🚨 (app)

src/hooks/useGitHubLogin.hook.ts

@@ -1,31 +1,31 @@
 import { computed, ref } from 'vue'
 
 import { confirmMessage } from '@/utils/notif'
-import { GithubToken } from '@/modules/user/interfaces/GithubToken'
 import { getAccessToken, saveAccessToken } from '@/modules/user/service/signIn'
+import { GithubToken } from '@/modules/user/interfaces/GithubToken'
 
 const username = ref<string | null>(null)
 const accessToken = ref<string | null>(null)
 
 let init = true
 
-export const useGitHubLogin = () => {
-  const saveAccessTokenToLocal = async () => {
+const saveAccessTokenToLocal = async () => {
   const response = await getAccessToken()
   username.value = response?.username || ''
   accessToken.value = response?.token || ''
-  }
+}
 
-  if (init) {
-    init = false
-    saveAccessTokenToLocal()
-  }
-
-  const saveCredentials = async (githubToken: GithubToken) => {
-    const accessToken = await saveAccessToken(githubToken)
+const saveCredentials = async (token: GithubToken): Promise<void> => {
+  const accessToken = await saveAccessToken(token)
 
   await saveAccessTokenToLocal()
   confirmMessage(`${accessToken.username} is logged in!`)
+}
+
+export const useGitHubLogin = () => {
+  if (init) {
+    init = false
+    saveAccessTokenToLocal()
   }
 
   return {

src/modules/repo/store/userRepo.store.ts

@@ -29,7 +29,6 @@ export const useUserRepoStore = defineStore({
     async setUserRepo(newUser: string, newRepo: string) {
       this.user = newUser
       this.repo = newRepo
-      await refreshToken()
       const [readme, files] = await Promise.all([
         getMainReadme(newUser, newRepo),
         getFiles(newUser, newRepo)

src/views/DraftNotes.vue

@@ -1,9 +1,7 @@
 <template>
   <div class="draft-notes">
-    <flux-note :user="user" :repo="repo" :content="content" key="draft-notes">
-      <h3 class="subtitle is-3">
-        Drafts
-      </h3>
+    <flux-note key="draft-notes" :user="user" :repo="repo" :content="content">
+      <h3 class="subtitle is-3">Drafts</h3>
     </flux-note>
   </div>
 </template>

src/views/FleetingNotes.vue

@@ -1,14 +1,12 @@
 <template>
   <div class="fleeting-notes">
     <flux-note
+      key="fleeting-notes"
       :user="user"
       :repo="repo"
       :content="content"
-      key="fleeting-notes"
     >
-      <h3 class="subtitle is-3">
-        Inbox
-      </h3>
+      <h3 class="subtitle is-3">Inbox</h3>
     </flux-note>
   </div>
 </template>

src/views/Home.vue

@@ -8,10 +8,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, defineAsyncComponent, computed } from 'vue'
+import { defineComponent, defineAsyncComponent, computed, onMounted } from 'vue'
 import { useQueryStackedNotes } from '@/hooks/useQueryStackedNotes.hook'
 import NewVersion from '@/components/NewVersion.vue'
 import Authorize from '@/components/Authorize.vue'
+import { refreshToken } from '@/modules/user/service/signIn'
 
 const FluxNote = defineAsyncComponent(() => import('@/components/FluxNote.vue'))
 
@@ -33,6 +34,9 @@ export default defineComponent({
   },
   setup(props) {
     const { resetStackedNotes } = useQueryStackedNotes()
+    onMounted(() => {
+      refreshToken()
+    })
 
     return {
       resetStackedNotes,