diff --git a/.DS_Store b/.DS_Store index d66d8d339..f478e8a8b 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/apps/web/src/assets/png/skeleton-screenshot-metric.png b/apps/web/src/assets/png/skeleton-screenshot-metric.png index 68635d22f..71c63e870 100644 Binary files a/apps/web/src/assets/png/skeleton-screenshot-metric.png and b/apps/web/src/assets/png/skeleton-screenshot-metric.png differ diff --git a/apps/web/src/assets/png/skeleton-search-metric.png b/apps/web/src/assets/png/skeleton-search-chat.png similarity index 100% rename from apps/web/src/assets/png/skeleton-search-metric.png rename to apps/web/src/assets/png/skeleton-search-chat.png diff --git a/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchModalBase.tsx b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchModalBase.tsx index 8bd7a689d..8d2eb3b15 100644 --- a/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchModalBase.tsx +++ b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchModalBase.tsx @@ -25,6 +25,7 @@ export const GlobalSearchModalBase = ({ onChangeValue={onChangeValue} onSelect={onSelect} onViewSearchItem={onViewSearchItem} + placeholder="Search..." /> ); }; diff --git a/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.stories.tsx b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.stories.tsx new file mode 100644 index 000000000..947005373 --- /dev/null +++ b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.stories.tsx @@ -0,0 +1,60 @@ +import type { SearchTextData } from '@buster/server-shared/search'; +import { faker } from '@faker-js/faker'; +import type { Meta, StoryObj } from '@storybook/react-vite'; +import { GlobalSearchSecondaryContent } from './GlobalSearchSecondaryContent'; + +const meta: Meta = { + title: 'Features/Search/GlobalSearchSecondaryContent', + component: GlobalSearchSecondaryContent, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], +}; + +export default meta; +type Story = StoryObj; + +const mockSearchTextData: SearchTextData = { + assetId: '123e4567-e89b-12d3-a456-426614174000', + assetType: 'chat', + title: 'Revenue Analysis Q4 2024', + additionalText: 'This is a comprehensive analysis of Q4 revenue trends', + updatedAt: new Date().toISOString(), + screenshotBucketKey: 'screenshots/mock-screenshot.png', + screenshotUrl: faker.image.url({ + width: 1024, + height: 1024, + }), + ancestors: { + chats: [ + { + id: '456e7890-e89b-12d3-a456-426614174001', + title: 'Parent Chat', + }, + ], + dashboards: [ + { + id: '789e0123-e89b-12d3-a456-426614174002', + title: 'Executive Dashboard', + }, + ], + reports: [], + collections: [], + }, + createdBy: { + id: 'abc123', + name: 'John Doe', + email: 'john.doe@example.com', + avatarUrl: faker.image.url({ + width: 100, + height: 100, + }), + }, +}; + +export const Default: Story = { + args: { + selectedItem: mockSearchTextData, + }, +}; diff --git a/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.tsx b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.tsx index 9f113b13a..2395a0a82 100644 --- a/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.tsx +++ b/apps/web/src/components/features/search/GlobalSearchModal/GlobalSearchSecondaryContent.tsx @@ -1,5 +1,9 @@ import type { SearchTextData } from '@buster/server-shared/search'; import type React from 'react'; +import SkeletonSearchChat from '@/assets/png/skeleton-search-chat.png'; +import SkeletonSearchDashboard from '@/assets/png/skeleton-search-dashboard.png'; +import SkeletonSearchMetric from '@/assets/png/skeleton-search-metric.png'; +import SkeletonSearchReport from '@/assets/png/skeleton-search-report.png'; export type GlobalSearchSecondaryContentProps = { selectedItem: SearchTextData; @@ -8,6 +12,52 @@ export type GlobalSearchSecondaryContentProps = { export const GlobalSearchSecondaryContent: React.FC = ({ selectedItem, }) => { - const { assetId, assetType, title, ancestors, updatedAt, screenshotBucketKey } = selectedItem; - return
GlobalSearchSecondaryContent
; + const { + assetId, + assetType, + title, + ancestors, + updatedAt, + screenshotBucketKey, + screenshotUrl, + createdBy, + } = selectedItem; + console.log(selectedItem); + return ( +
+ +
+ ); +}; + +const ScreenshotImage = ({ + screenshotUrl, + assetType, +}: { + screenshotUrl: string | null | undefined; + assetType: SearchTextData['assetType']; +}) => { + let imageUrl = screenshotUrl; + if (!imageUrl) { + if (assetType === 'chat') { + imageUrl = SkeletonSearchChat; + } else if (assetType === 'metric_file') { + imageUrl = SkeletonSearchMetric; + } else if (assetType === 'dashboard_file') { + imageUrl = SkeletonSearchDashboard; + } else if (assetType === 'report_file') { + imageUrl = SkeletonSearchReport; + } else if (assetType === 'collection') { + imageUrl = SkeletonSearchMetric; + } else { + const _exhaustiveCheck: never = assetType; + } + } + return ( + Screenshot + ); }; diff --git a/packages/server-shared/src/search/search.ts b/packages/server-shared/src/search/search.ts index b9a0550dd..e3e3f5209 100644 --- a/packages/server-shared/src/search/search.ts +++ b/packages/server-shared/src/search/search.ts @@ -4,6 +4,7 @@ import { TextSearchResultSchema, } from '@buster/database/schema-types'; import { z } from 'zod'; +import { UserInfoResponseSchema } from '../access-controls'; import { AssetTypeSchema } from '../assets'; import { PaginatedRequestSchema, @@ -50,6 +51,7 @@ export const SearchTextRequestSchema = z export const SearchTextDataSchema = TextSearchResultSchema.extend({ ancestors: AssetAncestorsSchema.optional(), screenshotUrl: z.string().optional(), + createdBy: UserInfoResponseSchema.optional(), }); export type { AssetAncestors } from '@buster/database/schema-types';