fix: QA

src/lib/elements/forms/inputPassword.svelte

@@ -51,7 +51,7 @@
         {label}
     </Label>
 
-    <div class="input-text-wrapper">
+    <div class="input-text-wrapper" style={showPasswordButton ? '--amount-of-buttons: 1' : ''}>
         {#if showInPlainText}
             <input
                 {id}

src/lib/wizards/functions/createTemplate.svelte

@@ -15,10 +15,18 @@
     import RepositoryBehaviour from './steps/repositoryBehaviour.svelte';
     import CreateRepository from './steps/createRepository.svelte';
     import TemplateVariables from './steps/templateVariables.svelte';
+    import { scopes } from '$lib/constants';
 
     async function create() {
         const runtimeDetail = $template.runtimes.find((r) => r.name === $templateConfig.runtime);
 
+        const key = await sdk.forConsole.projects.createKey(
+            $page.params.project,
+            'Generated for Template',
+            scopes.map((scope) => scope.scope)
+        );
+        $templateConfig.variables['APPWRITE_API_KEY'] = key.secret;
+
         const response = await sdk.forProject.functions.create(
             $templateConfig.$id || ID.unique(),
             $templateConfig.name,
@@ -53,29 +61,6 @@
         wizard.hide();
     }
 
-    // async function generateApiKey() {
-    //     try {
-    // const key = await sdk.forConsole.projects.createKey(
-    //             $page.params.project,
-    //             'Generated for Template',
-    //             scopes.map((scope) => scope.scope)
-    //         );
-    //         $templateConfig.variables['APPWRITE_API_KEY'] = key.secret;
-
-    //         addNotification({
-    //             type: 'success',
-    //             message: 'Key generated successfully.'
-    //         });
-    //     } catch (error) {
-    //         addNotification({
-    //             type: 'error',
-    //             message: error.message
-    //         });
-    //     } finally {
-    //         generatingApiKey = false;
-    //     }
-    // }
-
     function resetState() {
         wizard.hide();
         templateConfig.set(null);

src/lib/wizards/functions/steps/repositoryBehaviour.svelte

@@ -17,10 +17,10 @@
     </svelte:fragment>
 
     <ul class="u-flex u-flex-vertical u-gap-24">
-        <li>
-            <label
-                class="card is-allow-focus u-cursor-pointer"
-                style="--card-padding:1rem; --card-border-radius:var(--border-radius-small);">
+        <li
+            class="box is-allow-focus u-cursor-pointer"
+            style="--box-padding:1rem; --box-border-radius:var(--border-radius-small);">
+            <label>
                 <div class="u-flex u-gap-16">
                     <input
                         bind:group={$templateConfig.repositoryBehaviour}
@@ -38,10 +38,10 @@
                 </div>
             </label>
         </li>
-        <li>
-            <label
-                class="card is-allow-focus u-cursor-pointer"
-                style="--card-padding:1rem; --card-border-radius:var(--border-radius-small);">
+        <li
+            class="box is-allow-focus u-cursor-pointer"
+            style="--box-padding:1rem; --box-border-radius:var(--border-radius-small);">
+            <label>
                 <div class="u-flex u-gap-16">
                     <input
                         bind:group={$templateConfig.repositoryBehaviour}

src/routes/console/project-[project]/functions/function-[function]/create.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { beforeNavigate } from '$app/navigation';
     import { DropList, DropListItem } from '$lib/components';
     import { Button } from '$lib/elements/forms';
     import CreateCli from './createCli.svelte';
@@ -14,6 +15,8 @@
     let showCreateGit = false;
     let showCreateManual = false;
 
+    beforeNavigate(() => ($showCreateDeployment = false));
+
     $: if ($showCreateDeployment && main) {
         show = true;
     }

src/routes/console/project-[project]/functions/function-[function]/deployment-[deployment]/+page.svelte

@@ -17,6 +17,7 @@
     import { timer } from '$lib/actions/timer';
     import DeploymentSource from '../deploymentSource.svelte';
     import { deployment } from './store';
+    import DeploymentCreatedBy from '../deploymentCreatedBy.svelte';
 
     let logs = '';
 
@@ -75,7 +76,7 @@
                             {calculateTime($deployment.buildTime)}
                         {/if}
                     </p>
-                    <p><b>Created:</b> <deploymentCreatedBy deployment={$deployment} /></p>
+                    <p><b>Created:</b> <DeploymentCreatedBy deployment={$deployment} /></p>
                     <p><b>Size:</b> {fileSize.value + fileSize.unit}</p>
                     <p>
                         <b>Source:</b>