Skip to content

Commit 0334e70

Browse files
sadaf895sleidig
andauthored
fix(user management): highlight "create account" button for clearer user guidance (#2489)
closes #2461 Co-authored-by: Sebastian <[email protected]>
1 parent 14e5967 commit 0334e70

File tree

9 files changed

+266
-99
lines changed

9 files changed

+266
-99
lines changed

src/app/core/user/user-security/user-security.component.html

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@
2020
type="submit"
2121
(click)="createAccount()"
2222
[disabled]="form.disabled"
23+
class="invite-button"
24+
[color]="form.valid ? 'accent' : ''"
25+
[class.invite-button-animate]="form.valid"
2326
i18n="button to invite a new user"
2427
>
2528
Create account & send invitation
@@ -119,11 +122,16 @@
119122
<em style="font-size: x-small">{{ role.name }}</em>
120123
</mat-option>
121124
</mat-select>
125+
126+
<mat-hint i18n="hint about assigning user roles" class="field-hint">
127+
You should select at least one user role. Otherwise this user will not
128+
even be able to access the basic app layout like the menu.
129+
</mat-hint>
130+
131+
<mat-error *ngIf="form.hasError('required', 'roles')" i18n>
132+
This field is required
133+
</mat-error>
122134
</mat-form-field>
123-
<p i18n="hint about assigning user roles" class="field-hint">
124-
You should select at least one user role. Otherwise this user will not
125-
even be able to access the basic app layout like the menu.
126-
</p>
127135
</div>
128136

129137
<mat-error *ngIf="form.getError('failed')">{{

src/app/core/user/user-security/user-security.component.scss

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,22 @@
77
.field-warning {
88
color: #f44336;
99
}
10+
11+
@keyframes buttonPulse {
12+
0% {
13+
transform: scale(1);
14+
}
15+
50% {
16+
transform: scale(1.05);
17+
}
18+
100% {
19+
transform: scale(1);
20+
}
21+
}
22+
23+
.invite-button {
24+
margin: 0 12px;
25+
}
26+
.invite-button-animate {
27+
animation: buttonPulse 1s forwards;
28+
}

src/app/core/user/user-security/user-security.component.spec.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -132,8 +132,11 @@ describe("UserSecurityComponent", () => {
132132
new HttpErrorResponse({ error: { message: "user unauthorized" } }),
133133
),
134134
);
135-
136-
component.form.patchValue({ username: "test-name", email: "[email protected]" });
135+
component.form.patchValue({
136+
username: "test-name",
137+
138+
roles: [{ id: "test_role", name: "test role", description: "x" }],
139+
});
137140
component.createAccount();
138141
tick();
139142

src/app/core/user/user-security/user-security.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ export class UserSecurityComponent implements OnInit {
4848
form = this.fb.group({
4949
username: [{ value: "", disabled: true }],
5050
email: ["", [Validators.required, Validators.email]],
51-
roles: new FormControl<Role[]>([]),
51+
roles: new FormControl<Role[]>([], Validators.required),
5252
});
5353
availableRoles: Role[] = [];
5454
user: KeycloakUser;

src/app/core/user/user-security/user-security.stories.ts

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,40 @@ import { UserSecurityComponent } from "./user-security.component";
33
import { StorybookBaseModule } from "../../../utils/storybook-base.module";
44
import { User } from "../user";
55
import { importProvidersFrom } from "@angular/core";
6+
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
7+
import { KeycloakAuthService } from "app/core/session/auth/keycloak/keycloak-auth.service";
8+
import { BehaviorSubject, of } from "rxjs";
9+
import { HttpClient } from "@angular/common/http";
10+
import {
11+
SessionInfo,
12+
SessionSubject,
13+
} from "app/core/session/auth/session-info";
614

715
export default {
816
title: "Core/Admin/User Security",
917
component: UserSecurityComponent,
1018
decorators: [
1119
applicationConfig({
12-
providers: [importProvidersFrom(StorybookBaseModule)],
20+
providers: [
21+
importProvidersFrom(BrowserAnimationsModule),
22+
{
23+
provide: KeycloakAuthService,
24+
useValue: {
25+
getRoles: () => of(["account_manager", "user_app"]),
26+
getUser: () => {
27+
throw new Error("Not implemented");
28+
},
29+
},
30+
},
31+
{ provide: HttpClient, useValue: {} },
32+
{
33+
provide: SessionSubject,
34+
useValue: new BehaviorSubject<SessionInfo>({
35+
roles: [KeycloakAuthService.ACCOUNT_MANAGER_ROLE],
36+
name: "tester",
37+
}),
38+
},
39+
],
1340
}),
1441
],
1542
} as Meta;

src/assets/locale/messages.de.xlf

Lines changed: 51 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2410,7 +2410,7 @@
24102410
<note priority="1" from="meaning">distance with unit</note>
24112411
<context-group purpose="location">
24122412
<context context-type="sourcefile">src/app/features/location/view-distance/view-distance.component.ts</context>
2413-
<context context-type="linenumber">63</context>
2413+
<context context-type="linenumber">64</context>
24142414
</context-group>
24152415
</trans-unit>
24162416
<trans-unit id="4bc0107bf7dcdac8c02c5ced13ad79c23c253148" datatype="html">
@@ -2437,7 +2437,7 @@
24372437
<note priority="1" from="description">Matching button label</note>
24382438
<context-group purpose="location">
24392439
<context context-type="sourcefile">src/app/features/matching-entities/matching-entities/matching-entities.component.ts</context>
2440-
<context context-type="linenumber">100</context>
2440+
<context context-type="linenumber">101</context>
24412441
</context-group>
24422442
</trans-unit>
24432443
<trans-unit id="1779552786277618671" datatype="html">
@@ -2446,7 +2446,7 @@
24462446
<note priority="1" from="description">Matching View column name</note>
24472447
<context-group purpose="location">
24482448
<context context-type="sourcefile">src/app/features/matching-entities/matching-entities/matching-entities.component.ts</context>
2449-
<context context-type="linenumber">366</context>
2449+
<context context-type="linenumber">367</context>
24502450
</context-group>
24512451
</trans-unit>
24522452
<trans-unit id="54fdb618c658224c6fbd4e10a947f91ea7611913" datatype="html">
@@ -5866,7 +5866,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
58665866
<note priority="1" from="description">Save button for forms</note>
58675867
<context-group purpose="location">
58685868
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
5869-
<context context-type="linenumber">60</context>
5869+
<context context-type="linenumber">63</context>
58705870
</context-group>
58715871
<context-group purpose="location">
58725872
<context context-type="sourcefile">src/app/features/location/map-popup/map-popup.component.html</context>
@@ -5879,7 +5879,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
58795879
<note priority="1" from="description">Cancel button for forms</note>
58805880
<context-group purpose="location">
58815881
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
5882-
<context context-type="linenumber">69</context>
5882+
<context context-type="linenumber">72</context>
58835883
</context-group>
58845884
</trans-unit>
58855885
<trans-unit id="f86131ef7ca273e6d6ce010d579593d7652afdd9" datatype="html">
@@ -5888,15 +5888,19 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
58885888
<note priority="1" from="description">Hint in user account page</note>
58895889
<context-group purpose="location">
58905890
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
5891-
<context context-type="linenumber">87</context>
5891+
<context context-type="linenumber">90</context>
58925892
</context-group>
58935893
</trans-unit>
58945894
<trans-unit id="8ed7531bcca1a494f7b6a1af631796186be4be43" datatype="html">
58955895
<source> This field is required </source>
58965896
<target state="translated">Dieses Feld ist erforderlich</target>
58975897
<context-group purpose="location">
58985898
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
5899-
<context context-type="linenumber">98</context>
5899+
<context context-type="linenumber">101</context>
5900+
</context-group>
5901+
<context-group purpose="location">
5902+
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
5903+
<context context-type="linenumber">131</context>
59005904
</context-group>
59015905
</trans-unit>
59025906
<trans-unit id="5210270493533766316" datatype="html">
@@ -6584,15 +6588,15 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
65846588
<target state="translated">Erstelle eine neue Option</target>
65856589
<context-group purpose="location">
65866590
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/enum-dropdown/enum-dropdown.component.ts</context>
6587-
<context context-type="linenumber">84</context>
6591+
<context context-type="linenumber">103</context>
65886592
</context-group>
65896593
</trans-unit>
65906594
<trans-unit id="5006850401853518123" datatype="html">
6591-
<source>Do you want to create the new option "<x id="PH" equiv-text="name"/>"?</source>
6595+
<source>Do you want to create the new option "<x id="PH" equiv-text="addedOption.label"/>"?</source>
65926596
<target state="translated">Wollen sie die neue Option "<x id="PH" equiv-text="option"/>" erstellen?</target>
65936597
<context-group purpose="location">
65946598
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/enum-dropdown/enum-dropdown.component.ts</context>
6595-
<context context-type="linenumber">85</context>
6599+
<context context-type="linenumber">104</context>
65966600
</context-group>
65976601
</trans-unit>
65986602
<trans-unit id="8998179362936748717" datatype="html">
@@ -6816,7 +6820,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
68166820
<target state="translated">Wollen Sie siche die Option "<x id="PH" equiv-text="value.label"/>" löschen?</target>
68176821
<context-group purpose="location">
68186822
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/configure-enum-popup/configure-enum-popup.component.ts</context>
6819-
<context context-type="linenumber">73</context>
6823+
<context context-type="linenumber">74</context>
68206824
</context-group>
68216825
</trans-unit>
68226826
<trans-unit id="5809649168268401149" datatype="html">
@@ -6828,15 +6832,39 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
68286832
)"/> Einträgen genutzt. Wenn Sie die Option löschen, werden die Einträge nicht gelöscht, aber die Option besonders markiert.</target>
68296833
<context-group purpose="location">
68306834
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/configure-enum-popup/configure-enum-popup.component.ts</context>
6831-
<context context-type="linenumber">75</context>
6835+
<context context-type="linenumber">76</context>
68326836
</context-group>
68336837
</trans-unit>
68346838
<trans-unit id="3767101596108414700" datatype="html">
68356839
<source>Delete option</source>
68366840
<target state="translated">Option Löschen</target>
68376841
<context-group purpose="location">
68386842
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/configure-enum-popup/configure-enum-popup.component.ts</context>
6839-
<context context-type="linenumber">80</context>
6843+
<context context-type="linenumber">81</context>
6844+
</context-group>
6845+
</trans-unit>
6846+
<trans-unit id="5431785405792219476" datatype="html">
6847+
<source>Failed to create new option</source>
6848+
<target state="translated">Neue Option konnte nicht erstellt werden</target>
6849+
<context-group purpose="location">
6850+
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/configure-enum-popup/configure-enum-popup.component.ts</context>
6851+
<context context-type="linenumber">135</context>
6852+
</context-group>
6853+
<context-group purpose="location">
6854+
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/enum-dropdown/enum-dropdown.component.ts</context>
6855+
<context context-type="linenumber">91</context>
6856+
</context-group>
6857+
</trans-unit>
6858+
<trans-unit id="6031162605459514264" datatype="html">
6859+
<source>Couldn't create this new option. Please check if the value already exists.</source>
6860+
<target state="translated">Bitte prüfen Sie, ob der Wert bereits existiert.</target>
6861+
<context-group purpose="location">
6862+
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/configure-enum-popup/configure-enum-popup.component.ts</context>
6863+
<context context-type="linenumber">136</context>
6864+
</context-group>
6865+
<context-group purpose="location">
6866+
<context context-type="sourcefile">src/app/core/basic-datatypes/configurable-enum/enum-dropdown/enum-dropdown.component.ts</context>
6867+
<context context-type="linenumber">92</context>
68406868
</context-group>
68416869
</trans-unit>
68426870
<trans-unit id="3938396793871184620" datatype="html">
@@ -7254,7 +7282,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
72547282
<note priority="1" from="description">button to invite a new user</note>
72557283
<context-group purpose="location">
72567284
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7257-
<context context-type="linenumber">24</context>
7285+
<context context-type="linenumber">27</context>
72587286
</context-group>
72597287
</trans-unit>
72607288
<trans-unit id="474ead66131b28af1c7e156359ac13e01cc4e286" datatype="html">
@@ -7263,7 +7291,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
72637291
<note priority="1" from="description">button to update disable a user</note>
72647292
<context-group purpose="location">
72657293
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7266-
<context context-type="linenumber">40</context>
7294+
<context context-type="linenumber">43</context>
72677295
</context-group>
72687296
</trans-unit>
72697297
<trans-unit id="697c8c7bb7d15ad9c7ef6afa52dcee457bad9658" datatype="html">
@@ -7272,7 +7300,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
72727300
<note priority="1" from="description">button to enable a user</note>
72737301
<context-group purpose="location">
72747302
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7275-
<context context-type="linenumber">50</context>
7303+
<context context-type="linenumber">53</context>
72767304
</context-group>
72777305
</trans-unit>
72787306
<trans-unit id="c135f4618bd4d3741aa311d61a3c455739f8aa16" datatype="html">
@@ -7285,7 +7313,7 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
72857313
</context-group>
72867314
<context-group purpose="location">
72877315
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7288-
<context context-type="linenumber">78</context>
7316+
<context context-type="linenumber">81</context>
72897317
</context-group>
72907318
</trans-unit>
72917319
<trans-unit id="e657507a4e9ff27ce501080e9e0b93cf6811a185" datatype="html">
@@ -7345,15 +7373,15 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
73457373
<note priority="1" from="description">label of email input</note>
73467374
<context-group purpose="location">
73477375
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7348-
<context context-type="linenumber">93</context>
7376+
<context context-type="linenumber">96</context>
73497377
</context-group>
73507378
</trans-unit>
73517379
<trans-unit id="0cc7fb7cb9b7b36e3dbeefa92f1fa66dfc463d62" datatype="html">
73527380
<source> Please enter a valid email </source>
73537381
<target state="translated">Bitte eine korrekte E-Mail eingeben</target>
73547382
<context-group purpose="location">
73557383
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7356-
<context context-type="linenumber">95</context>
7384+
<context context-type="linenumber">98</context>
73577385
</context-group>
73587386
</trans-unit>
73597387
<trans-unit id="9610487cbeb5796d34d8601b5ac0c0a65f9e1d19" datatype="html">
@@ -7362,17 +7390,17 @@ Zögern Sie nicht uns mit Fragen und Feedback zu kontaktieren: [support@aam-digi
73627390
<note priority="1" from="description">label of roles input</note>
73637391
<context-group purpose="location">
73647392
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7365-
<context context-type="linenumber">106</context>
7393+
<context context-type="linenumber">109</context>
73667394
</context-group>
73677395
</trans-unit>
7368-
<trans-unit id="92bb23fab6544aecc438158fb28314519d896c25" datatype="html">
7396+
<trans-unit id="4b1bb1586dded700734bc36ea801ae06052a84ff" datatype="html">
73697397
<source> You should select at least one user role. Otherwise this user will not even be able to access the basic app layout like the menu. </source>
73707398
<target state="translated"> Mindestens eine Rolle sollte ausgewählt werden. Ansonsten wir der Nutzer keinen Zugang zu existierenden Daten haben. </target>
7371-
<note priority="1" from="description">hint about assigning user roles</note>
73727399
<context-group purpose="location">
73737400
<context context-type="sourcefile">src/app/core/user/user-security/user-security.component.html</context>
7374-
<context context-type="linenumber">123</context>
7401+
<context context-type="linenumber">126,129</context>
73757402
</context-group>
7403+
<note priority="1" from="description">hint about assigning user roles</note>
73767404
</trans-unit>
73777405
<trans-unit id="3506248175295374215" datatype="html">
73787406
<source>Account has been disabled, user will not be able to login anymore.</source>

0 commit comments

Comments
 (0)