From 04944c51642f8428cfb452dd6276d8ae4c16de10 Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@sdg.moe>
Date: Mon, 16 Mar 2020 02:23:22 +0100
Subject: [PATCH] Adding a more icon when the user does not have a profile
 picture

---
 src/app/app.component.html       | 4 ++--
 src/app/app.component.ts         | 3 ++-
 src/app/app.module.ts            | 2 +-
 src/app/services/auth.service.ts | 1 +
 static/more.svg                  | 1 +
 5 files changed, 7 insertions(+), 4 deletions(-)
 create mode 100644 static/more.svg

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 08b28072..e5de678f 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -25,8 +25,8 @@
 					</a>
 				</li>
 				<ng-template #accountDrop>
-					<li class="nav-item icon" style="opacity: 1 !important;">
-						<img matRipple [src]="authManager.user.picture" [matMenuTriggerFor]="accountMenu" class="profilePicture" matTooltipPosition="below" [matTooltip]="authManager.user.name" />
+					<li #accountParent class="nav-item icon" style="opacity: 1 !important;">
+						<img matRipple [src]="authManager.user.picture" [matMenuTriggerFor]="accountMenu" class="profilePicture" matTooltipPosition="below" [matTooltip]="authManager.user.name" fallback="more.svg" (error)="accountParent.style.removeProperty('opacity');" />
 					</li>
 					<mat-menu #accountMenu="matMenu">
 						<button class="dropButton" mat-menu-item (click)="this.openAccountDialog()">Settings</button>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index d64c1904..4f79e186 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -84,7 +84,8 @@ export class AppComponent
 		const dialog = this.dialog.open(AccountComponent, {width: "500px", data: this.account});
 		dialog.afterClosed().subscribe((result: Account) => 
 		{
-			this.account = result;
+			if (result)
+				this.account = result;
 		});
 	}
 }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 614507ab..1d839565 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -93,7 +93,7 @@ export function loadConfig(oidcConfigService: OidcConfigService)
 		AuthModule.forRoot()
 	],
 	entryComponents: [
-		AccountComponent	
+		AccountComponent
 	],
 	providers: [
 		OidcConfigService,
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index 465cfc61..d75e2aa5 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -56,6 +56,7 @@ export class AuthService
 	{
 		if (!this.isAuthenticated)
 			return null;
+		console.log("Running get account");
 		console.log(this.user);
 		return {email: this.user.email, username: this.user.username, picture: this.user.picture};
 	}
diff --git a/static/more.svg b/static/more.svg
new file mode 100644
index 00000000..65a683fa
--- /dev/null
+++ b/static/more.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" fill="#ffffff"/></svg>
\ No newline at end of file