mirror of https://github.com/buster-so/buster.git
update some layout stuff
This commit is contained in:
parent
4974176187
commit
e1ccaec8e8
|
@ -1,7 +1,6 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { FileIndeterminateLoader } from '@/components/features/FileIndeterminateLoader';
|
import { FileIndeterminateLoader } from '@/components/features/FileIndeterminateLoader';
|
||||||
import { StatusCard } from '@/components/ui/card/StatusCard';
|
|
||||||
import { ReasoningController } from '@/controllers/ReasoningController';
|
import { ReasoningController } from '@/controllers/ReasoningController';
|
||||||
import { useChatIndividualContextSelector } from '@/layouts/ChatLayout/ChatContext';
|
import { useChatIndividualContextSelector } from '@/layouts/ChatLayout/ChatContext';
|
||||||
|
|
||||||
|
@ -15,12 +14,8 @@ export default function Page(params: { params: { chatId: string } }) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<FileIndeterminateLoader />
|
<div className="animate-in fade-in hidden delay-300 duration-500">
|
||||||
<div className="p-5">
|
<FileIndeterminateLoader />
|
||||||
<StatusCard
|
|
||||||
title="Error"
|
|
||||||
message="If you are seeing this, tell Nate and screenshot this whole page including the URL and logs..."
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
@ -13,7 +13,7 @@ const inputTextAreaButtonVariants = cva(
|
||||||
variants: {
|
variants: {
|
||||||
variant: {
|
variant: {
|
||||||
default:
|
default:
|
||||||
'has-[textarea:hover]:border-foreground shadow has-[textarea:focus]:border-foreground has-[textarea:disabled]:border-border'
|
'has-[textarea:hover]:border-foreground shadow bg-background has-[textarea:focus]:border-foreground has-[textarea:disabled]:border-border'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -44,9 +44,7 @@ export const useChatLayout = ({ appSplitterRef }: UseChatSplitterProps) => {
|
||||||
renderViewLayoutKey
|
renderViewLayoutKey
|
||||||
} = useSelectedFileAndLayout({ animateOpenSplitter });
|
} = useSelectedFileAndLayout({ animateOpenSplitter });
|
||||||
|
|
||||||
const { onCollapseFileClick } = useLayoutCollapse({
|
const onCollapseFileClick = useLayoutCollapse({ onSetSelectedFile });
|
||||||
animateOpenSplitter
|
|
||||||
});
|
|
||||||
|
|
||||||
const fileLayoutContext = useChatFileLayout({
|
const fileLayoutContext = useChatFileLayout({
|
||||||
selectedFileId: selectedFile?.id,
|
selectedFileId: selectedFile?.id,
|
||||||
|
|
|
@ -1,30 +1,16 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useMemoizedFn } from '@/hooks';
|
import { useMemoizedFn } from '@/hooks';
|
||||||
import { useEffect, useMemo, useState } from 'react';
|
import { useSelectedFileAndLayout } from './useSelectedFileAndLayout';
|
||||||
import { SelectedFileParams } from './useSelectedFileAndLayout';
|
|
||||||
import { ChatLayoutView } from '../interfaces';
|
|
||||||
|
|
||||||
export const useLayoutCollapse = ({
|
export const useLayoutCollapse = ({
|
||||||
animateOpenSplitter
|
onSetSelectedFile
|
||||||
}: {
|
}: {
|
||||||
animateOpenSplitter: (side: 'left' | 'right' | 'both') => void;
|
onSetSelectedFile: ReturnType<typeof useSelectedFileAndLayout>['onSetSelectedFile'];
|
||||||
}) => {
|
}) => {
|
||||||
const onCollapseFileClick = useMemoizedFn((close?: boolean) => {
|
const onCollapseFileClick = useMemoizedFn((close?: boolean) => {
|
||||||
// if (selectedFile && selectedFile.type === 'reasoning') {
|
onSetSelectedFile(null);
|
||||||
// animateOpenSplitter(!isCloseAction ? 'both' : 'left');
|
|
||||||
// } else if (isFileLayout) {
|
|
||||||
// // For file layout, toggle between 'both' and 'right'
|
|
||||||
// animateOpenSplitter(!isCloseAction && selectedFile ? 'both' : 'right');
|
|
||||||
// } else {
|
|
||||||
// // For other layouts, toggle between 'right' and 'both'
|
|
||||||
// animateOpenSplitter(isCloseAction ? 'left' : 'both');
|
|
||||||
// }
|
|
||||||
|
|
||||||
animateOpenSplitter('left');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
return {
|
return onCollapseFileClick;
|
||||||
onCollapseFileClick
|
|
||||||
};
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import type { SelectedFile } from '../../interfaces';
|
import type { SelectedFile } from '../../interfaces';
|
||||||
import type { ChatURLParsed } from './parsePathnameSegments';
|
import type { ChatURLParsed } from './parsePathnameSegments';
|
||||||
|
|
||||||
export const initializeSelectedFile = (params: ChatURLParsed): SelectedFile | undefined => {
|
export const initializeSelectedFile = (params: ChatURLParsed): SelectedFile | null => {
|
||||||
const { metricId, collectionId, datasetId, dashboardId, chatId, messageId } = params;
|
const { metricId, collectionId, datasetId, dashboardId, chatId, messageId } = params;
|
||||||
|
|
||||||
if (metricId) {
|
if (metricId) {
|
||||||
|
@ -25,5 +25,5 @@ export const initializeSelectedFile = (params: ChatURLParsed): SelectedFile | un
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
return undefined;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
|
@ -5,11 +5,7 @@ import type { ChatLayoutView, SelectedFile } from '../../interfaces';
|
||||||
import { usePathname } from 'next/navigation';
|
import { usePathname } from 'next/navigation';
|
||||||
import { parsePathnameSegments } from './parsePathnameSegments';
|
import { parsePathnameSegments } from './parsePathnameSegments';
|
||||||
import { useMemoizedFn } from '@/hooks';
|
import { useMemoizedFn } from '@/hooks';
|
||||||
import {
|
import { createChatAssetRoute, createChatRoute } from '../../ChatLayoutContext/helpers';
|
||||||
createChatAssetRoute,
|
|
||||||
createChatRoute,
|
|
||||||
createFileRoute
|
|
||||||
} from '../../ChatLayoutContext/helpers';
|
|
||||||
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
|
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
|
||||||
import { initializeSelectedFile } from './initializeSelectedFile';
|
import { initializeSelectedFile } from './initializeSelectedFile';
|
||||||
import { BusterRoutes, createBusterRoute } from '@/routes';
|
import { BusterRoutes, createBusterRoute } from '@/routes';
|
||||||
|
@ -26,7 +22,7 @@ export const useSelectedFileAndLayout = ({
|
||||||
|
|
||||||
const { chatId } = params;
|
const { chatId } = params;
|
||||||
|
|
||||||
const [selectedFile, setSelectedFile] = useState<SelectedFile | undefined>(() =>
|
const [selectedFile, setSelectedFile] = useState<SelectedFile | null>(() =>
|
||||||
initializeSelectedFile(params)
|
initializeSelectedFile(params)
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -51,6 +47,7 @@ export const useSelectedFileAndLayout = ({
|
||||||
if (!file || !fileType || !fileId || !chatId) {
|
if (!file || !fileType || !fileId || !chatId) {
|
||||||
if (chatId) {
|
if (chatId) {
|
||||||
await onChangePage(createChatRoute(chatId));
|
await onChangePage(createChatRoute(chatId));
|
||||||
|
setSelectedFile(null);
|
||||||
animateOpenSplitter('left');
|
animateOpenSplitter('left');
|
||||||
} else {
|
} else {
|
||||||
await onChangePage(createBusterRoute({ route: BusterRoutes.APP_HOME }));
|
await onChangePage(createBusterRoute({ route: BusterRoutes.APP_HOME }));
|
||||||
|
@ -62,7 +59,7 @@ export const useSelectedFileAndLayout = ({
|
||||||
? createChatRoute(chatId)
|
? createChatRoute(chatId)
|
||||||
: createChatAssetRoute({ chatId, assetId: fileId, type: fileType });
|
: createChatAssetRoute({ chatId, assetId: fileId, type: fileType });
|
||||||
setRenderViewLayoutKey('both');
|
setRenderViewLayoutKey('both');
|
||||||
setSelectedFile(isSameAsCurrentFile ? undefined : file);
|
setSelectedFile(isSameAsCurrentFile ? null : file);
|
||||||
await onChangePage(route);
|
await onChangePage(route);
|
||||||
startTransition(() => {
|
startTransition(() => {
|
||||||
onChangePage(route); //this is hack for now...
|
onChangePage(route); //this is hack for now...
|
||||||
|
|
Loading…
Reference in New Issue