From 72003e78b13fc10793f79013d7eca0e98af0cb89 Mon Sep 17 00:00:00 2001
From: Joshua Chen <sidachen2003@gmail.com>
Date: Thu, 23 Jun 2022 18:22:50 +0800
Subject: [PATCH] refactor

---
 .../DocCategoryGeneratedIndexPage/index.tsx   | 32 +++++++++++--------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/website/src/theme/DocCategoryGeneratedIndexPage/index.tsx b/website/src/theme/DocCategoryGeneratedIndexPage/index.tsx
index 1124d31ad3d9..a407d9e4a2dc 100644
--- a/website/src/theme/DocCategoryGeneratedIndexPage/index.tsx
+++ b/website/src/theme/DocCategoryGeneratedIndexPage/index.tsx
@@ -14,25 +14,31 @@ import type {Props} from '@theme/DocCategoryGeneratedIndexPage';
 
 import styles from './styles.module.css';
 
+function HintFooter() {
+  const docPath = useLayoutDoc('guides/docs/sidebar/items', undefined)?.path;
+  return (
+    <p className={styles.footerTip}>
+      <Translate
+        values={{
+          guideLink: (
+            <Link to={`${docPath}#category-link`}>
+              <Translate>the generated index page guide</Translate>
+            </Link>
+          ),
+        }}>
+        {'Want to implement the same page? Read {guideLink} to find out!'}
+      </Translate>
+    </p>
+  );
+}
+
 export default function DocCategoryGeneratedIndexPageWrapper(
   props: Props,
 ): JSX.Element {
-  const docPath = useLayoutDoc('guides/docs/sidebar/items', undefined)?.path;
   return (
     <>
       <DocCategoryGeneratedIndexPage {...props} />
-      <p className={styles.footerTip}>
-        <Translate
-          values={{
-            guideLink: (
-              <Link to={`${docPath}#category-link`}>
-                <Translate>the generated index page guide</Translate>
-              </Link>
-            ),
-          }}>
-          {'Want to implement the same page? Read {guideLink} to find out!'}
-        </Translate>
-      </p>
+      <HintFooter />
     </>
   );
 }