more properly display related guides in how-to guides pages

stellar · Dec 17, 2024 · 42518d1 · 42518d1
1 parent a3300eb
commit 42518d1
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/src/theme/DocCardList/index.tsx b/src/theme/DocCardList/index.tsx
@@ -10,9 +10,9 @@ type Props = WrapperProps<typeof DocCardListType>;
 
 function DocCardListForCurrentSidebarCategory(props: Props): JSX.Element {
   const category = useCurrentSidebarCategory();
-  return category.label === 'Example Contracts'
+  return (category.label === 'Example Contracts' || category.label === 'Ejemplos de contratos')
     ? <ExampleContractsDocCardList items={category.items} className={props.className} />
-    : category.label === 'How-To Guides'
+    : (category.label === 'How-To Guides' || category.label === 'Guías de Cómo-Hacer')
     ? <GuidesDocCardList items={category.items} className={props.className} />
     : <DocCardList items={category.items} className={props.className} />;
 }

diff --git a/src/theme/DocItem/Footer/index.tsx b/src/theme/DocItem/Footer/index.tsx
@@ -6,18 +6,25 @@ import DocCardList from '@theme/DocCardList';
 import type FooterType from '@theme/DocItem/Footer';
 import type { WrapperProps } from '@docusaurus/types';
 import clsx from 'clsx';
+import Translate from '@docusaurus/Translate';
 
 type Props = WrapperProps<typeof FooterType>;
 
 export default function FooterWrapper(props: Props): JSX.Element {
   const { metadata } = useDoc();
 
-  const canDisplayDocCardsOnGuide = metadata.permalink?.startsWith('/docs/build/guides');
+  const canDisplayDocCardsOnGuide = metadata.permalink?.includes('/docs/build/guides');
+  const isMainGuidesPage = metadata.id === 'build/guides/README'
   return (
     <>
       {canDisplayDocCardsOnGuide &&
-        <div className={clsx(metadata.permalink === '/docs/build/guides/' ? 'margin-top--lg' : 'margin-top--xl')}>
-          {metadata.permalink !== '/docs/build/guides/' && <h3>Guides in this category:</h3>}
+        <div className={clsx(isMainGuidesPage ? 'margin-top--lg' : 'margin-top--xl')}>
+          {!isMainGuidesPage && <h3>
+            <Translate
+              id='components.HowToGuides.GuidesInCategory'
+              description='The h3 title do display the other related how-to guides'
+            >Guides in this category:</Translate>
+          </h3>}
           <DocCardList />
         </div>
       }