handle undefined user name and avatar initials
This commit is contained in:
parent
5477ffe575
commit
00ee5ccf31
4 changed files with 49 additions and 23 deletions
|
@ -45,6 +45,15 @@
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
|
if (isEnabled(FEATURE_FLAGS.USER_GROUPS)) {
|
||||||
|
menu = menu.concat([
|
||||||
|
{
|
||||||
|
title: "User Groups",
|
||||||
|
href: "/builder/portal/manage/groups",
|
||||||
|
},
|
||||||
|
])
|
||||||
|
}
|
||||||
|
|
||||||
if (admin) {
|
if (admin) {
|
||||||
menu = menu.concat([
|
menu = menu.concat([
|
||||||
{
|
{
|
||||||
|
@ -52,10 +61,6 @@
|
||||||
href: "/builder/portal/manage/users",
|
href: "/builder/portal/manage/users",
|
||||||
heading: "Manage",
|
heading: "Manage",
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: "User Groups",
|
|
||||||
href: "/builder/portal/manage/groups",
|
|
||||||
},
|
|
||||||
|
|
||||||
{ title: "Auth", href: "/builder/portal/manage/auth" },
|
{ title: "Auth", href: "/builder/portal/manage/auth" },
|
||||||
{ title: "Email", href: "/builder/portal/manage/email" },
|
{ title: "Email", href: "/builder/portal/manage/email" },
|
||||||
|
|
|
@ -41,6 +41,11 @@
|
||||||
let allAppList = []
|
let allAppList = []
|
||||||
let user
|
let user
|
||||||
$: fetchUser(userId)
|
$: fetchUser(userId)
|
||||||
|
|
||||||
|
$: fullName = $userFetch?.data?.firstName
|
||||||
|
? $userFetch?.data?.firstName + " " + $userFetch?.data?.lastName
|
||||||
|
: ""
|
||||||
|
|
||||||
$: hasGroupsLicense = $auth.user?.license.features.includes(
|
$: hasGroupsLicense = $auth.user?.license.features.includes(
|
||||||
Constants.Features.USER_GROUPS
|
Constants.Features.USER_GROUPS
|
||||||
)
|
)
|
||||||
|
@ -127,7 +132,7 @@
|
||||||
if (detail === "developer") {
|
if (detail === "developer") {
|
||||||
toggleFlags({ admin: { global: false }, builder: { global: true } })
|
toggleFlags({ admin: { global: false }, builder: { global: true } })
|
||||||
} else if (detail === "admin") {
|
} else if (detail === "admin") {
|
||||||
toggleFlags({ admin: { global: true }, builder: { global: false } })
|
toggleFlags({ admin: { global: true }, builder: { global: true } })
|
||||||
} else if (detail === "appUser") {
|
} else if (detail === "appUser") {
|
||||||
toggleFlags({ admin: { global: false }, builder: { global: false } })
|
toggleFlags({ admin: { global: false }, builder: { global: false } })
|
||||||
}
|
}
|
||||||
|
@ -186,15 +191,25 @@
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<div>
|
<div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<Avatar size="XXL" initials="PC" />
|
<Avatar
|
||||||
|
size="XXL"
|
||||||
|
initials={user?.email
|
||||||
|
.split(" ")
|
||||||
|
.map(x => x[0])
|
||||||
|
.join("")}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{#if fullName}
|
||||||
<div class="subtitle">
|
<div class="subtitle">
|
||||||
<Heading size="S"
|
<Heading size="S">{fullName}</Heading>
|
||||||
>{$userFetch?.data?.firstName +
|
|
||||||
" " +
|
|
||||||
$userFetch?.data?.lastName}</Heading
|
|
||||||
>
|
|
||||||
<Body size="XS">{$userFetch?.data?.email}</Body>
|
<Body size="XS">{$userFetch?.data?.email}</Body>
|
||||||
</div>
|
</div>
|
||||||
|
{:else}
|
||||||
|
<div class="alignEmail">
|
||||||
|
<Heading size="S">{$userFetch?.data?.email}</Heading>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
|
@ -372,4 +387,10 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.alignEmail {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: var(--spacing-m);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -72,19 +72,12 @@
|
||||||
name: {},
|
name: {},
|
||||||
email: {},
|
email: {},
|
||||||
role: {
|
role: {
|
||||||
noPropagation: true,
|
|
||||||
sortable: false,
|
sortable: false,
|
||||||
},
|
},
|
||||||
...(hasGroupsLicense && {
|
...(hasGroupsLicense && {
|
||||||
userGroups: { sortable: false, displayName: "User groups" },
|
userGroups: { sortable: false, displayName: "User groups" },
|
||||||
}),
|
}),
|
||||||
apps: { width: "120px" },
|
apps: {},
|
||||||
settings: {
|
|
||||||
sortable: false,
|
|
||||||
width: "60px",
|
|
||||||
displayName: "",
|
|
||||||
align: "Right",
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
|
|
||||||
$: userData = []
|
$: userData = []
|
||||||
|
@ -323,6 +316,13 @@
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
.pagination {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-top: var(--spacing-xl);
|
||||||
|
}
|
||||||
|
|
||||||
.field {
|
.field {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
@ -66,7 +66,7 @@
|
||||||
selectedApp?.status === AppStatus.DEPLOYED && latestDeployments?.length > 0
|
selectedApp?.status === AppStatus.DEPLOYED && latestDeployments?.length > 0
|
||||||
|
|
||||||
$: appUrl = `${window.origin}/app${selectedApp?.url}`
|
$: appUrl = `${window.origin}/app${selectedApp?.url}`
|
||||||
$: tabs = ["Overview", "Automation History", "Backups", "Settings"]
|
$: tabs = ["Overview", "Automation History", "Backups", "Settings", "Access"]
|
||||||
$: selectedTab = "Overview"
|
$: selectedTab = "Overview"
|
||||||
|
|
||||||
const backToAppList = () => {
|
const backToAppList = () => {
|
||||||
|
|
Loading…
Reference in a new issue