Skip to content

Commit e74a12e

Browse files
authored
feat(skip-dialog): Enhance popup usability and design (#118) (#328)
* feat(skip-dialog): enhance popup usability and design (#118) dialogs are not shown if url-parameter skip_dialog=true * feat(skip-dialog): enhance popup usability and design (#118 ) Add information about skipping dialogs if cookies are deleted after each session closes #118 * feat(skip-dialog): Enhance popup usability and design (#118) Add some description text before Icon * feat(skip-dialog): Enhance popup usability and design (#118) changed workflow for skipping cookies snackbar appears when skip_cookies is set remove icon update messages * feat(skip-dialog): Enhance popup usability and design (#118) change params via router change snackbar description add subscription for url-param changes * feat(skip-dialog): refactor methods and messages (#118) * feat(skip-dialog): add snackbar for just skipped dialogs(#118) added a snackbar for user information after click on "deactivate startup dialogs" * feat(skip-dialog): resolve comments (#118) rename message Co-Authored-By: DanielHabenicht <daniel-habenicht@outlook.de> * feat(skip-dialog): refactor messages resolve comments
1 parent 66ff75b commit e74a12e

File tree

7 files changed

+230
-40
lines changed

7 files changed

+230
-40
lines changed

Phonebook.Frontend/src/app/app.component.ts

Lines changed: 75 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,28 @@
11
import { Platform } from '@angular/cdk/platform';
2-
import { Component, OnInit } from '@angular/core';
2+
import { Component, OnInit, OnDestroy } from '@angular/core';
33
import { MatDialog } from '@angular/material/dialog';
44
import { MatSnackBar } from '@angular/material/snack-bar';
5-
import { NavigationError, Router } from '@angular/router';
5+
import { NavigationError, Router, ActivatedRoute } from '@angular/router';
66
import { I18n } from '@ngx-translate/i18n-polyfill';
77
import { Store } from '@ngxs/store';
88
import { filter } from 'rxjs/operators';
99
import { BugReportConsentComponent } from 'src/app/shared/dialogs/bug-report-consent/bug-report-consent.component';
1010
import { DisplayNotificationDialog } from 'src/app/shared/dialogs/display-notification-dialog/display-notification.dialog';
1111
import { IeWarningComponent } from 'src/app/shared/dialogs/ie-warning/ie-warning.component';
12-
import { AppState, InitTheme, SetSendFeedback } from 'src/app/shared/states/App.state';
12+
import { AppState, InitTheme, SetSendFeedback, SetDisplayedNotificationVersion } from 'src/app/shared/states/App.state';
1313
import { ReleaseInfoService } from './services/release-info.service';
1414
import { runtimeEnvironment } from 'src/environments/runtime-environment';
15+
import { untilComponentDestroyed } from 'ng2-rx-componentdestroyed';
1516

1617
@Component({
1718
selector: 'app-root',
1819
templateUrl: './app.component.html',
1920
styleUrls: ['./app.component.scss']
2021
})
21-
export class AppComponent implements OnInit {
22+
export class AppComponent implements OnInit, OnDestroy {
23+
//get url params
24+
private urlParams: URLSearchParams = new URLSearchParams(window.location.search);
25+
private skippedDialogs: boolean = this.urlParams.get('skip_dialog') === 'true';
2226
constructor(
2327
private snackBar: MatSnackBar,
2428
private releaseMigrationService: ReleaseInfoService,
@@ -27,11 +31,11 @@ export class AppComponent implements OnInit {
2731
// Issue: https://github.com/T-Systems-MMS/phonebook/issues/87
2832
// private swUpdates: SwUpdate,
2933
private matDialog: MatDialog,
30-
private i18n: I18n,
3134
private platform: Platform,
32-
private router: Router
35+
private router: Router,
36+
private i18n: I18n,
37+
private activatedRoute: ActivatedRoute
3338
) {}
34-
3539
public ngOnInit() {
3640
this.store.dispatch(new InitTheme());
3741
// Commented as long as serviceWorker is reinstalled
@@ -95,8 +99,22 @@ export class AppComponent implements OnInit {
9599
// });
96100
// }
97101

102+
//if skip_cookies is set, dont show dialogs
103+
if (this.skippedDialogs) {
104+
this.store.dispatch(new SetDisplayedNotificationVersion(DisplayNotificationDialog.version));
105+
}
106+
//subscribe on query param changes, if changed open snackbar
107+
this.activatedRoute.queryParamMap.pipe(untilComponentDestroyed(this)).subscribe(queryParamMap => {
108+
if (queryParamMap.get('skip_dialog') === 'true') {
109+
if (!this.skippedDialogs) {
110+
this.openJustSkippedDialogsSnackBar();
111+
} else {
112+
this.openSkippedDialogsSnackBar();
113+
}
114+
}
115+
});
116+
98117
// Ask for Permission to send Bug reports
99-
const test = this.store.selectSnapshot(AppState.sendFeedback);
100118
if (this.store.selectSnapshot(AppState.sendFeedback) == null && runtimeEnvironment.ravenURL != null) {
101119
const matDialogRef = this.matDialog.open(BugReportConsentComponent, {
102120
hasBackdrop: true
@@ -128,4 +146,53 @@ export class AppComponent implements OnInit {
128146
this.router.navigateByUrl('/');
129147
});
130148
}
149+
public openJustSkippedDialogsSnackBar() {
150+
this.snackBar
151+
.open(
152+
this.i18n({
153+
meaning: 'Display advice to new url',
154+
description: 'Message for just set no cookie url',
155+
id: 'PageInformationNewUrlNoCookies',
156+
value:
157+
'Save the site URL as a favourite now in order to not get any more startup-dialogs. Please notice: You won\'t get any information about updates or releases with the set url parameter.'
158+
}),
159+
this.i18n({
160+
meaning: 'Restore Url',
161+
description: 'Message for following no cookie url',
162+
id: 'PageInformationNewUrlNoCookiesUrl',
163+
value: 'Reset'
164+
}),
165+
{ duration: 8000 }
166+
)
167+
.onAction()
168+
.subscribe(() => {
169+
//remove url parameter and close snackbar
170+
this.router.navigateByUrl('/');
171+
});
172+
}
173+
public openSkippedDialogsSnackBar() {
174+
this.snackBar
175+
.open(
176+
this.i18n({
177+
meaning: 'Warning no dialogs are shown',
178+
description: 'Message to inform user that no dialogs will be shown',
179+
id: 'PageInformationNoDialogs',
180+
value:
181+
'Startup-Dialogs are deactivated. Please notice: You won\'t get any information about updates or releases.'
182+
}),
183+
this.i18n({
184+
meaning: 'Restore Url',
185+
description: 'Message for following no cookie url',
186+
id: 'PageInformationNewUrlNoCookiesUrl',
187+
value: 'Reset'
188+
}),
189+
{ duration: 8000 }
190+
)
191+
.onAction()
192+
.subscribe(() => {
193+
//remove url parameter and close snackbar
194+
this.router.navigateByUrl('/');
195+
});
196+
}
197+
public ngOnDestroy() {}
131198
}

Phonebook.Frontend/src/app/shared/dialogs/display-notification-dialog/display-notification.dialog.html

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -112,11 +112,22 @@ <h3 mat-dialog-title class="pb-color-primary" i18n="Display-notificationDialog|W
112112
<!-- call for contributors -->
113113
<app-contributors class="border-1 pb-center-element pb-border-color-primary pb-margin-05"></app-contributors>
114114
</mat-dialog-content>
115+
115116
<div class="spacer"></div>
116117
<mat-dialog-actions>
117-
<p i18n="Display-notificationDialog|Cookie notice@@WelcomeCookieNotice">
118+
<span i18n="Display-notificationDialog|Cookie notice@@WelcomeCookieNotice">
118119
This site uses cookies to ensure the basic functionality of the app.
119-
</p>
120+
</span>
121+
<span i18n="Display-notificationDialog|Annoyed by cookies notice@@PageInformationNewUrlNoCookiesText">
122+
You deactivated cookies and keep getting those dialogs?
123+
</span>
124+
<button
125+
i18n="Display-notificationDialog|Deactivate Startup Dialogs@@PageInformationNewUrlNoCookiesButton"
126+
mat-button
127+
(click)="skipStartDialogs()"
128+
>
129+
Deactivate startup-dialogs!
130+
</button>
120131
<div class="actions">
121132
<button mat-button mat-dialog-close cdkFocusInitial>
122133
Cool!

Phonebook.Frontend/src/app/shared/dialogs/display-notification-dialog/display-notification.dialog.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Component, OnDestroy, OnInit } from '@angular/core';
22
import { MatDialogRef } from '@angular/material/dialog';
33
import { Store } from '@ngxs/store';
44
import { SetDisplayedNotificationVersion } from 'src/app/shared/states';
5+
import { Router } from '@angular/router';
56

67
/**
78
* Display Notification Dialog
@@ -14,10 +15,13 @@ import { SetDisplayedNotificationVersion } from 'src/app/shared/states';
1415
})
1516
export class DisplayNotificationDialog implements OnInit, OnDestroy {
1617
public static version: number = 1;
17-
constructor(public dialogRef: MatDialogRef<DisplayNotificationDialog>, store: Store) {
18+
constructor(public dialogRef: MatDialogRef<DisplayNotificationDialog>, store: Store, private router: Router) {
1819
store.dispatch(new SetDisplayedNotificationVersion(DisplayNotificationDialog.version));
1920
}
20-
21+
public skipStartDialogs() {
22+
this.router.navigateByUrl('/?skip_dialog=true');
23+
this.dialogRef.close();
24+
}
2125
public ngOnInit() {}
2226

2327
public ngOnDestroy() {}

Phonebook.Frontend/src/i18n/messages.de.xlf

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -943,6 +943,22 @@
943943
</target>
944944
<note priority="1" from="description">Cookie notice</note>
945945
<note priority="1" from="meaning">Display-notificationDialog</note>
946+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesText" datatype="html">
947+
<source>
948+
You deactivated cookies and keep getting those dialogs?
949+
</source><target state="translated">
950+
Du hast Cookies deaktiviert und dir werden diese Dialoge ständig angezeigt?
951+
</target>
952+
<note priority="1" from="description">Annoyed by cookies notice</note>
953+
<note priority="1" from="meaning">Display-notificationDialog</note>
954+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesButton" datatype="html">
955+
<source>
956+
Deactivate startup-dialogs!
957+
</source><target state="translated">
958+
Start-Dialoge deaktivieren!
959+
</target>
960+
<note priority="1" from="description">Deactivate Startup Dialogs</note>
961+
<note priority="1" from="meaning">Display-notificationDialog</note>
946962
</trans-unit><trans-unit id="PageInformationComponentSectionCookies" datatype="html">
947963
<source>
948964
This site uses cookies, to enhance your experience. Cookies are only used for necessary tasks, e.g. saving the
@@ -1238,6 +1254,19 @@ Diese Seite nutzt Cookies, um die Bedienung der Seite zu verbessern. Cookies wer
12381254
<target state="translated">Gebäude</target>
12391255
<note priority="1" from="description">Title of Table Column "Building"</note>
12401256
<note priority="1" from="meaning">TableComponent</note>
1257+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookies" datatype="html">
1258+
<source>Save the site URL as a favourite now in order to not get any more startup-dialogs. Please notice: You won't get any information about updates or releases with the set url parameter.</source>
1259+
<target state="translated">Speicher die Seiten-URL jetzt als Favorit um Startdialoge auch zukünftig zu überspringen. Bitte beachte: Mit dem gesetzten Url-Parameter werden keine Dialoge zu Updates oder neuen Features angezeigt.</target>
1260+
<note priority="1" from="description">Message for just set no cookie url</note>
1261+
<note priority="1" from="meaning">Display advice to new url</note>
1262+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesUrl" datatype="html">
1263+
<source>Reset</source><target state="translated">Rückgängig</target>
1264+
<note priority="1" from="description">Message for following no cookie url</note>
1265+
<note priority="1" from="meaning">Restore Url</note>
1266+
</trans-unit><trans-unit id="PageInformationNoDialogs" datatype="html">
1267+
<source>Startup-Dialogs are deactivated. Please notice: You won't get any information about updates or releases.</source><target state="translated">Startdialoge sind deaktiviert. Bitte beachte, dass du keine Informationen zu Updates oder neuen Features angezeigt bekommst. </target>
1268+
<note priority="1" from="description">Message to inform user that no dialogs will be shown</note>
1269+
<note priority="1" from="meaning">Warning no dialogs are shown</note>
12411270
</trans-unit><trans-unit id="DataPersonStatus" datatype="html">
12421271
<source>
12431272
Status

Phonebook.Frontend/src/i18n/messages.en.xlf

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -991,6 +991,22 @@
991991
</target>
992992
<note priority="1" from="description">Cookie notice</note>
993993
<note priority="1" from="meaning">Display-notificationDialog</note>
994+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesText" datatype="html">
995+
<source>
996+
You deactivated cookies and keep getting those dialogs?
997+
</source><target state="final">
998+
You deactivated cookies and keep getting those dialogs?
999+
</target>
1000+
<note priority="1" from="description">Annoyed by cookies notice</note>
1001+
<note priority="1" from="meaning">Display-notificationDialog</note>
1002+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesButton" datatype="html">
1003+
<source>
1004+
Deactivate startup-dialogs!
1005+
</source><target state="final">
1006+
Deactivate startup-dialogs!
1007+
</target>
1008+
<note priority="1" from="description">Deactivate Startup Dialogs</note>
1009+
<note priority="1" from="meaning">Display-notificationDialog</note>
9941010
</trans-unit><trans-unit id="PageInformationComponentSectionCookies" datatype="html">
9951011
<source>
9961012
This site uses cookies, to enhance your experience. Cookies are only used for necessary tasks, e.g. saving the
@@ -1313,6 +1329,18 @@
13131329
<target state="final">Building</target>
13141330
<note priority="1" from="description">Title of Table Column "Building"</note>
13151331
<note priority="1" from="meaning">TableComponent</note>
1332+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookies" datatype="html">
1333+
<source>Save the site URL as a favourite now in order to not get any more startup-dialogs. Please notice: You won't get any information about updates or releases with the set url parameter.</source><target state="final">Save the site URL as a favourite now in order to not get any more startup-dialogs. Please notice: You won't get any information about updates or releases with the set url parameter.</target>
1334+
<note priority="1" from="description">Message for just set no cookie url</note>
1335+
<note priority="1" from="meaning">Display advice to new url</note>
1336+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesUrl" datatype="html">
1337+
<source>Reset</source><target state="final">Reset</target>
1338+
<note priority="1" from="description">Message for following no cookie url</note>
1339+
<note priority="1" from="meaning">Restore Url</note>
1340+
</trans-unit><trans-unit id="PageInformationNoDialogs" datatype="html">
1341+
<source>Startup-Dialogs are deactivated. Please notice: You won't get any information about updates or releases.</source><target state="final">Startup-Dialogs are deactivated. Please notice: You won't get any information about updates or releases.</target>
1342+
<note priority="1" from="description">Message to inform user that no dialogs will be shown</note>
1343+
<note priority="1" from="meaning">Warning no dialogs are shown</note>
13161344
</trans-unit><trans-unit id="DataPersonStatus" datatype="html">
13171345
<source>
13181346
Status

Phonebook.Frontend/src/i18n/messages.test.xlf

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -875,6 +875,18 @@
875875
</source><target state="final">TEST</target>
876876
<note priority="1" from="description">Cookie notice</note>
877877
<note priority="1" from="meaning">Display-notificationDialog</note>
878+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesText" datatype="html">
879+
<source>
880+
You deactivated cookies and keep getting those dialogs?
881+
</source><target state="translated">TEST</target>
882+
<note priority="1" from="description">Annoyed by cookies notice</note>
883+
<note priority="1" from="meaning">Display-notificationDialog</note>
884+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesButton" datatype="html">
885+
<source>
886+
Deactivate startup-dialogs!
887+
</source><target state="translated">TEST</target>
888+
<note priority="1" from="description">Deactivate Startup Dialogs</note>
889+
<note priority="1" from="meaning">Display-notificationDialog</note>
878890
</trans-unit><trans-unit id="PageInformationComponentSectionCookies" datatype="html">
879891
<source>
880892
This site uses cookies, to enhance your experience. Cookies are only used for necessary tasks, e.g. saving the
@@ -1098,6 +1110,18 @@
10981110
<source>Building</source><target state="final">TEST</target>
10991111
<note priority="1" from="description">Title of Table Column "Building"</note>
11001112
<note priority="1" from="meaning">TableComponent</note>
1113+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookies" datatype="html">
1114+
<source>Save the site URL as a favourite now in order to not get any more startup-dialogs. Please notice: You won't get any information about updates or releases with the set url parameter.</source><target state="translated">TEST</target>
1115+
<note priority="1" from="description">Message for just set no cookie url</note>
1116+
<note priority="1" from="meaning">Display advice to new url</note>
1117+
</trans-unit><trans-unit id="PageInformationNewUrlNoCookiesUrl" datatype="html">
1118+
<source>Reset</source><target state="translated">TEST</target>
1119+
<note priority="1" from="description">Message for following no cookie url</note>
1120+
<note priority="1" from="meaning">Restore Url</note>
1121+
</trans-unit><trans-unit id="PageInformationNoDialogs" datatype="html">
1122+
<source>Startup-Dialogs are deactivated. Please notice: You won't get any information about updates or releases.</source><target state="translated">TEST</target>
1123+
<note priority="1" from="description">Message to inform user that no dialogs will be shown</note>
1124+
<note priority="1" from="meaning">Warning no dialogs are shown</note>
11011125
</trans-unit><trans-unit id="DataPersonStatus" datatype="html">
11021126
<source>
11031127
Status

0 commit comments

Comments
 (0)