Picture URL fixed for google Login

src/Squidex/Config/Identity/GoogleHandler.cs

@@ -36,6 +36,16 @@ namespace Squidex.Config.Identity
 
             var pictureUrl = context.User?.Value<string>("picture");
 
+            if (string.IsNullOrWhiteSpace(pictureUrl))
+            {
+                pictureUrl = context.User?["image"]?.Value<string>("url");
+
+                if (pictureUrl != null && pictureUrl.EndsWith("?sz=50"))
+                {
+                    pictureUrl = pictureUrl.Substring(0, pictureUrl.Length - 6);
+                }
+            }
+
             if (!string.IsNullOrWhiteSpace(pictureUrl))
             {
                 context.Identity.AddClaim(new Claim(SquidexClaimTypes.SquidexPictureUrl, pictureUrl));

src/Squidex/app/shared/components/pipes.ts

@@ -139,6 +139,21 @@ export class UserDtoPicture implements PipeTransform {
     }
 }
 
+@Pipe({
+    name: 'userIdPicture',
+    pure: false
+})
+export class UserIdPicturePipe implements PipeTransform {
+    constructor(
+        private readonly apiUrl: ApiUrlConfig
+    ) {
+    }
+
+    public transform(userId: string): string | null {
+        return this.apiUrl.buildUrl(`api/users/${userId}/picture`);
+    }
+}
+
 @Pipe({
     name: 'userPicture',
     pure: false

src/Squidex/app/shared/module.ts

@@ -46,6 +46,7 @@ import {
     UserEmailRefPipe,
     UserNamePipe,
     UserNameRefPipe,
+    UserIdPicturePipe,
     UserPicturePipe,
     UserPictureRefPipe,
     UserManagementService,
@@ -70,6 +71,7 @@ import {
         UserDtoPicture,
         UserEmailPipe,
         UserEmailRefPipe,
+        UserIdPicturePipe,
         UserNamePipe,
         UserNameRefPipe,
         UserPicturePipe,
@@ -85,6 +87,7 @@ import {
         UserDtoPicture,
         UserEmailPipe,
         UserEmailRefPipe,
+        UserIdPicturePipe,
         UserNamePipe,
         UserNameRefPipe,
         UserPicturePipe,

src/Squidex/app/shell/pages/internal/profile-menu.component.html

@@ -2,7 +2,7 @@
     <li class="nav-item dropdown">
         <span class="nav-link dropdown-toggle" (click)="modalMenu.toggle()">
             <span class="user">
-                <img class="user-picture" [attr.src]="profilePictureUrl" />
+                <img class="user-picture" [attr.src]="profileId | userIdPicture" />
             </span>
         </span>
 

src/Squidex/app/shell/pages/internal/profile-menu.component.ts

@@ -29,7 +29,7 @@ export class ProfileMenuComponent implements OnInit, OnDestroy {
     public modalMenu = new ModalView(false, true);
 
     public profileDisplayName = '';
-    public profilePictureUrl = '';
+    public profileId = '';
 
     public isAdmin = false;
 
@@ -52,7 +52,7 @@ export class ProfileMenuComponent implements OnInit, OnDestroy {
                     const user = this.auth.user;
 
                     if (user) {
-                        this.profilePictureUrl = user.pictureUrl;
+                        this.profileId = user.id;
                         this.profileDisplayName = user.displayName;
 
                         this.isAdmin = user.isAdmin;