Initial list-view and a bit of restructuring

OpenBudget · Nov 22, 2023 · 9214ef5 · 9214ef5
1 parent d70b1ca
commit 9214ef5
Show file tree

Hide file tree

Showing 44 changed files with 581 additions and 106 deletions.
diff --git a/projects/budgetkey/src/app/app-routing.module.ts b/projects/budgetkey/src/app/app-routing.module.ts
@@ -8,6 +8,7 @@ const routes: Routes = [
   { path: 'i', loadChildren: () => import('./item/item.module').then(m => m.ItemModule) },
   { path: 'about', loadChildren: () => import('./about/about.module').then(m => m.AboutModule) },
   { path: 'p', loadChildren: () => import('./profile/profile.module').then(m => m.ProfileModule) },
+  { path: 'l', loadChildren: () => import('./list-components/list-components.module').then(m => m.ListComponentsModule) },
   { path: 'not-found', component: PageNotFoundComponent },
   { path: '**', pathMatch: 'full', component: PageNotFoundComponent },
 ];

diff --git a/projects/budgetkey/src/app/app.module.ts b/projects/budgetkey/src/app/app.module.ts
@@ -21,7 +21,7 @@ import { AppErrorHandler } from './app-error-handler';
   ],
   providers: [
     provideClientHydration(),
-    {provide: ErrorHandler, useClass: AppErrorHandler},
+    // {provide: ErrorHandler, useClass: AppErrorHandler},
     {provide: NGX_SEO_CONFIG_TOKEN, useValue: {
       changeTitle: (title: any) => title,
       preserve: true,

diff --git a/projects/budgetkey/src/app/common-components/auth/auth.component.ts b/projects/budgetkey/src/app/common-components/auth/auth.component.ts
@@ -1,46 +1,45 @@
 import {
+    AfterViewInit,
   Component, Input, OnInit
 } from '@angular/core';
 import { AuthService } from './auth.service';
 import { Observable } from 'rxjs';
 import { PlatformService } from '../platform.service';
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
 
-
+@UntilDestroy()
 @Component({
     selector: 'app-auth',
     templateUrl: './auth.component.html',
     styleUrls: ['./auth.component.less']
 })
-export class AuthComponent implements OnInit {
+export class AuthComponent implements AfterViewInit {
     public user: any;
-    private next: string;
 
     @Input() theme: any;
 
-    constructor(private auth: AuthService, private ps: PlatformService) {}
-
-    ngOnInit() {
-        this.ps.browser(() => {
-            this.next = document.location.href;
-            this.setUser(this.auth.check(this.next));
+    constructor(private auth: AuthService, private ps: PlatformService) {
+        this.auth.getUser().pipe(
+            untilDestroyed(this)
+        ).subscribe((user) => {
+            this.user = user;
         });
     }
 
-    setUser(o: Observable<any>) {
-        o.subscribe((user: any) => {
-            this.user = user;
+    ngAfterViewInit() {
+        this.ps.browser(() => {
+            this.auth.check().subscribe();
         });
     }
 
     login() {
         if (this.user && this.user.providers) {
             const href = this.user.providers.google || this.user.providers.github;
             if (href && href.url) {
-                if (document.location.href === this.next) {
+                if (document.location.href === this.auth.getNext()) {
                     window.location.href = href.url;
                 } else {
-                    this.next = document.location.href;
-                    this.auth.check(this.next)
+                    this.auth.check()
                         .subscribe((user) => {
                             this.user = user;
                             this.login();
@@ -51,7 +50,9 @@ export class AuthComponent implements OnInit {
     }
 
     logout() {
-        this.auth.logout(document.location.href);
+        this.auth.logout().subscribe((user) => {
+            console.log('logged out!');
+        });
     }
 
     profile() {

diff --git a/projects/budgetkey/src/app/common-components/auth/auth.service.ts b/projects/budgetkey/src/app/common-components/auth/auth.service.ts
@@ -1,7 +1,9 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { Observable, ReplaySubject, tap } from 'rxjs';
+import { Observable, ReplaySubject, tap, timer } from 'rxjs';
 import { filter, first, switchMap } from 'rxjs/operators';
+import { Location } from '@angular/common';
+import { PlatformService } from '../platform.service';
 
 @Injectable()
 export class AuthService {
@@ -10,6 +12,7 @@ export class AuthService {
     private jwtQueryParam: string;
     private user = new ReplaySubject<any>();
     private jwt = new ReplaySubject<any>();
+    private next: string | null = null;
 
     public authConfig = {
         authServerUrl: 'https://next.obudget.org',
@@ -18,7 +21,7 @@ export class AuthService {
         profilePagePath: '/p/'
     };    
 
-    constructor(private http: HttpClient) {
+    constructor(private http: HttpClient, private platform: PlatformService) {
         this.authServerUrl = this.authConfig.authServerUrl;
         this.jwtLocalStorageKey = this.authConfig.jwtLocalStorageKey;
         this.jwtQueryParam = this.authConfig.jwtQueryParam;
@@ -78,30 +81,43 @@ export class AuthService {
         return this.jwt;
     }
 
-    check(next: string): Observable<any> {
+    public getNext(): string | null {
+        return this.next;
+    }
+
+    check(next_?: string): Observable<any> {
+        const next = next_ || window.location.href;
         const jwt = this.resolveToken();
+        const headers: any = {};
         if (jwt) {
             this.setToken(jwt);
+            headers['auth-token'] = jwt;
         }
         return this.http
-            .get(this.authServerUrl + '/auth/check?jwt=' + (jwt ? jwt : '') + '&next=' + encodeURIComponent(next))
+            .get(`${this.authServerUrl}/auth/check?next=${encodeURIComponent(next)}`, { headers })
             .pipe(
-                tap((user) => this.user.next(user)),
+                tap((user) => {
+                    this.next = next;
+                    this.user.next(user);
+                }),
             );
     }
 
-    logout(next: string): Observable<any> {
+    logout(): Observable<any> {
+        console.log('LOGOUT');
         this.deleteToken();
-        return this.check(next);
+        console.log('token delted');
+        return this.check();
     }
 
     permission(service: string): Observable<any> {
         return this.jwt
             .pipe(
                 filter((token) => token !== null),
-                switchMap((token) =>
-                   this.http.get(this.authServerUrl + '/auth/authorize?service=' + service + '&jwt=' + token)
-                ),
+                switchMap((token) => {
+                    const headers = { 'auth-token': token };
+                    return this.http.get(`${this.authServerUrl}/auth/authorize?service=${service}`, { headers });
+                }),
                 first()
             );
     }

diff --git a/projects/budgetkey/src/app/common-components/common-components.module.ts b/projects/budgetkey/src/app/common-components/common-components.module.ts
@@ -41,7 +41,7 @@ import { SeoService } from './seo.service';
     BkSubscriptionManager,
     ModalComponent,
     ClickOnReturnDirective,
-    AuthComponent
+    AuthComponent,
   ],
   providers: [
     ListsService,

diff --git a/projects/budgetkey/src/app/common-components/components/header/bk-header.component.less b/projects/budgetkey/src/app/common-components/components/header/bk-header.component.less
@@ -63,6 +63,7 @@ header {
       margin-right: 40px;
       cursor: pointer;
       white-space: nowrap;
+      text-align: center;
 
       &, &:hover, &:visited {
         color: #192841;

diff --git a/...cts/budgetkey/src/app/common-components/components/searchbar/bk-search-bar.component.less b/...cts/budgetkey/src/app/common-components/components/searchbar/bk-search-bar.component.less
@@ -258,6 +258,7 @@ input {
     align-items: center;
     justify-content: flex-start;
     padding: 0 48px;
+    padding-left: 8px;
     background-color: #fff;
     font-family: "Abraham TRIAL";
     font-size: 16px;
@@ -266,9 +267,17 @@ input {
     color: #000000;
     border: 1px solid #FF5A5F;
     text-decoration: none;
-
+    white-space: nowrap;
+
     &:focus, &:hover, &:visited {
         color: #000000;
         text-decoration: underline;
     }
+
+    span {
+        display: inline-block;
+        width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
 }
diff --git a/...pp/common-components/components/subcsription-manager/bk-subscription-manager.component.ts b/...pp/common-components/components/subcsription-manager/bk-subscription-manager.component.ts
@@ -29,7 +29,7 @@ export class BkSubscriptionManager implements OnInit {
     ps.browser(() => {
       fromEvent(window, 'message').subscribe((evt) => {
         console.log('GOT Message', evt);
-        this.auth.check(window.location.href);
+        this.auth.check();
         this.loginModal = false;
       });    
     });
@@ -113,7 +113,7 @@ export class BkSubscriptionManager implements OnInit {
           if (this.isLoggedIn) {
             this.lists.get(SEARCHES_LIST)
               .subscribe((lc: ListContents) => {
-                for (const item of lc.items) {
+                for (const item of (lc.items || [])) {
                   const key = this.urlKey(item.url);
                   if (key) {
                     this.subscribedUrls[key] = item.id;

diff --git a/projects/budgetkey/src/app/search/model.ts → ...rc/app/common-components/search-models.ts b/projects/budgetkey/src/app/search/model.ts → ...rc/app/common-components/search-models.ts
@@ -1,4 +1,4 @@
-import { SearchBarType } from '../common-components/components/searchbar/bk-search-bar.component';
+import { SearchBarType } from './components/searchbar/bk-search-bar.component';
 
 export class SearchParams {
     constructor(other?: SearchParams) {