✏️(frontend) child document with different wording

We want to have a different wording when the child
document has no title, so we can distinguish
between the two cases.

Author: AntoLC

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

@@ -54,11 +54,7 @@ export const DocEditor = ({ doc, versionId }: DocEditorProps) => {
           $padding={{ horizontal: isDesktop ? '54px' : 'base' }}
           className="--docs--doc-editor-header"
         >
-          {isVersion ? (
-            <DocVersionHeader title={doc.title} />
-          ) : (
-            <DocHeader doc={doc} />
-          )}
+          {isVersion ? <DocVersionHeader /> : <DocHeader doc={doc} />}
         </Box>
 
         <Box

src/frontend/apps/impress/src/features/docs/doc-export/components/ModalExport.tsx

@@ -46,8 +46,7 @@ export const ModalExport = ({ onClose, doc }: ModalExportProps) => {
   const [format, setFormat] = useState<DocDownloadFormat>(
     DocDownloadFormat.PDF,
   );
-  const { untitledDocument } = useTrans();
-
+  const { untitledDocument } = useTrans(doc);
   const templateOptions = useMemo(() => {
     const templateOptions = (templates?.pages || [])
       .map((page) =>

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

@@ -13,6 +13,7 @@ import {
   KEY_DOC,
   KEY_LIST_DOC,
   KEY_SUB_PAGE,
+  useDocStore,
   useTrans,
   useUpdateDoc,
 } from '@/docs/doc-management';
@@ -24,19 +25,16 @@ interface DocTitleProps {
 
 export const DocTitle = ({ doc }: DocTitleProps) => {
   if (!doc.abilities.partial_update) {
-    return <DocTitleText title={doc.title} />;
+    return <DocTitleText />;
   }
 
   return <DocTitleInput doc={doc} />;
 };
 
-interface DocTitleTextProps {
-  title?: string;
-}
-
-export const DocTitleText = ({ title }: DocTitleTextProps) => {
+export const DocTitleText = () => {
   const { isMobile } = useResponsiveStore();
-  const { untitledDocument } = useTrans();
+  const { currentDoc } = useDocStore();
+  const { untitledDocument } = useTrans(currentDoc);
 
   return (
     <Text
@@ -45,7 +43,7 @@ export const DocTitleText = ({ title }: DocTitleTextProps) => {
       $size={isMobile ? 'h4' : 'h2'}
       $variation="1000"
     >
-      {title || untitledDocument}
+      {currentDoc?.title || untitledDocument}
     </Text>
   );
 };
@@ -57,7 +55,7 @@ const DocTitleInput = ({ doc }: DocTitleProps) => {
   const { colorsTokens } = useCunninghamTheme();
   const [titleDisplay, setTitleDisplay] = useState(doc.title);
 
-  const { untitledDocument } = useTrans();
+  const { untitledDocument } = useTrans(doc);
 
   const { broadcast } = useBroadcastStore();
 

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

@@ -5,11 +5,7 @@ import { useCunninghamTheme } from '@/cunningham';
 
 import { DocTitleText } from './DocTitle';
 
-interface DocVersionHeaderProps {
-  title?: string;
-}
-
-export const DocVersionHeader = ({ title }: DocVersionHeaderProps) => {
+export const DocVersionHeader = () => {
   const { spacingsTokens } = useCunninghamTheme();
 
   const { t } = useTranslation();
@@ -23,7 +19,7 @@ export const DocVersionHeader = ({ title }: DocVersionHeaderProps) => {
         aria-label={t('It is the document title')}
         className="--docs--doc-version-header"
       >
-        <DocTitleText title={title} />
+        <DocTitleText />
         <HorizontalSeparator />
       </Box>
     </>

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

@@ -29,7 +29,7 @@ export const ModalRemoveDoc = ({
   const { toast } = useToastProvider();
   const { push } = useRouter();
   const pathname = usePathname();
-  const { untitledDocument } = useTrans();
+  const { untitledDocument } = useTrans(doc);
 
   const {
     mutate: removeDoc,

src/frontend/apps/impress/src/features/docs/doc-management/hooks/useTrans.tsx

@@ -1,9 +1,10 @@
 import { useTranslation } from 'react-i18next';
 
-import { Role } from '../types';
+import { Doc, Role } from '../types';
 
-export const useTrans = () => {
+export const useTrans = (doc?: Doc) => {
   const { t } = useTranslation();
+  const isChild = doc && doc.nb_accesses_ancestors > 1;
 
   const translatedRoles = {
     [Role.READER]: t('Reader'),
@@ -16,7 +17,7 @@ export const useTrans = () => {
     transRole: (role: Role) => {
       return translatedRoles[role];
     },
-    untitledDocument: t('Untitled document'),
+    untitledDocument: isChild ? t('Untitled page') : t('Untitled document'),
     translatedRoles,
   };
 };

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

@@ -34,7 +34,7 @@ type Props = TreeViewNodeProps<Doc>;
 export const DocSubPageItem = (props: Props) => {
   const doc = props.node.data.value as Doc;
   const treeContext = useTreeContext<Doc>();
-  const { untitledDocument } = useTrans();
+  const { untitledDocument } = useTrans(doc);
   const { node } = props;
   const { spacingsTokens } = useCunninghamTheme();
   const [isHover, setIsHover] = useState(false);

src/frontend/apps/impress/src/features/docs/docs-grid/components/SimpleDocItem.tsx

@@ -34,7 +34,7 @@ export const SimpleDocItem = ({
   const { t } = useTranslation();
   const { spacingsTokens, colorsTokens } = useCunninghamTheme();
   const { isDesktop } = useResponsiveStore();
-  const { untitledDocument } = useTrans();
+  const { untitledDocument } = useTrans(doc);
 
   return (
     <Box