1
0
Fork 0
mirror of synced 2024-10-01 17:47:46 +13:00

fix invite user flow

This commit is contained in:
Peter Clement 2023-08-30 16:43:24 +01:00
parent 86c35a2266
commit 7c8914207b
3 changed files with 52 additions and 36 deletions

View file

@ -39,7 +39,6 @@
// Initially filter entities without app access // Initially filter entities without app access
// Show all when false // Show all when false
let filterByAppAccess = false let filterByAppAccess = false
let email let email
let error let error
let form let form
@ -55,7 +54,7 @@
let userLimitReachedModal let userLimitReachedModal
let inviteFailureResponse = "" let inviteFailureResponse = ""
$: queryIsEmail = emailValidator(query) === true $: validEmail = emailValidator(email) === true
$: prodAppId = apps.getProdAppID($store.appId) $: prodAppId = apps.getProdAppID($store.appId)
$: promptInvite = showInvite( $: promptInvite = showInvite(
filteredInvites, filteredInvites,
@ -152,16 +151,13 @@
} }
const sortInviteRoles = (a, b) => { const sortInviteRoles = (a, b) => {
const aIsEmpty = !a.info.apps || Object.keys(a.info.apps).length === 0 const aEmpty =
const bIsEmpty = !b.info.apps || Object.keys(b.info.apps).length === 0 !a.info?.appBuilders?.length && Object.keys(a.info.apps).length === 0
const bEmpty =
!b.info?.appBuilders?.length && Object.keys(b.info.apps).length === 0
return aIsEmpty if (aEmpty && !bEmpty) return 1
? bIsEmpty if (!aEmpty && bEmpty) return -1
? 0
: 1 // Put items with empty "apps" at the bottom
: bIsEmpty
? -1
: 0 // Put items with non-empty "apps" above the empty ones
} }
const sortRoles = (a, b) => { const sortRoles = (a, b) => {
@ -361,11 +357,11 @@
} }
async function inviteUser() { async function inviteUser() {
if (!queryIsEmail) { if (!validEmail) {
notifications.error("Email is not valid") notifications.error("Email is not valid")
return return
} }
const newUserEmail = query + "" const newUserEmail = email + ""
inviting = true inviting = true
const payload = [ const payload = [
@ -377,7 +373,7 @@
] ]
if (creationAccessType === Constants.Roles.CREATOR) { if (creationAccessType === Constants.Roles.CREATOR) {
payload[0].appBuilder = prodAppId payload[0].appBuilders = [prodAppId]
} else { } else {
payload[0].apps = { payload[0].apps = {
[prodAppId]: creationAccessType, [prodAppId]: creationAccessType,
@ -395,20 +391,22 @@
} }
const openInviteFlow = () => { const openInviteFlow = () => {
invitingFlow = true $licensing.userLimitReached
? userLimitReachedModal.show()
: (invitingFlow = true)
} }
const onInviteUser = async () => { const onInviteUser = async () => {
form.validate() form.validate()
userOnboardResponse = await inviteUser() userOnboardResponse = await inviteUser()
const originalQuery = query + "" const originalQuery = email + ""
query = null email = null
const newUser = userOnboardResponse?.successful.find( const newUser = userOnboardResponse?.successful.find(
user => user.email === originalQuery user => user.email === originalQuery
) )
if (newUser) { if (newUser) {
query = originalQuery email = originalQuery
notifications.success( notifications.success(
userOnboardResponse.created userOnboardResponse.created
? "User created successfully" ? "User created successfully"
@ -427,16 +425,26 @@
} }
userOnboardResponse = null userOnboardResponse = null
invitingFlow = false invitingFlow = false
// trigger reload of the users
query = ""
} }
const onUpdateUserInvite = async (invite, role) => { const onUpdateUserInvite = async (invite, role) => {
await users.updateInvite({ let updateBody = {
code: invite.code, code: invite.code,
apps: { apps: {
...invite.apps, ...invite.apps,
[prodAppId]: role, [prodAppId]: role,
}, },
}) }
if (role === Constants.Roles.CREATOR) {
updateBody.appBuilders = [...(updateBody.appBuilders ?? []), prodAppId]
delete updateBody?.apps?.[prodAppId]
} else if (role !== Constants.Roles.CREATOR && invite?.appBuilders) {
invite.appBuilders = []
}
await users.updateInvite(updateBody)
await filterInvites(query) await filterInvites(query)
} }
@ -482,7 +490,7 @@
$: initSidePanel($store.builderSidePanel) $: initSidePanel($store.builderSidePanel)
function handleKeyDown(evt) { function handleKeyDown(evt) {
if (evt.key === "Enter" && queryIsEmail && !inviting) { if (evt.key === "Enter" && validEmail && !inviting) {
onInviteUser() onInviteUser()
} }
} }
@ -524,9 +532,7 @@
<Heading size="S">{invitingFlow ? "Invite new user" : "Users"}</Heading> <Heading size="S">{invitingFlow ? "Invite new user" : "Users"}</Heading>
</div> </div>
<div class="header"> <div class="header">
<Button on:click={() => (invitingFlow = true)} size="S" cta <Button on:click={openInviteFlow} size="S" cta>Invite user</Button>
>Invite user</Button
>
<Icon <Icon
color="var(--spectrum-global-color-gray-600)" color="var(--spectrum-global-color-gray-600)"
name="RailRightClose" name="RailRightClose"
@ -579,9 +585,7 @@
<div class="invite-directions"> <div class="invite-directions">
Try searching a different email or <span Try searching a different email or <span
class="underlined" class="underlined"
on:click={$licensing.userLimitReached on:click={openInviteFlow}>invite a new user</span
? userLimitReachedModal.show
: openInviteFlow}>invite a new user</span
> >
</div> </div>
</div> </div>
@ -606,7 +610,9 @@
<div class="auth-entity-access"> <div class="auth-entity-access">
<RoleSelect <RoleSelect
placeholder={false} placeholder={false}
value={invite.info.apps?.[prodAppId]} value={invite.info?.appBuilders?.includes(prodAppId)
? Constants.Roles.CREATOR
: invite.info.apps?.[prodAppId]}
allowRemove={invite.info.apps?.[prodAppId]} allowRemove={invite.info.apps?.[prodAppId]}
allowPublic={false} allowPublic={false}
allowCreator={true} allowCreator={true}
@ -756,10 +762,9 @@
<FancyInput <FancyInput
disabled={false} disabled={false}
label="Email" label="Email"
value={query} value={email}
on:change={e => { on:change={e => {
email = e.detail email = e.detail
query = e.detail
}} }}
validate={() => { validate={() => {
if (!email) { if (!email) {

View file

@ -156,14 +156,14 @@ export const buildUserEndpoints = API => ({
return await API.post({ return await API.post({
url: "/api/global/users/onboard", url: "/api/global/users/onboard",
body: payload.map(invite => { body: payload.map(invite => {
const { email, admin, builder, apps, appBuilder } = invite const { email, admin, builder, apps, appBuilders } = invite
return { return {
email, email,
userInfo: { userInfo: {
admin: admin ? { global: true } : undefined, admin: admin ? { global: true } : undefined,
builder: builder ? { global: true } : undefined, builder: builder ? { global: true } : undefined,
apps: apps ? apps : undefined, apps: apps ? apps : undefined,
appBuilder: appBuilder ? appBuilder : undefined, appBuilders: appBuilders ? appBuilders : undefined,
}, },
} }
}), }),
@ -176,10 +176,12 @@ export const buildUserEndpoints = API => ({
* @param invite the invite code sent in the email * @param invite the invite code sent in the email
*/ */
updateUserInvite: async invite => { updateUserInvite: async invite => {
console.log(invite)
await API.post({ await API.post({
url: `/api/global/users/invite/update/${invite.code}`, url: `/api/global/users/invite/update/${invite.code}`,
body: { body: {
apps: invite.apps, apps: invite.apps,
appBuilders: invite.appBuilders ? invite.appBuilders : undefined,
}, },
}) })
}, },

View file

@ -267,8 +267,8 @@ export const onboardUsers = async (ctx: Ctx<InviteUsersRequest>) => {
// Temp password to be passed to the user. // Temp password to be passed to the user.
createdPasswords[invite.email] = password createdPasswords[invite.email] = password
let builder: { global: boolean; apps?: string[] } = { global: false } let builder: { global: boolean; apps?: string[] } = { global: false }
if (invite.userInfo.appBuilder) { if (invite.userInfo.appBuilders) {
builder.apps = [invite.userInfo.appBuilder] builder.apps = invite.userInfo.appBuilders
} }
return { return {
email: invite.email, email: invite.email,
@ -371,6 +371,15 @@ export const updateInvite = async (ctx: any) => {
...invite, ...invite,
} }
if (!updateBody?.appBuilders || !updateBody.appBuilders?.length) {
updated.info.appBuilders = []
} else {
updated.info.appBuilders = [
...(invite.info.appBuilders ?? []),
...updateBody.appBuilders,
]
}
if (!updateBody?.apps || !Object.keys(updateBody?.apps).length) { if (!updateBody?.apps || !Object.keys(updateBody?.apps).length) {
updated.info.apps = [] updated.info.apps = []
} else { } else {
@ -405,8 +414,8 @@ export const inviteAccept = async (
} }
let builder: { global: boolean; apps?: string[] } = { global: false } let builder: { global: boolean; apps?: string[] } = { global: false }
if (info.appBuilder) { if (info.appBuilders) {
builder.apps = [info.appBuilder] builder.apps = info.appBuilders
request.builder = builder request.builder = builder
} }
delete info.apps delete info.apps