From 1c5926553a7fba7a6eaf24be63181a61e6b763d7 Mon Sep 17 00:00:00 2001
From: martin <74269598+martabal@users.noreply.github.com>
Date: Tue, 25 Jul 2023 16:29:40 +0200
Subject: [PATCH] fix: dialog overflow when creating a user (#3422)

---
 web/src/lib/components/forms/create-user-form.svelte | 5 +++--
 web/src/routes/admin/user-management/+page.svelte    | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/web/src/lib/components/forms/create-user-form.svelte b/web/src/lib/components/forms/create-user-form.svelte
index 0a4078ba53..aee097a226 100644
--- a/web/src/lib/components/forms/create-user-form.svelte
+++ b/web/src/lib/components/forms/create-user-form.svelte
@@ -78,7 +78,7 @@
 </script>
 
 <div
-  class="w-[500px] max-w-[95vw] rounded-3xl border bg-immich-bg p-4 py-8 shadow-sm dark:border-immich-dark-gray dark:bg-immich-dark-gray dark:text-immich-dark-fg"
+  class="max-h-screen w-[500px] max-w-[95vw] overflow-y-scroll rounded-3xl border bg-immich-bg p-4 py-8 shadow-sm dark:border-immich-dark-gray dark:bg-immich-dark-gray dark:text-immich-dark-fg"
 >
   <div class="flex flex-col place-content-center place-items-center gap-4 px-4">
     <ImmichLogo class="text-center" height="100" width="100" />
@@ -128,7 +128,8 @@
     {#if success}
       <p class="ml-4 text-sm text-immich-primary">{success}</p>
     {/if}
-    <div class="flex w-full p-4">
+    <div class="flex w-full gap-4 p-4">
+      <Button color="gray" fullwidth on:click={() => dispatch('cancel')}>Cancel</Button>
       <Button type="submit" disabled={isCreatingUser} fullwidth>Create</Button>
     </div>
   </form>
diff --git a/web/src/routes/admin/user-management/+page.svelte b/web/src/routes/admin/user-management/+page.svelte
index aa0084187e..5dbe71aca3 100644
--- a/web/src/routes/admin/user-management/+page.svelte
+++ b/web/src/routes/admin/user-management/+page.svelte
@@ -110,7 +110,7 @@
 <section>
   {#if shouldShowCreateUserForm}
     <FullScreenModal on:clickOutside={() => (shouldShowCreateUserForm = false)}>
-      <CreateUserForm on:user-created={onUserCreated} />
+      <CreateUserForm on:user-created={onUserCreated} on:cancel={() => (shouldShowCreateUserForm = false)} />
     </FullScreenModal>
   {/if}