diff --git a/src/lib/stores/oauth-providers.ts b/src/lib/stores/oauth-providers.ts
index c5752e8ac..09c5bf539 100644
--- a/src/lib/stores/oauth-providers.ts
+++ b/src/lib/stores/oauth-providers.ts
@@ -1,15 +1,15 @@
 import type { Models } from '@appwrite.io/console';
 import type { SvelteComponent } from 'svelte';
 import { writable } from 'svelte/store';
-import Apple from '../../routes/console/project-[project]/auth/appleOAuth.svelte';
-import Auth0 from '../../routes/console/project-[project]/auth/auth0OAuth.svelte';
-import Authentik from '../../routes/console/project-[project]/auth/authentikOAuth.svelte';
-import GitLab from '../../routes/console/project-[project]/auth/gitlabOAuth.svelte';
-import Google from '../../routes/console/project-[project]/auth/googleOAuth.svelte';
-import Main from '../../routes/console/project-[project]/auth/mainOAuth.svelte';
-import Microsoft from '../../routes/console/project-[project]/auth/microsoftOAuth.svelte';
-import Oidc from '../../routes/console/project-[project]/auth/oidcOAuth.svelte';
-import Okta from '../../routes/console/project-[project]/auth/oktaOAuth.svelte';
+import Apple from '../../routes/console/project-[project]/auth/(providers)/appleOAuth.svelte';
+import Auth0 from '../../routes/console/project-[project]/auth/(providers)/auth0OAuth.svelte';
+import Authentik from '../../routes/console/project-[project]/auth/(providers)/authentikOAuth.svelte';
+import GitLab from '../../routes/console/project-[project]/auth/(providers)/gitlabOAuth.svelte';
+import Google from '../../routes/console/project-[project]/auth/(providers)/googleOAuth.svelte';
+import Main from '../../routes/console/project-[project]/auth/(providers)/mainOAuth.svelte';
+import Microsoft from '../../routes/console/project-[project]/auth/(providers)/microsoftOAuth.svelte';
+import Oidc from '../../routes/console/project-[project]/auth/(providers)/oidcOAuth.svelte';
+import Okta from '../../routes/console/project-[project]/auth/(providers)/oktaOAuth.svelte';
 
 export type Provider = Models.Provider & {
     key: string;
diff --git a/src/routes/console/project-[project]/auth/appleOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/appleOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/appleOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/appleOAuth.svelte
index c14b2e5f7..982422b3f 100644
--- a/src/routes/console/project-[project]/auth/appleOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/appleOAuth.svelte
@@ -5,11 +5,12 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     const projectId = $page.params.project;
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -37,7 +38,7 @@
     $: secret = keyID && teamID && p8 ? JSON.stringify({ keyID, teamID, p8 }) : provider.secret;
 </script>
 
-<Modal {error} onSubmit={update} size="big" show on:close>
+<Modal {error} onSubmit={update} size="big" bind:show on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/auth0OAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/auth0OAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/auth0OAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/auth0OAuth.svelte
index 51a25c834..0607180a5 100644
--- a/src/routes/console/project-[project]/auth/auth0OAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/auth0OAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -38,7 +39,7 @@
             : provider.secret;
 </script>
 
-<Modal {error} size="big" show onSubmit={update} on:close>
+<Modal {error} size="big" bind:show onSubmit={update} on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/authentikOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/authentikOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/authentikOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/authentikOAuth.svelte
index 7df8877a5..f7d6dcd37 100644
--- a/src/routes/console/project-[project]/auth/authentikOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/authentikOAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -38,7 +39,7 @@
             : provider.secret;
 </script>
 
-<Modal {error} size="big" show onSubmit={update} on:close>
+<Modal {error} size="big" bind:show onSubmit={update} on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/gitlabOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/gitlabOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/gitlabOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/gitlabOAuth.svelte
index e93d4ae8f..95f80675e 100644
--- a/src/routes/console/project-[project]/auth/gitlabOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/gitlabOAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -36,7 +37,7 @@
         clientSecret && endpoint ? JSON.stringify({ clientSecret, endpoint }) : provider.secret;
 </script>
 
-<Modal {error} size="big" show onSubmit={update} on:close>
+<Modal {error} size="big" bind:show onSubmit={update} on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/googleOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/googleOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/googleOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/googleOAuth.svelte
index c06c99b6f..defd59038 100644
--- a/src/routes/console/project-[project]/auth/googleOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/googleOAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     const projectId = $page.params.project;
 
@@ -34,7 +35,7 @@
     };
 </script>
 
-<Modal {error} size="big" show onSubmit={update} on:close>
+<Modal {error} size="big" bind:show onSubmit={update} on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/mainOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/mainOAuth.svelte
similarity index 94%
rename from src/routes/console/project-[project]/auth/mainOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/mainOAuth.svelte
index f8c11649e..184fcd00c 100644
--- a/src/routes/console/project-[project]/auth/mainOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/mainOAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     const projectId = $page.params.project;
 
@@ -34,7 +35,7 @@
     };
 </script>
 
-<Modal {error} size="big" show onSubmit={update} on:close>
+<Modal {error} size="big" bind:show onSubmit={update} on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/microsoftOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/microsoftOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/microsoftOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/microsoftOAuth.svelte
index 266713e8e..7fd451af5 100644
--- a/src/routes/console/project-[project]/auth/microsoftOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/microsoftOAuth.svelte
@@ -5,9 +5,10 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -37,7 +38,7 @@
         clientSecret && tenantID ? JSON.stringify({ clientSecret, tenantID }) : provider.secret;
 </script>
 
-<Modal {error} onSubmit={update} size="big" show on:close>
+<Modal {error} onSubmit={update} size="big" bind:show on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/oidcOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/oidcOAuth.svelte
similarity index 96%
rename from src/routes/console/project-[project]/auth/oidcOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/oidcOAuth.svelte
index 719759e14..f00f07e30 100644
--- a/src/routes/console/project-[project]/auth/oidcOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/oidcOAuth.svelte
@@ -5,11 +5,12 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     const projectId = $page.params.project;
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -60,7 +61,7 @@
         : provider.secret;
 </script>
 
-<Modal {error} onSubmit={update} size="big" show on:close>
+<Modal {error} onSubmit={update} size="big" bind:show on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/oktaOAuth.svelte b/src/routes/console/project-[project]/auth/(providers)/oktaOAuth.svelte
similarity index 95%
rename from src/routes/console/project-[project]/auth/oktaOAuth.svelte
rename to src/routes/console/project-[project]/auth/(providers)/oktaOAuth.svelte
index b9e640f8d..6e23ca60c 100644
--- a/src/routes/console/project-[project]/auth/oktaOAuth.svelte
+++ b/src/routes/console/project-[project]/auth/(providers)/oktaOAuth.svelte
@@ -5,11 +5,12 @@
     import type { Provider } from '$lib/stores/oauth-providers';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { updateOAuth } from './updateOAuth';
+    import { updateOAuth } from '../updateOAuth';
 
     const projectId = $page.params.project;
 
     export let provider: Provider;
+    export let show = false;
 
     let appId: string = null;
     let enabled: boolean = null;
@@ -42,7 +43,7 @@
             : provider.secret;
 </script>
 
-<Modal {error} onSubmit={update} size="big" show on:close>
+<Modal {error} onSubmit={update} size="big" bind:show on:close>
     <svelte:fragment slot="title">{provider.name} OAuth2 Settings</svelte:fragment>
     <FormList>
         <p>
diff --git a/src/routes/console/project-[project]/auth/settings/+page.svelte b/src/routes/console/project-[project]/auth/settings/+page.svelte
index fea2bad07..610733117 100644
--- a/src/routes/console/project-[project]/auth/settings/+page.svelte
+++ b/src/routes/console/project-[project]/auth/settings/+page.svelte
@@ -14,6 +14,7 @@
     import { project } from '../../store';
 
     const projectId = $page.params.project;
+    let showProvider = false;
 
     $: {
         authMethods.load($project);
@@ -74,6 +75,7 @@
                             class="card u-flex u-flex-vertical u-cross-center u-width-full-line"
                             on:click={() => {
                                 selectedProvider = provider;
+                                showProvider = true;
                                 trackEvent(`click_select_provider`, {
                                     provider: provider.key.toLowerCase()
                                 });
@@ -99,9 +101,13 @@
     </Container>
 {/if}
 
-{#if selectedProvider}
+{#if selectedProvider && showProvider}
     <svelte:component
         this={selectedProvider.component}
         bind:provider={selectedProvider}
-        on:close={() => (selectedProvider = null)} />
+        bind:show={showProvider}
+        on:close={() => {
+            selectedProvider = null;
+            showProvider = false;
+        }} />
 {/if}
diff --git a/src/routes/console/project-[project]/functions/function-[function]/+layout.svelte b/src/routes/console/project-[project]/functions/function-[function]/+layout.svelte
index d693ef604..8ae5bc6d4 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/+layout.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/+layout.svelte
@@ -5,7 +5,7 @@
     import { Dependencies } from '$lib/constants';
     import { invalidate, goto } from '$app/navigation';
     import { registerCommands } from '$lib/commandCenter';
-    import { execute, func, showCreateDeployment } from './store';
+    import { func, showCreateDeployment } from './store';
     import { project } from '../../store';
     import type { Models } from '@appwrite.io/console';
     import Execute from './execute.svelte';
@@ -147,4 +147,4 @@
 
 <slot />
 
-<Execute selectedFunction={$execute} />
+<Execute />
diff --git a/src/routes/console/project-[project]/functions/function-[function]/execute.svelte b/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
index 65fe792c5..070c0af0c 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
@@ -15,10 +15,7 @@
     import Label from '$lib/elements/forms/label.svelte';
     import { addNotification } from '$lib/stores/notifications';
     import { sdk } from '$lib/stores/sdk';
-    import type { Models } from '@appwrite.io/console';
-    import { showFunctionExecute } from './store';
-
-    export let selectedFunction: Models.Function = null;
+    import { showFunctionExecute, execute } from './store';
 
     let path = '/';
     let method = 'GET';
@@ -47,7 +44,7 @@
             }
 
             await sdk.forProject.functions.createExecution(
-                selectedFunction.$id,
+                $execute.$id,
                 body,
                 true,
                 path,
@@ -56,7 +53,7 @@
             );
             if (!$page.url?.toString()?.includes('/executions')) {
                 await goto(
-                    `${base}/console/project-${$page.params.project}/functions/function-${selectedFunction.$id}/executions`
+                    `${base}/console/project-${$page.params.project}/functions/function-${$execute.$id}/executions`
                 );
             }
             invalidate(Dependencies.EXECUTIONS);
@@ -75,7 +72,7 @@
     };
 
     function close() {
-        selectedFunction = null;
+        $execute = null;
         $showFunctionExecute = false;
     }
 
@@ -100,7 +97,7 @@
     </p>
 
     <FormList>
-        {#if selectedFunction?.version !== 'v3'}
+        {#if $execute?.version !== 'v3'}
             <Alert type="info">
                 <svelte:fragment slot="title">
                     Customizable execution data now available for functions v3.0
diff --git a/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte b/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
index 57ee9f4f3..0b14ea74f 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
@@ -19,19 +19,16 @@
     import { log } from '$lib/stores/logs';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { func, showFunctionExecute } from '../store';
+    import { func, execute, showFunctionExecute } from '../store';
     import type { Models } from '@appwrite.io/console';
     import { organization } from '$lib/stores/organization';
     import { getServiceLimit, showUsageRatesModal } from '$lib/stores/billing';
     import { project } from '$routes/console/project-[project]/store';
     import Create from '../create.svelte';
-    import Execute from '../execute.svelte';
     import { abbreviateNumber } from '$lib/helpers/numbers';
 
     export let data;
 
-    let selectedFunction: Models.Function = null;
-
     onMount(() => {
         return sdk.forConsole.client.subscribe('console', (response) => {
             if (response.events.includes('functions.*.executions.*')) {
@@ -55,7 +52,7 @@
         buttonText="Execute now"
         buttonEvent="execute_function"
         buttonMethod={() => {
-            selectedFunction = $func;
+            $execute = $func;
             $showFunctionExecute = true;
         }}>
         <svelte:fragment slot="tooltip" let:tier let:limit let:upgradeMethod>
@@ -172,7 +169,3 @@
         </EmptySearch>
     {/if}
 </Container>
-
-<!-- <CreateDeployment bind:showCreate /> -->
-
-<Execute {selectedFunction} />