diff --git a/package-lock.json b/package-lock.json
index 66182949f3..d7b8114414 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,8 +9,8 @@
             "version": "0.0.1",
             "dependencies": {
                 "@aw-labs/appwrite-console": "^10.0.0",
-                "@aw-labs/icons": "0.0.0-75",
-                "@aw-labs/ui": "0.0.0-75",
+                "@aw-labs/icons": "0.0.0-76",
+                "@aw-labs/ui": "0.0.0-76",
                 "@popperjs/core": "^2.11.6",
                 "echarts": "^5.4.0",
                 "pretty-bytes": "^6.0.0",
@@ -81,14 +81,14 @@
             }
         },
         "node_modules/@aw-labs/icons": {
-            "version": "0.0.0-75",
-            "resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-75.tgz",
-            "integrity": "sha512-3ajSt88EulmGyk0P8PUGROJehx+uNyUCfRzg29rE2h/SYMNwwyNWilh7qSRXJqbpBvC9y8IjwZ0D9MbILFzbFA=="
+            "version": "0.0.0-76",
+            "resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-76.tgz",
+            "integrity": "sha512-i22WHSl3aYCKqaEt87OKUmOZ9Q/LDUeqDJ7eab4dhey1+W3dqt+nF21YR38iRVtV08+0KniiwPxagBjjSSrmlg=="
         },
         "node_modules/@aw-labs/ui": {
-            "version": "0.0.0-75",
-            "resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-75.tgz",
-            "integrity": "sha512-Kk27kWH4Mxszpfpr954gqrJMkyjZwZS/X5zU4Jg/sCCg2QMYXbxRGmPoit0qNIRGVHf72hf8eJCUU17/2IHCSQ==",
+            "version": "0.0.0-76",
+            "resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-76.tgz",
+            "integrity": "sha512-Cfik0wm2dDKnLTxWSdNkaw76HqoKD1JNjfKzkBT+Hertl2Gae0C/ykc8MjCHsO8lu6FulVQ6uqSLqfiKR1T6zQ==",
             "dependencies": {
                 "@aw-labs/icons": "*",
                 "normalize.css": "^8.0.1",
@@ -7467,14 +7467,14 @@
             }
         },
         "@aw-labs/icons": {
-            "version": "0.0.0-75",
-            "resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-75.tgz",
-            "integrity": "sha512-3ajSt88EulmGyk0P8PUGROJehx+uNyUCfRzg29rE2h/SYMNwwyNWilh7qSRXJqbpBvC9y8IjwZ0D9MbILFzbFA=="
+            "version": "0.0.0-76",
+            "resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-76.tgz",
+            "integrity": "sha512-i22WHSl3aYCKqaEt87OKUmOZ9Q/LDUeqDJ7eab4dhey1+W3dqt+nF21YR38iRVtV08+0KniiwPxagBjjSSrmlg=="
         },
         "@aw-labs/ui": {
-            "version": "0.0.0-75",
-            "resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-75.tgz",
-            "integrity": "sha512-Kk27kWH4Mxszpfpr954gqrJMkyjZwZS/X5zU4Jg/sCCg2QMYXbxRGmPoit0qNIRGVHf72hf8eJCUU17/2IHCSQ==",
+            "version": "0.0.0-76",
+            "resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-76.tgz",
+            "integrity": "sha512-Cfik0wm2dDKnLTxWSdNkaw76HqoKD1JNjfKzkBT+Hertl2Gae0C/ykc8MjCHsO8lu6FulVQ6uqSLqfiKR1T6zQ==",
             "requires": {
                 "@aw-labs/icons": "*",
                 "normalize.css": "^8.0.1",
diff --git a/package.json b/package.json
index bd563e7da7..290e163748 100644
--- a/package.json
+++ b/package.json
@@ -20,8 +20,8 @@
     },
     "dependencies": {
         "@aw-labs/appwrite-console": "^10.0.0",
-        "@aw-labs/icons": "0.0.0-75",
-        "@aw-labs/ui": "0.0.0-75",
+        "@aw-labs/icons": "0.0.0-76",
+        "@aw-labs/ui": "0.0.0-76",
         "@popperjs/core": "^2.11.6",
         "echarts": "^5.4.0",
         "pretty-bytes": "^6.0.0",
diff --git a/src/lib/components/empty.svelte b/src/lib/components/empty.svelte
index 37bf41dce4..af24746dc6 100644
--- a/src/lib/components/empty.svelte
+++ b/src/lib/components/empty.svelte
@@ -15,9 +15,9 @@
         <div class="u-flex u-flex-vertical u-cross-center u-gap-24">
             <button type="button" on:click|preventDefault>
                 {#if $app.themeInUse === 'dark'}
-                    <img src={EmptyDark} alt="create" aria-hidden="true" />
+                    <img src={EmptyDark} alt="create" aria-hidden="true" height="124" />
                 {:else}
-                    <img src={EmptyLight} alt="create" aria-hidden="true" />
+                    <img src={EmptyLight} alt="create" aria-hidden="true" height="124" />
                 {/if}
             </button>
             <slot>
diff --git a/src/lib/components/heading.svelte b/src/lib/components/heading.svelte
index 29ca3d26a8..f9f245e71d 100644
--- a/src/lib/components/heading.svelte
+++ b/src/lib/components/heading.svelte
@@ -2,8 +2,9 @@
     export let tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
     export let size: '1' | '2' | '3' | '4' | '5' | '6' | '7';
     export let trimmed = true;
+    export let id: string = null;
 </script>
 
-<svelte:element this={tag} class={`heading-level-${size}`} class:u-trim-1={trimmed}>
+<svelte:element this={tag} class={`heading-level-${size}`} class:u-trim-1={trimmed} {id}>
     <slot />
 </svelte:element>
diff --git a/src/lib/components/output.svelte b/src/lib/components/output.svelte
index 1430ef4092..e8830076c8 100644
--- a/src/lib/components/output.svelte
+++ b/src/lib/components/output.svelte
@@ -6,7 +6,7 @@
 
 <Copy {value}>
     <div class="interactive-text-output is-textarea">
-        <span class="text u-line-height-1-5 u-break-word"><slot /></span>
+        <span class="text u-line-height-1-5 u-break-all"><slot /></span>
 
         <div class="u-flex u-cross-child-start u-gap-8">
             <button class="interactive-text-output-button" aria-label="copy text">
diff --git a/src/lib/components/secret.svelte b/src/lib/components/secret.svelte
index e44499b89e..9e64c6676a 100644
--- a/src/lib/components/secret.svelte
+++ b/src/lib/components/secret.svelte
@@ -7,7 +7,7 @@
 
 <div class="interactive-text-output" class:is-textarea={show}>
     {#if show}
-        <span class="text u-line-height-1-5 u-break-word">{value}</span>
+        <span class="text u-line-height-1-5 u-break-all">{value}</span>
     {:else}
         <span class="text">••••••••••••</span>
     {/if}
diff --git a/src/lib/elements/forms/inputFile.svelte b/src/lib/elements/forms/inputFile.svelte
index 154b3759b4..3dedef76ea 100644
--- a/src/lib/elements/forms/inputFile.svelte
+++ b/src/lib/elements/forms/inputFile.svelte
@@ -4,6 +4,7 @@
     export let label: string = null;
     export let files: FileList;
     export let list = new DataTransfer();
+    export let allowedFileExtensions: string[] = [];
 
     let input: HTMLInputElement;
     let hovering = false;
@@ -28,7 +29,12 @@
     }
 </script>
 
-<input bind:files bind:this={input} type="file" style="display: none" />
+<input
+    bind:files
+    bind:this={input}
+    accept={allowedFileExtensions.map((n) => `.${n}`).join(',')}
+    type="file"
+    style="display: none" />
 
 <div>
     {#if label}
diff --git a/src/routes/console/onboarding/+page.svelte b/src/routes/console/onboarding/+page.svelte
index 4884a64ebd..c0e0bb14cd 100644
--- a/src/routes/console/onboarding/+page.svelte
+++ b/src/routes/console/onboarding/+page.svelte
@@ -15,6 +15,7 @@
     let id: string;
     let showCustomId = false;
     let loading = false;
+
     async function createProject() {
         try {
             loading = true;
@@ -28,12 +29,11 @@
             await invalidate(Dependencies.ACCOUNT);
             goto(`/console/project-${project.$id}`);
         } catch ({ message }) {
+            loading = false;
             addNotification({
                 message,
                 type: 'error'
             });
-        } finally {
-            loading = false;
         }
     }
 
diff --git a/src/routes/console/organization-[organization]/createProject.svelte b/src/routes/console/organization-[organization]/createProject.svelte
index 97afc677c0..952850c44a 100644
--- a/src/routes/console/organization-[organization]/createProject.svelte
+++ b/src/routes/console/organization-[organization]/createProject.svelte
@@ -18,7 +18,7 @@
     let error: string;
     let isCreating = false;
 
-    const create = async () => {
+    async function create() {
         try {
             isCreating = true;
             const project = await sdkForConsole.projects.create(
@@ -34,11 +34,10 @@
             });
             await goto(`/console/project-${project.$id}`);
         } catch ({ message }) {
-            error = message;
-        } finally {
             isCreating = false;
+            error = message;
         }
-    };
+    }
 </script>
 
 <Modal {error} on:submit={create} size="big" bind:show>
diff --git a/src/routes/console/project-[project]/overview/+layout.svelte b/src/routes/console/project-[project]/overview/+layout.svelte
index 90877e51ac..67acbb9936 100644
--- a/src/routes/console/project-[project]/overview/+layout.svelte
+++ b/src/routes/console/project-[project]/overview/+layout.svelte
@@ -180,7 +180,7 @@
             {/if}
 
             <section class="common-section u-margin-block-start-100">
-                <Heading tag="h2" size="5">Integrations</Heading>
+                <Heading tag="h2" size="5" id="integrations">Integrations</Heading>
                 <div class="tabs u-margin-block-start-24 u-sep-block-end">
                     <button
                         class="tabs-button-scroll is-start u-hide"
diff --git a/src/routes/console/project-[project]/settings/+page.svelte b/src/routes/console/project-[project]/settings/+page.svelte
index ac7495b862..a202fb3a3a 100644
--- a/src/routes/console/project-[project]/settings/+page.svelte
+++ b/src/routes/console/project-[project]/settings/+page.svelte
@@ -77,7 +77,9 @@
                     </FormList>
                 </svelte:fragment>
                 <svelte:fragment slot="actions">
-                    <Button secondary href={`${base}/console/project-${projectId}/overview/keys`}>
+                    <Button
+                        secondary
+                        href={`${base}/console/project-${projectId}/overview/keys#integrations`}>
                         View API Keys
                     </Button>
                 </svelte:fragment>
diff --git a/src/routes/console/project-[project]/storage/bucket-[bucket]/create.svelte b/src/routes/console/project-[project]/storage/bucket-[bucket]/create.svelte
index a4c831b82b..83bb5fe7b7 100644
--- a/src/routes/console/project-[project]/storage/bucket-[bucket]/create.svelte
+++ b/src/routes/console/project-[project]/storage/bucket-[bucket]/create.svelte
@@ -54,7 +54,7 @@
     <svelte:fragment slot="header">Create File</svelte:fragment>
     <FormList>
         <div>
-            <InputFile bind:files />
+            <InputFile bind:files allowedFileExtensions={$bucket.allowedFileExtensions} />
             <p>Max file size: {calculateSize($bucket.maximumFileSize)}</p>
         </div>
 
diff --git a/src/routes/console/project-[project]/storage/bucket-[bucket]/store.ts b/src/routes/console/project-[project]/storage/bucket-[bucket]/store.ts
index 0b1d2ab2d6..4dafbf36a0 100644
--- a/src/routes/console/project-[project]/storage/bucket-[bucket]/store.ts
+++ b/src/routes/console/project-[project]/storage/bucket-[bucket]/store.ts
@@ -1,4 +1,5 @@
 import { derived } from 'svelte/store';
 import { page } from '$app/stores';
+import type { Models } from '@aw-labs/appwrite-console';
 
-export const bucket = derived(page, ($page) => $page.data.bucket);
+export const bucket = derived(page, ($page) => $page.data.bucket as Models.Bucket);
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
index 230fe63f1e..95c257a5c9 100644
--- a/src/routes/login/+page.svelte
+++ b/src/routes/login/+page.svelte
@@ -14,10 +14,11 @@
     import { Unauthenticated } from '$lib/layout';
     import { Dependencies } from '$lib/constants';
 
-    let mail: string, pass: string;
+    let mail: string, pass: string, disabled: boolean;
 
-    const login = async () => {
+    async function login() {
         try {
+            disabled = true;
             await sdkForConsole.account.createEmailSession(mail, pass);
             await invalidate(Dependencies.ACCOUNT);
             addNotification({
@@ -26,12 +27,13 @@
             });
             await goto(`${base}/console`);
         } catch (error) {
+            disabled = false;
             addNotification({
                 type: 'error',
                 message: error.message
             });
         }
-    };
+    }
 </script>
 
 <svelte:head>
@@ -59,7 +61,7 @@
                     showPasswordButton={true}
                     bind:value={pass} />
                 <FormItem>
-                    <Button fullWidth submit>Sign in</Button>
+                    <Button fullWidth submit {disabled}>Sign in</Button>
                 </FormItem>
             </FormList>
         </Form>
diff --git a/src/routes/register/+page.svelte b/src/routes/register/+page.svelte
index f21c8af435..52c3611a21 100644
--- a/src/routes/register/+page.svelte
+++ b/src/routes/register/+page.svelte
@@ -16,22 +16,24 @@
     import FormList from '$lib/elements/forms/formList.svelte';
     import { Dependencies } from '$lib/constants';
 
-    let name: string, mail: string, pass: string;
+    let name: string, mail: string, pass: string, disabled: boolean;
     let terms = false;
 
-    const register = async () => {
+    async function register() {
         try {
+            disabled = true;
             await sdkForConsole.account.create('unique()', mail, pass, name ?? '');
             await sdkForConsole.account.createEmailSession(mail, pass);
             await invalidate(Dependencies.ACCOUNT);
             await goto(`${base}/console`);
         } catch (error) {
+            disabled = false;
             addNotification({
                 type: 'error',
                 message: error.message
             });
         }
-    };
+    }
 </script>
 
 <svelte:head>
@@ -77,7 +79,7 @@
                         rel="noopener noreferrer">General Terms of Use</a
                     >.</InputChoice>
                 <FormItem>
-                    <Button fullWidth submit>Sign up</Button>
+                    <Button fullWidth submit {disabled}>Sign up</Button>
                 </FormItem>
             </FormList>
         </Form>