Add ability to export and import followers with settings #121

src/components/FollowButton.vue

@@ -1,4 +1,5 @@
 <script lang="ts">
+import { getFollows } from '@/settingsManager';
 import { ref } from 'vue'
 
 export default {
@@ -33,13 +34,11 @@ export default {
      * @returns true if streamer was followed, false if streamer was already followed.
      */
     followStreamer(username: string): boolean {
-      const follows = localStorage.getItem('following') || '[]'
-      let parsedFollows: string[] = JSON.parse(follows)
+      let follows = getFollows()
+      if (follows.includes(username)) return false
 
-      if (parsedFollows.includes(username)) return false
-
-      parsedFollows.push(username)
-      localStorage.setItem('following', JSON.stringify(parsedFollows))
+      follows.push(username)
+      localStorage.setItem('following', JSON.stringify(follows))
       return true
     },
 
@@ -49,13 +48,12 @@ export default {
      * @returns true if unfollowed, false if not followed.
      */
     unfollowStreamer(username: string): boolean {
-      const follows = localStorage.getItem('following') || '[]'
-      let parsedFollows: string[] = JSON.parse(follows)
+      let follows = getFollows()
 
-      const index = parsedFollows.indexOf(username)
+      const index = follows.indexOf(username)
       if (index === -1) return false
-      parsedFollows.splice(index, 1)
-      localStorage.setItem('following', JSON.stringify(parsedFollows))
+      follows.splice(index, 1)
+      localStorage.setItem('following', JSON.stringify(follows))
 
       return true
     }

src/settingsManager.ts

@@ -65,6 +65,7 @@ export interface Settings {
     streamerAboutSectionVisible: SettingsCheckbox
     autoplay: SettingsCheckbox
   }
+  followers: string[]
 }
 
 /**
@@ -124,7 +125,8 @@ export function getDefaultSettings(): Settings {
         selected: false,
         type: 'checkbox'
       }
-    }
+    },
+    followers: []
   }
 }
 
@@ -163,7 +165,8 @@ export function syncUserSettings(settings: Settings): { settings: Settings; chan
       version: defaultSettings.version,
       settings: {
         ...oldSettings
-      }
+      },
+      followers: []
     }
 
     userSettings = migrated

src/views/SettingsView.vue

@@ -5,7 +5,8 @@ import {
   syncUserSettings,
   setLanguage,
   themeList,
-  getTheme
+  getTheme,
+  getFollows
 } from '@/settingsManager'
 import type { Settings } from '@/settingsManager'
 
@@ -55,6 +56,8 @@ export default {
     download() {
       var hiddenElement = document.createElement('a')
 
+      this.settings.followers = getFollows()
+
       hiddenElement.href = 'data:attachment/text,' + encodeURI(JSON.stringify(this.settings))
       hiddenElement.target = '_blank'
       hiddenElement.download = 'safetwitch_prefs.json'
@@ -72,6 +75,7 @@ export default {
         settings = parsed
       }
 
+      localStorage.setItem('following', JSON.stringify(settings.followers))
       this.settings = settings
       this.save()
     }