diff --git a/src/components/BucketView.vue b/src/components/BucketView.vue index b8277653799957b4d236e32cf680e7241b3c0c0d..e9bbd681d6b5d158f698c9b1ecb1899b5833faea 100644 --- a/src/components/BucketView.vue +++ b/src/components/BucketView.vue @@ -17,18 +17,40 @@ import { DeleteObjectsCommand, } from "@aws-sdk/client-s3"; import { awsAuthMiddlewareOptions } from "@aws-sdk/middleware-signing"; +import { useAuthStore } from "@/stores/auth"; -const client = new S3Client({ +const authStore = useAuthStore(); + +let client = new S3Client({ region: "us-east-1", endpoint: import.meta.env.VITE_S3_URL, forcePathStyle: true, credentials: { - accessKeyId: import.meta.env.VITE_API_ACCESS_KEY, - secretAccessKey: import.meta.env.VITE_API_SECRET_KEY, + accessKeyId: authStore.s3key?.access_key ?? "", + secretAccessKey: authStore.s3key?.secret_key ?? "", }, tls: false, }); +authStore.$onAction(({ name, args }) => { + if (name === "setS3Key") { + if (args[0] === null) { + console.error("There are no S3 Keys"); + } else { + client = new S3Client({ + region: "us-east-1", + endpoint: import.meta.env.VITE_S3_URL, + forcePathStyle: true, + credentials: { + accessKeyId: args[0].access_key, + secretAccessKey: args[0].secret_key, + }, + tls: false, + }); + } + } +}); + client.middlewareStack.addRelativeTo( // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore @@ -223,7 +245,8 @@ const errorLoadingObjects: ComputedRef<boolean> = computed( ); const writeS3Permission: ComputedRef<boolean> = computed( - () => props.permission == undefined || props.permission.permission == "READWRITE" + () => + props.permission == undefined || props.permission.permission == "READWRITE" ); // Lifecycle Hooks @@ -670,10 +693,22 @@ watch( <button class="dropdown-item" type="button">Details</button> </li> <li> - <button class="dropdown-item" type="button" :disabled="!writeS3Permission">Edit</button> + <button + class="dropdown-item" + type="button" + :disabled="!writeS3Permission" + > + Edit + </button> </li> <li> - <button class="dropdown-item" type="button" :disabled="!writeS3Permission">Copy</button> + <button + class="dropdown-item" + type="button" + :disabled="!writeS3Permission" + > + Copy + </button> </li> <li> <button @@ -702,7 +737,7 @@ watch( :disabled="!writeS3Permission" @click=" deleteFolder( - obj.parentFolder.join('/') + '/' + obj.name + '/' + obj.parentFolder.concat(['']).join('/') + obj.name + '/' ) " > diff --git a/src/stores/auth.ts b/src/stores/auth.ts index 93dd60eaa64a3db0b5f9e0852e33d0f16ece69d8..debb687a59e17b6bd62db1ad2c1581c42b77e9c3 100644 --- a/src/stores/auth.ts +++ b/src/stores/auth.ts @@ -1,11 +1,12 @@ import { defineStore } from "pinia"; -import type { User } from "@/client"; -import { UserService } from "@/client"; +import type { S3Key, User } from "@/client"; +import { KeyService, UserService } from "@/client"; import { OpenAPI } from "@/client"; export type RootState = { token: string | null; user: User | null; + s3key: S3Key | null; }; export const useAuthStore = defineStore({ @@ -14,6 +15,7 @@ export const useAuthStore = defineStore({ ({ token: null, user: null, + s3key: null, } as RootState), getters: { authenticated: (state) => state.token != null, @@ -25,7 +27,7 @@ export const useAuthStore = defineStore({ this.token = token; UserService.userGetLoggedInUser() .then((user) => { - this.user = user; + this.updateUser(user); }) .catch(() => { this.token = null; @@ -35,8 +37,22 @@ export const useAuthStore = defineStore({ this.user = null; } }, - updateUser() { - this.setToken(this.token); + setS3Key(key: S3Key | null) { + this.s3key = key; + }, + updateUser(user: User) { + this.user = user; + KeyService.keyGetUserKeys(user.uid) + .then((keys) => { + if (keys.length > 0) { + this.setS3Key(keys[0]); + } else { + this.setS3Key(null); + } + }) + .catch(() => { + this.setS3Key(null); + }); }, logout() { this.setToken(null);