Salva usuário no localstorage em vez da sessão

resources/js/Components/Nav.vue

@@ -1,4 +1,5 @@
 <script setup>
+import user from "@/user";
 import { ref, watch } from "vue";
 
 const props = defineProps({
@@ -21,7 +22,7 @@ const emit = defineEmits(["name-updated"]);
 
 const setUsername = () => {
   console.log(`Setting name: ${finalName.value}`);
-  sessionStorage.setItem("username", finalName.value);
+  user.saveUsername(finalName.value)
   emit("name-updated");
 };
 </script>

resources/js/Components/ProfileModal.vue

@@ -1,4 +1,5 @@
 <script setup>
+import user from "@/user";
 import { ref } from "vue";
 import Modal from "./Modal.vue";
 
@@ -15,7 +16,7 @@ const emit = defineEmits(["name-updated"]);
 
 const setUsername = () => {
   console.log(`Setting name: ${finalName.value}`);
-  sessionStorage.setItem("username", finalName.value);
+  user.saveUsername(finalName.value);
   emit("name-updated");
 };
 </script>

resources/js/Layouts/MainLayout.vue

@@ -1,12 +1,13 @@
 <script setup>
 import Nav from "@/Components/Nav.vue";
 import ProfileModal from "@/Components/ProfileModal.vue";
-import { ref, onMounted } from "vue";
+import user from "@/user";
+import { onMounted, ref } from "vue";
 
 const username = ref("");
 
 const fetchUsername = () => {
-  username.value = sessionStorage.getItem("username") ?? "";
+  username.value = user.retrieveUsername() ?? "";
   console.log(`Name on session storage: ${username.value}`);
 };
 

resources/js/api.js

@@ -1,4 +1,5 @@
 import axios from "axios";
+import user from "./user";
 
 export function createRoom(name) {
   return axios.post("/api/rooms", { name: name });
@@ -45,7 +46,7 @@ export const votes = (roundId) => ({
     }
 
     const response = await axios.post(`/api/rounds/${roundId}/votes`, {
-      name: this.retrieveUsername(),
+      name: user.retrieveUsername(),
     });
 
     this.saveId(response.data.data.id);
@@ -54,7 +55,7 @@ export const votes = (roundId) => ({
   set(value) {
     const id = this.retrieveId();
     axios.put(`/api/rounds/${roundId}/votes/${id}`, {
-      name: this.retrieveUsername(),
+      name: user.retrieveUsername(),
       vote: value,
     });
   },
@@ -64,7 +65,4 @@ export const votes = (roundId) => ({
   saveId(id) {
     sessionStorage.setItem(`vote.${roundId}`, id);
   },
-  retrieveUsername() {
-    return sessionStorage.getItem(`username`);
-  },
 });

resources/js/user.js

@@ -0,0 +1,8 @@
+export default {
+    saveUsername(username) {
+        localStorage.setItem(`username`, username);
+    },
+    retrieveUsername() {
+        return localStorage.getItem(`username`);
+    }
+}