From c5f07c7d7967f37a32e7c1bbfb428e98f7b91e97 Mon Sep 17 00:00:00 2001 From: SheenaMalhotra182 Date: Fri, 23 Dec 2022 01:55:49 +0530 Subject: [PATCH] added forgot password changes --- lib/core/src/lib/core.module.ts | 3 + .../forgot-password.component.html | 46 ++++++++++ .../forgot-password.component.scss | 87 +++++++++++++++++++ .../forgot-password.component.ts | 53 +++++++++++ .../forgot-password/forgot-password.module.ts | 33 +++++++ lib/core/src/lib/i18n/en.json | 20 +++++ .../lib/login/components/login.component.html | 7 ++ .../lib/login/components/login.component.scss | 16 ++++ .../lib/login/components/login.component.ts | 16 +++- lib/core/src/lib/styles/_index.scss | 6 ++ 10 files changed, 286 insertions(+), 1 deletion(-) create mode 100644 lib/core/src/lib/forgot-password/forgot-password.component.html create mode 100644 lib/core/src/lib/forgot-password/forgot-password.component.scss create mode 100644 lib/core/src/lib/forgot-password/forgot-password.component.ts create mode 100644 lib/core/src/lib/forgot-password/forgot-password.module.ts diff --git a/lib/core/src/lib/core.module.ts b/lib/core/src/lib/core.module.ts index f1282386f2..f826dc0eb1 100644 --- a/lib/core/src/lib/core.module.ts +++ b/lib/core/src/lib/core.module.ts @@ -66,6 +66,7 @@ import { AppConfigService } from './app-config/app-config.service'; import { StorageService } from './common/services/storage.service'; import { AlfrescoApiLoaderService, createAlfrescoApiInstance } from './api-factories/alfresco-api-v2-loader.service'; import { AlfrescoApiServiceWithAngularBasedHttpClient } from './api-factories/alfresco-api-service-with-angular-based-http-client'; +import { ForgotPasswordModule } from './forgot-password/forgot-password.module'; interface Config { readonly useAngularBasedHttpClientInAlfrescoJs: boolean; @@ -96,6 +97,7 @@ const defaultConfig: Config = { useAngularBasedHttpClientInAlfrescoJs: false }; CommentsModule, CommentListModule, LoginModule, + ForgotPasswordModule, LanguageMenuModule, InfoDrawerModule, DataTableModule, @@ -135,6 +137,7 @@ const defaultConfig: Config = { useAngularBasedHttpClientInAlfrescoJs: false }; CommentsModule, CommentListModule, LoginModule, + ForgotPasswordModule, LanguageMenuModule, InfoDrawerModule, DataTableModule, diff --git a/lib/core/src/lib/forgot-password/forgot-password.component.html b/lib/core/src/lib/forgot-password/forgot-password.component.html new file mode 100644 index 0000000000..76e8f300ae --- /dev/null +++ b/lib/core/src/lib/forgot-password/forgot-password.component.html @@ -0,0 +1,46 @@ +
+
+ + + +
+
+ {{ 'RECOVER-PASSWORD.RECOVER-PASSWORD' | translate }} +
+
+
+ +
+

{{ 'RECOVER-PASSWORD.MESSAGES.FILLER' | translate }}

+
+ + + + + + + +
+
+ +
+
+

+ {{ 'RECOVER-PASSWORD.MESSAGES.RESET-PASSWORD-EMAIL-SENT' | translate }} +

+
+
+ +
+
\ No newline at end of file diff --git a/lib/core/src/lib/forgot-password/forgot-password.component.scss b/lib/core/src/lib/forgot-password/forgot-password.component.scss new file mode 100644 index 0000000000..77a583a8e1 --- /dev/null +++ b/lib/core/src/lib/forgot-password/forgot-password.component.scss @@ -0,0 +1,87 @@ +.app-dialog { + height: 100%; + display: flex; + flex-direction: column; +} + +.app-mat-dialog-title { + font-style: normal; + font-weight: 400; + font-size: 20px; + line-height: 28px; + letter-spacing: 0.15px; + color: var(--theme-forgot-password-title-color); + padding: 2px 0; +} + +hr { + margin: 12px 0; +} + +.app-dialog-filler { + display: flex; + flex-direction: row; + align-items: center; + padding: 8px 0px; + height: 16px; + font-style: normal; + font-weight: 400; + font-size: 12px; + line-height: 16px; + letter-spacing: 0.5px; + color: var(--theme-forgot-password-label-color); + margin: 0 0 8px 0; +} + +.app-forgot-password-label { + height: 32px; + padding: 6px 0; + font-style: normal; + font-weight: 700; + font-size: 14px; + line-height: 20px; + letter-spacing: 0.15px; + color: var(--theme-forgot-password-title-color); +} + +.app-forgot-password-field { + text-decoration: none; + height: 32px; + line-height: 32px; + background: var(--theme-forgot-password-input-background-color); + border-radius: 6px; + width: 100%; + border: none !important; + outline: none; + margin-top: 10px !important; +} + +.send-instructions-button { + width: 100% !important; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 4px 12px; + height: 32px; + background: var(--theme-forgot-password-button-background-color); + border-radius: 6px; + margin: 24px 0 0 0 !important; +} + +.password-reset-link-message { + height: 52px; + padding: 6px 0; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 20px; + letter-spacing: 0.25px; + color: var(--theme-forgot-password-title-color); +} + +.close-button { + float: right; + top: -24px; + right: -24px; +} \ No newline at end of file diff --git a/lib/core/src/lib/forgot-password/forgot-password.component.ts b/lib/core/src/lib/forgot-password/forgot-password.component.ts new file mode 100644 index 0000000000..4640192de6 --- /dev/null +++ b/lib/core/src/lib/forgot-password/forgot-password.component.ts @@ -0,0 +1,53 @@ +/* + * Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved. + * + * License rights for this program may be obtained from Alfresco Software, Ltd. + * pursuant to a written agreement and any use of this program without such an + * agreement is prohibited. + */ + +import { Component, OnInit } from '@angular/core'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { PeopleApi, ClientBody } from '@alfresco/js-api'; +import { AlfrescoApiService } from '@alfresco/adf-core'; + +@Component({ + selector: 'app-forgot-password', + templateUrl: './forgot-password.component.html', + styleUrls: ['./forgot-password.component.scss'] +}) +export class ForgotPasswordComponent implements OnInit { + private peopleApi: PeopleApi; + forgotPasswordForm: FormGroup; + isSaveInProgress: boolean = false; + passwordResetStatus: boolean = false; + + constructor( + private apiService: AlfrescoApiService, + private formBuilder: FormBuilder) { } + + ngOnInit(): void { + this.forgotPasswordForm = this.formBuilder.group({ + userName: ['', [Validators.required]] + }); + } + + get peopleApiInstance() { + return ( + this.peopleApi || + (this.peopleApi = new PeopleApi(this.apiService.getInstance())) + ); + } + + sendInstructions() { + this.isSaveInProgress = true; + this.passwordResetStatus = true; + + this.peopleApiInstance.requestPasswordReset( + this.forgotPasswordForm.controls.userName.value, { 'client': 'adw' } as ClientBody); + } + + isButtonDisabled(): boolean { + return this.forgotPasswordForm.invalid || this.isSaveInProgress; + } +} diff --git a/lib/core/src/lib/forgot-password/forgot-password.module.ts b/lib/core/src/lib/forgot-password/forgot-password.module.ts new file mode 100644 index 0000000000..9cce8786cd --- /dev/null +++ b/lib/core/src/lib/forgot-password/forgot-password.module.ts @@ -0,0 +1,33 @@ +/* + * Copyright © 2005 - 2021 Alfresco Software, Ltd. All rights reserved. + * + * License rights for this program may be obtained from Alfresco Software, Ltd. + * pursuant to a written agreement and any use of this program without such an + * agreement is prohibited. + */ + +import { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { RouterModule } from '@angular/router'; +import { TranslateModule } from '@ngx-translate/core'; +import { MaterialModule } from '../material.module'; +import { ForgotPasswordComponent } from './forgot-password.component'; + +@NgModule({ + imports: [ + RouterModule, + MaterialModule, + FormsModule, + ReactiveFormsModule, + CommonModule, + TranslateModule + ], + declarations: [ + ForgotPasswordComponent + ], + exports: [ + ForgotPasswordComponent + ] +}) +export class ForgotPasswordModule { } diff --git a/lib/core/src/lib/i18n/en.json b/lib/core/src/lib/i18n/en.json index 362a9b32a7..c2627df585 100644 --- a/lib/core/src/lib/i18n/en.json +++ b/lib/core/src/lib/i18n/en.json @@ -310,12 +310,32 @@ "HELP": "NEED HELP?", "REGISTER": "REGISTER" }, + "FORGOT-PASSWORD": { + "FORGOT-PASSWORD": "Forgot Password?" + }, "DIALOG": { "CANCEL": "Cancel", "CHOOSE": "Choose", "LOGIN": "Sign in" } }, + "RCOVER-PASSWORD": { + "RECOVER-PASSWORD": "Recover Password", + "MESSAGES": { + "USERNAME-REQUIRED": "Required", + "FILLER": "Don't worry, happens to the best of us.", + "ENTER-USERNAME": "Enter username for your account", + "INVALID-USERNAME": "You've entered an invalid username", + "RESET-PASSWORD-EMAIL-SENT": "An email has been sent to your registered Email ID. Please click the link when you get it." + }, + "PLACEHOLDERS": { + "USERNAME": "Username" + }, + "BUTTONS": { + "SEND-INSTRUCTIONS": "Send Instructions", + "CLOSE": "Close" + } + }, "ADF-DATATABLE": { "EMPTY": { "HEADER": "This list is empty", diff --git a/lib/core/src/lib/login/components/login.component.html b/lib/core/src/lib/login/components/login.component.html index 18144998b7..fdcfad4257 100644 --- a/lib/core/src/lib/login/components/login.component.html +++ b/lib/core/src/lib/login/components/login.component.html @@ -168,6 +168,13 @@ {{ 'LOGIN.LABEL.REMEMBER' | translate }} +
+ +