diff --git a/lib/core/src/lib/i18n/en.json b/lib/core/src/lib/i18n/en.json index f2ac097fad..947bee586c 100644 --- a/lib/core/src/lib/i18n/en.json +++ b/lib/core/src/lib/i18n/en.json @@ -309,7 +309,8 @@ }, "DIALOG": { "CANCEL": "Cancel", - "CHOOSE": "Choose" + "CHOOSE": "Choose", + "LOGIN": "Sign in" } }, "ADF-DATATABLE": { diff --git a/lib/core/src/lib/login/components/login-dialog.component.html b/lib/core/src/lib/login/components/login-dialog.component.html index 35463e7f9b..5f0661e526 100644 --- a/lib/core/src/lib/login/components/login-dialog.component.html +++ b/lib/core/src/lib/login/components/login-dialog.component.html @@ -1,25 +1,27 @@
{{data?.title}} + data-automation-id="login-dialog-title"> + {{data?.title}}
- + - diff --git a/lib/core/src/lib/login/components/login-dialog.component.stories.ts b/lib/core/src/lib/login/components/login-dialog.component.stories.ts new file mode 100644 index 0000000000..2c557ed4d4 --- /dev/null +++ b/lib/core/src/lib/login/components/login-dialog.component.stories.ts @@ -0,0 +1,102 @@ +/*! + * @license + * Copyright 2019 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Meta, moduleMetadata, Story } from '@storybook/angular'; +import { CoreStoryModule } from '../../testing/core.story.module'; +import { RouterTestingModule } from '@angular/router/testing'; +import { LoginModule } from './../login.module'; +import { LoginDialogStorybookComponent } from './login-dialog.stories.component'; +import { MatButtonModule } from '@angular/material/button'; +import { AuthenticationService } from './../../services/authentication.service'; +import { AuthenticationMock } from './../../mock/authentication.service.mock'; + +export default { + component: LoginDialogStorybookComponent, + title: 'Core/Login/Login Dialog', + decorators: [ + moduleMetadata({ + imports: [CoreStoryModule, LoginModule, RouterTestingModule, MatButtonModule], + providers: [ + { provide: AuthenticationService, useClass: AuthenticationMock } + ] + }) + ], + parameters: { + docs: { + description: { + component: `Allows a user to perform a login via a dialog.` + } + } + }, + argTypes: { + correct: { + control: 'none', + name: 'To test correct functionality:', + description: 'Use `fake-username` and `fake-password`.', + table: { category: 'Storybook Info' } + }, + corsError: { + control: 'none', + name: 'To test CORS error:', + description: 'Use `fake-username-CORS-error` and `fake-password`.', + table: { category: 'Storybook Info' } + }, + csrfError: { + control: 'none', + name: 'To test CSRF error:', + description: 'Use `fake-username-CSRF-error` and `fake-password`.', + table: { category: 'Storybook Info' } + }, + ecmAccessError: { + control: 'none', + name: 'To test ECM access error:', + description: 'Use `fake-username-ECM-access-error` and `fake-password`.', + table: { category: 'Storybook Info' } + }, + closed: { + action: 'closed', + description: 'Emitted when the dialog is closed.', + table: { + type: { summary: 'EventEmitter ' }, + category: 'Actions' + } + }, + error: { + action: 'error', + description: 'Emitted when the login fails.', + table: { + type: { summary: 'EventEmitter ' }, + category: 'Actions' + } + }, + executeSubmit: { + action: 'executeSubmit', + description: 'Emitted when the login form is submitted.', + table: { + type: { summary: 'EventEmitter ' }, + category: 'Actions' + } + } + } +} as Meta; + +const template: Story = (args: LoginDialogStorybookComponent) => ({ + props: args +}); + +export const loginDialog = template.bind({}); +loginDialog.parameters = { layout: 'centered' }; diff --git a/lib/core/src/lib/login/components/login-dialog.stories.component.ts b/lib/core/src/lib/login/components/login-dialog.stories.component.ts new file mode 100644 index 0000000000..3fb7413d5f --- /dev/null +++ b/lib/core/src/lib/login/components/login-dialog.stories.component.ts @@ -0,0 +1,67 @@ +/*! + * @license + * Copyright 2019 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Component, Output, EventEmitter } from '@angular/core'; +import { MatDialog } from '@angular/material/dialog'; +import { Subject } from 'rxjs'; +import { LoginDialogComponent } from './login-dialog.component'; +import { LoginDialogComponentData } from './login-dialog-component-data.interface'; + +@Component({ + selector: 'adf-login-dialog-storybook', + template: `` +}) +export class LoginDialogStorybookComponent { + + @Output() executeSubmit = new EventEmitter(); + @Output() error = new EventEmitter(); + @Output() closed = new EventEmitter(); + + constructor(private dialog: MatDialog) { } + + openLoginDialog() { + const data: LoginDialogComponentData = { + title: 'Perform a Login', + actionName: 'LOGIN', + logged: new Subject() + }; + + this.dialog.open( + LoginDialogComponent, + { + data, + panelClass: 'adf-login-dialog', + width: '630px' + } + ); + + data.logged.subscribe( + () => { + this.executeSubmit.emit('executeSubmit'); + }, + (error) => { + this.error.emit(error); + }, + () => { + this.closed.emit('closed'); + this.dialog.closeAll(); + } + ); + } +} diff --git a/lib/core/src/lib/login/components/login.component.html b/lib/core/src/lib/login/components/login.component.html index 6b2ab39b3e..18144998b7 100644 --- a/lib/core/src/lib/login/components/login.component.html +++ b/lib/core/src/lib/login/components/login.component.html @@ -3,17 +3,27 @@