From 63ebeafc82550c6120fc56d0f3d584a1831c85e3 Mon Sep 17 00:00:00 2001 From: Hemachandar <132386067+hmacr@users.noreply.github.com> Date: Wed, 7 Jan 2026 11:08:50 +0530 Subject: [PATCH 1/5] Improve UX for manual sites & functions deployment (#2523) * Improve UX for manual sites & functions deployment * lint * feedback --- src/lib/stores/uploader.ts | 66 ++++++++++++++++++- .../project-[region]-[project]/+layout.svelte | 2 +- .../create-function/manual/+page.svelte | 65 +++++++++++------- .../(modals)/createManual.svelte | 22 +++---- .../sites/create-site/manual/+page.svelte | 49 +++++++++----- .../createManualDeploymentModal.svelte | 10 ++- 6 files changed, 160 insertions(+), 54 deletions(-) diff --git a/src/lib/stores/uploader.ts b/src/lib/stores/uploader.ts index ef848232c..8a04eae8a 100644 --- a/src/lib/stores/uploader.ts +++ b/src/lib/stores/uploader.ts @@ -1,4 +1,4 @@ -import { Client, ID, type Models, Sites, Storage } from '@appwrite.io/console'; +import { Client, Functions, ID, type Models, Sites, Storage } from '@appwrite.io/console'; import { writable } from 'svelte/store'; import { getApiEndpoint } from '$lib/stores/sdk'; import { page } from '$app/state'; @@ -32,6 +32,13 @@ const temporarySites = (region: string, projectId: string) => { return new Sites(clientProject); }; +const temporaryFunctions = (region: string, projectId: string) => { + const clientProject = new Client().setMode('admin'); + const endpoint = getApiEndpoint(region); + clientProject.setEndpoint(endpoint).setProject(projectId); + return new Functions(clientProject); +}; + const createUploader = () => { const { subscribe, set, update } = writable({ isOpen: false, @@ -110,7 +117,19 @@ const createUploader = () => { newFile.status = 'success'; updateFile(newFile.$id, newFile); }, - uploadSiteDeployment: async (siteId: string, code: File) => { + uploadSiteDeployment: async ({ + siteId, + code, + buildCommand, + installCommand, + outputDirectory + }: { + siteId: string; + code: File; + buildCommand?: string; + installCommand?: string; + outputDirectory?: string; + }) => { const newDeployment: UploaderFile = { $id: '', resourceId: siteId, @@ -132,6 +151,49 @@ const createUploader = () => { siteId, code, activate: true, + buildCommand, + installCommand, + outputDirectory, + onProgress: (progress) => { + newDeployment.$id = progress.$id; + newDeployment.progress = progress.progress; + newDeployment.status = progress.progress === 100 ? 'success' : 'pending'; + updateFile(progress.$id, newDeployment); + } + }); + newDeployment.$id = uploadedFile.$id; + newDeployment.progress = 100; + newDeployment.status = 'success'; + updateFile(newDeployment.$id, newDeployment); + }, + uploadFunctionDeployment: async ({ + functionId, + code + }: { + functionId: string; + code: File; + }) => { + const newDeployment: UploaderFile = { + $id: '', + resourceId: functionId, + name: code.name, + size: code.size, + progress: 0, + status: 'pending' + }; + update((n) => { + n.isOpen = true; + n.isCollapsed = false; + n.files.unshift(newDeployment); + return n; + }); + const uploadedFile = await temporaryFunctions( + page.params.region, + page.params.project + ).createDeployment({ + functionId, + code, + activate: true, onProgress: (progress) => { newDeployment.$id = progress.$id; newDeployment.progress = progress.progress; diff --git a/src/routes/(console)/project-[region]-[project]/+layout.svelte b/src/routes/(console)/project-[region]-[project]/+layout.svelte index 426821259..eeeff2dd7 100644 --- a/src/routes/(console)/project-[region]-[project]/+layout.svelte +++ b/src/routes/(console)/project-[region]-[project]/+layout.svelte @@ -124,7 +124,7 @@