Signed URls e.g. private storage

Donnerstagnacht · Dec 17, 2023 · ba976a2 · ba976a2
1 parent 26b6639
commit ba976a2
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 39 deletions.
diff --git a/src/app/features/profile/profile-image-upload/profile-image-upload.component.ts b/src/app/features/profile/profile-image-upload/profile-image-upload.component.ts
@@ -25,7 +25,7 @@ export class ProfileImageUploadComponent {
     protected rejectedFiles$: Subject<TuiFileLike | null> = new Subject<TuiFileLike | null>();
     protected loadingFiles$: Subject<TuiFileLike | null> = new Subject<TuiFileLike | null>();
     protected loadedFiles$: Observable<TuiFileLike | null> = this.imageControl.valueChanges.pipe(
-        switchMap(file => (file ? this.makeRequest(file) : of(null))),
+        switchMap(file => (file ? this.returnRequestAsObservable(file) : of(null))),
     );
     protected profileWriteable: WritableSignal<Profile | null | undefined>;
     private avatarUrl: string = '';
@@ -38,47 +38,50 @@ export class ProfileImageUploadComponent {
         this.profileWriteable = this.profileStoreService.profile.getObject()
     }
 
-    protected makeRequest(file: TuiFileLike): Observable<TuiFileLike | null> {
+    returnRequestAsObservable(file: TuiFileLike): Observable<TuiFileLike | null> {
+        const request: Promise<TuiFileLike | null> = this.makeRequest(file)
+        const requestAsObservable: Observable<TuiFileLike | null> = from(request)
+        return requestAsObservable;
+    }
+
+    async makeRequest(file: TuiFileLike): Promise<TuiFileLike | null> {
         this.loadingFiles$.next(file);
         const fileExtension: string | undefined = file.name.split('.').pop()
         const filePath: string = `${Math.random()}.${fileExtension}`
+        try {
+            const response: {
+                data: { path: string };
+                error: null
+            } | {
+                data: null;
+                error: Error
+            } = await this.profileService.uploadImage(filePath, file);
 
-        console.log('before request')
-        const response: Promise<TuiFileLike | null> = this.profileService.uploadImage(filePath, file)
-        .then((response: { data: { path: string }, error: null } | { data: null, error: Error }) => {
             if (response.error) {
-                console.log('error', response.error)
                 throw Error
             } else {
-                // const publicBucket: {
-                //     data: { publicUrl: string }
-                // } = this.profileService.getPublicBucket(response.data.path)
-                // console.log('public bucket', publicBucket)
-                // this.avatarUrl = publicBucket.data.publicUrl;
-                // console.log('public bucket', publicBucket)
-                this.profileService.getSignedImageUrl(response.data.path).then((privateUrl) => {
-                    console.log('fetched privateUrl', privateUrl)
-                    this.profileService.updateProfileImage(response.data.path).then((): void => {
-                        //TODO double check
-                        const profile = {
-                            // profile_image: this.avatarUrl
+                try {
+                    const privateUrl: string | undefined = await this.profileService.getSignedImageUrl(response.data.path);
+                    try {
+                        await this.profileService.updateProfileImage(response.data.path);
+                    } catch (error) {
+                    } finally {
+                        const profile: FunctionSingleReturn<"select_user"> = {
                             profile_image: privateUrl
-                        } as FunctionSingleReturn<'select_user'>
-                        this.profileStoreService.profile.mutateObject(profile)
-                    })
-                });
+                        } as FunctionSingleReturn<'select_user'>;
+                        this.profileStoreService.profile.mutateObject(profile);
+                    }
+                } catch (error) {
+                }
             }
             return file;
-        })
-        .catch((): null => {
+        } catch (error) {
             this.rejectedFiles$.next(file);
             return null;
-        })
-        .finally((): null => {
+        } finally {
             this.loadingFiles$.next(null)
             return null;
-        });
-        return from(response)
+        }
     }
 
     protected clearRejected(): void {

diff --git a/supabase/migrations/02_profile/01000202_profile_storage.sql b/supabase/migrations/02_profile/01000202_profile_storage.sql
@@ -6,18 +6,20 @@ INSERT INTO
 VALUES
     ('profile_images',
      'profile_images',
-     TRUE);
+     FALSE);
 
 -- Set up access controls for storage.
 -- See https://supabase.com/docs/guides/storage/security/access-control#policy-examples for more details.
-DROP POLICY IF EXISTS "Profile images are publicly accessible." ON storage.objects;
-CREATE POLICY "Profile images are publicly accessible." ON storage.objects
-    FOR SELECT USING (bucket_id = 'profile_images');
+DROP POLICY IF EXISTS "Profile images are accessible for authenticated users." ON storage.objects;
+CREATE POLICY "Profile images are accessible for authenticated users."
+    ON storage.objects
+    FOR SELECT
+    TO authenticated
+    USING (bucket_id = 'profile_images');
 
-DROP POLICY IF EXISTS "Anyone can upload an profile_image." ON storage.objects;
-CREATE POLICY "Anyone can upload an profile_image." ON storage.objects
-    FOR INSERT WITH CHECK (bucket_id = 'profile_images');
-
-DROP POLICY IF EXISTS "Users can update their own profile_image." ON storage.objects;
-CREATE POLICY "Users can update their own profile_image." ON storage.objects
-    FOR UPDATE USING (auth.uid() = owner) WITH CHECK (bucket_id = 'profile_images');
+DROP POLICY IF EXISTS "Authenticated users can upload images" ON storage.objects;
+CREATE POLICY "Authenticated users can upload images"
+    ON storage.objects
+    FOR INSERT
+    TO authenticated
+    WITH CHECK (bucket_id = 'profile_images');