diff --git a/package-lock.json b/package-lock.json index 2df8546..2c88ea6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,12 +16,15 @@ "@angular/platform-browser": "^16.2.12", "@angular/platform-browser-dynamic": "^16.2.12", "@angular/router": "^16.2.12", + "@fortawesome/angular-fontawesome": "^0.14.0", + "@fortawesome/fontawesome-free": "^6.4.2", + "@fortawesome/free-solid-svg-icons": "^6.4.2", "eslint-config-prettier": "^8.8.0", "eslint-plugin-prettier": "^4.2.1", "flowbite": "^1.5.3", "prettier": "^2.8.7", "primeicons": "^6.0.1", - "primeng": "^15.4.1", + "primeng": "^16.4.2", "rxjs": "^6.6.0", "tslib": "^2.3.0", "zone.js": "~0.13.3" @@ -268,18 +271,6 @@ "vite": "^3.0.0 || ^4.0.0" } }, - "node_modules/@angular-devkit/build-angular/node_modules/lru-cache": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", - "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, - "dependencies": { - "yallist": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/@angular-devkit/build-angular/node_modules/rxjs": { "version": "7.8.1", "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", @@ -289,21 +280,6 @@ "tslib": "^2.1.0" } }, - "node_modules/@angular-devkit/build-angular/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/@angular-devkit/build-angular/node_modules/vite": { "version": "4.4.7", "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.7.tgz", @@ -498,33 +474,6 @@ "yarn": ">= 1.13.0" } }, - "node_modules/@angular/cli/node_modules/lru-cache": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", - "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==", - "dev": true, - "dependencies": { - "yallist": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/@angular/cli/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/@angular/common": { "version": "16.2.12", "resolved": "https://registry.npmjs.org/@angular/common/-/common-16.2.12.tgz", @@ -3030,6 +2979,66 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@fortawesome/angular-fontawesome": { + "version": "0.14.0", + "resolved": "https://registry.npmjs.org/@fortawesome/angular-fontawesome/-/angular-fontawesome-0.14.0.tgz", + "integrity": "sha512-nB7an9t66nY0m/1MIBOIvi+vKyZaTskhtGtQwGTiMyte3Bmy9080pFpXguyox68/vxGVmLxZkRxYIgjMCvm7QQ==", + "dependencies": { + "tslib": "^2.6.2" + }, + "peerDependencies": { + "@angular/core": "^17.0.0", + "@fortawesome/fontawesome-svg-core": "~1.2.27 || ~1.3.0-beta2 || ^6.1.0" + } + }, + "node_modules/@fortawesome/angular-fontawesome/node_modules/tslib": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + }, + "node_modules/@fortawesome/fontawesome-common-types": { + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.2.tgz", + "integrity": "sha512-1DgP7f+XQIJbLFCTX1V2QnxVmpLdKdzzo2k8EmvDOePfchaIGQ9eCHj2up3/jNEbZuBqel5OxiaOJf37TWauRA==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/fontawesome-free": { + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.4.2.tgz", + "integrity": "sha512-m5cPn3e2+FDCOgi1mz0RexTUvvQibBebOUlUlW0+YrMjDTPkiJ6VTKukA1GRsvRw+12KyJndNjj0O4AgTxm2Pg==", + "hasInstallScript": true, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/fontawesome-svg-core": { + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.2.tgz", + "integrity": "sha512-gjYDSKv3TrM2sLTOKBc5rH9ckje8Wrwgx1CxAPbN5N3Fm4prfi7NsJVWd1jklp7i5uSCVwhZS5qlhMXqLrpAIg==", + "hasInstallScript": true, + "peer": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.4.2" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/@fortawesome/free-solid-svg-icons": { + "version": "6.4.2", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.2.tgz", + "integrity": "sha512-sYwXurXUEQS32fZz9hVCUUv/xu49PEJEyUOsA51l6PU/qVgfbTb2glsTEaJngVVT8VqBATRIdh7XVgV1JF1LkA==", + "hasInstallScript": true, + "dependencies": { + "@fortawesome/fontawesome-common-types": "6.4.2" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/@gar/promisify": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/@gar/promisify/-/promisify-1.1.3.tgz", @@ -8436,9 +8445,9 @@ } }, "node_modules/istanbul-lib-instrument/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true, "bin": { "semver": "bin/semver.js" @@ -8829,9 +8838,9 @@ } }, "node_modules/karma-coverage/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true, "bin": { "semver": "bin/semver.js" @@ -9065,9 +9074,9 @@ } }, "node_modules/less/node_modules/semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", "dev": true, "optional": true, "bin": { @@ -9332,9 +9341,9 @@ } }, "node_modules/make-dir/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true, "bin": { "semver": "bin/semver.js" @@ -11362,18 +11371,18 @@ "integrity": "sha512-KDeO94CbWI4pKsPnYpA1FPjo79EsY9I+M8ywoPBSf9XMXoe/0crjbUK7jcQEDHuc0ZMRIZsxH3TYLv4TUtHmAA==" }, "node_modules/primeng": { - "version": "15.4.1", - "resolved": "https://registry.npmjs.org/primeng/-/primeng-15.4.1.tgz", - "integrity": "sha512-j2unOQZk6756l6SgkzcmlHF6JlawF0bIjKTgAPWwT+S5RYeWEjpCPg/ABV8TylwW7CTNQX2oCHbyqCAuhtr++w==", + "version": "16.4.2", + "resolved": "https://registry.npmjs.org/primeng/-/primeng-16.4.2.tgz", + "integrity": "sha512-631g1Tk3bumuSM+tY4DlH1/f96gXfyR6c3wNLTX28IIZDdFMLZq2roQ3wIYZaYGdJSPAHMoqJcbbg/ZijoRviQ==", "dependencies": { "tslib": "^2.3.0" }, "peerDependencies": { - "@angular/common": "^15.2.1", - "@angular/core": "^15.2.1", - "@angular/forms": "^15.2.1", - "rxjs": "^6.0.0 || ^7.5.0", - "zone.js": "^0.10.2 || ^0.11.0 || ^0.12.0 || ^0.13.0" + "@angular/common": "^16.2.0", + "@angular/core": "^16.2.0", + "@angular/forms": "^16.2.0", + "rxjs": "^6.0.0 || ^7.8.1", + "zone.js": "~0.13.0" } }, "node_modules/proc-log": { @@ -12166,9 +12175,9 @@ } }, "node_modules/semver": { - "version": "7.3.8", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz", - "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==", + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "dev": true, "dependencies": { "lru-cache": "^6.0.0" @@ -14236,9 +14245,9 @@ "dev": true }, "node_modules/word-wrap": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", - "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==", + "version": "1.2.5", + "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz", + "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==", "engines": { "node": ">=0.10.0" } diff --git a/package.json b/package.json index 331670c..a4a29bf 100644 --- a/package.json +++ b/package.json @@ -19,12 +19,15 @@ "@angular/platform-browser": "^16.2.12", "@angular/platform-browser-dynamic": "^16.2.12", "@angular/router": "^16.2.12", + "@fortawesome/angular-fontawesome": "^0.14.0", + "@fortawesome/fontawesome-free": "^6.4.2", + "@fortawesome/free-solid-svg-icons": "^6.4.2", "eslint-config-prettier": "^8.8.0", "eslint-plugin-prettier": "^4.2.1", "flowbite": "^1.5.3", "prettier": "^2.8.7", "primeicons": "^6.0.1", - "primeng": "^15.4.1", + "primeng": "^16.4.2", "rxjs": "^6.6.0", "tslib": "^2.3.0", "zone.js": "~0.13.3" @@ -49,4 +52,4 @@ "tailwindcss": "^2.2.19", "typescript": "^5.1.6" } -} \ No newline at end of file +} diff --git a/src/app/api/models/concretes/authenticate-user.ts b/src/app/api/models/concretes/authenticate-user.ts new file mode 100644 index 0000000..f029dcb --- /dev/null +++ b/src/app/api/models/concretes/authenticate-user.ts @@ -0,0 +1,6 @@ +export interface AuthenticateUser { + email: string; + password: string; + userName: string; + token: string; +} diff --git a/src/app/api/request.ts b/src/app/api/request.ts index fd8cd2b..c79071d 100644 --- a/src/app/api/request.ts +++ b/src/app/api/request.ts @@ -97,6 +97,8 @@ export class ApiRequest { responseType: 'json', }; + console.log('Request: ', requestOptions); + return httpClient .request('POST', path, requestOptions) .pipe( diff --git a/src/app/api/services/authenticate.service.spec.ts b/src/app/api/services/authenticate.service.spec.ts new file mode 100644 index 0000000..488abaf --- /dev/null +++ b/src/app/api/services/authenticate.service.spec.ts @@ -0,0 +1,19 @@ +/* tslint:disable:no-unused-variable */ + +import { TestBed, async, inject } from '@angular/core/testing'; +import { AuthenticateService } from './authenticate.service'; + +describe('Service: Authorize', () => { + beforeEach(() => { + TestBed.configureTestingModule({ + providers: [AuthenticateService], + }); + }); + + it('should ...', inject( + [AuthenticateService], + (service: AuthenticateService) => { + expect(service).toBeTruthy(); + } + )); +}); diff --git a/src/app/api/services/authenticate.service.ts b/src/app/api/services/authenticate.service.ts new file mode 100644 index 0000000..4daf5fe --- /dev/null +++ b/src/app/api/services/authenticate.service.ts @@ -0,0 +1,60 @@ +import { Injectable } from '@angular/core'; +import { AbstractService } from './abstract/abstract.service'; +import { ParametersRequest } from '../models/shared/parametersRequest'; +import { AppConfig } from 'src/app/app.config'; +import { HttpClient } from '@angular/common/http'; +import { AuthenticateUser } from '../models/concretes/authenticate-user'; +import { ApiRequest } from '../request'; + +@Injectable({ + providedIn: 'root', +}) +export class AuthenticateService extends AbstractService { + parametersRequest!: ParametersRequest; + api_authenticate: string; + + constructor(config: AppConfig, httpClient: HttpClient) { + super(config, httpClient); + this.api_authenticate = config.getConfig('authenticate_api'); + console.log('API Authenticate: ' + this.api_authenticate); + } + + login(authenticateUser: AuthenticateUser) { + this.parametersRequest = { + url: this.api_authenticate + '/login', + parameters: [], + }; + + const path = this.basePath + this.parametersRequest.url; + console.log(this.api_authenticate, authenticateUser); + return ApiRequest.post( + this.httpClient, + this.defaultHeaders, + this.configuration, + path, + authenticateUser, + undefined, + 'body', + false + ); + } + + register(authenticateUser: AuthenticateUser) { + this.parametersRequest = { + url: this.api_authenticate + '/register', + parameters: [], + }; + + const path = this.basePath + this.parametersRequest.url; + return ApiRequest.post( + this.httpClient, + this.defaultHeaders, + this.configuration, + path, + authenticateUser, + undefined, + 'body', + false + ); + } +} diff --git a/src/app/api/services/game.service.ts b/src/app/api/services/game.service.ts index 1c098cd..59e1f39 100644 --- a/src/app/api/services/game.service.ts +++ b/src/app/api/services/game.service.ts @@ -20,7 +20,7 @@ export class GameService extends AbstractService { console.log('API Game: ' + this.api_game); } - public getGames(): Observable { + getGames(): Observable { this.parametersRequest = { url: this.api_game, parameters: [], @@ -33,7 +33,7 @@ export class GameService extends AbstractService { this.configuration, path, this.parametersRequest, - 'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJJZCI6IjA4MTY4M2FlLTBlODgtNDQ3Ny1hY2VjLTZhMTBhMDY4Njc4ZSIsInN1YiI6IkNoZXdpZUBLYWFzaHl5ay5jb20iLCJlbWFpbCI6IkNoZXdpZUBLYWFzaHl5ay5jb20iLCJqdGkiOiI0MDU1MGU4MC0xMGQxLTQ2NDQtOTYxZC1jZGZiZGJjOGZmZTciLCJuYmYiOjE3MDA0MzEwNzEsImV4cCI6MTcwMDQ3NDI3MSwiaWF0IjoxNzAwNDMxMDcxfQ.lWiNSoDgZH9Ixz-uIO0xxokcU44fjbm2JbzGg5S_xYP1XqT-cwfdEUkjN45GfePS-o62YPCN98iXAzvntNRVww', + undefined, 'body', false ); diff --git a/src/app/api/services/loc.service.spec.ts b/src/app/api/services/loc.service.spec.ts new file mode 100644 index 0000000..a1ea4af --- /dev/null +++ b/src/app/api/services/loc.service.spec.ts @@ -0,0 +1,16 @@ +/* tslint:disable:no-unused-variable */ + +import { TestBed, async, inject } from '@angular/core/testing'; +import { LocService } from './loc.service'; + +describe('Service: Loc', () => { + beforeEach(() => { + TestBed.configureTestingModule({ + providers: [LocService] + }); + }); + + it('should ...', inject([LocService], (service: LocService) => { + expect(service).toBeTruthy(); + })); +}); diff --git a/src/app/api/services/loc.service.ts b/src/app/api/services/loc.service.ts new file mode 100644 index 0000000..c8f626f --- /dev/null +++ b/src/app/api/services/loc.service.ts @@ -0,0 +1,18 @@ +import { Injectable } from '@angular/core'; +import { BehaviorSubject, Observable } from 'rxjs'; + +@Injectable({ + providedIn: 'root', +}) +export class LocService { + private locSubject: BehaviorSubject = new BehaviorSubject(null); + public loc$: Observable = this.locSubject.asObservable(); + + setLoc(loc: string) { + this.locSubject.next(loc); + } + + getLoc() { + return this.loc$; + } +} diff --git a/src/app/api/services/pokemon.service.ts b/src/app/api/services/pokemon.service.ts index 680cff5..c1eb8ca 100644 --- a/src/app/api/services/pokemon.service.ts +++ b/src/app/api/services/pokemon.service.ts @@ -19,7 +19,7 @@ export class PokemonService extends AbstractService { console.log('API Pokemon: ' + this.api_pokemon); } - public getPokemons(limit: boolean, max: number): Observable { + getPokemons(limit: boolean, max: number): Observable { this.parametersRequest = { url: this.api_pokemon, parameters: [ diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3670441..7d1a21f 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,6 +5,8 @@ import { PokemonService } from './api/services/pokemon.service'; import { AppResource } from './app.resource'; import { SharedModule } from './shared/modules/shared.module'; import { AppRoutingModule } from './shared/modules/app-routing.module'; +import { HTTP_INTERCEPTORS } from '@angular/common/http'; +import { AuthInterceptor } from './shared/interceptor/AuthInterceptor'; export function initConfig(config: AppConfig) { return () => config.load(); @@ -32,7 +34,11 @@ export function initResource(resource: AppResource) { deps: [AppConfig], multi: true, }, - PokemonService, + { + provide: HTTP_INTERCEPTORS, + useClass: AuthInterceptor, + multi: true, + }, ], bootstrap: [AppComponent], }) diff --git a/src/app/shared/components/header/header.component.html b/src/app/shared/components/header/header.component.html index a4b33ff..6af9452 100644 --- a/src/app/shared/components/header/header.component.html +++ b/src/app/shared/components/header/header.component.html @@ -29,7 +29,11 @@ > - - + + + + diff --git a/src/app/shared/components/header/header.component.ts b/src/app/shared/components/header/header.component.ts index a999ee4..3babca4 100644 --- a/src/app/shared/components/header/header.component.ts +++ b/src/app/shared/components/header/header.component.ts @@ -3,17 +3,33 @@ import { BaseComponent } from '../base/base.component'; import { AppResource } from 'src/app/app.resource'; import { CommonModule } from '@angular/common'; import { LanguageComponent } from '../language/language.component'; +import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; +import { + faArrowRightFromBracket, + faArrowRightToBracket, +} from '@fortawesome/free-solid-svg-icons'; +import { ActivatedRoute } from '@angular/router'; +import { LocService } from 'src/app/api/services/loc.service'; @Component({ selector: 'app-header', templateUrl: './header.component.html', styleUrls: ['./header.component.scss'], standalone: true, - imports: [CommonModule, LanguageComponent], + imports: [CommonModule, LanguageComponent, FontAwesomeModule], }) export class HeaderComponent extends BaseComponent implements OnInit { - constructor(resources: AppResource) { + faArrowRightToBracket = faArrowRightToBracket; + faArrowRightFromBracket = faArrowRightFromBracket; + + loc!: string; + + constructor(resources: AppResource, private locService: LocService) { super(resources); + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() {} diff --git a/src/app/shared/components/language/language.component.ts b/src/app/shared/components/language/language.component.ts index 3164e45..0db6794 100644 --- a/src/app/shared/components/language/language.component.ts +++ b/src/app/shared/components/language/language.component.ts @@ -3,6 +3,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { BaseComponent } from '../base/base.component'; import { AppResource } from 'src/app/app.resource'; import { CommonModule } from '@angular/common'; +import { LocService } from 'src/app/api/services/loc.service'; @Component({ selector: 'app-language', @@ -12,12 +13,13 @@ import { CommonModule } from '@angular/common'; imports: [CommonModule], }) export class LanguageComponent extends BaseComponent implements OnInit { - location!: any; + loc!: any; url: string = this.router.url; constructor( resources: AppResource, private router: Router, + private locService: LocService, private activatedRoute: ActivatedRoute ) { super(resources); @@ -31,8 +33,9 @@ export class LanguageComponent extends BaseComponent implements OnInit { } public navigateTo(language: string): void { - this.location = this.router.url.split('/')[1]; - this.url = this.router.url.replace(this.location, language); + this.loc = this.router.url.split('/')[1]; + this.locService.setLoc(language); + this.url = this.router.url.replace(this.loc, language); this.router.navigate([this.url]); } } diff --git a/src/app/shared/guards/auth-guard.service.ts b/src/app/shared/guards/auth-guard.service.ts index 8bf3e68..73d32b1 100644 --- a/src/app/shared/guards/auth-guard.service.ts +++ b/src/app/shared/guards/auth-guard.service.ts @@ -1,11 +1,12 @@ import { Injectable } from '@angular/core'; import { Router, UrlTree } from '@angular/router'; +import { LocService } from 'src/app/api/services/loc.service'; @Injectable({ providedIn: 'root', }) -export class AuthGuardService { - constructor(private router: Router) {} +export class AuthGuardService { + constructor(private router: Router, private locService: LocService) {} canActivate(): boolean | UrlTree { let location = 'EN'; @@ -25,7 +26,7 @@ export class AuthGuardService { default: location = 'EN'; } - + this.locService.setLoc(location); this.router.navigate([location, 'pokedex']); return false; } diff --git a/src/app/shared/interceptor/AuthInterceptor.ts b/src/app/shared/interceptor/AuthInterceptor.ts new file mode 100644 index 0000000..9bb991d --- /dev/null +++ b/src/app/shared/interceptor/AuthInterceptor.ts @@ -0,0 +1,28 @@ +import { + HttpEvent, + HttpHandler, + HttpInterceptor, + HttpRequest, +} from '@angular/common/http'; +import { Injectable } from '@angular/core'; +import { Observable } from 'rxjs'; + +@Injectable({ + providedIn: 'root', +}) +export class AuthInterceptor implements HttpInterceptor { + intercept( + req: HttpRequest, + next: HttpHandler + ): Observable> { + const token = localStorage.getItem('token'); + if (token) { + const cloned = req.clone({ + headers: req.headers.set('Authorization', 'Bearer ' + token), + }); + return next.handle(cloned); + } else { + return next.handle(req); + } + } +} diff --git a/src/app/shared/modules/app-routing.module.ts b/src/app/shared/modules/app-routing.module.ts index 3959eb7..d7a8965 100644 --- a/src/app/shared/modules/app-routing.module.ts +++ b/src/app/shared/modules/app-routing.module.ts @@ -5,11 +5,11 @@ import { LayoutComponent } from '../components/layout/layout.component'; const routes: Routes = [ { - path: '', + path: ':loc', component: LayoutComponent, children: [ { - path: ':loc/home', + path: 'home', loadComponent: () => import('src/app/views/home/home.component').then( (m) => m.HomeComponent @@ -17,29 +17,44 @@ const routes: Routes = [ canActivate: [AuthGuardService], }, { - path: ':loc/pokedex', + path: 'pokedex', loadComponent: () => import('src/app/views/pokedex/pokedex.component').then( (m) => m.PokedexComponent ), }, { - path: ':loc/pokemon/:id', + path: 'pokemon/:id', loadComponent: () => import( 'src/app/views/pokemon-details/pokemon-details.component' ).then((m) => m.PokemonDetailsComponent), }, { - path: ':loc/game', + path: 'game', loadComponent: () => import('src/app/views/game/game.component').then( (m) => m.GameComponent ), }, - { path: '**', redirectTo: 'home' }, + { + path: 'login', + loadComponent: () => + import('src/app/views/login/login.component').then( + (m) => m.LoginComponent + ), + }, + { + path: 'register', + loadComponent: () => + import('src/app/views/register/register.component').then( + (m) => m.RegisterComponent + ), + }, ], }, + { path: '', redirectTo: 'EN/home', pathMatch: 'full' }, + { path: '**', redirectTo: 'home' }, ]; @NgModule({ diff --git a/src/app/views/game/game.component.ts b/src/app/views/game/game.component.ts index 982e8b7..a029189 100644 --- a/src/app/views/game/game.component.ts +++ b/src/app/views/game/game.component.ts @@ -4,6 +4,7 @@ import { ActivatedRoute } from '@angular/router'; import { Subscription } from 'rxjs'; import { Game } from 'src/app/api/models/concretes/game'; import { GameService } from 'src/app/api/services/game.service'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; @@ -22,10 +23,14 @@ export class GameComponent extends BaseComponent implements OnInit, OnDestroy { constructor( resources: AppResource, private gameService: GameService, + private locService: LocService, private route: ActivatedRoute ) { super(resources); - this.loc = this.route.snapshot.params['loc']; + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() { @@ -33,6 +38,7 @@ export class GameComponent extends BaseComponent implements OnInit, OnDestroy { .getGames() .subscribe((games: Game[]) => { this.games = games; + console.log(this.games); }); } diff --git a/src/app/views/home/home.component.ts b/src/app/views/home/home.component.ts index 89558ad..ed3e2b5 100644 --- a/src/app/views/home/home.component.ts +++ b/src/app/views/home/home.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; @@ -11,9 +12,15 @@ import { BaseComponent } from 'src/app/shared/components/base/base.component'; export class HomeComponent extends BaseComponent implements OnInit { loc!: string; - constructor(resources: AppResource, private route: ActivatedRoute) { + constructor( + resources: AppResource, + private locService: LocService, + private route: ActivatedRoute + ) { super(resources); - console.log('Localisation', this.route.snapshot.params['loc']); - this.loc = this.route.snapshot.params['loc']; + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } } diff --git a/src/app/views/login/login.component.html b/src/app/views/login/login.component.html index cbdfa13..04c538a 100644 --- a/src/app/views/login/login.component.html +++ b/src/app/views/login/login.component.html @@ -1,3 +1,23 @@ -

- login works! -

+
+
+ + +
+
+ + +
+ +
diff --git a/src/app/views/login/login.component.ts b/src/app/views/login/login.component.ts index dc30a56..c5ceed0 100644 --- a/src/app/views/login/login.component.ts +++ b/src/app/views/login/login.component.ts @@ -1,5 +1,15 @@ import { CommonModule } from '@angular/common'; import { Component, OnInit } from '@angular/core'; +import { + FormControl, + FormGroup, + FormsModule, + ReactiveFormsModule, + Validators, +} from '@angular/forms'; +import { AuthenticateUser } from 'src/app/api/models/concretes/authenticate-user'; +import { AuthenticateService } from 'src/app/api/services/authenticate.service'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; @@ -8,11 +18,39 @@ import { BaseComponent } from 'src/app/shared/components/base/base.component'; templateUrl: './login.component.html', styleUrls: ['./login.component.scss'], standalone: true, - imports: [CommonModule] + imports: [CommonModule, FormsModule, ReactiveFormsModule], }) export class LoginComponent extends BaseComponent implements OnInit { - constructor(resources: AppResource) { + form!: FormGroup; + loc!: string; + + constructor( + resources: AppResource, + private locService: LocService, + private authenticateService: AuthenticateService + ) { super(resources); + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); + } + ngOnInit() { + this.form = new FormGroup({ + email: new FormControl('', [Validators.required, Validators.email]), + password: new FormControl('', Validators.required), + }); + } + + login() { + const body = { + email: this.form.value.email, + password: this.form.value.password, + token: '', + userName: '', + } as AuthenticateUser; + this.authenticateService.login(body).subscribe((response) => { + localStorage.setItem('token', response.token); + }); } - ngOnInit() {} } diff --git a/src/app/views/pokedex/pokedex.component.html b/src/app/views/pokedex/pokedex.component.html index a95aeaa..475583e 100644 --- a/src/app/views/pokedex/pokedex.component.html +++ b/src/app/views/pokedex/pokedex.component.html @@ -1,7 +1,6 @@
@@ -13,7 +12,7 @@ class="border-b border-r border-gray-300 px-5 scroll-pt-10 pb-10 bg-white bg-opacity-25" *ngFor="let pokemon of filteredPokemons" > - + diff --git a/src/app/views/pokedex/pokedex.component.ts b/src/app/views/pokedex/pokedex.component.ts index 11c7aab..b32d450 100644 --- a/src/app/views/pokedex/pokedex.component.ts +++ b/src/app/views/pokedex/pokedex.component.ts @@ -11,6 +11,7 @@ import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; import { PokemonItemComponent } from '../pokemon-item/pokemon-item.component'; import { SearchComponent } from '../search/search.component'; +import { LocService } from 'src/app/api/services/loc.service'; @Component({ selector: 'app-pokedex', @@ -38,16 +39,22 @@ export class PokedexComponent constructor( resources: AppResource, private pokemonService: PokemonService, + private locService: LocService, private config: AppConfig, private route: ActivatedRoute ) { super(resources); - this.loc = this.route.snapshot.params['loc']; + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() { this.waiting = true; + if (!this.loc) + this.locService.setLoc(this.route.snapshot.paramMap.get('loc')!); + const pokedexOK = localStorage.getItem('pokedex'); if (!pokedexOK) { this.pokemonSubscription = this.pokemonService diff --git a/src/app/views/pokemon-details/pokemon-details.component.ts b/src/app/views/pokemon-details/pokemon-details.component.ts index 1235a63..c294080 100644 --- a/src/app/views/pokemon-details/pokemon-details.component.ts +++ b/src/app/views/pokemon-details/pokemon-details.component.ts @@ -18,13 +18,14 @@ import { GenericUtils } from 'src/app/shared/utils/genericUtils'; import { CommonModule } from '@angular/common'; import { PokemonEvolutionComponent } from '../pokemon-evolution/pokemon-evolution.component'; import { PokemonAttackComponent } from '../pokemon-attack/pokemon-attack.component'; +import { LocService } from 'src/app/api/services/loc.service'; @Component({ selector: 'app-pokemon-details', templateUrl: './pokemon-details.component.html', styleUrls: ['./pokemon-details.component.scss'], standalone: true, - imports: [CommonModule, PokemonEvolutionComponent, PokemonAttackComponent] + imports: [CommonModule, PokemonEvolutionComponent, PokemonAttackComponent], }) export class PokemonDetailsComponent extends BaseComponent @@ -39,7 +40,7 @@ export class PokemonDetailsComponent pokemonSubscription!: Subscription; key!: number; - location!: string; + loc!: string; typesVm: TypeVM[] = []; @@ -47,6 +48,7 @@ export class PokemonDetailsComponent resources: AppResource, private route: ActivatedRoute, private config: AppConfig, + private locService: LocService, private pokemonService: PokemonService ) { super(resources); @@ -71,7 +73,9 @@ export class PokemonDetailsComponent } ngOnInit() { - this.location = this.route.snapshot.params['loc']; + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); this.key = this.route.snapshot.params['id']; new Promise((resolve) => { @@ -79,7 +83,7 @@ export class PokemonDetailsComponent .getPokemon(this.key) .subscribe((pokemon: Pokemon) => { this.pokemon = pokemon; - this.getDataByLocalisation(this.pokemonVm, this.location); + this.getDataByLocalisation(this.pokemonVm, this.loc); this.pokemonService .getEvolChain(this.pokemon.FR.Evolutions) @@ -87,7 +91,7 @@ export class PokemonDetailsComponent pokemons.forEach((pokemon) => { pokemon.Types.forEach((type) => { this.typesVm.push( - this.createTypeVMByLocation(type, this.location) + this.createTypeVMByLocation(type, this.loc) ); }); @@ -102,7 +106,7 @@ export class PokemonDetailsComponent pokemons.forEach((pokemon) => { pokemon.Types.forEach((type) => { this.typesVm.push( - this.createTypeVMByLocation(type, this.location) + this.createTypeVMByLocation(type, this.loc) ); }); @@ -131,10 +135,7 @@ export class PokemonDetailsComponent pokemonVm.Id = this.pokemon.Id; pokemonVm.Number = this.pokemon.Number; - this.getDataInfo( - pokemonVm, - GenericUtils.getObject(this.pokemon, this.location) - ); + this.getDataInfo(pokemonVm, GenericUtils.getObject(this.pokemon, this.loc)); this.pokemon.Types.forEach((type) => { pokemonVm.Types.push(this.createTypeVMByLocation(type.typePok, location)); @@ -149,8 +150,8 @@ export class PokemonDetailsComponent this.pokemon.Talents.forEach((talentResponse) => { pokemonVm.Talents.push( new TalentVM( - talentResponse.talent['Name_' + this.location], - talentResponse.talent['Description_' + this.location], + talentResponse.talent['Name_' + this.loc], + talentResponse.talent['Description_' + this.loc], talentResponse.isHidden ) ); @@ -188,8 +189,8 @@ export class PokemonDetailsComponent private createTypeVMByLocation(typePok: TypePok, location: string): TypeVM { return new TypeVM( - typePok['Name_' + this.location], - this.imgRoot + typePok['UrlMiniHome_' + this.location], + typePok['Name_' + this.loc], + this.imgRoot + typePok['UrlMiniHome_' + this.loc], this.imgRoot + typePok.PathFondGo, typePok.ImgColor, typePok.InfoColor, @@ -204,11 +205,11 @@ export class PokemonDetailsComponent return new PokemonEvoVM( pokemon.Id, pokemon.Number, - GenericUtils.getObject(pokemon, this.location).Name, + GenericUtils.getObject(pokemon, this.loc).Name, typesVM, this.imgRoot + pokemon.PathImg, this.imgRoot + pokemon.PathSprite, - GenericUtils.getObject(pokemon, this.location).WhenEvolution + GenericUtils.getObject(pokemon, this.loc).WhenEvolution ); } @@ -224,8 +225,8 @@ export class PokemonDetailsComponent private createAttackVMByLocation(attack: AttaqueResponse): AttackVM { return new AttackVM( - attack.attaque['Name_' + this.location], - attack.attaque['Description_' + this.location], + attack.attaque['Name_' + this.loc], + attack.attaque['Description_' + this.loc], this.imgRoot + attack.attaque.TypeAttaque.UrlImg, this.imgRoot + attack.attaque.Types.PathIconHome ); diff --git a/src/app/views/pokemon-evolution/pokemon-evolution.component.ts b/src/app/views/pokemon-evolution/pokemon-evolution.component.ts index 0a8e09f..0b09c67 100644 --- a/src/app/views/pokemon-evolution/pokemon-evolution.component.ts +++ b/src/app/views/pokemon-evolution/pokemon-evolution.component.ts @@ -1,6 +1,7 @@ import { CommonModule } from '@angular/common'; import { Component, Input, OnInit } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; import { FormVM } from 'src/app/shared/models/pokemonVM'; @@ -18,11 +19,15 @@ export class PokemonEvolutionComponent extends BaseComponent implements OnInit { constructor( resources: AppResource, + private locService: LocService, private router: Router, private route: ActivatedRoute ) { super(resources); - this.loc = this.route.snapshot.params['loc']; + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() {} diff --git a/src/app/views/pokemon-item/pokemon-item.component.ts b/src/app/views/pokemon-item/pokemon-item.component.ts index 45d4890..475f5d1 100644 --- a/src/app/views/pokemon-item/pokemon-item.component.ts +++ b/src/app/views/pokemon-item/pokemon-item.component.ts @@ -2,6 +2,7 @@ import { CommonModule } from '@angular/common'; import { Component, Input, OnInit } from '@angular/core'; import { Router } from '@angular/router'; import { PokemonLight } from 'src/app/api/models/concretes/pokemon'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppConfig } from 'src/app/app.config'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; @@ -24,17 +25,23 @@ export class PokemonVM { }) export class PokemonItemComponent extends BaseComponent implements OnInit { @Input() pokemon!: PokemonLight; - @Input() location!: string; + loc!: string; pokemonVm: PokemonVM = new PokemonVM(); imgRoot: string = this.config.getConfig('img_root'); constructor( resources: AppResource, + private locService: LocService, + private router: Router, private config: AppConfig ) { super(resources); + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() { @@ -42,7 +49,7 @@ export class PokemonItemComponent extends BaseComponent implements OnInit { } public goToPokemonDetails(Id: number): void { - this.router.navigate(['/' + this.location + '/pokemon/' + Id]); + this.router.navigate(['/' + this.loc + '/pokemon/' + Id]); } private getDataByLocalisation(pokemonVm: PokemonVM): void { @@ -50,10 +57,11 @@ export class PokemonItemComponent extends BaseComponent implements OnInit { pokemonVm.Number = this.pokemon.Number; pokemonVm.PathImg = this.imgRoot + this.pokemon.PathImg; - pokemonVm.Name = GenericUtils.getObject(this.pokemon, this.location).Name; + console.log(this.pokemon, this.loc); + pokemonVm.Name = GenericUtils.getObject(this.pokemon, this.loc).Name; this.pokemon.Types.forEach((type) => { pokemonVm.PathTypes.push( - this.imgRoot + type.typePok['UrlMiniHome_' + this.location] + this.imgRoot + type.typePok['UrlMiniHome_' + this.loc] ); }); } diff --git a/src/app/views/register/register.component.ts b/src/app/views/register/register.component.ts index 4b528f4..03e93a2 100644 --- a/src/app/views/register/register.component.ts +++ b/src/app/views/register/register.component.ts @@ -1,5 +1,6 @@ import { CommonModule } from '@angular/common'; import { Component, OnInit } from '@angular/core'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; @@ -11,8 +12,14 @@ import { BaseComponent } from 'src/app/shared/components/base/base.component'; imports: [CommonModule], }) export class RegisterComponent extends BaseComponent implements OnInit { - constructor(resources: AppResource) { + loc!: string; + + constructor(resources: AppResource, private locService: LocService) { super(resources); + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); } ngOnInit() {} diff --git a/src/app/views/search/search.component.ts b/src/app/views/search/search.component.ts index ec011bd..33af4f6 100644 --- a/src/app/views/search/search.component.ts +++ b/src/app/views/search/search.component.ts @@ -9,6 +9,7 @@ import { import { InputTextModule } from 'primeng/inputtext'; import { debounceTime } from 'rxjs/operators'; import { PokemonLight } from 'src/app/api/models/concretes/pokemon'; +import { LocService } from 'src/app/api/services/loc.service'; import { AppResource } from 'src/app/app.resource'; import { BaseComponent } from 'src/app/shared/components/base/base.component'; import { GenericUtils } from 'src/app/shared/utils/genericUtils'; @@ -22,13 +23,18 @@ import { GenericUtils } from 'src/app/shared/utils/genericUtils'; }) export class SearchComponent extends BaseComponent implements OnInit { @Input() pokemons!: PokemonLight[]; - @Input() location!: string; + loc!: string; @Output() filteredPokemons = new EventEmitter(); formSearch!: FormGroup; - constructor(resources: AppResource) { + constructor(resources: AppResource, private locService: LocService) { super(resources); + + this.locService.loc$.subscribe((loc: string) => { + this.loc = loc; + }); + this.initForm(); } @@ -41,7 +47,7 @@ export class SearchComponent extends BaseComponent implements OnInit { for (let i = 0; i < this.pokemons.length; i++) { const pokemon = this.pokemons[i]; if ( - GenericUtils.getObject(pokemon, this.location) + GenericUtils.getObject(pokemon, this.loc) .Name.toLowerCase() .includes(query.toLowerCase()) ) diff --git a/src/assets/env/env.development.json b/src/assets/env/env.development.json index 1c4621c..3f28ca4 100644 --- a/src/assets/env/env.development.json +++ b/src/assets/env/env.development.json @@ -3,5 +3,6 @@ "api_root": "https://localhost:32778/api/v1.0", "typesPok_api": "/TypePok", "pokemons_api": "/Pokemon", - "games_api": "/Game" + "games_api": "/Game", + "authenticate_api": "/Authenticate" } \ No newline at end of file