payload-zitadel-plugin 0.2.18 → 0.2.19

package/README.md

@@ -12,7 +12,7 @@ Thus the user collection in PayloadCMS becomes just a shadow of the information
 ## Install
 
 ```shell
-pnpm add payload-zitadel-plugin@0.2.18
+pnpm add payload-zitadel-plugin@0.2.19
 ```
 
 ## Configuration

package/dist/components/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/components/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,eAAO,MAAM,MAAM,eAAc;IAAE,MAAM,EAAE,OAAO,CAAA;CAAE,sBAqCnD,CAAA"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/components/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,eAAO,MAAM,MAAM,eAAc;IAAE,MAAM,EAAE,OAAO,CAAA;CAAE,sBAkBnD,CAAA"}

package/dist/components/Avatar.js

@@ -3,36 +3,21 @@ import * as React from 'react';
 import { DefaultAccountIcon } from '@payloadcms/ui/graphics/Account/Default';
 import { usePayloadAPI } from '@payloadcms/ui';
 export const Avatar = ({ active })=>{
-    const { data, isLoading } = usePayloadAPI('/api/users/me')[0];
+    const { data } = usePayloadAPI('/api/users/me')[0];
     const { user } = data;
-    return !isLoading && user?.image ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("style", null, `
-                        .avatar {
-                            position: relative;
-                            height: 2rem;
-                            width: 2rem;
-                        }
-                        
-                        .avatar:hover {
-                            filter: brightness(1.2);
-                        }
-                        
-                        .avatar.active {
-                            filter: brightness(.8);
-                        }
-                        
-                        .avatar img {
-                            border-radius: 100%;
-                        }
-                    `), /*#__PURE__*/ React.createElement("div", {
-        className: [
-            'avatar',
-            active ? 'active' : ''
-        ].join(' ').trim()
-    }, /*#__PURE__*/ React.createElement("img", {
+    return user?.image ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("style", null, 'zitadel-avatar:hover { filter: brightness(1.2); }'), /*#__PURE__*/ React.createElement("img", {
+        className: "zitadel-avatar",
         src: user.image,
+        height: 25,
+        width: 25,
         alt: "Profile Picture",
-        sizes: "2rem 2rem"
-    }))) : /*#__PURE__*/ React.createElement(DefaultAccountIcon, {
+        style: {
+            borderRadius: '100%',
+            ...active ? {
+                filter: 'brightness(.8)'
+            } : {}
+        }
+    })) : /*#__PURE__*/ React.createElement(DefaultAccountIcon, {
         active: active
     });
 };

package/dist/components/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/Avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport {DefaultAccountIcon} from '@payloadcms/ui/graphics/Account/Default'\nimport {usePayloadAPI} from '@payloadcms/ui'\nimport {ZitadelUser} from '../types.js'\n\nexport const Avatar = ({active}: { active: boolean }) => {\n\n    const {data, isLoading} = usePayloadAPI('/api/users/me')[0]\n\n    const {user} = data as { user: ZitadelUser }\n\n    return (\n        !isLoading && user?.image ?\n            <>\n                <style>\n                    {`\n                        .avatar {\n                            position: relative;\n                            height: 2rem;\n                            width: 2rem;\n                        }\n                        \n                        .avatar:hover {\n                            filter: brightness(1.2);\n                        }\n                        \n                        .avatar.active {\n                            filter: brightness(.8);\n                        }\n                        \n                        .avatar img {\n                            border-radius: 100%;\n                        }\n                    `}\n                </style>\n                <div className={['avatar', active ? 'active' : ''].join(' ').trim()}>\n                    <img src={user.image} alt=\"Profile Picture\" sizes=\"2rem 2rem\"/>\n                </div>\n            </> :\n            <DefaultAccountIcon active={active}/>\n    )\n\n}\n"],"names":["React","DefaultAccountIcon","usePayloadAPI","Avatar","active","data","isLoading","user","image","style","div","className","join","trim","img","src","alt","sizes"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAO;AAC9B,SAAQC,kBAAkB,QAAO,0CAAyC;AAC1E,SAAQC,aAAa,QAAO,iBAAgB;AAG5C,OAAO,MAAMC,SAAS,CAAC,EAACC,MAAM,EAAsB;IAEhD,MAAM,EAACC,IAAI,EAAEC,SAAS,EAAC,GAAGJ,cAAc,gBAAgB,CAAC,EAAE;IAE3D,MAAM,EAACK,IAAI,EAAC,GAAGF;IAEf,OACI,CAACC,aAAaC,MAAMC,sBAChB,wDACI,oBAACC,eACI,CAAC;;;;;;;;;;;;;;;;;;oBAkBF,CAAC,iBAEL,oBAACC;QAAIC,WAAW;YAAC;YAAUP,SAAS,WAAW;SAAG,CAACQ,IAAI,CAAC,KAAKC,IAAI;qBAC7D,oBAACC;QAAIC,KAAKR,KAAKC,KAAK;QAAEQ,KAAI;QAAkBC,OAAM;yBAG1D,oBAAChB;QAAmBG,QAAQA;;AAGxC,EAAC"}
+{"version":3,"sources":["../../src/components/Avatar.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport {DefaultAccountIcon} from '@payloadcms/ui/graphics/Account/Default'\nimport {usePayloadAPI} from '@payloadcms/ui'\nimport {ZitadelUser} from '../types.js'\n\nexport const Avatar = ({active}: { active: boolean }) => {\n\n    const {data} = usePayloadAPI('/api/users/me')[0]\n\n    const {user} = data as { user: ZitadelUser }\n\n    return (\n        user?.image ?\n            <>\n                <style>{'zitadel-avatar:hover { filter: brightness(1.2); }'}</style>\n                <img className=\"zitadel-avatar\" src={user.image} height={25} width={25} alt=\"Profile Picture\" style={{\n                    borderRadius: '100%',\n                    ...(active ? {filter: 'brightness(.8)'} : {})\n                }}/>\n            </> :\n            <DefaultAccountIcon active={active}/>\n    )\n\n}\n"],"names":["React","DefaultAccountIcon","usePayloadAPI","Avatar","active","data","user","image","style","img","className","src","height","width","alt","borderRadius","filter"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAO;AAC9B,SAAQC,kBAAkB,QAAO,0CAAyC;AAC1E,SAAQC,aAAa,QAAO,iBAAgB;AAG5C,OAAO,MAAMC,SAAS,CAAC,EAACC,MAAM,EAAsB;IAEhD,MAAM,EAACC,IAAI,EAAC,GAAGH,cAAc,gBAAgB,CAAC,EAAE;IAEhD,MAAM,EAACI,IAAI,EAAC,GAAGD;IAEf,OACIC,MAAMC,sBACF,wDACI,oBAACC,eAAO,oEACR,oBAACC;QAAIC,WAAU;QAAiBC,KAAKL,KAAKC,KAAK;QAAEK,QAAQ;QAAIC,OAAO;QAAIC,KAAI;QAAkBN,OAAO;YACjGO,cAAc;YACd,GAAIX,SAAS;gBAACY,QAAQ;YAAgB,IAAI,CAAC,CAAC;QAChD;wBAEJ,oBAACf;QAAmBG,QAAQA;;AAGxC,EAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payload-zitadel-plugin",
-  "version": "0.2.18",
+  "version": "0.2.19",
   "description": "plugin for Payload CMS, which enables authentication via Zitadel IdP",
   "type": "module",
   "license": "MIT",