diff --git a/frontend/allowance-planner-v2/package-lock.json b/frontend/allowance-planner-v2/package-lock.json
index f2970d9..81b602a 100644
--- a/frontend/allowance-planner-v2/package-lock.json
+++ b/frontend/allowance-planner-v2/package-lock.json
@@ -25,6 +25,7 @@
"@capacitor/status-bar": "7.0.1",
"@ionic/angular": "^8.0.0",
"@ionic/pwa-elements": "^3.3.0",
+ "@ionic/storage-angular": "^4.0.0",
"ionicons": "^7.0.0",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
@@ -3779,6 +3780,27 @@
"npm": ">=8.0.0"
}
},
+ "node_modules/@ionic/storage": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/@ionic/storage/-/storage-4.0.0.tgz",
+ "integrity": "sha512-3N21P19Xk6cICLnSXZ3ilRqbSXAGSFeIF3HNqz+1kARcm0UFT/vwmZreaXtFyq437vvEWOfJ2enlj3JHLKS0FA==",
+ "dependencies": {
+ "localforage": "^1.9.0"
+ }
+ },
+ "node_modules/@ionic/storage-angular": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/@ionic/storage-angular/-/storage-angular-4.0.0.tgz",
+ "integrity": "sha512-FeSmCMCm1bMRfu5TFSqLtjdfEo/dLLUhLIrPmbhSYomVZdV/dNn4mBZv9SabyxSqn4bF31hw40y+4buhG+durQ==",
+ "dependencies": {
+ "@ionic/storage": "^4.0.0",
+ "tslib": "^2.3.0"
+ },
+ "peerDependencies": {
+ "@angular/core": "*",
+ "rxjs": "*"
+ }
+ },
"node_modules/@ionic/utils-array": {
"version": "2.1.6",
"resolved": "https://registry.npmjs.org/@ionic/utils-array/-/utils-array-2.1.6.tgz",
@@ -10250,6 +10272,11 @@
"node": ">=0.10.0"
}
},
+ "node_modules/immediate": {
+ "version": "3.0.6",
+ "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
+ "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ=="
+ },
"node_modules/immutable": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.2.tgz",
@@ -11791,6 +11818,14 @@
}
}
},
+ "node_modules/lie": {
+ "version": "3.1.1",
+ "resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz",
+ "integrity": "sha512-RiNhHysUjhrDQntfYSfY4MU24coXXdEOgw9WGcKHNeEwffDYbF//u87M1EWaMGzuFoSbqW0C9C6lEEhDOAswfw==",
+ "dependencies": {
+ "immediate": "~3.0.5"
+ }
+ },
"node_modules/lines-and-columns": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
@@ -11893,6 +11928,14 @@
"node": ">= 12.13.0"
}
},
+ "node_modules/localforage": {
+ "version": "1.10.0",
+ "resolved": "https://registry.npmjs.org/localforage/-/localforage-1.10.0.tgz",
+ "integrity": "sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==",
+ "dependencies": {
+ "lie": "3.1.1"
+ }
+ },
"node_modules/locate-path": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
diff --git a/frontend/allowance-planner-v2/package.json b/frontend/allowance-planner-v2/package.json
index 2de0c80..19de028 100644
--- a/frontend/allowance-planner-v2/package.json
+++ b/frontend/allowance-planner-v2/package.json
@@ -30,6 +30,7 @@
"@capacitor/status-bar": "7.0.1",
"@ionic/angular": "^8.0.0",
"@ionic/pwa-elements": "^3.3.0",
+ "@ionic/storage-angular": "^4.0.0",
"ionicons": "^7.0.0",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
@@ -64,4 +65,4 @@
"typescript": "~5.6.3"
},
"description": "An Ionic project"
-}
\ No newline at end of file
+}
diff --git a/frontend/allowance-planner-v2/src/app/app-routing.module.ts b/frontend/allowance-planner-v2/src/app/app-routing.module.ts
index 1cc1595..ffe16e8 100644
--- a/frontend/allowance-planner-v2/src/app/app-routing.module.ts
+++ b/frontend/allowance-planner-v2/src/app/app-routing.module.ts
@@ -8,7 +8,7 @@ const routes: Routes = [
loadChildren: () => import('./pages/user-login/user-login.module').then( m => m.UserLoginPageModule)
},
{
- path: 'allowance-app',
+ path: '',
loadChildren: () => import('./pages/tabs/tabs.module').then(m => m.TabsPageModule)
},
];
diff --git a/frontend/allowance-planner-v2/src/app/app.component.ts b/frontend/allowance-planner-v2/src/app/app.component.ts
index da2f9aa..ea48f32 100644
--- a/frontend/allowance-planner-v2/src/app/app.component.ts
+++ b/frontend/allowance-planner-v2/src/app/app.component.ts
@@ -1,4 +1,6 @@
import { Component } from '@angular/core';
+import { StorageService } from './services/storage.service';
+import { Router } from '@angular/router';
@Component({
selector: 'app-root',
@@ -7,5 +9,14 @@ import { Component } from '@angular/core';
standalone: false,
})
export class AppComponent {
- constructor() {}
+ constructor(private storageService: StorageService, private router: Router) {
+ this.storageService.init().then(() => {
+ this.storageService.getCurrentUserId().then((userId) => {
+ if (userId !== undefined && userId !== null) {
+ console.log('userId: ', userId);
+ this.router.navigate(['/tabs'], userId);
+ }
+ });
+ })
+ }
}
diff --git a/frontend/allowance-planner-v2/src/app/app.module.ts b/frontend/allowance-planner-v2/src/app/app.module.ts
index 4255dd8..a6c06b7 100644
--- a/frontend/allowance-planner-v2/src/app/app.module.ts
+++ b/frontend/allowance-planner-v2/src/app/app.module.ts
@@ -3,13 +3,23 @@ import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
+import { Drivers, Storage } from '@ionic/storage';
+import { IonicStorageModule } from '@ionic/storage-angular';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
- imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
+ imports: [
+ BrowserModule,
+ IonicModule.forRoot(),
+ AppRoutingModule,
+ IonicStorageModule.forRoot({
+ name: '__mydb',
+ driverOrder: [Drivers.IndexedDB, Drivers.LocalStorage]
+ })
+ ],
providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
bootstrap: [AppComponent],
})
diff --git a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.html b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.html
index c97e99a..3844691 100644
--- a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.html
+++ b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.html
@@ -1,6 +1,9 @@
Who are you?
diff --git a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.scss b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.scss
index 42765e5..9c28a41 100644
--- a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.scss
+++ b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.scss
@@ -1,5 +1,6 @@
.title,
-.selection {
+.selection,
+.profile {
display: flex;
justify-content: center;
}
@@ -8,4 +9,22 @@
margin-top: 40%;
color: var(--ion-color-primary);
font-size: 40px;
+}
+
+.selection {
+ gap: 10%;
+ margin-top: 20%;
+ color: var(--ion-color-primary);
+}
+
+.profile {
+ flex-direction: column;
+ align-items: center;
+}
+
+.picture {
+ width: 130px;
+ height: 130px;
+ border: 1px solid var(--ion-color-primary);
+ border-radius: 10px;
}
\ No newline at end of file
diff --git a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.ts b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.ts
index a1f2c2d..6fb3b56 100644
--- a/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.ts
+++ b/frontend/allowance-planner-v2/src/app/pages/user-login/user-login.page.ts
@@ -1,4 +1,6 @@
import { Component, OnInit } from '@angular/core';
+import { User } from 'src/app/models/user';
+import { StorageService } from 'src/app/services/storage.service';
import { UserService } from 'src/app/services/user.service';
@Component({
@@ -8,11 +10,17 @@ import { UserService } from 'src/app/services/user.service';
standalone: false,
})
export class UserLoginPage implements OnInit {
+ public users: Array = [];
- constructor(private userService: UserService) { }
+ constructor(private userService: UserService, private storageService: StorageService) { }
ngOnInit() {
- this.userService.getUserList().subscribe(users => console.log('Users: ', users));
+ this.userService.getUserList().subscribe(users => {
+ this.users = users
+ });
}
+ selectUser(id: number) {
+ this.storageService.set('user-id', id);
+ }
}
diff --git a/frontend/allowance-planner-v2/src/app/services/storage.service.ts b/frontend/allowance-planner-v2/src/app/services/storage.service.ts
new file mode 100644
index 0000000..3cb6436
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/services/storage.service.ts
@@ -0,0 +1,28 @@
+import { Injectable } from '@angular/core';
+
+import { Storage } from '@ionic/storage-angular';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class StorageService {
+ private _storage: Storage | null = null;
+
+ constructor(private storage: Storage) {}
+
+ async init() {
+ // If using, define drivers here: await this.storage.defineDriver(/*...*/);
+ const storage = await this.storage.create();
+ this._storage = storage;
+ }
+
+ // Create and expose methods that users of this service can
+ // call, for example:
+ public set(key: string, value: any) {
+ this._storage?.set(key, value);
+ }
+
+ public async getCurrentUserId() {
+ return await this._storage?.get('user-id');
+ }
+}
\ No newline at end of file