fix: update loading state variable for input fields in invite page

This commit is contained in:
Rotimi Best
2025-09-10 21:12:50 +01:00
parent 01e9aa9700
commit a078971064
2 changed files with 37 additions and 25 deletions
@@ -9,6 +9,8 @@
currentOrgPath
} from '$lib/utils/store/org';
import { ChevronDown, Settings } from 'carbon-icons-svelte';
import Avatar from '$lib/components/Avatar/index.svelte';
import TextChip from '$lib/components/Chip/Text.svelte';
import Logout from 'carbon-icons-svelte/lib/Logout.svelte';
import Rocket from 'carbon-icons-svelte/lib/Rocket.svelte';
import NewTab from 'carbon-icons-svelte/lib/NewTab.svelte';
@@ -44,19 +46,19 @@
}
</script>
<div class="md:px-4 md:py-4 py-2 px-2 rounded-md cursor-pointer">
<div class="border-b py-3 space-y-4">
<div class="cursor-pointer rounded-md px-2 py-2 md:px-4 md:py-4">
<div class="space-y-4 border-b py-3">
<p class="text-xs font-semibold text-gray-500">{$t('profileMenu.profile')}</p>
<a
href={`${!$globalStore.isOrgSite ? $currentOrgPath : '/lms'}/settings`}
class="flex items-center justify-between hover:no-underline"
on:click={closeMenu}
>
<span class="flex items-center gap-2 max-w-[70%]">
<span class="flex max-w-[70%] items-center gap-2">
<img src={$profile.avatar_url} alt="profile" class="h-8 w-8 rounded-full" />
<div>
<p class="text-sm font-semibold w-[80%] truncate">{$profile.fullname}</p>
<p class="text-xs w-[80%] truncate">{$profile.email}</p>
<p class="w-[80%] truncate text-sm font-semibold">{$profile.fullname}</p>
<p class="w-[80%] truncate text-xs">{$profile.email}</p>
</div>
</span>
<div>
@@ -65,22 +67,32 @@
</a>
</div>
{#if !$globalStore.isOrgSite}
<div class="border-b py-3 space-y-4">
<div class="space-y-4 border-b py-3">
<p class="text-xs font-semibold text-gray-500">{$t('profileMenu.current_org')}</p>
<a
href={`${$currentOrgPath}/settings?tab=org`}
class="flex items-center justify-between hover:no-underline"
on:click={closeMenu}
>
<span class="flex items-center gap-2 max-w-[70%]">
<div
class="flex items-center justify-center h-8 w-8 p-4 bg-blue-900 text-white font-semibold rounded-lg"
>
{$currentOrg.shortName}
</div>
<span class="flex max-w-[70%] items-center gap-2">
{#if $currentOrg.avatar_url && $currentOrg.name}
<Avatar
src={$currentOrg.avatar_url}
name={$currentOrg.name}
shape="rounded-md"
width="w-7"
height="h-7"
/>
{:else if $currentOrg.shortName}
<TextChip
size="sm"
value={$currentOrg.shortName}
className="bg-primary-200 dark:text-black font-medium"
/>
{/if}
<div>
<p class="text-sm font-semibold w-[80%] truncate">{$currentOrg.name}</p>
<p class="text-xs w-[80%] truncate">
<p class="w-[80%] truncate text-sm font-semibold">{$currentOrg.name}</p>
<p class="w-[80%] truncate text-xs">
{$currentOrgDomain}
</p>
</div>
@@ -92,7 +104,7 @@
</div>
{/if}
<div class="border-b py-3 space-y-4">
<div class="space-y-4 border-b py-3">
<p class="text-xs font-semibold text-gray-500">{$t('profileMenu.free_tools')}</p>
<a
href="https://classroomio.com/tools/progress"
@@ -125,21 +137,21 @@
href="https://classroomio.com/tools"
on:click={closeMenu}
target="_blank"
class="flex ml-auto w-fit items-center justify-end"
class="ml-auto flex w-fit items-center justify-end"
>
<div class="text-blue-900 font-semibold text-xs flex items-center gap-1">
<div class="flex items-center gap-1 text-xs font-semibold text-blue-900">
{$t('profileMenu.see_more')}
<ChevronDown class="text-blue-900" />
</div>
</a>
</div>
{#if !$globalStore.isOrgSite}
<div class="border-b py-3 space-y-4">
<div class="space-y-4 border-b py-3">
<a
href="https://classroomio.com/roadmap"
target="_blank"
on:click={closeMenu}
class="hover:no-underline flex items-center gap-2"
class="flex items-center gap-2 hover:no-underline"
>
<NewTab />
<p class="text-sm font-semibold">{$t('profileMenu.whats_new')}</p>
@@ -148,7 +160,7 @@
href="https://classroomio.com/blog/launch-week"
target="_blank"
on:click={closeMenu}
class="hover:no-underline flex items-center gap-2"
class="flex items-center gap-2 hover:no-underline"
>
<Rocket />
<p class="text-sm font-semibold">{$t('profileMenu.launch_week')}</p>
@@ -156,7 +168,7 @@
</div>
{/if}
<button on:click={logout} class="w-full pt-3 space-y-4">
<button on:click={logout} class="w-full space-y-4 pt-3">
<span class="flex items-center gap-2">
<Logout />
<p class="text-sm font-semibold">{$t('settings.profile.logout')}</p>
@@ -57,7 +57,7 @@
formRef?.reset();
return goto($currentOrgPath);
window.location.href = $currentOrgPath;
}
async function signUserIn(profileId: string, email: string) {
@@ -222,7 +222,7 @@
placeholder="e.g Joke Silva"
className="mb-6"
inputClassName="w-full"
isDisabled={loading}
isDisabled={isLoading}
errorMessage={errors.name}
isRequired
/>
@@ -234,7 +234,7 @@
placeholder="************"
className="mb-6"
inputClassName="w-full"
isDisabled={loading}
isDisabled={isLoading}
errorMessage={errors.password}
helperMessage={$t('login.fields.password_helper_message')}
isRequired
@@ -247,7 +247,7 @@
placeholder="************"
className="mb-6"
inputClassName="w-full"
isDisabled={loading}
isDisabled={isLoading}
errorMessage={errors.confirmPassword}
isRequired
/>