if not auth - redirect to login, set profile after siginin\signup

src/layouts/AppLayout.vue

@@ -47,6 +47,7 @@
 
 <script setup>
 import { onBeforeUnmount, onMounted, ref, computed } from "vue";
+import { useRouter } from "vue-router";
 import { storeToRefs } from "pinia";
 import { onBeforeRouteUpdate } from "vue-router";
 import { useBreakpoint } from "vuestic-ui";
@@ -77,6 +78,10 @@ const onResize = () => {
 };
 
 onMounted(() => {
+  const token = localStorage.getItem('token');
+  if (!token) {
+    useRouter().push({ name: "login" });
+  }
   window.addEventListener("resize", onResize);
   onResize();
 });

src/layouts/AuthLayout.vue

@@ -43,6 +43,5 @@
 <script lang="ts" setup>
 import { useBreakpoint } from "vuestic-ui";
 import VuesticLogo from "../components/VuesticLogo.vue";
-
 const breakpoint = useBreakpoint();
 </script>

src/pages/auth/CheckTheEmail.vue

@@ -34,7 +34,10 @@ const submit = () => {
         code: code.value,
       })
       .then((response) => {
+
         localStorage.setItem('token', response.data.token);
+        localStorage.setItem('profile', JSON.stringify(response.data.profile));
+
         router.push({ name: "dashboard" }).catch((error) => { });
       }).catch((error) => {
         if (error.response.data.detail.code_string == "ObjectNotFound") {

src/pages/auth/Login.vue

@@ -92,10 +92,18 @@ const submit = () => {
       })
       .then((response) => {
         localStorage.setItem('token', response.data.token);
+        localStorage.setItem('profile', JSON.stringify(response.data.profile));
         init({ message: "Вы успешно вошли!", color: "success" });
         push({ name: "dashboard" });
       })
-      .catch((error) => {});
+      .catch((error) => {
+        
+          init({
+            message: "Неверный логин или пароль",
+            color: "error",
+          });
+
+      });
   }
 };
 </script>

src/pages/auth/Signup.vue

@@ -104,6 +104,7 @@ const submit = () => {
       })
       .then((response) => {
         localStorage.setItem('token', response.data.token);
+        localStorage.setItem('profile', JSON.stringify(response.data.profile));
         init({
           message: "Вы успешно вошли",
           color: "success",

src/pages/preferences/Preferences.vue

@@ -1,5 +1,5 @@
 <template>
-  <h1 class="page-title">Preferences</h1>
+  <h1 class="page-title">Настройки профиля</h1>
   <div class="flex flex-col p-4 space-y-10 bg-backgroundSecondary rounded-lg">
     <div class="flex space-x-5">
       <PreferencesHeader />

src/pages/preferences/settings/Settings.vue

@@ -45,83 +45,13 @@
     </VaButton>
   </div>  
   <VaDivider />
-  <div
-    class="flex flex-col md:flex-row space-y-2 md:space-y-0 md:space-x-6 min-h-[36px] leading-5"
-  >
-    <p class="font-bold w-[200px]">Двуфакторная авторизация</p>
-    <div class="flex-1">
-      <div class="max-w-[748px]">
-        {{ twoFA.content }}
-      </div>
-    </div>
-    <VaButton
-      :style="buttonStyles"
-      class="w-fit h-fit"
-      preset="primary"
-      :color="twoFA.color"
-      @click="toggle2FA"
-    >
-      {{ twoFA.button }}
-    </VaButton>
-  </div>
-  <VaDivider />
-  <div
-    class="flex flex-col md:flex-row space-y-2 md:space-y-0 md:space-x-6 min-h-[36px] leading-5"
-  >
-    <p class="font-bold w-[200px]">Email подписка</p>
-    <div class="flex-1">
-      <div class="max-w-[748px]">
-        <p>Чтобы управлять подписками, перейдите в</p>
-        <div class="flex space-x-1 w-fit">
-          <RouterLink
-            :to="{ name: 'settings' }"
-            class="font-semibold text-primary"
-            >Настройки оповещения</RouterLink
-          >
-        </div>
-      </div>
-    </div>
-  </div>
 </template>
 <script lang="ts" setup>
-import { computed } from "vue";
-
-import { useToast } from "vuestic-ui/web-components";
-
 import { useUserStore } from "../../../stores/user-store";
 
 import { buttonStyles } from "../styles";
 
 const store = useUserStore();
 
-const { init } = useToast();
-
-const toastMessage = computed(() =>
-  store.is2FAEnabled ? "2FA успешно включена" : "2FA успешно откючена",
-);
-
-const twoFA = computed(() => {
-  if (store.is2FAEnabled) {
-    return {
-      color: "danger",
-      button: "Disable 2FA",
-      content:
-        "Для вашей учетной записи теперь включена двухфакторная аутентификация (2FA), что повышает уровень безопасности при входе в систему",
-    };
-  } else {
-    return {
-      color: "primary",
-      button: "Set up 2FA",
-      content:
-        "Повысьте уровень безопасности своей учетной записи. Чтобы войти в систему, вам необходимо ввести код вместе со своим именем пользователя и паролем.",
-    };
-  }
-});
-
-const toggle2FA = () => {
-  store.toggle2FA();
-  init({ message: toastMessage.value, color: "success" });
-};
-
 const emits = defineEmits(["openNameModal", "openResetPasswordModal"]);
 </script>

src/stores/user-store.ts

@@ -2,9 +2,29 @@ import { defineStore } from "pinia";
 
 export const useUserStore = defineStore("user", {
   state: () => {
+    if (!localStorage.getItem("profile")) {
       return {
-      userName: "Vasili Savitski",
-      email: "vasili@gmail.com",
+        userName: "",
+        email: "",
+        memberSince: "",
+        pfp: "",
+        is2FAEnabled: false,
+      }
+    }
+    const dataUser = JSON.parse(localStorage.getItem("profile")!);
+    let userName = "";
+    if (dataUser.first_name) {
+      userName = dataUser.first_name;
+    }
+    if (dataUser.surname) {
+      if (userName.length == 0) {
+        userName += " ";
+      }
+      userName += dataUser.surname;
+    }
+    return {
+      userName: userName,
+      email: dataUser.email || "",
       memberSince: "8/12/2020",
       pfp: "https://picsum.photos/id/22/200/300",
       is2FAEnabled: false,