Authorization is now a cookie so removed localStorage code

Update some structure in how we request and save settings. Updated
Settings & Profile to reflect these changes.

src/components/Profile.vue

@@ -43,7 +43,7 @@ import Settings from "@/components/Settings";
 import Activity from "@/components/ActivityPage";
 import SeasonedButton from "@/components/ui/SeasonedButton";
 
-import { getEmoji, getUserRequests, getSettings } from "@/api";
+import { getEmoji, getUserRequests, getSettings, logout } from "@/api";
 
 export default {
   components: { ListHeader, ResultsList, Settings, Activity, SeasonedButton },
@@ -67,7 +67,7 @@ export default {
     }
   },
   methods: {
-    ...mapActions("user", ["logout", "updateSettings"]),
+    ...mapActions("user", ["logout", "setSettings"]),
     toggleSettings() {
       this.showSettings = this.showSettings ? false : true;
 
@@ -98,15 +98,17 @@ export default {
       this.updateQueryParams("activity", this.showActivity);
     },
     _logout() {
-      this.logout();
-      this.$router.push("home");
+      logout().then(() => {
+        this.logout();
+        this.$router.push("home");
+      });
     }
   },
   created() {
     if (!this.settings) {
       getSettings().then(resp => {
         const { settings } = resp;
-        if (settings) updateSettings(settings);
+        if (settings) this.setSettings(settings);
       });
     }
 

src/components/Settings.vue

@@ -13,16 +13,16 @@
           <form class="form">
             <seasoned-input
               placeholder="plex username"
-              icon="Email"
+              type="email"
               :value.sync="plexUsername"
             />
             <seasoned-input
               placeholder="plex password"
-              icon="Keyhole"
               type="password"
               :value.sync="plexPassword"
-              @submit="authenticatePlex"
-            />
+              @enter="authenticatePlex"
+            >
+            </seasoned-input>
 
             <seasoned-button @click="authenticatePlex"
               >link plex account</seasoned-button
@@ -80,7 +80,7 @@
 </template>
 
 <script>
-import { mapGetters, mapState, mapActions } from "vuex";
+import { mapGetters, mapActions } from "vuex";
 import storage from "@/storage";
 import SeasonedInput from "@/components/ui/SeasonedInput";
 import SeasonedButton from "@/components/ui/SeasonedButton";
@@ -104,18 +104,18 @@ export default {
     ...mapGetters("user", ["loggedIn", "plexId", "settings"])
   },
   methods: {
-    ...mapActions("user", ["login", "updateSettings"]),
+    ...mapActions("user", ["setSettings"]),
     changePassword() {
       return;
     },
     created() {
-      if (!this.settings) {
-        console.log("settings does not exists.", this.settings);
-        getSettings().then(resp => {
-          const { settings } = resp;
-          if (settings) updateSettings(settings);
-        });
-      }
+      if (!this.settings) this.reloadSettings();
+    },
+    reloadSettings() {
+      return getSettings().then(response => {
+        const { settings } = response;
+        if (settings) this.setSettings(settings);
+      });
     },
     async authenticatePlex() {
       let username = this.plexUsername;
@@ -123,6 +123,12 @@ export default {
 
       const { success, message } = await linkPlexAccount(username, password);
 
+      if (success) {
+        this.reloadSettings();
+        this.plexUsername = "";
+        this.plexPassword = "";
+      }
+
       this.messages.push({
         type: success ? "success" : "error",
         title: success ? "Authenticated with plex" : "Something went wrong",
@@ -132,6 +138,8 @@ export default {
     async unauthenticatePlex() {
       const response = await unlinkPlexAccount();
 
+      if (response.success) this.reloadSettings();
+
       this.messages.push({
         type: response.success ? "success" : "error",
         title: response.success
@@ -154,8 +162,14 @@ a {
 
 // DUPLICATE CODE
 .form {
-  > div:last-child {
-    margin-top: 1rem;
+  > div,
+  input,
+  button {
+    margin-bottom: 1rem;
+
+    &:last-child {
+      margin-bottom: 0px;
+    }
   }
 
   &__group {