Skip to content

Commit

Permalink
Merge pull request #7076 from ever-co/develop
Browse files Browse the repository at this point in the history
Release
  • Loading branch information
evereq authored Nov 2, 2023
2 parents 1e130c8 + 6085899 commit cd9fbe9
Show file tree
Hide file tree
Showing 13 changed files with 436 additions and 379 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,9 @@ import { ThemeSelectorComponent } from '../theme-selector.component';
import { NbThemeService } from '@nebular/theme';
import { Store } from '../../../../../../../@core/services/store.service';
import { SwitchThemeService } from './switch-theme.service';
import { ActivatedRoute } from '@angular/router';
import { filter, tap } from 'rxjs/operators';
import { untilDestroyed } from '@ngneat/until-destroy';

@Component({
selector: 'gauzy-switch-theme',
Expand All @@ -22,7 +25,8 @@ export class SwitchThemeComponent extends ThemeSelectorComponent {
constructor(
private readonly switchService: SwitchThemeService,
readonly themeService: NbThemeService,
readonly store: Store
readonly store: Store,
private readonly activatedRoute: ActivatedRoute
) {
super(themeService, store);
// Listerning event and switching to current OS color theme
Expand All @@ -41,11 +45,18 @@ export class SwitchThemeComponent extends ThemeSelectorComponent {
if (!this.switchService.isAlreadyLoaded) {
this.ngOnInit();
// if there is a preferred theme in localStorage don't switch to OS theme
if (!this.switchService.hasAlreadyPreferredTheme)
this.getPreferColorOsScheme();
if (!this.switchService.hasAlreadyPreferredTheme) this.getPreferColorOsScheme();
// lockdown
this.switchService.isAlreadyLoaded = true;
}

this.activatedRoute.queryParams
.pipe(
filter((query) => !!query.theme),
tap(({ theme }) => this.handleThemeChange(theme)),
untilDestroyed(this)
)
.subscribe();
}
/**
* this method help to switch to opposite current theme
Expand All @@ -66,4 +77,11 @@ export class SwitchThemeComponent extends ThemeSelectorComponent {
if (this.isDark.state) this.switchTheme();
}
}
// Handle theme on theme change
private handleThemeChange(theme: string): void {
const isDarkTheme = this.isDark.state;
if ((theme === 'dark' && !isDarkTheme) || (theme === 'light' && isDarkTheme)) {
this.switchTheme();
}
}
}
40 changes: 20 additions & 20 deletions apps/gauzy/src/app/auth/auth/auth.component.html
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
<nb-layout>
<nb-layout-column class="wrapper">
<nb-card class="card">
<nb-card-header class="header" [ngClass]="{register: isRegister}">
<nav class="navigation">
<a href="#" (click)="back()" class="link back-link" aria-label="Back">
<nb-icon icon="arrow-back"></nb-icon>
</a>
</nav>
<gauzy-switch-theme class="theme-switch" [hasText]="false"></gauzy-switch-theme>
</nb-card-header>
<nb-card-body class="body" [ngClass]="{register: isRegister}">
<nb-auth-block class="auth-block">
<router-outlet></router-outlet>
</nb-auth-block>
<!-- <div class="message-us-wrapper">-->
<!-- <nb-icon icon="message-square-outline"></nb-icon>-->
<!-- </div>-->
</nb-card-body>
</nb-card>
</nb-layout-column>
<nb-layout-column class="wrapper">
<nb-card class="card">
<nb-card-header class="header" [ngClass]="{register: isRegister }">
<nav [ngClass]="{ 'hide-go-back' : !(queryParams$ | async)?.returnUrl }" class="navigation">
<a (click)="goBack()" class="link back-link" aria-label="Back">
<nb-icon icon="arrow-back"></nb-icon>
</a>
</nav>
<gauzy-switch-theme class="theme-switch" [hasText]="false"></gauzy-switch-theme>
</nb-card-header>
<nb-card-body class="body" [ngClass]="{ register: isRegister }">
<nb-auth-block class="auth-block">
<router-outlet></router-outlet>
</nb-auth-block>
<!-- <div class="message-us-wrapper">
<nb-icon icon="message-square-outline"></nb-icon>
</div> -->
</nb-card-body>
</nb-card>
</nb-layout-column>
</nb-layout>
4 changes: 4 additions & 0 deletions apps/gauzy/src/app/auth/auth/auth.component.scss
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,10 @@
background: $register-background-light-color;
}

.hide-go-back {
visibility: hidden;
}

::ng-deep ngx-register {
width: 100%;
display: flex;
Expand Down
104 changes: 73 additions & 31 deletions apps/gauzy/src/app/auth/auth/auth.component.ts
Original file line number Diff line number Diff line change
@@ -1,40 +1,82 @@
import { NbAuthComponent, NbAuthService } from "@nebular/auth";
import { Component, OnInit } from "@angular/core";
import { Location } from '@angular/common';
import { NavigationStart, Router } from "@angular/router";
import { ActivatedRoute, NavigationStart, Params, Router } from "@angular/router";
import { filter } from "rxjs/operators";
import { map } from "rxjs";

import { Observable, map, tap } from "rxjs";
import { UntilDestroy, untilDestroyed } from "@ngneat/until-destroy";

@UntilDestroy({ checkProperties: true })
@Component({
selector: 'ngx-auth',
templateUrl: './auth.component.html',
styleUrls: ['./auth.component.scss'],
selector: 'ngx-auth',
templateUrl: './auth.component.html',
styleUrls: ['./auth.component.scss'],
})
export class NgxAuthComponent extends NbAuthComponent implements OnInit {
isRegister: boolean = false;

constructor (
protected auth: NbAuthService,
protected location: Location,
private router: Router,
) {
super(auth, location);
}

updateRegisterClas (url: string) {
this.isRegister = url === '/auth/register';
}

ngOnInit () {
this.updateRegisterClas(this.router.url);

this.router.events.pipe(
filter(e => e instanceof NavigationStart),
map(e => e as NavigationStart),
)
.subscribe(e => {
this.updateRegisterClas(e.url);
});
}
isRegister: boolean = false;
public queryParams$: Observable<Params>; // Observable for the query params

constructor(
protected readonly auth: NbAuthService,
protected readonly location: Location,
private readonly _router: Router,
private readonly _route: ActivatedRoute
) {
super(auth, location);
}

updateRegisterClass(url: string) {
this.isRegister = url === '/auth/register';
}

ngOnInit() {
this.updateRegisterClass(this._router.url);

// Create an observable to listen to query parameter changes in the current route.
this.queryParams$ = this._route.queryParams.pipe(
// Filter and ensure that query parameters are present.
filter((params: Params) => !!params),

// Use 'untilDestroyed' to handle component lifecycle and avoid memory leaks.
untilDestroyed(this)
);

this._router.events.pipe(
filter((event) => event instanceof NavigationStart),
map((event) => event as NavigationStart),
).subscribe((event) => {
this.updateRegisterClass(event.url);
});
}

/**
* Go back to the return URL.
*/
goBack() {
// Access query parameters from the snapshot.
const returnUrl = this._route.snapshot.queryParamMap.get('returnUrl');

if (returnUrl) {
if (this.isExternalUrl(returnUrl)) {
// If it's an external URL, navigate to it using window.location.href.
window.location.href = returnUrl;
} else {
// If it's an Angular app URL, navigate within the Angular application.
this._router.navigate([returnUrl], { replaceUrl: true });
}
} else {
// Handle the case when returnUrl is not provided.
// You can navigate to a default route or display an error message.
console.error('No return URL provided.');
}
}

/**
* Check if a URL is external (not part of the Angular app).
*/
isExternalUrl(url: string): boolean {
const location = window.location;
const currentOrigin = location.origin;
return !url.startsWith(currentOrigin);
}
}
Loading

0 comments on commit cd9fbe9

Please sign in to comment.