[U] upgrade dependencies, new supbase-js version

package.json

@@ -21,34 +21,34 @@
     "@angular/platform-browser": "^11.2.10",
     "@angular/platform-browser-dynamic": "^11.2.10",
     "@angular/router": "^11.2.10",
-    "@ng-bootstrap/ng-bootstrap": "7.0.0",
+    "@ng-bootstrap/ng-bootstrap": "9.1.0",
-    "@supabase/supabase-js": "^0.36.5",
+    "@supabase/supabase-js": "^1.11.6",
-    "bootstrap": "4.5.2",
+    "bootstrap": "4.6.0",
-    "core-js": "3.6.4",
+    "core-js": "3.10.1",
-    "recordrtc": "^5.6.1",
+    "recordrtc": "^5.6.2",
-    "rxjs": "6.5.4",
+    "rxjs": "6.6.7",
-    "tslib": "^2.0.0",
+    "tslib": "^2.2.0",
-    "zone.js": "0.10.2"
+    "zone.js": "0.11.4"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "^0.1102.9",
     "@angular/cli": "^11.2.9",
     "@angular/compiler-cli": "^11.2.10",
     "@angular/language-service": "^11.2.10",
-    "@types/core-js": "0.9.46",
+    "@types/core-js": "2.5.4",
-    "@types/jasmine": "~3.6.0",
+    "@types/jasmine": "~3.6.9",
-    "@types/jasminewd2": "~2.0.2",
+    "@types/jasminewd2": "~2.0.8",
-    "@types/node": "~6.0.60",
+    "@types/node": "~14.14.41",
-    "codelyzer": "^6.0.0",
+    "codelyzer": "^6.0.1",
-    "jasmine-core": "~3.6.0",
+    "jasmine-core": "~3.7.1",
-    "jasmine-spec-reporter": "~5.0.0",
+    "jasmine-spec-reporter": "~7.0.0",
     "karma": "~6.3.2",
     "karma-chrome-launcher": "~3.1.0",
-    "karma-coverage-istanbul-reporter": "^1.2.1",
+    "karma-coverage-istanbul-reporter": "^3.0.3",
-    "karma-jasmine": "~4.0.0",
+    "karma-jasmine": "~4.0.1",
-    "karma-jasmine-html-reporter": "^1.5.0",
+    "karma-jasmine-html-reporter": "^1.5.4",
     "protractor": "~7.0.0",
-    "ts-node": "~4.1.0",
+    "ts-node": "~9.1.1",
     "tslint": "~6.1.3",
     "typescript": "4.1.5"
   },

src/app/api/supabase/channel.service.ts

@@ -56,8 +56,10 @@ export class ChannelService {
   refreshChannels(): Observable<Channel[]> {
     this.subscribeToChannels();
     this.supa.client.from<Channel>('channel').select()
-      .then(channels => this.updateStore(channels.body))
+      .then(
-      .catch(error => console.log('Error: ', error));
+        channels => this.updateStore(channels.body),
+        error => console.log('Error: ', error)
+      );
     return this.channels.asObservable();
   }
 
@@ -88,15 +90,17 @@ export class ChannelService {
       const subject: Subject<Channel> = new Subject();
       this.supa.client.from<Channel>('channel').select('id, name, description')
       .filter(<never>'id', 'eq', id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore([data.body[0]]);
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
       return subject.asObservable();
     }
   }
@@ -108,15 +112,17 @@ export class ChannelService {
   updateOne(channel: Channel): Observable<Channel> {
     const subject: Subject<Channel> = new Subject();
     this.supa.client.from<Channel>('channel').update(channel)
-      .match({ id: channel.id })
+      .match({ id: String(channel.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        }),
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      ;
     return subject.asObservable();
   }
 
@@ -128,15 +134,17 @@ export class ChannelService {
   deleteOne(channel: Channel): Observable<Channel> {
     const subject: Subject<Channel> = new Subject();
     this.supa.client.from<Channel>('channel').delete()
-      .match({ id: channel.id })
+      .match({ id: String(channel.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(channel);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -147,14 +155,16 @@ export class ChannelService {
   addOne(channel: Channel): Observable<Channel> {
     const subject: Subject<Channel> = new Subject();
     this.supa.client.from<Channel>('channel').insert(channel)
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 }

src/app/api/supabase/message.service.ts

@@ -30,12 +30,10 @@ export class MessageService {
       console.log('getMessages - REFRESH', channel_id)
       this.supa.client.from<Message>('message').select()
       .filter(<never>'channel_id', 'eq', channel_id)      
-      .then(data => {
+      .then(
-        this.updateStore(data.body);
+        data => this.updateStore(data.body),
-      })
+        error => console.error(error)
-      .catch(error => {
+      );
-        console.error(error);
-      });
     } else {      
       console.log('getMessages - LOCAL', channel_id)
     }
@@ -108,15 +106,17 @@ export class MessageService {
       const subject: Subject<Message> = new Subject();
       this.supa.client.from<Message>('message').select('id, name, description')
       .filter(<never>'id', 'eq', id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore([data.body[0]]);
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
       return subject.asObservable();
     }
   }
@@ -128,15 +128,17 @@ export class MessageService {
   updateOne(message: Message): Observable<Message> {
     const subject: Subject<Message> = new Subject();
     this.supa.client.from<Message>('message').update(message)
-      .match({ id: message.id })
+      .match({ id: String(message.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      )      ;
     return subject.asObservable();
   }
 
@@ -148,15 +150,17 @@ export class MessageService {
   deleteOne(message: Message): Observable<Message> {
     const subject: Subject<Message> = new Subject();
     this.supa.client.from<Message>('message').delete()
-      .match({ id: message.id })
+      .match({ id: String(message.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(message);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -167,14 +171,16 @@ export class MessageService {
   addOne(message: Message): Observable<Message> {
     const subject: Subject<Message> = new Subject();
     this.supa.client.from<Message>('message').insert(message)
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 

src/app/api/supabase/standup.service.ts

@@ -56,8 +56,10 @@ export class StandupService {
   refreshStandUps(): Observable<StandUp[]> {
     this.subscribeToStandups();
     this.supa.client.from<StandUp>('standup').select()
-      .then(standups => this.updateStore(standups.body))
+      .then(
-      .catch(error => console.log('Error: ', error));
+        standups => this.updateStore(standups.body),
+        error => console.log('Error: ', error)
+      );
     return this.standups.asObservable();
   }
 
@@ -88,15 +90,17 @@ export class StandupService {
       const subject: Subject<StandUp> = new Subject();
       this.supa.client.from<StandUp>('standup').select('id, name, description')
       .filter(<never>'id', 'eq', id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore([data.body[0]]);
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
       return subject.asObservable();
     }
   }
@@ -108,15 +112,17 @@ export class StandupService {
   updateOne(standup: StandUp): Observable<StandUp> {
     const subject: Subject<StandUp> = new Subject();
     this.supa.client.from<StandUp>('standup').update(standup)
-      .match({ id: standup.id })
+      .match({ id: String(standup.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -128,15 +134,17 @@ export class StandupService {
   deleteOne(standup: StandUp): Observable<StandUp> {
     const subject: Subject<StandUp> = new Subject();
     this.supa.client.from<StandUp>('standup').delete()
-      .match({ id: standup.id })
+      .match({ id: String(standup.id) })
-      .then(data => {
+      .then(
+        data => {
           subject.next(standup);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -147,14 +155,16 @@ export class StandupService {
   addOne(standup: StandUp): Observable<StandUp> {
     const subject: Subject<StandUp> = new Subject();
     this.supa.client.from<StandUp>('standup').insert(standup)
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 

src/app/api/supabase/story.service.ts

@@ -30,12 +30,14 @@ export class StoryService {
       console.log('getStories - REFRESH', standup_id)
       this.supa.client.from<Story>('story').select()
       .filter(<never>'standup_id', 'eq', standup_id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore(data.body);
-      })
+        },
-      .catch(error => {
+        error => {
           console.error(error);
-      });
+        }
+      );
     } else {      
       console.log('getStories - LOCAL', standup_id)
     }
@@ -108,15 +110,17 @@ export class StoryService {
       const subject: Subject<Story> = new Subject();
       this.supa.client.from<Story>('story').select('id, name, description')
       .filter(<never>'id', 'eq', id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore([data.body[0]]);
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
       return subject.asObservable();
     }
   }
@@ -129,14 +133,16 @@ export class StoryService {
     const subject: Subject<Story> = new Subject();
     this.supa.client.from<Story>('story').update(story)
       .match({ id: story.id })
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -149,14 +155,16 @@ export class StoryService {
     const subject: Subject<Story> = new Subject();
     this.supa.client.from<Story>('story').delete()
       .match({ id: story.id })
-      .then(data => {
+      .then(
+        data => {
           subject.next(story);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -167,14 +175,16 @@ export class StoryService {
   addOne(story: Story): Observable<Story> {
     const subject: Subject<Story> = new Subject();
     this.supa.client.from<Story>('story').insert(story)
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+      }
+      );
     return subject.asObservable();
   }
 

src/app/api/supabase/supa.service.ts

@@ -1,8 +1,8 @@
 import { Injectable } from '@angular/core';
-import { createClient, SupabaseAuthUser, SupabaseClient } from '@supabase/supabase-js'
+import { createClient, User, SupabaseClient } from '@supabase/supabase-js';
 import { Subject } from 'rxjs';
 import { environment } from '../../../environments/environment'
-import { User } from './user';
+import { User as UserModel } from './user';
 
 
 @Injectable({
@@ -10,81 +10,87 @@ import { User } from './user';
 })
 export class SupaService {
   client: SupabaseClient;
-  user: Subject<SupabaseAuthUser> = new Subject();
+  user: Subject<User> = new Subject();
-  supabaseUser: SupabaseAuthUser;
+  supabaseUserModel: User;
-  userProfile: User;
+  userProfile: UserModel;
 
   constructor() {
       // Create a single supabase client for interacting with your database 
       this.client = createClient(environment.supa_url, environment.supa_key);
-      this.getUser();
+      this.getUserModel();
   }
 
-  async getUser() {
+  async getUserModel() {
     const user = await this.client.auth.user();
+    if (user) {
       console.log('user', user);
-    this.supabaseUser = user;
+      this.supabaseUserModel = user;
-    this.getUserProfile();
+      this.getUserModelProfile();
       this.user.next(user);
     }
+  }
 
-  getUserProfile(user_id: string = this.supabaseUser.id) {
+  getUserModelProfile(user_id: string = this.supabaseUserModel.id) {
-    const subject: Subject<User> = new Subject();
+    const subject: Subject<UserModel> = new Subject();
     if (!this.userProfile) {
-      this.client.from<User>('user').select().match({id: <never>user_id})
+      this.client.from<UserModel>('user').select().match({id: <never>user_id})
-        .then(data => {
+        .then(
-          console.log('getUserProfile', data)
+          data => {
+            console.log('getUserModelProfile', data)
             if (data.body.length === 0) {
               // create default user profile
-            this.client.from<User>('user').insert(new User(user_id, this.supabaseUser.email.split('@')[0]))
+              this.client.from<UserModel>('user').insert(new UserModel(user_id, this.supabaseUserModel.email.split('@')[0]))
-              .then(data => {
+                .then(
-                console.log('created UserProfile', data.body[0]);
+                  data => {
+                    console.log('created UserModelProfile', data.body[0]);
                     this.userProfile = data.body[0];
                     subject.next(this.userProfile);
-              })
+                  },
-              .catch(error => console.error('Error creating UserProfile', error))
+                  error => console.error('Error creating UserModelProfile', error)
+                )
             } else {
-            console.log('loaded UserProfile', data.body[0]);
+              console.log('loaded UserModelProfile', data.body[0]);
               this.userProfile = data.body[0];
               subject.next(this.userProfile);
             }
-        })
+          },
-        .catch(error => console.error('getUserProfile', error))
+          error => console.error('getUserModelProfile', error)
+        );
     } else {
       setTimeout(() =>subject.next(this.userProfile), 100);
     }
     return subject.asObservable();
   }
 
-  async login(email: string, password: string): Promise<SupabaseAuthUser> {
+  async login(email: string, password: string): Promise<User> {
     try {
-      const res = await this.client.auth.login(
+      const res = await this.client.auth.signIn({
         email,
         password
-      );
+      });
-      this.user.next(res.body.user);
+      this.user.next(res.user);
-      this.supabaseUser = res.body.user;
+      this.supabaseUserModel = res.user;
-      return res.body.user;
+      return res.user;
     } catch (e) {
       console.error('Login', e);
     }
   }
 
   async logout(): Promise<any> {
-    return this.client.auth.logout()
+    return this.client.auth.signOut()
       .then(() => this.user.next(null))
       .catch((e) =>console.error('Logout', e));
   }
 
-  async signup(email: string, password: string): Promise<SupabaseAuthUser> {
+  async signup(email: string, password: string): Promise<User> {
     try {
-      const res = await this.client.auth.signup(
+      const res = await this.client.auth.signUp({
         email,
         password
-      );
+      });
-      this.user.next(res.body.user);
+      this.user.next(res.user);
-      this.supabaseUser = res.body.user;
+      this.supabaseUserModel = res.user;
-      return res.body.user;
+      return res.user;
     } catch (e) {
       console.error('Signup', e);
     }

src/app/api/supabase/user.service.ts

@@ -1,6 +1,5 @@
 import { Injectable } from '@angular/core';
 import { BehaviorSubject, Observable, of, Subject } from 'rxjs';
-import { map } from 'rxjs/internal/operators/map';
 import { SupaService } from './supa.service';
 import { User } from './user';
 
@@ -26,12 +25,10 @@ export class UserService {
       this.subscribeToUsers();
       console.log('getUsers- REFRESH')
       this.supa.client.from<User>('user').select()     
-      .then(data => {
+      .then(
-        this.updateStore(data.body);
+        data => this.updateStore(data.body),
-      })
+        error => console.error(error)
-      .catch(error => {
+      );
-        console.error(error);
-      });
     }
     return this.users.asObservable();
   }
@@ -86,15 +83,17 @@ export class UserService {
       const subject: Subject<User> = new Subject();
       this.supa.client.from<User>('user').select()
       .filter(<never>'id', 'eq', id)      
-      .then(data => {
+      .then(
+        data => {
           this.updateStore([data.body[0]]);
           subject.next(data.body[0]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
       return subject.asObservable();
     }
   }
@@ -107,15 +106,17 @@ export class UserService {
     const subject: Subject<User> = new Subject();
     this.supa.client.from<User>('user').update(user)
       .match({ id: user.id })
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           this.updateStore([data.body[0]]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+      }
+      );
     return subject.asObservable();
   }
 
@@ -128,14 +129,16 @@ export class UserService {
     const subject: Subject<User> = new Subject();
     this.supa.client.from<User>('user').delete()
       .match({ id: user.id })
-      .then(data => {
+      .then(
+        data => {
           subject.next(user);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 
@@ -146,15 +149,17 @@ export class UserService {
   addOne(user: User): Observable<User> {
     const subject: Subject<User> = new Subject();
     this.supa.client.from<User>('user').insert(user)
-      .then(data => {
+      .then(
+        data => {
           subject.next(data.body[0]);
           this.updateStore([data.body[0]]);
           subject.complete();
-      })
+        },
-      .catch(error => {
+        error => {
           subject.error(error);
           subject.complete();
-      });
+        }
+      );
     return subject.asObservable();
   }
 

src/app/app.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from "@angular/core";
 import { Router } from '@angular/router';
-import { SupabaseAuthUser } from '@supabase/supabase-js';
+import { User } from '@supabase/supabase-js';
 import { SupaService } from './api/supabase/supa.service';
 
 @Component({
@@ -9,7 +9,7 @@ import { SupaService } from './api/supabase/supa.service';
   styleUrls: ["./app.component.scss"]
 })
 export class AppComponent implements OnInit {
-  user: SupabaseAuthUser;
+  user: User;
   menuHidden: boolean = false;
 
   constructor(

src/app/authguard.service.ts

@@ -14,11 +14,11 @@ export class AuthGuard implements CanActivate {
   canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
 
     /* Try to auth with the server. If authed resolve to true, else resolve to false */
-    return this.supa.client.auth.user()
+    const user = this.supa.client.auth.user();
-      .then(() => true)
+    console.warn('authguard: user', user);
-      .catch(() => {
+    if (user) {
-        this.router.navigate(['/login']);
+      return true;
+    }
     return false;
-      });
   }
 }

src/app/channel/channel.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute, Router } from '@angular/router';
-import { SupabaseAuthUser } from '@supabase/supabase-js';
+import { User } from '@supabase/supabase-js';
 import { Subject } from 'rxjs';
 import { take, takeUntil, map } from 'rxjs/operators';
 import { Channel } from '../api/supabase/channel';
@@ -8,7 +8,7 @@ import { ChannelService } from '../api/supabase/channel.service';
 import { Message } from '../api/supabase/message';
 import { MessageService } from '../api/supabase/message.service';
 import { SupaService } from '../api/supabase/supa.service';
-import { User } from '../api/supabase/user';
+import { User as UserModel } from '../api/supabase/user';
 import { UserService } from '../api/supabase/user.service';
 
 @Component({
@@ -18,12 +18,12 @@ import { UserService } from '../api/supabase/user.service';
 })
 export class ChannelComponent implements OnInit {
   channel: Channel;
-  member: User[] = [];
+  member: UserModel[] = [];
   messages: Message[] = [];
   $destroy: Subject<boolean> = new Subject();
   dataUpdated: boolean = false;
   messageInput: string = '';
-  user: SupabaseAuthUser;
+  user: User;
 
   constructor(
     private channelService: ChannelService,
@@ -35,9 +35,7 @@ export class ChannelComponent implements OnInit {
    ) { }
 
   ngOnInit() {
-    this.supaService.client.auth.user()
+    this.user = this.supaService.client.auth.user();
-      .then(user => this.user = user)
-      .catch(error => console.error(error));
     this.route.params.subscribe(
       params => {
         this.reset();
@@ -46,7 +44,7 @@ export class ChannelComponent implements OnInit {
             data => {
               console.log('got channel', data);
               this.channel = data;
-              this.loadMessages(data.id).subscribe(messages => {
+              this.loadMessages(data.id).subscribe((messages:Message[]) => {
                 this.messages = messages;
               });
               // for (let i = 0; i < 100; i++) {

src/app/huddle/huddle.component.ts

@@ -2,7 +2,7 @@ import { Component, OnDestroy, OnInit, ViewChild } from "@angular/core";
 import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
 import { ActivatedRoute, Router } from '@angular/router';
 import { NgbModal, NgbModalRef } from "@ng-bootstrap/ng-bootstrap";
-import { SupabaseAuthUser } from '@supabase/supabase-js';
+import { User } from '@supabase/supabase-js';
 import { Subject } from 'rxjs';
 import { take, takeUntil, map } from 'rxjs/operators';
 import { StandUp } from '../api/supabase/standup';
@@ -23,7 +23,7 @@ export class HuddleComponent implements OnInit, OnDestroy {
   selectedStory: Story;
   stories: Story[] = [];
   unsubscribe: Subject<boolean> = new Subject();
-  user: SupabaseAuthUser;
+  user: User;
 
   constructor(
     private modalService: NgbModal,
@@ -37,9 +37,7 @@ export class HuddleComponent implements OnInit, OnDestroy {
   ) {}
 
   ngOnInit() {
-    this.supaService.client.auth.user()
+    this.user = this.supaService.client.auth.user();
-      .then(user => this.user = user)
-      .catch(error => console.error(error));
     this.route.params.subscribe(
       params => {
         this.reset();
@@ -48,7 +46,7 @@ export class HuddleComponent implements OnInit, OnDestroy {
             data => {
               console.log(data);
               this.standup = data;
-              this.loadStories(data.id).subscribe(stories => {
+              this.loadStories(data.id).subscribe((stories:Story[]) => {
                 this.stories = stories;
               });
             },

src/app/profile/profile.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { SupabaseAuthUser } from '@supabase/supabase-js';
 import { SupaService } from '../api/supabase/supa.service';
-import { User } from '../api/supabase/user';
+import { User as UserModel } from '../api/supabase/user';
 import { UserService } from '../api/supabase/user.service';
 
 @Component({
@@ -10,7 +9,7 @@ import { UserService } from '../api/supabase/user.service';
   styleUrls: ['./profile.component.scss']
 })
 export class ProfileComponent implements OnInit {
-  user: User;
+  user: UserModel;
 
   constructor(
     private supaService: SupaService,
@@ -18,7 +17,7 @@ export class ProfileComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.supaService.getUserProfile().subscribe((user:User) => {
+    this.supaService.getUserModelProfile().subscribe((user:UserModel) => {
       console.log('user', user);
       this.user = user;
     });