handle undefined user name and avatar initials

This commit is contained in:
Peter Clement 2022-07-29 13:21:42 +01:00
parent 1d36f258cb
commit 28405c7beb
4 changed files with 49 additions and 23 deletions

View File

@ -45,6 +45,15 @@
},
])
}
if (isEnabled(FEATURE_FLAGS.USER_GROUPS)) {
menu = menu.concat([
{
title: "User Groups",
href: "/builder/portal/manage/groups",
},
])
}
if (admin) {
menu = menu.concat([
{
@ -52,10 +61,6 @@
href: "/builder/portal/manage/users",
heading: "Manage",
},
{
title: "User Groups",
href: "/builder/portal/manage/groups",
},
{ title: "Auth", href: "/builder/portal/manage/auth" },
{ title: "Email", href: "/builder/portal/manage/email" },

View File

@ -41,6 +41,11 @@
let allAppList = []
let user
$: fetchUser(userId)
$: fullName = $userFetch?.data?.firstName
? $userFetch?.data?.firstName + " " + $userFetch?.data?.lastName
: ""
$: hasGroupsLicense = $auth.user?.license.features.includes(
Constants.Features.USER_GROUPS
)
@ -127,7 +132,7 @@
if (detail === "developer") {
toggleFlags({ admin: { global: false }, builder: { global: true } })
} else if (detail === "admin") {
toggleFlags({ admin: { global: true }, builder: { global: false } })
toggleFlags({ admin: { global: true }, builder: { global: true } })
} else if (detail === "appUser") {
toggleFlags({ admin: { global: false }, builder: { global: false } })
}
@ -186,15 +191,25 @@
<div class="title">
<div>
<div style="display: flex;">
<Avatar size="XXL" initials="PC" />
<div class="subtitle">
<Heading size="S"
>{$userFetch?.data?.firstName +
" " +
$userFetch?.data?.lastName}</Heading
>
<Body size="XS">{$userFetch?.data?.email}</Body>
</div>
<Avatar
size="XXL"
initials={user?.email
.split(" ")
.map(x => x[0])
.join("")}
/>
{#if fullName}
<div class="subtitle">
<Heading size="S">{fullName}</Heading>
<Body size="XS">{$userFetch?.data?.email}</Body>
</div>
{:else}
<div class="alignEmail">
<Heading size="S">{$userFetch?.data?.email}</Heading>
</div>
{/if}
</div>
</div>
<div>
@ -372,4 +387,10 @@
display: flex;
flex-direction: column;
}
.alignEmail {
display: flex;
align-items: center;
margin-left: var(--spacing-m);
}
</style>

View File

@ -72,19 +72,12 @@
name: {},
email: {},
role: {
noPropagation: true,
sortable: false,
},
...(hasGroupsLicense && {
userGroups: { sortable: false, displayName: "User groups" },
}),
apps: { width: "120px" },
settings: {
sortable: false,
width: "60px",
displayName: "",
align: "Right",
},
apps: {},
}
$: userData = []
@ -323,6 +316,13 @@
</Modal>
<style>
.pagination {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: var(--spacing-xl);
}
.field {
display: flex;
align-items: center;

View File

@ -66,7 +66,7 @@
selectedApp?.status === AppStatus.DEPLOYED && latestDeployments?.length > 0
$: appUrl = `${window.origin}/app${selectedApp?.url}`
$: tabs = ["Overview", "Automation History", "Backups", "Settings"]
$: tabs = ["Overview", "Automation History", "Backups", "Settings", "Access"]
$: selectedTab = "Overview"
const backToAppList = () => {