clean code

packages/app/src/components/ContentLinkButtons.tsx

@@ -5,54 +5,49 @@ import styles from '~/components/ContentLinkButtons.module.scss';
 import { RecentlyCreatedIcon } from '~/components/Icons/RecentlyCreatedIcon';
 import { usePageUser } from '~/stores/context';
 
-const WIKI_HEADER_LINK = 120;
+export const ContentLinkButtons = (): JSX.Element => {
 
-// props for re-rendering
-type Props = {
-  isUserPage: boolean
-}
-
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const ContentLinkButtons = (props: Props): JSX.Element => {
+  const WIKI_HEADER_LINK = 120;
 
   const { data: pageUser } = usePageUser();
 
-  const getBookMarkListHeaderDom = document.getElementById('bookmarks-list');
-  const getRecentlyCreatedListHeaderDom = document.getElementById('recently-created-list');
+  const BookMarkLinkButtonClickHandler = useCallback(() => {
+    const getBookMarkListHeaderDom = document.getElementById('bookmarks-list');
+    if (getBookMarkListHeaderDom == null) { return }
+    smoothScrollIntoView(getBookMarkListHeaderDom, WIKI_HEADER_LINK);
+  }, []);
 
-  const BookMarkLinkButton = useCallback((): JSX.Element => {
-    if (getBookMarkListHeaderDom == null) {
-      return <></>;
-    }
+  const RecentlyCreatedListButtonClickHandler = useCallback(() => {
+    const getRecentlyCreatedListHeaderDom = document.getElementById('recently-created-list');
+    if (getRecentlyCreatedListHeaderDom == null) { return }
+    smoothScrollIntoView(getRecentlyCreatedListHeaderDom, WIKI_HEADER_LINK);
+  }, []);
 
+  const BookMarkLinkButton = () => {
     return (
       <button
         type="button"
         className="btn btn-outline-secondary btn-sm px-2"
-        onClick={() => smoothScrollIntoView(getBookMarkListHeaderDom, WIKI_HEADER_LINK)}
+        onClick={BookMarkLinkButtonClickHandler}
       >
         <i className="fa fa-fw fa-bookmark-o"></i>
         <span>Bookmarks</span>
       </button>
     );
-  }, [getBookMarkListHeaderDom]);
-
-  const RecentlyCreatedLinkButton = useCallback(() => {
-    if (getRecentlyCreatedListHeaderDom == null) {
-      return <></>;
-    }
+  };
 
+  const RecentlyCreatedLinkButton = () => {
     return (
       <button
         type="button"
         className="btn btn-outline-secondary btn-sm px-3"
-        onClick={() => smoothScrollIntoView(getRecentlyCreatedListHeaderDom, WIKI_HEADER_LINK)}
+        onClick={RecentlyCreatedListButtonClickHandler}
       >
         <i className={`${styles['grw-icon-container-recently-created']} grw-icon-container-recently-created mr-2`}><RecentlyCreatedIcon /></i>
         <span>Recently Created</span>
       </button>
     );
-  }, [getRecentlyCreatedListHeaderDom]);
+  };
 
   if (pageUser == null || pageUser.name === '') {
     return <></>;
@@ -64,4 +59,5 @@ export const ContentLinkButtons = (props: Props): JSX.Element => {
       <RecentlyCreatedLinkButton />
     </div>
   );
+
 };

packages/app/src/components/Page/DisplaySwitcher.tsx

@@ -95,7 +95,7 @@ const PageView = React.memo((): JSX.Element => {
 
             <div className="d-none d-lg-block">
               <TableOfContents />
-              { isUserPage && <ContentLinkButtons isUserPage={isUserPage}/> }
+              { isUserPage && <ContentLinkButtons /> }
             </div>
 
           </div>