fix: deployment form design

src/lib/elements/forms/label.svelte

@@ -28,7 +28,7 @@
 {/if}
 
 {#if tooltip}
-    <button class="tooltip" aria-label="variables info">
+    <button class="tooltip" aria-label="input tooltip">
         <span class="icon-info" aria-hidden="true" style="font-size: var(--icon-size-small)" />
         <span class="tooltip-popup" role="tooltip">
             <p class="text">

src/routes/console/project-[project]/functions/function-[function]/+layout.ts

@@ -14,7 +14,7 @@ export const load: LayoutLoad = async ({ params, depends }) => {
             header: Header,
             breadcrumbs: Breadcrumbs,
             function: sdk.forProject.functions.get(params.function),
-            domain: sdk.forProject.proxy.listRules([
+            proxyRuleList: sdk.forProject.proxy.listRules([
                 Query.equal('resourceType', 'function'),
                 Query.equal('resourceId', params.function),
                 Query.limit(1)

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

@@ -25,7 +25,7 @@
         TableRow,
         TableScroll
     } from '$lib/elements/table';
-    import { execute, func } from './store';
+    import { execute, func, proxyRuleList } from './store';
     import { Container } from '$lib/layout';
     import { app } from '$lib/stores/app';
     import { calculateSize, humanFileSize } from '$lib/helpers/sizeConvertion';
@@ -125,10 +125,10 @@
                                 <b>Source:</b>
                                 <DeploymentSource deployment={activeDeployment} />
                             </p>
-                            {#if data.domain?.rules?.length}
+                            {#if $proxyRuleList?.rules?.length}
                                 <p class="u-flex u-gap-4 u-cross-center">
                                     <b>Domains:</b>
-                                    <DeploymentDomains domain={data.domain} />
+                                    <DeploymentDomains domain={$proxyRuleList} />
                                 </p>
                             {/if}
                         </div>

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

@@ -7,7 +7,7 @@
     import { calculateTime } from '$lib/helpers/timeConversion';
     import { Container } from '$lib/layout';
     import { app } from '$lib/stores/app';
-    import { func } from '../store';
+    import { func, proxyRuleList } from '../store';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
     import type { Models } from '@appwrite.io/console';
@@ -18,6 +18,8 @@
     import DeploymentSource from '../deploymentSource.svelte';
     import { deployment } from './store';
     import DeploymentCreatedBy from '../deploymentCreatedBy.svelte';
+    import DeploymentDomains from '../deploymentDomains.svelte';
+    import { tooltip } from '$lib/actions/tooltip';
 
     let logs = '';
 
@@ -77,11 +79,28 @@
                         {/if}
                     </p>
                     <p><b>Updated:</b> <DeploymentCreatedBy deployment={$deployment} /></p>
-                    <p><b>Size:</b> {fileSize.value + fileSize.unit}</p>
                     <p>
+                        <b>Size:</b>
+                        {fileSize.value + fileSize.unit}
+                        <span
+                            class="icon-info"
+                            aria-hidden="true"
+                            style="font-size: var(--icon-size-small)"
+                            use:tooltip={{
+                                content:
+                                    'Build size is the size of your code that will run. If your code has been transpiled, it will include your library source code. If it has been compiled, it will include your build output file.'
+                            }} />
+                    </p>
+                    <p class="u-flex u-gap-4 u-cross-center">
                         <b>Source:</b>
                         <DeploymentSource deployment={$deployment} />
                     </p>
+                    {#if $proxyRuleList?.rules?.length}
+                        <p class="u-flex u-gap-4 u-cross-center">
+                            <b>Domains:</b>
+                            <DeploymentDomains domain={$proxyRuleList} />
+                        </p>
+                    {/if}
                 </div>
                 <div class="u-flex u-flex-vertical u-cross-end">
                     <Pill

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

@@ -21,10 +21,12 @@
             <DropListLink href={deployment.providerBranchUrl} external icon="git-branch">
                 {deployment.providerBranch}
             </DropListLink>
-            <DropListLink href={deployment.providerCommitUrl} external icon="git-commit">
-                {deployment?.providerCommitHash?.substring(0, 7)}
-                {deployment.providerCommitMessage}
-            </DropListLink>
+            {#if deployment?.providerCommitMessage && deployment?.providerCommitHash && deployment?.providerCommitUrl}
+                <DropListLink href={deployment.providerCommitUrl} external icon="git-commit">
+                    {deployment?.providerCommitHash?.substring(0, 7)}
+                    {deployment.providerCommitMessage}
+                </DropListLink>
+            {/if}
         </svelte:fragment>
     </DropList>
 {:else if deployment.type === 'manual'}

src/routes/console/project-[project]/functions/function-[function]/store.ts

@@ -3,6 +3,10 @@ import { derived, writable, type Writable } from 'svelte/store';
 import type { Models } from '@appwrite.io/console';
 
 export const func = derived(page, ($page) => $page.data.function as Models.Function);
+export const proxyRuleList = derived(
+    page,
+    ($page) => $page.data.proxyRuleList as Models.ProxyRuleList
+);
 export const execute: Writable<Models.Function> = writable();
 export const repositories: Writable<{
     search: string;