Skip to content

Commit cd523ea

Browse files
committed
fixup! ✨(frontend) doc page when deleted
1 parent 72216a6 commit cd523ea

File tree

10 files changed

+71
-31
lines changed

10 files changed

+71
-31
lines changed

src/frontend/apps/impress/src/components/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export * from './InfiniteScroll';
99
export * from './Link';
1010
export * from './Loading';
1111
export * from './modal';
12+
export * from './Overlayer';
1213
export * from './separators';
1314
export * from './Text';
1415
export * from './TextErrors';

src/frontend/apps/impress/src/features/docs/doc-editor/styles.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ export const cssEditor = (readonly: boolean, isDeletedDoc: boolean) => css`
130130
131131
${isDeletedDoc &&
132132
`
133-
a {
133+
.node-interlinkingLinkInline button {
134134
pointer-events: none;
135135
}
136136
`}

src/frontend/apps/impress/src/features/docs/doc-header/components/AlertRestore.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ export const AlertRestore = ({ doc }: { doc: Doc }) => {
6060
`}
6161
$justify="space-between"
6262
>
63-
<Box $direction="row" $align="center" $gap="0.2rem">
63+
<Box $direction="row" $align="center" $gap={spacingsTokens['2xs']}>
6464
<Icon
6565
$theme="danger"
6666
$variation="700"
@@ -80,12 +80,13 @@ export const AlertRestore = ({ doc }: { doc: Doc }) => {
8080
}
8181
$direction="row"
8282
$gap="0.2rem"
83+
$align="center"
8384
>
8485
<Icon
8586
iconName="undo"
8687
$theme="danger"
8788
$variation="600"
88-
$css="font-size: 18px !important;"
89+
$size="18px"
8990
variant="symbols-outlined"
9091
/>
9192
<Text $theme="danger" $variation="600" $size="s">

src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import {
2323
useCopyDocLink,
2424
useCreateFavoriteDoc,
2525
useDeleteFavoriteDoc,
26+
useDocUtils,
2627
useDuplicateDoc,
2728
} from '@/docs/doc-management';
2829
import { DocShareModal } from '@/docs/doc-share';
@@ -48,6 +49,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
4849
const treeContext = useTreeContext<Doc>();
4950
const queryClient = useQueryClient();
5051
const router = useRouter();
52+
const { isChild } = useDocUtils(doc);
5153

5254
const { spacingsTokens, colorsTokens } = useCunninghamTheme();
5355

@@ -153,7 +155,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
153155
},
154156
},
155157
{
156-
label: t('Delete document'),
158+
label: isChild ? t('Delete sub-document') : t('Delete document'),
157159
icon: 'delete',
158160
disabled: !doc.abilities.destroy,
159161
callback: () => {
@@ -238,7 +240,26 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
238240
<ModalExport onClose={() => setIsModalExportOpen(false)} doc={doc} />
239241
)}
240242
{isModalRemoveOpen && (
241-
<ModalRemoveDoc onClose={() => setIsModalRemoveOpen(false)} doc={doc} />
243+
<ModalRemoveDoc
244+
onClose={() => setIsModalRemoveOpen(false)}
245+
doc={doc}
246+
onSuccess={() => {
247+
const isTopParent = doc.id === treeContext?.root?.id;
248+
const parentId =
249+
treeContext?.treeData.getParentId(doc.id) ||
250+
treeContext?.root?.id;
251+
252+
if (isTopParent) {
253+
void router.push(`/`);
254+
} else if (parentId) {
255+
void router.push(`/docs/${parentId}`).then(() => {
256+
setTimeout(() => {
257+
treeContext?.treeData.deleteNode(doc.id);
258+
}, 100);
259+
});
260+
}
261+
}}
262+
/>
242263
)}
243264
{selectHistoryModal.isOpen && (
244265
<ModalSelectVersion

src/frontend/apps/impress/src/features/docs/doc-management/components/ModalRemoveDoc.tsx

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import {
55
VariantType,
66
useToastProvider,
77
} from '@openfun/cunningham-react';
8-
import { usePathname } from 'next/navigation';
98
import { useRouter } from 'next/router';
109
import { Trans, useTranslation } from 'react-i18next';
1110

@@ -14,6 +13,7 @@ import { KEY_LIST_DOC_TRASHBIN } from '@/docs/docs-grid';
1413

1514
import { KEY_LIST_DOC } from '../api/useDocs';
1615
import { useRemoveDoc } from '../api/useRemoveDoc';
16+
import { useDocUtils } from '../hooks';
1717
import { Doc } from '../types';
1818

1919
interface ModalRemoveDocProps {
@@ -30,7 +30,7 @@ export const ModalRemoveDoc = ({
3030
const { toast } = useToastProvider();
3131
const { t } = useTranslation();
3232
const { push } = useRouter();
33-
const pathname = usePathname();
33+
const { hasChildren } = useDocUtils(doc);
3434
const {
3535
mutate: removeDoc,
3636
isError,
@@ -41,12 +41,12 @@ export const ModalRemoveDoc = ({
4141
onSuccess: () => {
4242
if (onSuccess) {
4343
onSuccess(doc);
44-
} else if (pathname === '/') {
45-
onClose();
4644
} else {
4745
void push('/');
4846
}
4947

48+
onClose();
49+
5050
toast(t('The document has been deleted.'), VariantType.SUCCESS, {
5151
duration: 4000,
5252
});
@@ -113,10 +113,16 @@ export const ModalRemoveDoc = ({
113113
<Box className="--docs--modal-remove-doc">
114114
{!isError && (
115115
<Text $size="sm" $variation="600" $display="inline-block" as="p">
116-
<Trans t={t}>
117-
This document and <strong>any sub-documents</strong> will be
118-
permanently deleted. This action is irreversible.
119-
</Trans>
116+
{hasChildren ? (
117+
<Trans t={t}>
118+
This document and <strong>any sub-documents</strong> will be
119+
permanently deleted. This action is irreversible.
120+
</Trans>
121+
) : (
122+
t(
123+
'This document will be permanently deleted. This action is irreversible.',
124+
)
125+
)}
120126
</Text>
121127
)}
122128

Lines changed: 11 additions & 2 deletions
Loading

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocSubPageItem.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export const DocSubPageItem = (props: TreeViewNodeProps<Doc>) => {
3939
const treeContext = useTreeContext<Doc>();
4040
const { untitledDocument } = useTrans();
4141
const { node } = props;
42-
const { spacingsTokens } = useCunninghamTheme();
42+
const { spacingsTokens, colorsTokens } = useCunninghamTheme();
4343
const { isDesktop } = useResponsiveStore();
4444
const { t } = useTranslation();
4545

@@ -166,7 +166,11 @@ export const DocSubPageItem = (props: TreeViewNodeProps<Doc>) => {
166166
`}
167167
>
168168
<Box $width="16px" $height="16px">
169-
<DocIcon emoji={emoji} defaultIcon={<SubPageIcon />} $size="sm" />
169+
<DocIcon
170+
emoji={emoji}
171+
defaultIcon={<SubPageIcon color={colorsTokens['primary-400']} />}
172+
$size="sm"
173+
/>
170174
</Box>
171175

172176
<Box

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTree.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,7 @@ import { useCallback, useEffect, useState } from 'react';
1010
import { useTranslation } from 'react-i18next';
1111
import { css } from 'styled-components';
1212

13-
import { Box, StyledLink } from '@/components';
14-
import { Overlayer } from '@/components/Overlayer';
13+
import { Box, Overlayer, StyledLink } from '@/components';
1514
import { useCunninghamTheme } from '@/cunningham';
1615
import { Doc, SimpleDocItem } from '@/docs/doc-management';
1716

@@ -290,7 +289,7 @@ export const DocTree = ({ currentDoc }: DocTreeProps) => {
290289
{initialOpenState &&
291290
treeContext.treeData.nodes.length > 0 &&
292291
treeRoot && (
293-
<Overlayer isOverlay={currentDoc.deleted_at != null}>
292+
<Overlayer isOverlay={currentDoc.deleted_at != null} inert>
294293
<TreeView
295294
dndRootElement={treeRoot}
296295
initialOpenState={initialOpenState}

src/frontend/apps/impress/src/features/docs/doc-tree/components/DocTreeItemActions.tsx

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -126,16 +126,13 @@ export const DocTreeItemActions = ({
126126
});
127127

128128
const onSuccessDelete = () => {
129-
if (parentId) {
130-
void router.push(`/docs/${parentId}`).then(() => {
131-
setTimeout(() => {
132-
treeContext?.treeData.deleteNode(doc.id);
133-
}, 100);
134-
});
135-
} else if (doc.id === treeContext?.root?.id && !parentId) {
129+
const isTopParent = doc.id === treeContext?.root?.id && !parentId;
130+
const parentIdComputed = parentId || treeContext?.root?.id;
131+
132+
if (isTopParent) {
136133
void router.push(`/`);
137-
} else if (treeContext && treeContext.root) {
138-
void router.push(`/docs/${treeContext.root.id}`).then(() => {
134+
} else if (parentIdComputed) {
135+
void router.push(`/docs/${parentIdComputed}`).then(() => {
139136
setTimeout(() => {
140137
treeContext?.treeData.deleteNode(doc.id);
141138
}, 100);

src/frontend/apps/impress/src/pages/docs/[id]/index.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import {
1616
useDoc,
1717
useDocStore,
1818
useProviderStore,
19+
useTrans,
1920
} from '@/docs/doc-management/';
2021
import { KEY_AUTH, setAuthUrl, useAuth } from '@/features/auth';
2122
import { getDocChildren, subPageToTree } from '@/features/docs/doc-tree/';
@@ -89,6 +90,7 @@ const DocPage = ({ id }: DocProps) => {
8990
useCollaboration(doc?.id, doc?.content);
9091
const { t } = useTranslation();
9192
const { authenticated } = useAuth();
93+
const { untitledDocument } = useTrans();
9294

9395
/**
9496
* Scroll to top when navigating to a new document
@@ -194,11 +196,11 @@ const DocPage = ({ id }: DocProps) => {
194196
<>
195197
<Head>
196198
<title>
197-
{doc.title} - {t('Docs')}
199+
{doc.title || untitledDocument} - {t('Docs')}
198200
</title>
199201
<meta
200202
property="og:title"
201-
content={`${doc.title} - ${t('Docs')}`}
203+
content={`${doc.title || untitledDocument} - ${t('Docs')}`}
202204
key="title"
203205
/>
204206
</Head>

0 commit comments

Comments
 (0)