old-portfolio/frontend-hideyoshi.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: updates angular to v20

Browse Source
This commit is contained in:
Vitor Hideyoshi
2025-10-31 18:31:34 -03:00
parent 401879275c
commit 3fd87ba2c8
35 changed files with 4636 additions and 9694 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/header/header-popup/callback/callback.component.ts
View File

@@ -6,6 +6,7 @@ import {AuthService} from 'src/app/shared/service/auth.service';
selector: 'app-callback',
templateUrl: './callback.component.html',
styleUrls: ['./callback.component.css'],
standalone: false
})
export class CallbackComponent implements OnInit {
constructor(

6
src/app/header/header-popup/error-box/error-box.component.html
View File

@@ -1,3 +1,5 @@
<div class="error-box" *ngIf="errorMessage">
@if (errorMessage) {
<div class="error-box">
{{ errorMessage }}
</div>
</div>
}

1
src/app/header/header-popup/error-box/error-box.component.ts
View File

@@ -4,6 +4,7 @@ import {Component, Input} from '@angular/core';
selector: 'app-error-box',
templateUrl: './error-box.component.html',
styleUrls: ['./error-box.component.css'],
standalone: false
})
export class ErrorBoxComponent {
@Input()

1
src/app/header/header-popup/help/help.component.ts
View File

@@ -4,6 +4,7 @@ import {Component, EventEmitter, Input, Output} from '@angular/core';
selector: 'app-help',
templateUrl: './help.component.html',
styleUrls: ['./help.component.css'],
standalone: false
})
export class HelpComponent {
@Input()

180
src/app/header/header-popup/login/login.component.html
View File

@@ -1,96 +1,98 @@
<app-popup
[state]="state"
(stateChange)="onStateChange($event)"
[ignoreClickOutside]="ignoreClickOutside"
>
<div
class="container m-0 overflow-hidden"
[@resizeContainerForErrorMessage]="hideErrorMessage()"
[state]="state"
(stateChange)="onStateChange($event)"
[ignoreClickOutside]="ignoreClickOutside"
>
<div
class="container m-0 overflow-hidden"
[@resizeContainerForErrorMessage]="hideErrorMessage()"
>
<app-error-box
[errorMessage]="errorMessage"
[@showErrorMessage]="showErrorMessage()"
>
</app-error-box>
<app-error-box
[errorMessage]="errorMessage"
[@showErrorMessage]="showErrorMessage()"
>
</app-error-box>
<div
class="container authentication-container"
[@hideAuthContainer]="hideErrorMessage()"
(@hideAuthContainer.done)="hideAuthContainer($event)"
>
<div class="row">
<div class="col-lg-6 authentication-body">
<form [formGroup]="loginForm" (ngSubmit)="onLogin()">
<div class="input-div">
<fa-icon class="input-div-icon" [icon]="_userIcon">
</fa-icon>
<input
type="text"
id="username"
formControlName="username"
class="form-control"
placeholder="Username"
/>
</div>
<div class="input-div">
<fa-icon
class="input-div-icon"
[icon]="_passwordIcon"
>
</fa-icon>
<input
type="password"
id="password"
formControlName="password"
class="form-control"
placeholder="Password"
/>
</div>
<button
class="btn"
[disabled]="loginForm.invalid"
type="submit"
>
Login
</button>
</form>
</div>
<div class="separator-line">
<div class="line"></div>
</div>
<div class="col-lg-6 authentication-body">
<button
mat-button
class="oauth-button d-flex justify-content-center align-items-center"
[disabled]="isCookieBlocked"
(click)="onGoogleLogin()"
>
<mat-icon
*ngIf="!isCookieBlocked"
style="width: 50px; height: 30px"
svgIcon="google-logo"
></mat-icon>
<mat-icon
*ngIf="isCookieBlocked"
style="width: 50px; height: 30px"
svgIcon="google-disabled-logo"
></mat-icon>
Login With Google
</button>
<button
mat-button
class="oauth-button d-flex justify-content-center align-items-center"
[disabled]="isCookieBlocked"
(click)="onGithubLogin()"
>
<mat-icon
style="width: 50px; height: 30px"
svgIcon="github-logo"
></mat-icon>
Login With Github
</button>
</div>
<div
class="container authentication-container"
[@hideAuthContainer]="hideErrorMessage()"
(@hideAuthContainer.done)="hideAuthContainer($event)"
>
<div class="row">
<div class="col-lg-6 authentication-body">
<form [formGroup]="loginForm" (ngSubmit)="onLogin()">
<div class="input-div">
<fa-icon class="input-div-icon" [icon]="_userIcon">
</fa-icon>
<input
type="text"
id="username"
formControlName="username"
class="form-control"
placeholder="Username"
/>
</div>
<div class="input-div">
<fa-icon
class="input-div-icon"
[icon]="_passwordIcon"
>
</fa-icon>
<input
type="password"
id="password"
formControlName="password"
class="form-control"
placeholder="Password"
/>
</div>
<button
class="btn"
[disabled]="loginForm.invalid"
type="submit"
>
Login
</button>
</form>
</div>
<div class="separator-line">
<div class="line"></div>
</div>
<div class="col-lg-6 authentication-body">
<button
mat-button
class="oauth-button d-flex justify-content-center align-items-center"
[disabled]="isCookieBlocked"
(click)="onGoogleLogin()"
>
@if (!isCookieBlocked) {
<mat-icon
style="width: 50px; height: 30px"
svgIcon="google-logo"
></mat-icon>
}
@if (isCookieBlocked) {
<mat-icon
style="width: 50px; height: 30px"
svgIcon="google-disabled-logo"
></mat-icon>
}
Login With Google
</button>
<button
mat-button
class="oauth-button d-flex justify-content-center align-items-center"
[disabled]="isCookieBlocked"
(click)="onGithubLogin()"
>
<mat-icon
style="width: 50px; height: 30px"
svgIcon="github-logo"
></mat-icon>
Login With Github
</button>
</div>
</div>
</div>
</div>
</app-popup>

69
src/app/header/header-popup/login/login.component.ts
View File

@@ -33,56 +33,39 @@ const GITHUB_LOGO_SVG = 'assets/img/providers/github.svg';
styleUrls: ['./login.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
state(
'hide',
style({
height: '100px',
width: '320px',
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
]),
),
state('hide', style({
height: '100px',
width: '320px',
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
])),
]),
trigger('showErrorMessage', [
state(
'show',
style({
opacity: 1,
height: '100px',
width: '320px',
}),
),
state(
'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
}),
),
state('show', style({
opacity: 1,
height: '100px',
width: '320px',
})),
state('hide', style({
opacity: 0,
height: '0px',
width: '0px',
})),
transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
state(
'hide',
style({
opacity: 0,
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
]),
),
state('hide', style({
opacity: 0,
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
])),
]),
],
standalone: false
})
export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
@Input()

69
src/app/header/header-popup/my-profile/my-profile.component.ts
View File

@@ -13,56 +13,39 @@ import {faFileUpload} from '@fortawesome/free-solid-svg-icons';
styleUrls: ['./my-profile.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
state(
'hide',
style({
height: '100px',
width: '320px',
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
]),
),
state('hide', style({
height: '100px',
width: '320px',
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
])),
]),
trigger('showErrorMessage', [
state(
'show',
style({
opacity: 1,
height: '100px',
width: '320px',
}),
),
state(
'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
}),
),
state('show', style({
opacity: 1,
height: '100px',
width: '320px',
})),
state('hide', style({
opacity: 0,
height: '0px',
width: '0px',
})),
transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
state(
'hide',
style({
opacity: 0,
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
]),
),
state('hide', style({
opacity: 0,
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
])),
]),
],
standalone: false
})
export class MyProfileComponent implements OnInit {
@Input()

1
src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.ts
View File

@@ -5,6 +5,7 @@ import {AuthService} from '../../../../shared/service/auth.service';
selector: 'app-profile-picture-picker',
templateUrl: './profile-picture-picker.component.html',
styleUrls: ['./profile-picture-picker.component.css'],
standalone: false
})
export class ProfilePicturePickerComponent {
@Output()

69
src/app/header/header-popup/signup/signup.component.ts
View File

@@ -22,56 +22,39 @@ const GITHUB_LOGO_SVG = 'assets/img/providers/github.svg';
styleUrls: ['./signup.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
state(
'hide',
style({
height: '100px',
width: '320px',
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
]),
),
state('hide', style({
height: '100px',
width: '320px',
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('1s ease'),
])),
]),
trigger('showErrorMessage', [
state(
'show',
style({
opacity: 1,
height: '100px',
width: '320px',
}),
),
state(
'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
}),
),
state('show', style({
opacity: 1,
height: '100px',
width: '320px',
})),
state('hide', style({
opacity: 0,
height: '0px',
width: '0px',
})),
transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
state(
'hide',
style({
opacity: 0,
}),
),
transition(
'show => hide',
group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
]),
),
state('hide', style({
opacity: 0,
})),
transition('show => hide', group([
query('@*', animateChild(), { optional: true }),
animate('250ms ease-out'),
])),
]),
],
standalone: false
})
export class SignupComponent implements OnInit {
@Input()