From 9518df944deae86df92b58b68e6d3caa79ef6e99 Mon Sep 17 00:00:00 2001 From: Nate Kelley Date: Wed, 5 Mar 2025 19:08:27 -0700 Subject: [PATCH] manually parse the pathname... what a bummer --- .../ChatLayout/hooks/useDefaultFile.test.ts | 74 ++++++++++++++++ .../ChatLayout/hooks/useDefaultFile.ts | 86 +++++++++++++------ 2 files changed, 133 insertions(+), 27 deletions(-) create mode 100644 web/src/layouts/ChatLayout/hooks/useDefaultFile.test.ts diff --git a/web/src/layouts/ChatLayout/hooks/useDefaultFile.test.ts b/web/src/layouts/ChatLayout/hooks/useDefaultFile.test.ts new file mode 100644 index 000000000..b5b63ad36 --- /dev/null +++ b/web/src/layouts/ChatLayout/hooks/useDefaultFile.test.ts @@ -0,0 +1,74 @@ +import { parsePathnameSegments } from './useDefaultFile'; + +describe('parsePathnameSegments', () => { + it('should parse chat with reasoning pathname correctly', () => { + const pathname = + '/app/chats/c2adc995-82b9-45a6-8dff-1cf897665fb0/reasoning/6cd53c00-0b5e-44fc-9a22-c50c00860610'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + chatId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0', + messageId: '6cd53c00-0b5e-44fc-9a22-c50c00860610' + }); + }); + + it('should parse chat with metric pathname correctly', () => { + const pathname = '/app/chats/c2adc995-82b9-45a6-8dff-1cf897665fb0/metric/1234567890'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + chatId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0', + metricId: '1234567890' + }); + }); + + it('should parse dashboard pathname correctly', () => { + const pathname = '/app/dashboards/c2adc995-82b9-45a6-8dff-1cf897665fb0'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + dashboardId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0' + }); + }); + + it('should parse dataset pathname correctly', () => { + const pathname = '/app/datasets/c2adc995-82b9-45a6-8dff-1cf897665fb0'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + datasetId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0' + }); + }); + + it('should handle empty pathname', () => { + const pathname = ''; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({}); + }); + + it('should handle root pathname', () => { + const pathname = '/'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({}); + }); + + it('should handle pathname with trailing slash', () => { + const pathname = '/app/chats/c2adc995-82b9-45a6-8dff-1cf897665fb0/'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + chatId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0' + }); + }); + + it('should parse collection pathname correctly', () => { + const pathname = '/app/collection/c2adc995-82b9-45a6-8dff-1cf897665fb0'; + const result = parsePathnameSegments(pathname); + + expect(result).toEqual({ + collectionId: 'c2adc995-82b9-45a6-8dff-1cf897665fb0' + }); + }); +}); diff --git a/web/src/layouts/ChatLayout/hooks/useDefaultFile.ts b/web/src/layouts/ChatLayout/hooks/useDefaultFile.ts index d19492356..64f08930c 100644 --- a/web/src/layouts/ChatLayout/hooks/useDefaultFile.ts +++ b/web/src/layouts/ChatLayout/hooks/useDefaultFile.ts @@ -2,41 +2,73 @@ import { useMemo } from 'react'; import type { ChatLayoutView, SelectedFile } from '../interfaces'; -import { useParams, usePathname, useSelectedLayoutSegments, useRouter } from 'next/navigation'; +import { usePathname } from 'next/navigation'; + +interface ParsedParams { + metricId?: string; + collectionId?: string; + datasetId?: string; + dashboardId?: string; + chatId?: string; + messageId?: string; +} + +export const parsePathnameSegments = (pathname: string): ParsedParams => { + const params: ParsedParams = {}; + + // Remove leading slash and split into segments + //example: /app/chats/c2adc995-82b9-45a6-8dff-1cf897665fb0/reasoning/6cd53c00-0b5e-44fc-9a22-c50c00860610 + //example: /app/chats/c2adc995-82b9-45a6-8dff-1cf897665fb0/metric/1234567890 + //example: /app/dashboards/c2adc995-82b9-45a6-8dff-1cf897665fb0 + //example: /app/datasets/c2adc995-82b9-45a6-8dff-1cf897665fb0 + + const segments = pathname.split('/').filter(Boolean); + + segments.forEach((segment, index) => { + // Check for chats segment + if (segment === 'chats' && segments[index + 1]) { + params.chatId = segments[index + 1]; + } + + // Check for dashboards segment + if (segment === 'dashboards' && segments[index + 1]) { + params.dashboardId = segments[index + 1]; + } + + // Check for datasets segment + if (segment === 'datasets' && segments[index + 1]) { + params.datasetId = segments[index + 1]; + } + + // Check for reasoning segment with messageId + if (segment === 'reasoning' && segments[index + 1]) { + params.messageId = segments[index + 1]; + } + + // Check for metric segment + if (segment === 'metric' && segments[index + 1]) { + params.metricId = segments[index + 1]; + } + + if (segment === 'collection' && segments[index + 1]) { + params.collectionId = segments[index + 1]; + } + }); + + return params; +}; export const useSelectedFileByParams = () => { - const { metricId, collectionId, datasetId, dashboardId, chatId, messageId } = useParams() as { - metricId?: string; - collectionId?: string; - datasetId?: string; - dashboardId?: string; - chatId?: string; - messageId?: string; - }; - - const segments = useSelectedLayoutSegments(); const pathname = usePathname(); - const isReasoningSegments = useMemo(() => { - return segments.some((segment) => segment === 'reasoning'); - }, [segments]); + const params = useMemo(() => parsePathnameSegments(pathname), [pathname]); + const { metricId, collectionId, datasetId, dashboardId, chatId, messageId } = params; const selectedFile: SelectedFile | undefined = useMemo(() => { if (metricId) return { id: metricId, type: 'metric' }; if (dashboardId) return { id: dashboardId, type: 'dashboard' }; - if (messageId && isReasoningSegments) return { id: messageId, type: 'reasoning' }; - // if (collectionId) return { id: collectionId, type: 'collection' }; - // if (datasetId) return { id: datasetId, type: 'dataset' }; - }, [ - metricId, - collectionId, - datasetId, - dashboardId, - chatId, - messageId, - isReasoningSegments, - pathname - ]); + if (messageId) return { id: messageId, type: 'reasoning' }; + }, [metricId, dashboardId, messageId, pathname]); const selectedLayout: ChatLayoutView = useMemo(() => { const hasFileId = metricId || collectionId || datasetId || dashboardId || messageId;