🚚(frontend) rename feature summary to table of content

We rename the feature summary to table of content
to better reflect the feature purpose.
This commit is contained in:
Anthony LC
2024-09-17 14:53:31 +02:00
committed by Anthony LC
parent ed39c01608
commit 5bd78b8068
12 changed files with 41 additions and 33 deletions

View File

@@ -6,9 +6,14 @@ test.beforeEach(async ({ page }) => {
await page.goto('/');
});
test.describe('Doc Summary', () => {
test('it checks the doc summary', async ({ page, browserName }) => {
const [randomDoc] = await createDoc(page, 'doc-summary', browserName, 1);
test.describe('Doc Table Content', () => {
test('it checks the doc table content', async ({ page, browserName }) => {
const [randomDoc] = await createDoc(
page,
'doc-table-content',
browserName,
1,
);
await expect(page.locator('h2').getByText(randomDoc)).toBeVisible();

View File

@@ -9,7 +9,7 @@ import { Panel } from '@/components/Panel';
import { useCunninghamTheme } from '@/cunningham';
import { DocHeader } from '@/features/docs/doc-header';
import { Doc } from '@/features/docs/doc-management';
import { Summary } from '@/features/docs/doc-summary';
import { TableContent } from '@/features/docs/doc-table-content';
import {
VersionList,
Versions,
@@ -70,7 +70,7 @@ export const DocEditor = ({ doc }: DocEditorProps) => {
<VersionList doc={doc} />
</Panel>
)}
<Summary doc={doc} />
<TableContent doc={doc} />
</Box>
</>
);

View File

@@ -9,7 +9,7 @@ import {
ModalShare,
ModalUpdateDoc,
} from '@/features/docs/doc-management';
import { useDocSummaryStore } from '@/features/docs/doc-summary';
import { useDocTableContentStore } from '@/features/docs/doc-table-content';
import { useDocVersionStore } from '@/features/docs/doc-versioning';
import { ModalPDF } from './ModalExport';
@@ -26,7 +26,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
const [isModalPDFOpen, setIsModalPDFOpen] = useState(false);
const [isDropOpen, setIsDropOpen] = useState(false);
const { setIsPanelVersionOpen } = useDocVersionStore();
const { setIsPanelSummaryOpen } = useDocSummaryStore();
const { setIsPanelTableContentOpen } = useDocTableContentStore();
return (
<Box
@@ -83,7 +83,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
)}
<Button
onClick={() => {
setIsPanelSummaryOpen(true);
setIsPanelTableContentOpen(true);
setIsPanelVersionOpen(false);
setIsDropOpen(false);
}}

View File

@@ -1 +0,0 @@
export * from './Summary';

View File

@@ -1 +0,0 @@
export * from './useDocSummaryStore';

View File

@@ -1,13 +0,0 @@
import { create } from 'zustand';
export interface UseDocSummaryStore {
isPanelSummaryOpen: boolean;
setIsPanelSummaryOpen: (isOpen: boolean) => void;
}
export const useDocSummaryStore = create<UseDocSummaryStore>((set) => ({
isPanelSummaryOpen: false,
setIsPanelSummaryOpen: (isPanelSummaryOpen) => {
set(() => ({ isPanelSummaryOpen }));
},
}));

View File

@@ -6,7 +6,7 @@ import { Panel } from '@/components/Panel';
import { useDocStore } from '@/features/docs/doc-editor';
import { Doc } from '@/features/docs/doc-management';
import { useDocSummaryStore } from '../stores';
import { useDocTableContentStore } from '../stores';
import { Heading } from './Heading';
@@ -20,11 +20,11 @@ type HeadingBlock = {
};
};
interface SummaryProps {
interface TableContentProps {
doc: Doc;
}
export const Summary = ({ doc }: SummaryProps) => {
export const TableContent = ({ doc }: TableContentProps) => {
const { docsStore } = useDocStore();
const { t } = useTranslation();
@@ -38,11 +38,12 @@ export const Summary = ({ doc }: SummaryProps) => {
);
const [headings, setHeadings] = useState<HeadingBlock[]>();
const { setIsPanelSummaryOpen, isPanelSummaryOpen } = useDocSummaryStore();
const { setIsPanelTableContentOpen, isPanelTableContentOpen } =
useDocTableContentStore();
const [hasBeenClose, setHasBeenClose] = useState(false);
const setClosePanel = () => {
setHasBeenClose(true);
setIsPanelSummaryOpen(false);
setIsPanelTableContentOpen(false);
};
const [headingIdHighlight, setHeadingIdHighlight] = useState<string>();
@@ -50,16 +51,16 @@ export const Summary = ({ doc }: SummaryProps) => {
// Open the panel if there are more than 1 heading
useEffect(() => {
if (headings?.length && headings.length > 1 && !hasBeenClose) {
setIsPanelSummaryOpen(true);
setIsPanelTableContentOpen(true);
}
}, [setIsPanelSummaryOpen, headings, hasBeenClose]);
}, [setIsPanelTableContentOpen, headings, hasBeenClose]);
// Close the panel unmount
useEffect(() => {
return () => {
setIsPanelSummaryOpen(false);
setIsPanelTableContentOpen(false);
};
}, [setIsPanelSummaryOpen]);
}, [setIsPanelTableContentOpen]);
// To highlight the first heading in the viewport
useEffect(() => {
@@ -112,7 +113,7 @@ export const Summary = ({ doc }: SummaryProps) => {
setHeadings(headingFiltering());
});
if (!isPanelSummaryOpen) {
if (!isPanelTableContentOpen) {
return null;
}

View File

@@ -0,0 +1 @@
export * from './TableContent';

View File

@@ -0,0 +1 @@
export * from './useDocTableContentStore';

View File

@@ -0,0 +1,15 @@
import { create } from 'zustand';
export interface UseDocTableContentStore {
isPanelTableContentOpen: boolean;
setIsPanelTableContentOpen: (isOpen: boolean) => void;
}
export const useDocTableContentStore = create<UseDocTableContentStore>(
(set) => ({
isPanelTableContentOpen: false,
setIsPanelTableContentOpen: (isPanelTableContentOpen) => {
set(() => ({ isPanelTableContentOpen }));
},
}),
);