Lint + format

src/components/FooterView.vue

@@ -6,7 +6,7 @@ export default {
     let version = `${import.meta.env.SAFETWITCH_TAG}-${import.meta.env.SAFETWITCH_COMMIT_HASH}`
 
     if (dev) {
-      version = version + "-dev"
+      version = version + '-dev'
     }
 
     return {

src/components/NavbarView.vue

@@ -43,7 +43,11 @@ export default {
 
     <div class="block md:hidden">
       <button @click="toggle" class="flex items-center px-3 py-2">
-        <svg class="fill-current text-contrast h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+        <svg
+          class="fill-current text-contrast h-3 w-3"
+          viewBox="0 0 20 20"
+          xmlns="http://www.w3.org/2000/svg"
+        >
           <title>Menu</title>
           <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
         </svg>

src/mixins.ts

@@ -1,4 +1,3 @@
-import { getFollows } from '@/settingsManager'
 import type { StreamerData } from '@/types'
 
 const language = localStorage.getItem('language') || 'en-us'
@@ -112,7 +111,7 @@ export async function followersStreaming(streamers: string[]): Promise<string[]>
 
   const liveStreamers: string[] = []
 
-  for (let streamer of data) {
+  for (const streamer of data) {
     if (streamer.isLive) {
       liveStreamers.push(streamer.login)
     }

src/settingsManager.ts

@@ -193,7 +193,7 @@ export function getSetting(key: string): boolean | string {
 
 export function getFollows(): string[] {
   const follows = localStorage.getItem('following') || '[]'
-  let parsedFollows: string[] = JSON.parse(follows)
+  const parsedFollows: string[] = JSON.parse(follows)
 
   return parsedFollows
 }

src/views/FollowingView.vue

@@ -55,19 +55,22 @@ export default {
 <template>
   <loading-screen v-if="!data && status != 'error'"></loading-screen>
   <error-message v-else-if="status == 'error'"></error-message>
-  <div v-else-if="data" class="md:max-w-[50rem] w-full mx-auto text-contrast flex flex-col justify-center">
+  <div
+    v-else-if="data"
+    class="md:max-w-[50rem] w-full mx-auto text-contrast flex flex-col justify-center"
+  >
     <div v-if="data.length == 0" class="text-center">
-      <h1 class="text-3xl font-bold">{{ $t("following.empty") }}</h1>
+      <h1 class="text-3xl font-bold">{{ $t('following.empty') }}</h1>
-      <p>{{ $t("following.followAdvice") }}</p>
+      <p>{{ $t('following.followAdvice') }}</p>
     </div>
 
     <div class="text-center">
-      <h1 class="text-3xl font-bold">{{ $t("home.following") }}</h1>
+      <h1 class="text-3xl font-bold">{{ $t('home.following') }}</h1>
-      <p>{{ $t("home.streamersYouFollow") }}</p>
+      <p>{{ $t('home.streamersYouFollow') }}</p>
     </div>
 
     <ul class="m-2 flex flex-wrap justify-center">
-      <li v-for="streamer in data" class="">
+      <li v-for="streamer in data" :key="streamer.login" class="">
         <div class="inline-flex bg-overlay0 p-2.5 m-1 rounded-md w-[22rem]">
           <img :src="streamer.pfp" class="w-16 rounded-full" />
           <div class="justify-between flex flex-col ml-2">

src/views/HomepageView.vue

@@ -21,7 +21,7 @@ export default {
       data,
       status,
       filterTags: '',
-      following,
+      following
     }
   },
   methods: {
@@ -71,7 +71,7 @@ export default {
   async mounted() {
     window.onscroll = this.getNextCategory
 
-    this.following = await followersStreaming(getFollows());
+    this.following = await followersStreaming(getFollows())
 
     // get discover page
     await getEndpoint('api/discover')
@@ -115,16 +115,27 @@ export default {
         <div class="relative">
           <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" id="searchBar" name="searchBar" :placeholder="$t('main.search')" v-model="filterTags"
+          <input
-            @keypress="filterSearches(filterTags)" @keyup="filterSearches(filterTags)"
+            type="text"
-            class="rounded-md p-1 pl-8 placeholder:text-white" />
+            id="searchBar"
+            name="searchBar"
+            :placeholder="$t('main.search')"
+            v-model="filterTags"
+            @keypress="filterSearches(filterTags)"
+            @keyup="filterSearches(filterTags)"
+            class="rounded-md p-1 pl-8 placeholder:text-white"
+          />
         </div>
       </div>
     </div>
 
     <ul ref="categoryList" class="flex flex-wrap justify-center">
-      <li v-for="category in data" :key="category.name" ref="categoryItem"
+      <li
-        class="m-2 hover:scale-105 transition-transform">
+        v-for="category in data"
+        :key="category.name"
+        ref="categoryItem"
+        class="m-2 hover:scale-105 transition-transform"
+      >
         <category-preview :category-data="category"></category-preview>
       </li>
     </ul>