Fix hooks

src/components/NotePage/NoteList/NoteList.tsx

@@ -113,8 +113,6 @@ type NoteListProps = {
   lastCreatedNoteId: string
 }
 
-const { t } = useTranslation()
-
 const NoteList = ({
   notes,
   createNote,
@@ -127,6 +125,7 @@ const NoteList = ({
   navigateUp,
   lastCreatedNoteId
 }: NoteListProps) => {
+  const { t } = useTranslation()
   const updateSearchInput: ChangeEventHandler<HTMLInputElement> = useCallback(
     event => {
       setSearchInput(event.target.value)

src/components/PreferencesModal/AboutTab.tsx

@@ -80,7 +80,6 @@ interface PrimaryLinkProps {
   href: string
   children: string
 }
-const { t } = useTranslation()
 
 const PrimaryLink = ({ href, children }: PrimaryLinkProps) => {
   const handleClick = useCallback(
@@ -99,6 +98,8 @@ const PrimaryLink = ({ href, children }: PrimaryLinkProps) => {
 }
 
 const AboutTab = () => {
+  const { t } = useTranslation()
+
   return (
     <div>
       <Section>

src/components/PreferencesModal/ImportTab.tsx

@@ -55,9 +55,8 @@ const StyledRemove = styled.span`
   color: ${({ theme }) => theme.primaryColor};
 `
 
-const { t } = useTranslation()
-
 export default () => {
+  const { t } = useTranslation()
   const { pushMessage } = useToast()
   const { storageMap, createNote } = useDb()
   const storageEntries = useMemo(() => entries(storageMap), [storageMap])

src/components/PreferencesModal/UserInfo.tsx

@@ -15,14 +15,16 @@ const Container = styled.div`
   margin-bottom: 8px;
 `
 
-const { t } = useTranslation()
+export default ({ user, signout }: UserProps) => {
+  const { t } = useTranslation()
 
-export default ({ user, signout }: UserProps) => (
-  <Container>
-    <MdiIcon path={mdiAccount} size='80px' />
-    <p>{user.name}</p>
-    <SectionPrimaryButton onClick={() => signout(user)}>
-      {t('general.signOut')}
-    </SectionPrimaryButton>
-  </Container>
-)
+  return (
+    <Container>
+      <MdiIcon path={mdiAccount} size='80px' />
+      <p>{user.name}</p>
+      <SectionPrimaryButton onClick={() => signout(user)}>
+        {t('general.signOut')}
+      </SectionPrimaryButton>
+    </Container>
+  )
+}

src/components/SideNavigator/FolderListFragment.tsx

@@ -18,8 +18,6 @@ interface FolderListFragmentProps {
   showPromptToRenameFolder: (folderPathname: string) => void
 }
 
-const { t } = useTranslation()
-
 const FolderListFragment = ({
   storage,
   showPromptToCreateFolder,
@@ -34,6 +32,8 @@ const FolderListFragment = ({
   const { push } = useRouter()
   const { messageBox } = useDialog()
   const { popup } = useContextMenu()
+  const { t } = useTranslation()
+
   const { folderMap, id: storageId } = storage
 
   const { toggleSideNavOpenedItem, sideNavOpenedItemSet } = useGeneralStatus()

src/components/SideNavigator/TagListFragment.tsx

@@ -14,15 +14,14 @@ interface TagListFragmentProps {
   storage: NoteStorage
 }
 
-const { t } = useTranslation()
-
 const TagListFragment = ({ storage }: TagListFragmentProps) => {
   const { toggleSideNavOpenedItem, sideNavOpenedItemSet } = useGeneralStatus()
   const { id: storageId, tagMap } = storage
   const { push } = useRouter()
   const { popup } = useContextMenu()
   const { messageBox } = useDialog()
   const { removeTag } = useDb()
+  const { t } = useTranslation()
   const currentPathname = usePathnameWithoutNoteId()
 
   const tagListNavItemId = getTagListItemId(storage.id)
@@ -69,7 +68,16 @@ const TagListFragment = ({ storage }: TagListFragmentProps) => {
         />
       )
     })
-  }, [storageId, tagMap, push, currentPathname, popup, messageBox, removeTag])
+  }, [
+    storageId,
+    tagMap,
+    push,
+    currentPathname,
+    popup,
+    messageBox,
+    removeTag,
+    t
+  ])
 
   return (
     <>