LINT

src/views/HomepageView.vue

@@ -13,7 +13,7 @@ export default {
   inject: ['protocol'],
   async setup() {
     let data = ref<CategoryPreviewInterface[]>()
-    let status = ref<"ok" | "error">()
+    let status = ref<'ok' | 'error'>()
 
     return {
       data,
@@ -57,7 +57,9 @@ export default {
           const cursor = this.data[this.data.length - 1].cursor
           if (!cursor) return
           const res = await fetch(
-            `${this.protocol}${import.meta.env.SAFETWITCH_BACKEND_DOMAIN}/api/discover/?cursor=${cursor}`
+            `${this.protocol}${
+              import.meta.env.SAFETWITCH_BACKEND_DOMAIN
+            }/api/discover/?cursor=${cursor}`
           )
           if (!res.ok) {
             throw new Error('Failed to fetch data')
@@ -81,14 +83,13 @@ export default {
       this.following = []
     }
 
-    await getEndpoint("api/discover")
-        .catch(() => {
-            this.status = "error"
-        })
-        .then((data: CategoryPreviewInterface[]) => {
-            this.data = data
-        })
-
+    await getEndpoint('api/discover')
+      .catch(() => {
+        this.status = 'error'
+      })
+      .then((data: CategoryPreviewInterface[]) => {
+        this.data = data
+      })
   },
   components: {
     StreamPreviewVue,
@@ -119,13 +120,13 @@ export default {
     </div>
 
     <div class="p-2">
-      <h1 class="font-bold text-5xl text-white">{{ $t("home.discover") }}</h1>
-      <p class="text-xl text-white">{{ $t("home.discoverDescription") }}</p>
+      <h1 class="font-bold text-5xl text-white">{{ $t('home.discover') }}</h1>
+      <p class="text-xl text-white">{{ $t('home.discoverDescription') }}</p>
 
       <div class="pt-5 inline-flex text-white">
-        <p class="mr-2 font-bold text-white">{{ $t("home.tagDescription") }}</p>
+        <p class="mr-2 font-bold text-white">{{ $t('home.tagDescription') }}</p>
         <form class="relative">
-          <label for="searchBar" class="hidden">{{ $t("main.search") }}</label>
+          <label for="searchBar" class="hidden">{{ $t('main.search') }}</label>
           <v-icon name="io-search-outline" class="absolute my-auto inset-y-0 left-2"></v-icon>
           <input
             type="text"
@@ -143,10 +144,11 @@ export default {
     <ul ref="categoryList">
       <li
         v-for="category in data"
+        :key="category.name"
         ref="categoryItem"
         class="inline-flex m-2 hover:scale-105 transition-transform"
       >
-      <category-preview :category-data="category"></category-preview>
+        <category-preview :category-data="category"></category-preview>
       </li>
     </ul>
   </div>