refacto: migrate to composition API everywhere

src/views/AboutApp.vue

@@ -1,3 +1,7 @@
+<script lang="ts" setup>
+import GoBack from '@/components/GoBack.vue'
+</script>
+
 <template>
   <div class="about content">
     <go-back />
@@ -21,16 +25,6 @@
   </div>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import GoBack from '@/components/GoBack.vue'
-
-export default defineComponent({
-  components: { GoBack }
-})
-</script>
-
 <style lang="scss" scoped>
 .about {
   padding: 1rem;

src/views/RepoList.vue

@@ -1,3 +1,15 @@
+<script lang="ts" setup>
+import GoBack from '@/components/GoBack.vue'
+import { useGitHubLogin } from '@/hooks/useGitHubLogin.hook'
+import { useRepos } from '@/hooks/useRepos.hook'
+import { useRepoList } from '@/modules/repo/hooks/useRepoList.hook'
+
+const { username } = useGitHubLogin()
+const { isReady } = useRepos()
+const { favoriteRepos, otherRepos, favoriteCheckboxes, toggleCheckbox } =
+  useRepoList()
+</script>
+
 <template>
   <div class="repo-list">
     <h1 class="title is-1">Repositories</h1>
@@ -78,35 +90,6 @@
   </div>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import GoBack from '@/components/GoBack.vue'
-import { useGitHubLogin } from '@/hooks/useGitHubLogin.hook'
-import { useRepos } from '@/hooks/useRepos.hook'
-import { useRepoList } from '@/modules/repo/hooks/useRepoList.hook'
-
-export default defineComponent({
-  name: 'RepoList',
-  components: { GoBack },
-  setup() {
-    const { username } = useGitHubLogin()
-    const { isReady } = useRepos()
-    const { favoriteRepos, otherRepos, favoriteCheckboxes, toggleCheckbox } =
-      useRepoList()
-
-    return {
-      isReady,
-      username,
-      favoriteRepos,
-      otherRepos,
-      favoriteCheckboxes,
-      toggleCheckbox
-    }
-  }
-})
-</script>
-
 <style lang="scss" scoped>
 .repo-list {
   flex: 1;

src/views/SpaceCowboy.vue

@@ -1,3 +1,6 @@
+<script lang="ts" setup>
+</script>
+
 <template>
   <main class="space-cowboy content">
     <p>
@@ -44,14 +47,6 @@
   </main>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'SpaceCowboy'
-})
-</script>
-
 <style scoped lang="scss">
 .space-cowboy {
   display: flex;