Use dynamic S3 keys instead of hard coding one

#15

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 + '/'
                     )
                   "
                 >

src/stores/auth.ts

 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);