diff --git a/package-lock.json b/package-lock.json index 67285e5b..bd15cc23 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1497,9 +1497,9 @@ } }, "node_modules/@babel/helpers": { - "version": "7.23.7", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.7.tgz", - "integrity": "sha512-6AMnjCoC8wjqBzDHkuqpa7jAKwvMo4dC+lr/TFBz+ucfulO1XMpDnwWPGBNwClOKZ8h6xn5N81W/R5OrcKtCbQ==", + "version": "7.23.8", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.8.tgz", + "integrity": "sha512-KDqYz4PiOWvDFrdHLPhKtCThtIcKVy6avWD2oG4GEvyQ+XDZwHD4YQd+H2vNMnq2rkdxsDkU82T+Vk8U/WXHRQ==", "dev": true, "dependencies": { "@babel/template": "^7.22.15", @@ -2101,16 +2101,15 @@ } }, "node_modules/@babel/plugin-transform-classes": { - "version": "7.23.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.5.tgz", - "integrity": "sha512-jvOTR4nicqYC9yzOHIhXG5emiFEOpappSJAl73SDSEDcybD+Puuze8Tnpb9p9qEyYup24tq891gkaygIFvWDqg==", + "version": "7.23.8", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.8.tgz", + "integrity": "sha512-yAYslGsY1bX6Knmg46RjiCiNSwJKv2IUC8qOdYKqMMr0491SXFhcHqOdRDeCRohOOIzwN/90C6mQ9qAKgrP7dg==", "dev": true, "dependencies": { "@babel/helper-annotate-as-pure": "^7.22.5", - "@babel/helper-compilation-targets": "^7.22.15", + "@babel/helper-compilation-targets": "^7.23.6", "@babel/helper-environment-visitor": "^7.22.20", "@babel/helper-function-name": "^7.23.0", - "@babel/helper-optimise-call-expression": "^7.22.5", "@babel/helper-plugin-utils": "^7.22.5", "@babel/helper-replace-supers": "^7.22.20", "@babel/helper-split-export-declaration": "^7.22.6", @@ -5680,9 +5679,9 @@ "dev": true }, "node_modules/bonjour-service": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.0.tgz", - "integrity": "sha512-xdzMA6JGckxyJzZByjEWRcfKmDxXaGXZWVftah3FkCqdlePNS9DjHSUN5zkP4oEfz/t0EXXlro88EIhzwMB4zA==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.1.tgz", + "integrity": "sha512-oSzCS2zV14bh2kji6vNe7vrpJYCHGvcZnlffFQ1MEoX/WOeQ/teD8SYWKR942OI3INjq8OMNJlbPK5LLLUxFDw==", "dev": true, "dependencies": { "fast-deep-equal": "^3.1.3", @@ -6577,9 +6576,9 @@ } }, "node_modules/date-fns/node_modules/@babel/runtime": { - "version": "7.23.7", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.7.tgz", - "integrity": "sha512-w06OXVOFso7LcbzMiDGt+3X7Rh7Ho8MmgPoWU3rarH+8upf+wSU/grlGbWzQyr3DkdN6ZeuMFjpdwW0Q+HxobA==", + "version": "7.23.8", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.8.tgz", + "integrity": "sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw==", "dependencies": { "regenerator-runtime": "^0.14.0" }, @@ -6849,9 +6848,9 @@ "dev": true }, "node_modules/electron-to-chromium": { - "version": "1.4.623", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.623.tgz", - "integrity": "sha512-lKoz10iCYlP1WtRYdh5MvocQPWVRoI7ysp6qf18bmeBgR8abE6+I2CsfyNKztRDZvhdWc+krKT6wS7Neg8sw3A==", + "version": "1.4.625", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.625.tgz", + "integrity": "sha512-DENMhh3MFgaPDoXWrVIqSPInQoLImywfCwrSmVl3cf9QHzoZSiutHwGaB/Ql3VkqcQV30rzgdM+BjKqBAJxo5Q==", "dev": true }, "node_modules/emoji-regex": { @@ -12145,9 +12144,9 @@ } }, "node_modules/serialize-javascript": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz", - "integrity": "sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w==", + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz", + "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==", "dev": true, "dependencies": { "randombytes": "^2.1.0" diff --git a/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.ttf b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.ttf new file mode 100644 index 00000000..e707d526 Binary files /dev/null and b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.ttf differ diff --git a/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff new file mode 100644 index 00000000..341158a5 Binary files /dev/null and b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff differ diff --git a/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff2 b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff2 new file mode 100644 index 00000000..76611d45 Binary files /dev/null and b/projects/arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff2 differ diff --git a/projects/arc-lib/src/lib/components/auth/auth-routing.module.ts b/projects/arc-lib/src/lib/components/auth/auth-routing.module.ts index a0c76547..8acf0780 100644 --- a/projects/arc-lib/src/lib/components/auth/auth-routing.module.ts +++ b/projects/arc-lib/src/lib/components/auth/auth-routing.module.ts @@ -1,11 +1,11 @@ -import { NgModule } from '@angular/core'; -import { RouterModule, Routes } from '@angular/router'; +import {NgModule} from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; -import { AuthComponent } from './auth.component'; -import { LoginComponent } from './login/login.component'; -import { SignupComponent } from './signup/signup.component'; -import { ForgotPasswordComponent } from './forgot-password/forgot-password.component'; -import { ResetPasswordComponent } from './reset-password/reset-password.component'; +import {AuthComponent} from './auth.component'; +import {LoginComponent} from './login/login.component'; +import {SignupComponent} from './signup/signup.component'; +import {ForgotPasswordComponent} from './forgot-password/forgot-password.component'; +import {ResetPasswordComponent} from './reset-password/reset-password.component'; const routes: Routes = [ { @@ -27,7 +27,7 @@ const routes: Routes = [ { path: 'resetpassword', component: ResetPasswordComponent, - } + }, ], }, ]; diff --git a/projects/arc-lib/src/lib/components/auth/auth.component.html b/projects/arc-lib/src/lib/components/auth/auth.component.html index debfa9ab..a51d3bee 100644 --- a/projects/arc-lib/src/lib/components/auth/auth.component.html +++ b/projects/arc-lib/src/lib/components/auth/auth.component.html @@ -14,4 +14,4 @@ - \ No newline at end of file + diff --git a/projects/arc-lib/src/lib/components/auth/auth.component.scss b/projects/arc-lib/src/lib/components/auth/auth.component.scss index c90fdee5..5d33d5a3 100644 --- a/projects/arc-lib/src/lib/components/auth/auth.component.scss +++ b/projects/arc-lib/src/lib/components/auth/auth.component.scss @@ -28,5 +28,5 @@ .card-row { flex-grow: 0 !important; flex-shrink: 0 !important; - flex-basis: 35% !important; -} \ No newline at end of file + flex-basis: 35% !important; +} diff --git a/projects/arc-lib/src/lib/components/auth/auth.module.ts b/projects/arc-lib/src/lib/components/auth/auth.module.ts index cd9f5acd..838f2237 100644 --- a/projects/arc-lib/src/lib/components/auth/auth.module.ts +++ b/projects/arc-lib/src/lib/components/auth/auth.module.ts @@ -12,12 +12,18 @@ import {AuthRoutingModule} from './auth-routing.module'; import {AuthComponent} from './auth.component'; import {LoginComponent} from './login/login.component'; -import { SignupComponent } from './signup/signup.component'; -import { ForgotPasswordComponent } from './forgot-password/forgot-password.component'; -import { ResetPasswordComponent } from './reset-password/reset-password.component'; +import {SignupComponent} from './signup/signup.component'; +import {ForgotPasswordComponent} from './forgot-password/forgot-password.component'; +import {ResetPasswordComponent} from './reset-password/reset-password.component'; @NgModule({ - declarations: [LoginComponent, AuthComponent, SignupComponent, ForgotPasswordComponent, ResetPasswordComponent], + declarations: [ + LoginComponent, + AuthComponent, + SignupComponent, + ForgotPasswordComponent, + ResetPasswordComponent, + ], schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [ CommonModule, @@ -29,7 +35,7 @@ import { ResetPasswordComponent } from './reset-password/reset-password.componen HttpClientModule, NbLayoutModule, TranslateModule, - NbThemeModule.forRoot(), + NbThemeModule.forRoot({name: 'boiler'}), NbAuthModule.forRoot({ strategies: [ NbPasswordAuthStrategy.setup({ diff --git a/projects/arc-lib/src/lib/components/auth/login/login.component.html b/projects/arc-lib/src/lib/components/auth/login/login.component.html index a6eecae6..75f359d9 100644 --- a/projects/arc-lib/src/lib/components/auth/login/login.component.html +++ b/projects/arc-lib/src/lib/components/auth/login/login.component.html @@ -2,102 +2,148 @@
- -
- + -
- -
-
- Email -
-
- -
-
- Email is required. -
-
- Invalid email format. -
-
- - -
-
- Password -
-
- - - -
- Forgot Password -
-
-
- Password is required. -
-
- Password must be at least 6 characters. -
-
- - -
- -
-
+
+ +
+
+ Email +
+
+ +
+
+ Email is required. +
+
+ Invalid email format. +
+
-
- You can also Sign In via -
+ +
+
+ Password +
+
+ + + +
+ Forgot Password +
+
+
+ Password is required. +
+
+ Password must be at least 6 characters. +
+
- - -
- - I don't have an account in Arc by SourceFuse - Sign Up - -
-
+ +
+ +
+ + +
+ You can also Sign In via +
+ + + +
+ + I don't have an account in Arc by SourceFuse + Sign Up + +
+
diff --git a/projects/arc-lib/src/lib/components/auth/login/login.component.ts b/projects/arc-lib/src/lib/components/auth/login/login.component.ts index 302c523c..8e15af45 100644 --- a/projects/arc-lib/src/lib/components/auth/login/login.component.ts +++ b/projects/arc-lib/src/lib/components/auth/login/login.component.ts @@ -3,8 +3,8 @@ import {Component, Inject} from '@angular/core'; import {ActivatedRoute, Router} from '@angular/router'; import {AuthService} from '@project-lib/core/auth'; import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base'; -import { FormBuilder, FormGroup, Validators } from '@angular/forms'; -import { concatMap, throwError } from 'rxjs'; +import {FormBuilder, FormGroup, Validators} from '@angular/forms'; +import {concatMap, throwError} from 'rxjs'; @Component({ selector: 'app-login', @@ -20,45 +20,50 @@ export class LoginComponent extends RouteComponentBaseDirective { override readonly location: Location, private readonly authService: AuthService, private readonly router: Router, - private fb: FormBuilder - + private fb: FormBuilder, ) { super(route, location); - this.imageUrl = '../../../assets/images/auth/ARC_logo.png'; + this.imageUrl = '../../../assets/images/auth/ARC_logo.png'; this.altText = 'logo'; this.loginForm = this.fb.group({ - email: ['', [Validators.required, Validators.email]], - password:['',[ Validators.required, - Validators.minLength(6), - Validators.pattern( - '(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&#])[A-Za-zd$@$!%*?&].{7,}', - ), - ]] - }) -} + email: ['', [Validators.required, Validators.email]], + password: [ + '', + [ + Validators.required, + Validators.minLength(6), + Validators.pattern( + '(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&#])[A-Za-zd$@$!%*?&].{7,}', + ), + ], + ], + }); + } - showPassword = false; onSubmit() { if (this.loginForm.valid) { const credentials = this.loginForm.value; - this.authService.login(credentials.email,credentials.password).pipe( - concatMap(response => { - if (response.body && response.body.code) { - this.authService.authorize(response.body.code).subscribe(); - } - return throwError('Unauthorized'); - }), - ).subscribe( - () => { - // Handle successful login response - }, - (error) => { - // Handle login error - console.error('Login error:', error); //NOSONAR - } - ); + this.authService + .login(credentials.email, credentials.password) + .pipe( + concatMap(response => { + if (response.body && response.body.code) { + this.authService.authorize(response.body.code).subscribe(); + } + return throwError('Unauthorized'); + }), + ) + .subscribe( + () => { + // Handle successful login response + }, + error => { + // Handle login error + console.error('Login error:', error); //NOSONAR + }, + ); } } @@ -69,7 +74,6 @@ export class LoginComponent extends RouteComponentBaseDirective { } return 'password'; } - toggleShowPassword() { this.showPassword = !this.showPassword; diff --git a/projects/arc-lib/src/lib/components/gantt/components/gantt-header/gantt-header.component.scss b/projects/arc-lib/src/lib/components/gantt/components/gantt-header/gantt-header.component.scss index a479c055..3e9aeb60 100644 --- a/projects/arc-lib/src/lib/components/gantt/components/gantt-header/gantt-header.component.scss +++ b/projects/arc-lib/src/lib/components/gantt/components/gantt-header/gantt-header.component.scss @@ -1,6 +1,6 @@ // @use "../../../../theme/styles/variables" as *; -@use "projects/arc-lib/src/lib/theme/styles/_variables.scss" as *; -@use "sass:map"; +@use 'projects/arc-lib/src/lib/theme/styles/_variables.scss' as *; +@use 'sass:map'; .header-container { line-height: 1; width: 100%; @@ -15,7 +15,7 @@ nb-form-field { flex-grow: 1; } - nb-icon[icon="menu-arrow-outline"] { + nb-icon[icon='menu-arrow-outline'] { height: 100%; margin: 0 1rem; cursor: pointer; diff --git a/projects/arc-lib/src/lib/components/index.ts b/projects/arc-lib/src/lib/components/index.ts index 6f21206f..e7c52ee0 100644 --- a/projects/arc-lib/src/lib/components/index.ts +++ b/projects/arc-lib/src/lib/components/index.ts @@ -4,3 +4,4 @@ export * from './gantt/gantt.module'; export * from './selector/select.module'; export * from './resize/resize.module'; export * from './list/list.component'; +export * from './role/role.module'; diff --git a/projects/arc-lib/src/lib/components/role/adapters/index.ts b/projects/arc-lib/src/lib/components/role/adapters/index.ts new file mode 100644 index 00000000..e69de29b diff --git a/projects/arc-lib/src/lib/components/role/adapters/role-adapter.service.ts b/projects/arc-lib/src/lib/components/role/adapters/role-adapter.service.ts new file mode 100644 index 00000000..6c07c580 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/adapters/role-adapter.service.ts @@ -0,0 +1,27 @@ +/* eslint-disable */ +import {Injectable} from '@angular/core'; +import {Role} from '../models'; +import {IAdapter} from '@project-lib/core/api'; + +@Injectable() +export class RoleAdapterService implements IAdapter { + adaptToModel(resp: any): Role { + const role = new Role(); + role.id = resp.id; + role.name = resp.name; + role.tenantId = resp.tenantId; + role.actions = resp.actions.map( + (ele: {id: string; action_key: string}) => ele.action_key, + ); + role.createdOn = resp.createdOn; + return role; + } + adaptFromModel(data: Role): any { + return { + id: data.id, + name: data.name, + actions: data.actions, + tenantId: data.tenantId, + }; + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/create-role.command.ts b/projects/arc-lib/src/lib/components/role/commands/create-role.command.ts new file mode 100644 index 00000000..b6c552cc --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/create-role.command.ts @@ -0,0 +1,17 @@ +import {environment} from '@main-project/boiler/env/environment'; +import {ApiService, IAdapter, PostAPICommand} from '@project-lib/core/api'; + +export class CreateRoleCommand extends PostAPICommand { + constructor( + apiService: ApiService, + adapter: IAdapter, + tenantId?: string, + endpoint?: string, + ) { + super( + apiService, + adapter, + endpoint ?? `${environment.authServiceUrl}/tenant/${tenantId}/roles`, + ); + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/edit-role.command.ts b/projects/arc-lib/src/lib/components/role/commands/edit-role.command.ts new file mode 100644 index 00000000..843c05a5 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/edit-role.command.ts @@ -0,0 +1,19 @@ +import {environment} from '@main-project/boiler/env/environment'; +import {PatchAPICommand, ApiService, IAdapter} from '@project-lib/core/api'; + +export class EditRoleCommand extends PatchAPICommand { + constructor( + apiService: ApiService, + adapter: IAdapter, + tenantId: string, + id: string, + endpoint?: string, + ) { + super( + apiService, + adapter, + endpoint ?? + `${environment.authServiceUrl}/tenant/${tenantId}/roles/${id}`, + ); + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/get-feature-actions.command.ts b/projects/arc-lib/src/lib/components/role/commands/get-feature-actions.command.ts new file mode 100644 index 00000000..3bb42312 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/get-feature-actions.command.ts @@ -0,0 +1,18 @@ +import {environment} from '@main-project/boiler/env/environment'; +import {GetListAPICommand, ApiService, IAdapter} from '@project-lib/core/api'; + +export class GetFeatureActionsCommand extends GetListAPICommand { + constructor( + apiService: ApiService, + adapter: IAdapter, + tenantId?: string, + endpoint?: string, + ) { + super( + apiService, + adapter, + endpoint ?? + `${environment.authServiceUrl}/tenant/${tenantId}/feature-actions`, + ); + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/get-role-by-id.command.ts b/projects/arc-lib/src/lib/components/role/commands/get-role-by-id.command.ts new file mode 100644 index 00000000..22916700 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/get-role-by-id.command.ts @@ -0,0 +1,19 @@ +import {environment} from '@main-project/boiler/env/environment'; +import {GetAPICommand, ApiService, IAdapter} from '@project-lib/core/api'; + +export class GetRoleByIdCommand extends GetAPICommand { + constructor( + apiService: ApiService, + adapter: IAdapter, + tenantId?: string, + id?: string, + endpoint?: string, + ) { + super( + apiService, + adapter, + endpoint ?? + `${environment.authServiceUrl}/tenant/${tenantId}/roles/${id}`, + ); + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/get-roles.command.ts b/projects/arc-lib/src/lib/components/role/commands/get-roles.command.ts new file mode 100644 index 00000000..8b1efaa9 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/get-roles.command.ts @@ -0,0 +1,17 @@ +import {environment} from '@main-project/boiler/env/environment'; +import {GetListAPICommand, ApiService, IAdapter} from '@project-lib/core/api'; + +export class GetRolesCommand extends GetListAPICommand { + constructor( + apiService: ApiService, + adapter: IAdapter, + tenantId?: string, + endpoint?: string, + ) { + super( + apiService, + adapter, + endpoint ?? `${environment.authServiceUrl}/tenant/${tenantId}/roles`, + ); + } +} diff --git a/projects/arc-lib/src/lib/components/role/commands/index.ts b/projects/arc-lib/src/lib/components/role/commands/index.ts new file mode 100644 index 00000000..a7cd901d --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/commands/index.ts @@ -0,0 +1,4 @@ +export * from './get-feature-actions.command'; +export * from './create-role.command'; +export * from './get-role-by-id.command'; +export * from './edit-role.command'; diff --git a/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.html b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.html new file mode 100644 index 00000000..9fd3bb63 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.html @@ -0,0 +1,134 @@ +
+
+ Management + + + Role Management + + + {{ + roleId ? 'Update Role' : 'New Role' + }} +
+
+
+

+ {{ roleId ? 'Update Role' : 'New Role' }} +

+
+
+
+
+
+ + Role name + + Name is required + + + Role Description + + +
+
+
+
Role Permissions
+
+ + + + +
+
+ + {{ action.name }} + +
+
+ See all Permissions +
+
+ + +
+
+ + {{ item.action }} + +
+
+ + +
+
+
+ + +
+
+
diff --git a/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.scss b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.scss new file mode 100644 index 00000000..4ce76bb2 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.scss @@ -0,0 +1,119 @@ +$primary-color: #0469e3; +$secondary-font: Gotham; +.inner-content-wrapper { + max-height: calc(100vh - 185px); + overflow: auto; + .add-role { + margin-top: 12px !important; + } + .role-permission-wrapper { + .title { + font-weight: bold; + } + .role-permission-panels { + .permission-accordion { + ::ng-deep .mat-expansion-panel { + border-radius: 8px; + margin: 12px 0 0 !important; + &:first-child { + margin-top: 0 !important; + } + .mat-expansion-panel-header { + height: 48px; + padding: 0 8px; + pointer-events: none; + .mat-expansion-panel-header-title { + margin-right: 5px; + .role-hdr { + display: flex; + width: 100%; + align-items: center; + .role-hdr-content { + justify-content: flex-start; + pointer-events: fill; + width: calc(100% - 135px); + @media (max-width: 768px) { + width: calc(100% - 85px); + } + .mat-icon { + transition: all ease 0.2s; + } + } + .panel-indicator { + justify-content: flex-end; + pointer-events: fill; + text-align: center; + .mat-icon { + transition: all ease 0.2s; + } + } + } + } + .mat-expansion-indicator { + display: none; + } + } + &.mat-expanded { + .panel-indicator { + .mat-icon { + transform: scale(-1); + -webkit-transform: scale(-1); + -moz-transform: scale(-1); + } + } + } + } + } + } + } +} +.form-action-button { + position: fixed; + z-index: 1; + right: 0; + width: calc(100% - 265px); + padding: 16px; + bottom: 0; + display: flex; + justify-content: flex-end; + @media (max-width: 768px) { + width: 100%; + } + button { + margin: 3px; + } +} +mat-form-field { + width: 50%; + padding: 5px; + @media (max-width: 768px) { + width: 100%; + } +} +.breadcrumb-wrapper { + margin-bottom: 6px; + .breadcrumb-text { + color: #525252; + font-family: $secondary-font; + font-size: 13px; + font-style: normal; + font-weight: 400; + line-height: normal; + } +} +.ellipsis { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + vertical-align: middle; +} +.stroke { + font-size: smaller; +} +.inner-content { + .role-permission-wrapper { + .title { + margin-bottom: 10px; + } + } +} diff --git a/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.spec.ts b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.spec.ts new file mode 100644 index 00000000..58ce765f --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { AddRoleComponent } from './add-role.component'; + +describe('AddRoleComponent', () => { + let component: AddRoleComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [AddRoleComponent] + }); + fixture = TestBed.createComponent(AddRoleComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.ts b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.ts new file mode 100644 index 00000000..414e2f6f --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/add-role/add-role.component.ts @@ -0,0 +1,127 @@ +import {Component} from '@angular/core'; +import {MatDialog} from '@angular/material/dialog'; +import {ConfirmationDialogComponent} from '../confirmation-dialog/confirmation-dialog.component'; +import {Location} from '@angular/common'; +import {ActivatedRoute, Router} from '@angular/router'; +import {MatCheckboxChange} from '@angular/material/checkbox'; +import {indexOf} from 'lodash'; +import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base'; +import {RoleFacadeService} from '../../role-facade.service'; +import {UserSessionStoreService} from '@project-lib/core/store'; +import {FeatureAction, Role} from '../../models'; +import {takeUntil} from 'rxjs'; + +@Component({ + selector: 'careconnect-add-role', + templateUrl: './add-role.component.html', + styleUrls: ['./add-role.component.scss'], +}) +export class AddRoleComponent extends RouteComponentBaseDirective { + role = new Role(); + featureActions: FeatureAction[] = []; + roleId = this.getRouteParam('id') ?? ''; + actions: {action: string; id: string; key: string; enabled: boolean}[] = []; + constructor( + public dialog: MatDialog, + protected override readonly location: Location, + protected override readonly route: ActivatedRoute, + private readonly store: UserSessionStoreService, + private readonly roleFacade: RoleFacadeService, + private readonly router: Router, + ) { + super(route, location); + } + + ngOnInit() { + this.getFeatureActions(); + if (this.roleId) { + this.getRoleById(); + } + } + + getRoleById() { + this.roleFacade + .getRoleById(this.roleId, this.store.getUser().id) + .pipe(takeUntil(this._destroy$)) + .subscribe(res => { + this.role = res; + this.mapActions(); + }); + } + + mapActions() { + this.featureActions.forEach(ele => { + let count = 0; + ele.actions.forEach(action => { + if (this.role.actions.includes(action.key)) { + action.enabled = true; + count++; + } else { + action.enabled = false; + } + }); + if (count && count === ele.actions.length) { + ele.enabled = true; + } + }); + } + + getFeatureActions() { + this.roleFacade + .getFeatureActions(this.store.getUser().tenant.id) + .pipe(takeUntil(this._destroy$)) + .subscribe(res => { + this.featureActions = res; + }); + } + + openDialog() { + this.dialog.open(ConfirmationDialogComponent, { + maxWidth: '543px', + width: '100%', + }); + } + + actionChanged(key: string, event: MatCheckboxChange, action: FeatureAction) { + if (event.checked) { + this.role.actions.push(key); + } else { + this.role.actions.splice(indexOf(this.role.actions, key), 1); + action.enabled = false; + } + this.role.actions = [...new Set(this.role.actions)]; + } + + selectFeature(feature: FeatureAction, event: MatCheckboxChange) { + if (event.checked) { + this.role.actions = this.role.actions.concat( + ...feature.actions.map(ele => ele.key), + ); + } else { + feature.actions.forEach(ele => { + this.role.actions.splice(indexOf(this.role.actions, ele.key), 1); + }); + } + this.role.actions = [...new Set(this.role.actions)]; + this.mapActions(); + } + + createRole() { + this.role.tenantId = this.store.getUser()?.tenant?.id; + if (this.roleId) { + this.roleFacade + .editRole(this.role, this.store.getUser()?.tenant?.id) + .pipe(takeUntil(this._destroy$)) + .subscribe(() => + this.router.navigate(['../../'], {relativeTo: this.route}), + ); + } else { + this.roleFacade + .createRole(this.role, this.store.getUser()?.tenant?.id) + .pipe(takeUntil(this._destroy$)) + .subscribe(() => + this.router.navigate(['../'], {relativeTo: this.route}), + ); + } + } +} diff --git a/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.html b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.html new file mode 100644 index 00000000..faae2977 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.html @@ -0,0 +1,30 @@ + diff --git a/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.scss b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.scss new file mode 100644 index 00000000..a2ae73a4 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.scss @@ -0,0 +1,39 @@ +.confirmation-dialog { + .title { + color: #000; + height: auto; + line-height: normal; + font-size: 36px; + padding: 36px 36px 0; + &::before { + display: none; + } + @media (max-width: 1400px) { + font-size: 28px; + padding: 24px 24px 0; + } + } + .dialog-content { + padding: 36px; + color: #000; + @media (max-width: 1400px) { + padding: 24px; + } + p { + font-size: 16px; + margin: 0; + @media (max-width: 1400px) { + font-size: 14px; + } + } + } + .dialog-action { + padding: 0 36px 36px; + @media (max-width: 1400px) { + padding: 0 24px 24px; + } + .dialog-action-items { + width: 100%; + } + } +} diff --git a/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.spec.ts b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.spec.ts new file mode 100644 index 00000000..4afa9094 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ConfirmationDialogComponent } from './confirmation-dialog.component'; + +describe('ConfirmationDialogComponent', () => { + let component: ConfirmationDialogComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [ConfirmationDialogComponent] + }); + fixture = TestBed.createComponent(ConfirmationDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.ts b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.ts new file mode 100644 index 00000000..707b0d69 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/confirmation-dialog/confirmation-dialog.component.ts @@ -0,0 +1,15 @@ +import {Component} from '@angular/core'; +import {MatDialogRef} from '@angular/material/dialog'; + +@Component({ + selector: 'careconnect-confirmation-dialog', + templateUrl: './confirmation-dialog.component.html', + styleUrls: ['./confirmation-dialog.component.scss'], +}) +export class ConfirmationDialogComponent { + constructor(public dialogRef: MatDialogRef) {} + + closeModal() { + this.dialogRef.close(); + } +} diff --git a/projects/arc-lib/src/lib/components/role/components/role/role.component.html b/projects/arc-lib/src/lib/components/role/components/role/role.component.html new file mode 100644 index 00000000..421ead28 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/role/role.component.html @@ -0,0 +1,91 @@ +
+
+ Management + + + Role Management +
+
+
+

Role Management

+
+
+ + + + +
+ +
+
+
+
+ + + + + + + + + + + + + + +
{{ column }}{{ element[column] }}Actions + + + + +
+
+
diff --git a/projects/arc-lib/src/lib/components/role/components/role/role.component.scss b/projects/arc-lib/src/lib/components/role/components/role/role.component.scss new file mode 100644 index 00000000..d5b7fc1a --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/role/role.component.scss @@ -0,0 +1,40 @@ +$primary-color: #0469e3; +$secondary-font: Gotham; + +.page-title { + color: #000; + font-feature-settings: 'clig' off, 'liga' off; + font-family: Gotham; + font-size: 32px; + font-style: normal; + font-weight: 700; + line-height: normal; +} + +table { + width: 100%; +} + +th { + text-align: left; +} + +.breadcrumb-wrapper { + .breadcrumb-text { + color: #525252; + font-family: $secondary-font; + font-size: 13px; + font-style: normal; + font-weight: 400; + line-height: normal; + } +} +.ellipsis { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + vertical-align: middle; +} +.stroke { + font-size: smaller; +} diff --git a/projects/arc-lib/src/lib/components/role/components/role/role.component.spec.ts b/projects/arc-lib/src/lib/components/role/components/role/role.component.spec.ts new file mode 100644 index 00000000..ac0b8bde --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/role/role.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RoleComponent } from './role.component'; + +describe('RoleComponent', () => { + let component: RoleComponent; + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [RoleComponent] + }); + fixture = TestBed.createComponent(RoleComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/arc-lib/src/lib/components/role/components/role/role.component.ts b/projects/arc-lib/src/lib/components/role/components/role/role.component.ts new file mode 100644 index 00000000..16b9b238 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/components/role/role.component.ts @@ -0,0 +1,66 @@ +import {Location} from '@angular/common'; +import {Component} from '@angular/core'; +import {ActivatedRoute, Router} from '@angular/router'; +import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base'; +import {Role} from '../../models'; +import {RoleFacadeService} from '../../role-facade.service'; +import {UserSessionStoreService} from '@project-lib/core/index'; +import {MatTableDataSource} from '@angular/material/table'; + +@Component({ + selector: 'careconnect-role', + templateUrl: './role.component.html', + styleUrls: ['./role.component.scss'], +}) +export class RoleComponent extends RouteComponentBaseDirective { + roles: MatTableDataSource; + displayedColumns = ['name', 'createdOn', 'action']; + + constructor( + protected override readonly location: Location, + protected override readonly route: ActivatedRoute, + private readonly roleFacade: RoleFacadeService, + private readonly store: UserSessionStoreService, + private readonly router: Router, + ) { + super(route, location); + } + + ngOnInit(): void { + this.getRoles(); + } + + getRoles() { + this.roles = new MatTableDataSource(); + this.roles.data = [ + { + name: 'Admin', + createdOn: '2023-10-27 07:49:14.844+00', + id: 'jher', + tenantId: 'hgvcyug', + description: 'jhvguryew', + }, + ]; + // this.roleFacade.getRoles(this.store.getUser().tenant.id).subscribe(res => { + // this.roles = new MatTableDataSource(); + // this.roles.data = res; + // this.roles.data = [ + // { + // name: 'Admin', + // createdOn: '2023-10-27 07:49:14.844+00', + // id: 'jher', + // tenantId: 'hgvcyug', + // description: 'jhvguryew', + // }, + // ]; + // }); + } + + editRole(id: string) { + this.router.navigate([`./edit/${id}`], { + relativeTo: this.route, + }); + } + + deleteRole(id: string) {} +} diff --git a/projects/arc-lib/src/lib/components/role/models/api-config.interface.ts b/projects/arc-lib/src/lib/components/role/models/api-config.interface.ts new file mode 100644 index 00000000..37a3ea22 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/models/api-config.interface.ts @@ -0,0 +1,8 @@ +export interface RoleApiConfig { + getRoles: string; + addRole: string; + deleteRole: string; + editRole: string; + getRoleById: string; + getFeatureActions: string; +} diff --git a/projects/arc-lib/src/lib/components/role/models/feature-action.model.ts b/projects/arc-lib/src/lib/components/role/models/feature-action.model.ts new file mode 100644 index 00000000..b911a533 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/models/feature-action.model.ts @@ -0,0 +1,10 @@ +export class FeatureAction { + id!: string; + name!: string; + featureKey!: string; + strategyKey!: string; + strategyEntityId!: string; + status!: boolean; + actions: any[] = []; + enabled? = false; +} diff --git a/projects/arc-lib/src/lib/components/role/models/index.ts b/projects/arc-lib/src/lib/components/role/models/index.ts new file mode 100644 index 00000000..c18f107f --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/models/index.ts @@ -0,0 +1,2 @@ +export * from './role.model'; +export * from './feature-action.model'; diff --git a/projects/arc-lib/src/lib/components/role/models/role.model.ts b/projects/arc-lib/src/lib/components/role/models/role.model.ts new file mode 100644 index 00000000..0e8a121f --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/models/role.model.ts @@ -0,0 +1,8 @@ +export class Role { + id!: string; + name!: string; + actions?: any; + tenantId!: string; + description: string; + createdOn: string; +} diff --git a/projects/arc-lib/src/lib/components/role/role-facade.service.spec.ts b/projects/arc-lib/src/lib/components/role/role-facade.service.spec.ts new file mode 100644 index 00000000..e58a98a8 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/role-facade.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { RoleFacadeService } from './role-facade.service'; + +describe('RoleFacadeService', () => { + let service: RoleFacadeService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(RoleFacadeService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/projects/arc-lib/src/lib/components/role/role-facade.service.ts b/projects/arc-lib/src/lib/components/role/role-facade.service.ts new file mode 100644 index 00000000..221498e3 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/role-facade.service.ts @@ -0,0 +1,91 @@ +import {Inject, Injectable, Optional} from '@angular/core'; +import { + CreateRoleCommand, + EditRoleCommand, + GetFeatureActionsCommand, + GetRoleByIdCommand, +} from './commands'; +import {RoleAdapterService} from './adapters/role-adapter.service'; +import {AnyAdapter, ApiService} from '@project-lib/core/api'; +import {FeatureAction, Role} from './models'; +import {GetRolesCommand} from './commands/get-roles.command'; +import {ROLE_API_ENDPOINT} from './role.module'; +import {RoleApiConfig} from './models/api-config.interface'; + +@Injectable() +export class RoleFacadeService { + constructor( + private readonly apiService: ApiService, + private readonly anyAdapter: AnyAdapter, + private readonly roleAdapter: RoleAdapterService, + @Optional() + @Inject(ROLE_API_ENDPOINT) + private readonly endPointConfig: RoleApiConfig, + ) {} + + getRoles(tenantId: string) { + const command: GetRolesCommand = new GetRolesCommand( + this.apiService, + this.roleAdapter, + tenantId, + this.endPointConfig?.getRoles, + ); + + return command.execute(); + } + + getFeatureActions(tenantId: string) { + const command: GetFeatureActionsCommand = + new GetFeatureActionsCommand( + this.apiService, + this.anyAdapter, + tenantId, + this.endPointConfig?.getFeatureActions, + ); + + return command.execute(); + } + + createRole(role: Role, tenantId: string) { + const command: CreateRoleCommand = new CreateRoleCommand( + this.apiService, + this.roleAdapter, + tenantId, + this.endPointConfig?.getFeatureActions, + ); + + command.parameters = { + data: role, + }; + + return command.execute(); + } + + editRole(role: Role, tenantId: string) { + const command: EditRoleCommand = new EditRoleCommand( + this.apiService, + this.roleAdapter, + tenantId, + role.id, + this.endPointConfig?.editRole, + ); + + command.parameters = { + data: role, + }; + + return command.execute(); + } + + getRoleById(roleId: string, tenantId: string) { + const command: GetRoleByIdCommand = new GetRoleByIdCommand( + this.apiService, + this.roleAdapter, + tenantId, + roleId, + this.endPointConfig?.getRoleById, + ); + + return command.execute(); + } +} diff --git a/projects/arc-lib/src/lib/components/role/role-routing.module.ts b/projects/arc-lib/src/lib/components/role/role-routing.module.ts new file mode 100644 index 00000000..0094c429 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/role-routing.module.ts @@ -0,0 +1,25 @@ +import {NgModule} from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; +import {RoleComponent} from './components/role/role.component'; +import {AddRoleComponent} from './components/add-role/add-role.component'; + +const routes: Routes = [ + { + path: '', + component: RoleComponent, + }, + { + path: 'add', + component: AddRoleComponent, + }, + { + path: 'edit/:id', + component: AddRoleComponent, + }, +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class RoleRoutingModule {} diff --git a/projects/arc-lib/src/lib/components/role/role.module.ts b/projects/arc-lib/src/lib/components/role/role.module.ts new file mode 100644 index 00000000..e69db464 --- /dev/null +++ b/projects/arc-lib/src/lib/components/role/role.module.ts @@ -0,0 +1,41 @@ +import {InjectionToken, NgModule} from '@angular/core'; +import {CommonModule} from '@angular/common'; +import {RoleComponent} from './components/role/role.component'; +import {RoleRoutingModule} from './role-routing.module'; +import {AddRoleComponent} from './components/add-role/add-role.component'; +import {ConfirmationDialogComponent} from './components/confirmation-dialog/confirmation-dialog.component'; +import {RoleAdapterService} from './adapters/role-adapter.service'; +import {ThemeModule} from '@project-lib/theme/theme.module'; +import {MatDialogModule} from '@angular/material/dialog'; +import {MatIconModule} from '@angular/material/icon'; +import {RoleFacadeService} from './role-facade.service'; +import {CdkTableModule} from '@angular/cdk/table'; +import {RoleApiConfig} from './models/api-config.interface'; +import {MatTableModule} from '@angular/material/table'; +import {MatCheckboxModule} from '@angular/material/checkbox'; +import {MatFormFieldModule} from '@angular/material/form-field'; +import {MatInputModule} from '@angular/material/input'; +import {MatExpansionModule} from '@angular/material/expansion'; + +export const ROLE_API_ENDPOINT = new InjectionToken( + 'Role API endpoint', +); + +@NgModule({ + declarations: [AddRoleComponent, ConfirmationDialogComponent, RoleComponent], + imports: [ + CommonModule, + RoleRoutingModule, + ThemeModule, + MatDialogModule, + CdkTableModule, + MatIconModule, + MatTableModule, + MatFormFieldModule, + MatInputModule, + MatCheckboxModule, + MatExpansionModule, + ], + providers: [RoleAdapterService, RoleFacadeService], +}) +export class RoleModule {} diff --git a/projects/arc-lib/src/lib/core/auth/auth.service.ts b/projects/arc-lib/src/lib/core/auth/auth.service.ts index 1fb15ce5..59f7d4ba 100644 --- a/projects/arc-lib/src/lib/core/auth/auth.service.ts +++ b/projects/arc-lib/src/lib/core/auth/auth.service.ts @@ -31,9 +31,9 @@ import { import {LoggedInUserDM, LoginModel} from './models'; import {AnyAdapter, ApiService} from '../api'; import {APP_CONFIG} from '@project-lib/app-config'; -import { CreateExternalUserCommand } from './commands/create-external-user.command'; -import { SignUpAdapter } from './adapters/signup-adapter.service'; -import { CreateTokenCommand } from './commands/create-token.command'; +import {CreateExternalUserCommand} from './commands/create-external-user.command'; +import {SignUpAdapter} from './adapters/signup-adapter.service'; +import {CreateTokenCommand} from './commands/create-token.command'; @Injectable({ providedIn: CoreAuthModule, @@ -170,11 +170,11 @@ export class AuthService { data: { username: username.toLowerCase(), password, - client_id: this.appConfig.clientId, - client_secret: this.appConfig.publicKey, + clientId: this.appConfig.clientId, + clientSecret: this.appConfig.publicKey, } as any, observe: 'response', - headers: this.authTokenSkipHeader, + headers: new HttpHeaders().set(AuthTokenSkipHeader, ''), }; return command.execute(); } @@ -206,9 +206,7 @@ export class AuthService { this.signUpAdapter, this.appConfig, ); - - - + command.parameters = { data: user, }; @@ -216,21 +214,19 @@ export class AuthService { return command.execute(); } - createToken(email){ + createToken(email) { const command = new CreateTokenCommand( this.apiService, this.signUpAdapter, this.appConfig, ); - + command.parameters = { data: email, }; return command.execute(); } - - public authorize(secret: string): Observable { if (!secret) { diff --git a/projects/arc-lib/src/lib/core/interceptors/auth.interceptor.ts b/projects/arc-lib/src/lib/core/interceptors/auth.interceptor.ts index b7a9b95f..6c1d1d24 100644 --- a/projects/arc-lib/src/lib/core/interceptors/auth.interceptor.ts +++ b/projects/arc-lib/src/lib/core/interceptors/auth.interceptor.ts @@ -4,36 +4,34 @@ import { HttpInterceptor, HttpRequest, } from '@angular/common/http'; -import { Injectable } from '@angular/core'; -import { ActivatedRoute, Router } from '@angular/router'; -import { Observable, throwError } from 'rxjs'; - -import { AuthTokenSkipHeader } from '../constants'; -import { UserSessionStoreService } from '../store'; +import {Injectable} from '@angular/core'; +import {ActivatedRoute, Router} from '@angular/router'; +import {Observable, throwError} from 'rxjs'; +import {AuthTokenSkipHeader} from '../constants'; +import {UserSessionStoreService} from '../store'; @Injectable() export class AuthInterceptor implements HttpInterceptor { constructor( private readonly sessionStore: UserSessionStoreService, private readonly route: ActivatedRoute, - private readonly router: Router + private readonly router: Router, ) {} intercept( req: HttpRequest, - next: HttpHandler + next: HttpHandler, ): Observable> { - if (req.headers.has(AuthTokenSkipHeader) || req.url.includes('i18n/')) { const headers = req.headers.delete(AuthTokenSkipHeader); - return next.handle(req.clone({ headers })); + return next.handle(req.clone({headers})); } const authToken = this.sessionStore.getAccessToken(); if (authToken) { return next.handle( - req.clone({ setHeaders: { Authorization: `Bearer ${authToken}` } }) + req.clone({setHeaders: {Authorization: `Bearer ${authToken}`}}), ); } else { if (this.route.snapshot.data['skipAuth']) { diff --git a/projects/arc-lib/src/lib/theme/styles/_variables.scss b/projects/arc-lib/src/lib/theme/styles/_variables.scss index a2fc8960..3b9753a1 100644 --- a/projects/arc-lib/src/lib/theme/styles/_variables.scss +++ b/projects/arc-lib/src/lib/theme/styles/_variables.scss @@ -1,56 +1,56 @@ $font: ( - "dark": #191a1b, - "dark2": #404040, - "primary": #1a69df, - "primary-active": #124798, - "primary-hover": #1658bb, - "light": #fff, - "light2": #838383, - "light3": #4b4b4b, - "light4": #b1b1b1, - "placeholder": #9a9a9a, - "disable": #838383, - "logo-text": #35ab38, + 'dark': #191a1b, + 'dark2': #404040, + 'primary': #f00c18, + 'primary-active': #dc8a8e, + 'primary-hover': #dc8a8e, + 'light': #fff, + 'light2': #838383, + 'light3': #4b4b4b, + 'light4': #b1b1b1, + 'placeholder': #9a9a9a, + 'disable': #838383, + 'logo-text': #35ab38, ) !default; $color: ( - "light": #ffffff, - "background-basic": #f8f8f8, - "background-disable": #dfdfdf, - "border-basic": #ebebeb, - "border-disable": #dfdfdf, - "icon": #555555, - "menu-item-active": #edf3fd, - "menu-item-hover": #f8f8f8, - "tab-hover": #222222, - "select-dropdown-border": #f5f5f5, - "input-border-basic": #e6e6e6, - "logo-bg": #c5ffd4, - "grey": #838383, - "input-border-basic-hover": #9a9a9a, - "primary": #1a69df, - "primary-active": #1a69df, - "primary-hover": #9a9a9a, - "primary-focused": #1658bb, - "dark": #191a1b, - "toggle-background": #0469e3, - "gray20": #333333, - "overallocated": #df0101, - "primary-label-background": #fff0b3, - "overallocated-gantt-border": "f6222e1a", - "overallocated-resource-gantt-text": "#e73d3d", - "actual-resource-gantt-text": #006497, - "actual-resource-gantt-lines": #cde3ff, - "actual-resource-gantt-background": #ebf7fe, - "placeholder-resource-gantt-background": #f7f7f7, - "placeholder-resource-gantt-lines": #cbcbcb, - "gantt-lines": #e5e5e5, - "currency-tags": #464646, - "opendialogspan": #1a69df, - "warning-separator": #d1d1d1, - "gantt-subtitle": #8f8f8f, - "gantt-parent-bar": #e3fcef, - "gantt-parent-bar-border": #baefd4, + 'light': #ffffff, + 'background-basic': #f8f8f8, + 'background-disable': #dfdfdf, + 'border-basic': #ebebeb, + 'border-disable': #dfdfdf, + 'icon': #555555, + 'menu-item-active': #edf3fd, + 'menu-item-hover': #f8f8f8, + 'tab-hover': #222222, + 'select-dropdown-border': #f5f5f5, + 'input-border-basic': #e6e6e6, + 'logo-bg': #c5ffd4, + 'grey': #838383, + 'input-border-basic-hover': #9a9a9a, + 'primary': #f00c18, + 'primary-active': #dc8a8e, + 'primary-hover': #dc8a8e, + 'primary-focused': #dc8a8e, + 'dark': #191a1b, + 'toggle-background': #dc8a8e, + 'gray20': #333333, + 'overallocated': #df0101, + 'primary-label-background': #fff0b3, + 'overallocated-gantt-border': 'f6222e1a', + 'overallocated-resource-gantt-text': '#e73d3d', + 'actual-resource-gantt-text': #006497, + 'actual-resource-gantt-lines': #cde3ff, + 'actual-resource-gantt-background': #ebf7fe, + 'placeholder-resource-gantt-background': #f7f7f7, + 'placeholder-resource-gantt-lines': #cbcbcb, + 'gantt-lines': #e5e5e5, + 'currency-tags': #464646, + 'opendialogspan': #1a69df, + 'warning-separator': #d1d1d1, + 'gantt-subtitle': #8f8f8f, + 'gantt-parent-bar': #e3fcef, + 'gantt-parent-bar-border': #baefd4, ) !default; $font-size: ( @@ -59,7 +59,7 @@ $font-size: ( // 10px small: 0.625rem, // 12px - medium: 0.75rem, + medium: 0.85rem, // 14px default: 0.875rem, // 16px @@ -79,9 +79,9 @@ $font-weight: ( ); $padding: ( - small: 0.125rem, - medium: 0.25rem, - large: 0.5rem, + small: 0.145rem, + medium: 0.29rem, + large: 0.7rem, ); -$main-font-family: Montserrat, Open Sans, sans-serif; +$main-font-family: 'Gotham', Open Sans, sans-serif; diff --git a/projects/arc-lib/src/public-api.ts b/projects/arc-lib/src/public-api.ts index 4be079f6..b8295258 100644 --- a/projects/arc-lib/src/public-api.ts +++ b/projects/arc-lib/src/public-api.ts @@ -1,9 +1,6 @@ -/* - * Public API Surface of shared-library - */ - export * from './lib/components/auth/login/login.component'; export * from './lib/core/route-component-base'; export * from './lib/components/auth/auth.module'; +export * from './lib/components/index'; export * from './lib/core'; export * from './lib/theme'; diff --git a/projects/arc/src/app/app-routing.module.ts b/projects/arc/src/app/app-routing.module.ts index 7ac50dcb..583bf642 100644 --- a/projects/arc/src/app/app-routing.module.ts +++ b/projects/arc/src/app/app-routing.module.ts @@ -19,7 +19,10 @@ const routes: Routes = [ }, { path: 'gantt', - loadChildren: () => import('../../../arc-lib/src/lib/components/gantt/gantt.module').then(m => m.GanttModule), + loadChildren: () => + import('../../../arc-lib/src/lib/components/gantt/gantt.module').then( + m => m.GanttModule, + ), canActivate: [AuthGuard], }, { diff --git a/projects/arc/src/app/app.module.ts b/projects/arc/src/app/app.module.ts index 8388f78b..c49156a3 100644 --- a/projects/arc/src/app/app.module.ts +++ b/projects/arc/src/app/app.module.ts @@ -19,13 +19,11 @@ import {APP_CONFIG} from '@project-lib/app-config'; import {environment} from '../environments/environment'; import {ThemeModule} from '@project-lib/theme/theme.module'; import {NbLayoutModule, NbThemeModule} from '@nebular/theme'; -import { OverlayModule } from '@angular/cdk/overlay'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { GanttModule } from '@project-lib/components/index'; -import { SelectModule } from '@project-lib/components/selector'; -import { GanttAdapter } from '@project-lib/components/gantt'; - - +import {OverlayModule} from '@angular/cdk/overlay'; +import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; +import {GanttModule} from '@project-lib/components/index'; +import {SelectModule} from '@project-lib/components/selector'; +import {GanttAdapter} from '@project-lib/components/gantt'; @NgModule({ declarations: [AppComponent], @@ -37,14 +35,12 @@ import { GanttAdapter } from '@project-lib/components/gantt'; LocalizationModule, CoreModule, ThemeModule, - NbThemeModule.forRoot(), + NbThemeModule.forRoot({name: 'boiler'}), NbLayoutModule, OverlayModule, SelectModule, GanttModule, BrowserAnimationsModule, - - ], providers: [ TranslationService, @@ -58,7 +54,6 @@ import { GanttAdapter } from '@project-lib/components/gantt'; provide: APP_CONFIG, useValue: environment, }, - ], bootstrap: [AppComponent], }) diff --git a/projects/arc/src/app/main/home/home.component.ts b/projects/arc/src/app/main/home/home.component.ts index 62636e01..c3d77370 100644 --- a/projects/arc/src/app/main/home/home.component.ts +++ b/projects/arc/src/app/main/home/home.component.ts @@ -13,7 +13,6 @@ import {takeUntil} from 'rxjs'; export class HomeComponent extends RouteComponentBaseDirective implements OnInit - { imageUrl: string; altText: string; @@ -24,11 +23,10 @@ export class HomeComponent private readonly authService: AuthService, ) { super(route, location); - this.imageUrl='../../../assets/images/home/home-banner.png'; - - this.altText='homepage-illustration'; + this.imageUrl = '../../../assets/images/Illustration.svg'; + this.altText = 'homepage-illustration'; } - + loggedInUserDM: LoggedInUserDM = new LoggedInUserDM(); greeting = ''; diff --git a/projects/arc/src/app/main/main-routing.module.ts b/projects/arc/src/app/main/main-routing.module.ts index 45387405..19a11602 100644 --- a/projects/arc/src/app/main/main-routing.module.ts +++ b/projects/arc/src/app/main/main-routing.module.ts @@ -1,7 +1,7 @@ -import { NgModule } from '@angular/core'; -import { RouterModule, Routes } from '@angular/router'; -import { MainComponent } from './main.component'; -import { IntroductionComponent } from './introduction/introduction.component'; +import {NgModule} from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; +import {MainComponent} from './main.component'; +import {IntroductionComponent} from './introduction/introduction.component'; const routes: Routes = [ { @@ -11,22 +11,34 @@ const routes: Routes = [ { path: 'home', loadChildren: () => - import('./home/home.module').then((m) => m.HomeModule), + import('./home/home.module').then(m => m.HomeModule), + }, + { + path: 'role', + loadChildren: () => + import('@project-lib/components/role/role.module').then( + m => m.RoleModule, + ), }, { path: 'components', - component:IntroductionComponent, - children:[{ - path:'nebular-comp', - loadChildren: () => - import('./introduction/introduction.module').then((m) => m.IntroductionModule), - }, - { - path:'arc-comp', - loadChildren: () => - import('./introduction/introduction.module').then((m) => m.IntroductionModule), - } - ] + component: IntroductionComponent, + children: [ + { + path: 'nebular-comp', + loadChildren: () => + import('./introduction/introduction.module').then( + m => m.IntroductionModule, + ), + }, + { + path: 'arc-comp', + loadChildren: () => + import('./introduction/introduction.module').then( + m => m.IntroductionModule, + ), + }, + ], }, ], }, diff --git a/projects/arc/src/app/main/main.component.ts b/projects/arc/src/app/main/main.component.ts index c9aabe15..2a4594b8 100644 --- a/projects/arc/src/app/main/main.component.ts +++ b/projects/arc/src/app/main/main.component.ts @@ -6,8 +6,8 @@ import {takeUntil} from 'rxjs'; import {AuthService, LoggedInUserDM} from '@project-lib/core/auth'; import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base'; import {IconPacksManagerService} from '@project-lib/theme/services'; -import { COMPONENTS_ITEMS } from './constants/components.constant'; -import { NEBULAR_COMP_ITEMS } from './constants/nebularComponents.constants'; +import {COMPONENTS_ITEMS} from './constants/components.constant'; +import {NEBULAR_COMP_ITEMS} from './constants/nebularComponents.constants'; @Component({ selector: 'main', @@ -26,13 +26,13 @@ export class MainComponent private readonly authService: AuthService, private readonly menuService: NbMenuService, private readonly iconMgr: IconPacksManagerService, - private router: Router + private router: Router, ) { super(route, location); this.iconMgr.registerSvgs(); } - loggedInUserDM: LoggedInUserDM = new LoggedInUserDM(); + loggedInUserDM: LoggedInUserDM = new LoggedInUserDM(); userMenu: NbMenuItem[] = [{title: 'Log out', data: 'logout'}]; menu: NbMenuItem[] = [ { @@ -48,20 +48,33 @@ export class MainComponent link: '/main/components', home: true, pathMatch: 'prefix', - children:[ + children: [ { - title:'Nebular Components', - link:'/nebular-comp', - children:NEBULAR_COMP_ITEMS as NbMenuItem[] + title: 'Nebular Components', + link: '/nebular-comp', + children: NEBULAR_COMP_ITEMS as NbMenuItem[], }, { - title:' Arc Components', - link:'/arc-comp', - children:COMPONENTS_ITEMS as NbMenuItem[] - } - - ] - + title: ' Arc Components', + link: '/arc-comp', + children: COMPONENTS_ITEMS as NbMenuItem[], + }, + ], + }, + { + title: 'ARC-Back', + icon: 'book-outline', + home: true, + pathMatch: 'prefix', + children: [ + { + title: 'Role', + icon: 'book-outline', + link: '/main/role', + home: true, + pathMatch: 'prefix', + }, + ], }, ]; diff --git a/projects/arc/src/app/main/main.module.ts b/projects/arc/src/app/main/main.module.ts index 01628d2a..9e58169c 100644 --- a/projects/arc/src/app/main/main.module.ts +++ b/projects/arc/src/app/main/main.module.ts @@ -5,8 +5,7 @@ import {MainComponent} from './main.component'; import {APP_CONFIG} from '@project-lib/app-config'; import {ThemeModule} from '@project-lib/theme/theme.module'; import {NbLayoutModule, NbMenuModule, NbThemeModule} from '@nebular/theme'; -import { IntroductionComponent } from './introduction/introduction.component'; - +import {IntroductionComponent} from './introduction/introduction.component'; @NgModule({ declarations: [MainComponent], @@ -15,7 +14,7 @@ import { IntroductionComponent } from './introduction/introduction.component'; MainRoutingModule, NbLayoutModule, NbMenuModule.forRoot(), - NbThemeModule.forRoot(), + NbThemeModule.forRoot({name: 'boiler'}), ThemeModule, ], }) diff --git a/projects/arc/src/environments/environment.ts b/projects/arc/src/environments/environment.ts index a0a9ee2b..50df1bde 100644 --- a/projects/arc/src/environments/environment.ts +++ b/projects/arc/src/environments/environment.ts @@ -1,10 +1,10 @@ export const environment = { production: false, - clientId: "", - publicKey: "", + clientId: 'managing_webapp', + publicKey: 'FbHISutQ6e', homePath: '/main/home', - baseApiUrl: '', - authServiceUrl: '', - userServiceUrl: '', + baseApiUrl: 'http://localhost:4001/', + authServiceUrl: 'auth-facade', + userServiceUrl: 'http://localhost:4002/user-tenant-facade', logLevel: 5, }; diff --git a/projects/arc/src/styles.scss b/projects/arc/src/styles.scss index 32ac3fdc..9fb2744e 100644 --- a/projects/arc/src/styles.scss +++ b/projects/arc/src/styles.scss @@ -9,7 +9,42 @@ @include nb-theme-global(); @include nb-auth-global(); } +// Fonts From Local +@font-face { + font-family: 'Gotham'; + font-style: normal; + font-weight: 100; + src: url('../../arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.ttf') + format('truetype'), + url('../../arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff') + format('woff'), + url('../../arc-lib/src/lib/assets/fonts/gotham/Gotham-Medium.woff2') + format('woff2'); + font-display: swap; +} +//gogal style set +body, +html, +p, +div, +span, +form, +input, +button, +a, +ul, +li, +table, +ul, +li, +table, +tr, +th, +td, +.mat-expansion-panel-header { + font-family: 'Gotham', sans-serif !important; +} /* You can add global styles to this file, and also import other style files */ .kebab-menu ul.menu-items { text-align: left !important; @@ -101,14 +136,13 @@ router-outlet.main-router + * { color: #525252; a { text-decoration: none; - color: #19a5ff; - font-weight: 700; + font-weight: 500; } } h1, .h1 { - font-size: 2.25rem !important; + font-size: 2.25rem; } h3, @@ -206,6 +240,7 @@ nb-select[readonly] > button { nb-sidebar, nb-sidebar > div.main-container { transition: width 0.3s; + background: #fff; } input[disabled], @@ -288,3 +323,91 @@ nb-toast.status-success .icon-container { background: #fff; } } +.inner-content-wrapper { + padding: 0; + .breadcrumb-wrapper { + margin: 0; + } + .list-container { + ::ng-deep .ag-grid-main { + height: calc(100vh - 194px); + .status-column { + display: flex; + align-items: center; + } + } + } + .title-n-filter { + margin-bottom: 15px; + display: flex; + justify-content: flex-start; + width: 100%; + align-items: center; + flex-wrap: wrap; + .title-container { + width: calc(100% - 350px); + @media (max-width: 1200px) { + width: 100%; + } + .page-title { + margin: 0; + font-size: 1.5rem; + font-family: Gotham; + line-height: normal; + @media (max-width: 1400px) { + font-size: 1.5rem; + margin-bottom: 10px; + } + } + } + .search { + width: 345px; + display: flex; + align-items: center; + gap: 8px; + justify-content: flex-end; + @media (max-width: 1200px) { + width: 100%; + } + } + } +} +.list-container { + width: 100%; + overflow: auto; + .actions { + min-width: 100px; + .cursor-pointer { + margin: 0 5px; + } + } +} +.layout-container { + .main-container { + .scrollable { + padding: 10px 0 !important; + .menu-items { + .menu-item { + a { + padding: 15px; + font-weight: 500; + } + > .menu-items { + padding: 10px 0; + .menu-item { + margin-left: 10px; + } + } + } + } + } + } + .left.expanded { + @media (max-width: 1200px) { + position: fixed; + } + .scrollable { + background: #fff; + } + } +} diff --git a/projects/arc/src/themes.scss b/projects/arc/src/themes.scss index 74684b40..0269fafc 100644 --- a/projects/arc/src/themes.scss +++ b/projects/arc/src/themes.scss @@ -16,14 +16,13 @@ $nb-themes: nb-register-theme( border-radius: 0.25rem, // Font - font-family-primary: 'Montserrat,Open Sans,sans-serif', + font-family-primary: 'Gotham,Open Sans,sans-serif', // Background related background-basic-color-3: map.get($bb-color, 'background-basic'), ag-header-background-color: inherit, // Layout related - layout-padding: 1.25rem map.get($bb-font-size, 'large'), // Header related header-height: 3.25rem, header-padding: map.get($bb-font-size, 'medium'), @@ -72,7 +71,7 @@ $nb-themes: nb-register-theme( sidebar-text-color: map.get($bb-font, 'dark2'), sidebar-text-font-size: map.get($bb-font-size, 'medium'), sidebar-shadow: none, - sidebar-width: 10.688rem, + sidebar-width: 13.688rem, sidebar-padding: map.get($bb-font-size, 'medium'), sidebar-width-compact: 3.5rem, // Nb-user @@ -100,7 +99,7 @@ $nb-themes: nb-register-theme( // Button related button-filled-basic-background-color: map.get($bb-color, 'light'), - button-medium-text-font-size: map.get($bb-font-size, 'small'), + button-medium-text-font-size: map.get($bb-font-size, 'medium'), color-primary-default: map.get($bb-font, 'primary'), color-primary-focus: map.get($bb-font, 'primary-active'), color-primary-focus-border: map.get($bb-font, 'primary-active'), @@ -123,6 +122,10 @@ $nb-themes: nb-register-theme( button-filled-basic-focus-background-color: map.get($bb-color, 'light'), button-filled-basic-border-color: map.get($bb-color, 'input-border-basic'), button-filled-basic-active-border-color: map.get($bb-color, 'primary-focus'), + button-filled-primary-hover-background-color: + map.get($bb-color, 'primary-hover'), + button-filled-primary-hover-border-color: + map.get($bb-color, 'primary-hover'), button-filled-basic-focus-border-color: map.get($bb-color, 'primary-focus'), button-filled-medium-padding: map.get($bb-padding, 'large') 0.914rem, button-filled-basic-hover-border-color: @@ -230,4 +233,4 @@ $nb-themes: nb-register-theme( ), boiler, default -); \ No newline at end of file +);