fetch and store self in store

This commit is contained in:
Hayden 2022-09-24 17:58:19 -08:00
parent efcea11959
commit 8bb13f6bf4
2 changed files with 19 additions and 2 deletions

View file

@ -1,4 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { useAuthStore } from "~~/stores/auth";
import { useItemStore } from "~~/stores/items"; import { useItemStore } from "~~/stores/items";
import { useLabelStore } from "~~/stores/labels"; import { useLabelStore } from "~~/stores/labels";
import { useLocationStore } from "~~/stores/locations"; import { useLocationStore } from "~~/stores/locations";
@ -12,6 +13,19 @@
const api = useUserApi(); const api = useUserApi();
const auth = useAuthStore();
if (auth.self === null) {
const { data, error } = await api.self();
if (error) {
navigateTo("/login");
}
auth.$patch({ self: data.item });
console.log(auth.self);
}
const itemsStore = useItemStore(); const itemsStore = useItemStore();
const items = computed(() => itemsStore.items); const items = computed(() => itemsStore.items);
@ -121,8 +135,8 @@
<div class="sm:flex sm:space-x-5"> <div class="sm:flex sm:space-x-5">
<div class="mt-4 text-center sm:mt-0 sm:pt-1 sm:text-left"> <div class="mt-4 text-center sm:mt-0 sm:pt-1 sm:text-left">
<p class="text-sm font-medium text-gray-600">Welcome back,</p> <p class="text-sm font-medium text-gray-600">Welcome back,</p>
<p class="text-xl font-bold text-gray-900 sm:text-2xl">Username</p> <p class="text-xl font-bold text-gray-900 sm:text-2xl">{{ auth.self.name }}</p>
<p class="text-sm font-medium text-gray-600">User</p> <p class="text-sm font-medium text-gray-600">{{ auth.self.isSuperuser ? "Admin" : "User" }}</p>
</div> </div>
</div> </div>
<div class="mt-5 flex justify-center sm:mt-0"> <div class="mt-5 flex justify-center sm:mt-0">

View file

@ -1,11 +1,13 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
import { useLocalStorage } from "@vueuse/core"; import { useLocalStorage } from "@vueuse/core";
import { UserApi } from "~~/lib/api/user"; import { UserApi } from "~~/lib/api/user";
import { UserOut } from "~~/lib/api/types/data-contracts";
export const useAuthStore = defineStore("auth", { export const useAuthStore = defineStore("auth", {
state: () => ({ state: () => ({
token: useLocalStorage("pinia/auth/token", ""), token: useLocalStorage("pinia/auth/token", ""),
expires: useLocalStorage("pinia/auth/expires", ""), expires: useLocalStorage("pinia/auth/expires", ""),
self: null as UserOut | null,
}), }),
getters: { getters: {
isTokenExpired: state => { isTokenExpired: state => {
@ -30,6 +32,7 @@ export const useAuthStore = defineStore("auth", {
this.token = ""; this.token = "";
this.expires = ""; this.expires = "";
this.self = null;
return result; return result;
}, },