Appwrite/console
1
0
Fork 0
mirror of https://github.com/appwrite/console.git synced 2026-06-06 19:27:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: backend breaking changes

Browse Source
This commit is contained in:
Arman
2025-03-20 17:00:46 +01:00
parent 2adf4add22
commit c665a67b90
11 changed files with 120 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+1 -1
View File
@@ -19,7 +19,7 @@
"e2e:ui": "playwright test tests/e2e --ui"
},
"dependencies": {
"@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464",
"@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400",
"@appwrite.io/pink-icons": "0.25.0",
"@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@64948b6 ",
"@appwrite.io/pink-legacy": "^1.0.3",
pnpm-lock.yaml
Generated
+5 -5
View File
@@ -9,8 +9,8 @@ importers:
.:
dependencies:
'@appwrite.io/console':
specifier: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464
version: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464
specifier: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400
version: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400
'@appwrite.io/pink-icons':
specifier: 0.25.0
version: 0.25.0
@@ -211,8 +211,8 @@ packages:
'@analytics/type-utils@0.6.2':
resolution: {integrity: sha512-TD+xbmsBLyYy/IxFimW/YL/9L2IEnM7/EoV9Aeh56U64Ify8o27HJcKjo38XY9Tcn0uOq1AX3thkKgvtWvwFQg==}
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464':
resolution: {tarball: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464}
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400':
resolution: {tarball: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400}
version: 1.2.1
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@64948b6':
@@ -4097,7 +4097,7 @@ snapshots:
'@analytics/type-utils@0.6.2': {}
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@74f9464': {}
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@08b7400': {}
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@64948b6(svelte@4.2.19)':
dependencies:
src/lib/helpers/timeConversion.ts
+26
View File
@@ -114,3 +114,29 @@ export function formatTimeDetailed(time: number): string {
return parts.join(' ');
}
/**
* Calculates the time difference between a starting date/time and the current time.
* Returns the difference formatted in seconds, minutes, or hours depending on the magnitude.
*
* @export
* @param {Date | number | string} startTime - The starting date/time, timestamp in milliseconds, or ISO date string (e.g., '2025-03-20T15:50:43.495+00:00')
* @returns {string} The formatted time difference
*/
export function timer(startTime: Date | number | string): string {
let start: number;
if (startTime instanceof Date) {
start = startTime.getTime();
} else if (typeof startTime === 'number') {
start = startTime;
} else {
// Handle ISO date string format
start = new Date(startTime).getTime();
}
const now = new Date().getTime();
const diffInSeconds = (now - start) / 1000;
return calculateTime(diffInSeconds);
}
src/routes/(console)/project-[project]/sites/+page.svelte
+13 -1
View File
@@ -22,6 +22,10 @@
import { columns } from './store';
import { View } from '$lib/helpers/load';
import Table from './table.svelte';
import { onMount } from 'svelte';
import { invalidate } from '$app/navigation';
import { Dependencies } from '$lib/constants';
import { sdk } from '$lib/stores/sdk';
export let data;
let show = false;
@@ -41,6 +45,14 @@
]);
$updateCommandGroupRanks({ sites: 1000 });
onMount(() => {
return sdk.forConsole.client.subscribe('console', (response) => {
if (response.events.includes(`sites.*`)) {
invalidate(Dependencies.SITES);
}
});
});
</script>
<Container>
@@ -60,7 +72,7 @@
</Layout.Stack>
{#if data.siteList.total}
{#if data.view === View.Grid}
<Grid deployments={data.deployments} siteList={data.siteList} />
<Grid siteList={data.siteList} />
{:else}
<Table siteList={data.siteList} />
{/if}
src/routes/(console)/project-[project]/sites/+page.ts
-24
View File
@@ -17,35 +17,11 @@ export const load = async ({ url, depends, route }) => {
search || undefined
);
// TODO: @Meldiron Discuss better solution for getting screnshot IDs
const deployments: Models.Deployment[] = [];
await Promise.all(
siteList.sites.map(async (site) => {
if (!site.deploymentId) {
return;
}
// TODO: @Meldiron Tripple-check if this can ever happened
// It happened to me but on QA that might have corrupted data
try {
const deployment = await sdk.forProject.sites.getDeployment(
site.$id,
site.deploymentId
);
deployments.push(deployment);
} catch (err) {
// Active deployment no longer available (deleted?)
console.warn(err);
}
})
);
return {
offset,
limit,
search,
siteList,
deployments,
view
};
};
src/routes/(console)/project-[project]/sites/create-site/configuration.svelte
+13 -20
View File
@@ -37,6 +37,7 @@
export let frameworks: Models.Framework[];
export let selectedFramework: Models.Framework;
$: frameworkData = frameworks.find((framework) => framework.key === selectedFramework?.key);
$: ssr = frameworkData?.adapters.find((adapter) => adapter.key === 'ssr');
export let variables: Partial<Models.Variable>[] = [];
export let installCommand = '';
@@ -54,9 +55,9 @@
let frameworkId = selectedFramework.key;
$: if (!installCommand || !buildCommand || !outputDirectory) {
installCommand ||= frameworkData?.adapters?.ssr?.installCommand;
buildCommand ||= frameworkData?.adapters?.ssr?.buildCommand;
outputDirectory ||= frameworkData?.adapters?.ssr?.outputDirectory;
installCommand ||= ssr?.installCommand;
buildCommand ||= ssr?.buildCommand;
outputDirectory ||= ssr?.outputDirectory;
}
</script>
@@ -86,15 +87,12 @@
id="installCommand"
label="Install command"
bind:value={installCommand}
placeholder={frameworkData?.adapters?.ssr?.installCommand} />
placeholder={ssr?.installCommand} />
<Button
secondary
size="s"
disabled={frameworkData?.adapters?.ssr?.installCommand ===
installCommand}
on:click={() =>
(installCommand =
frameworkData?.adapters?.ssr?.installCommand)}>
disabled={ssr?.installCommand === installCommand}
on:click={() => (installCommand = ssr?.installCommand)}>
Reset
</Button>
</Layout.Stack>
@@ -103,14 +101,12 @@
id="buildCommand"
label="Build command"
bind:value={buildCommand}
placeholder={frameworkData?.adapters?.ssr?.buildCommand} />
placeholder={ssr?.buildCommand} />
<Button
secondary
size="s"
disabled={frameworkData?.adapters?.ssr?.buildCommand ===
buildCommand}
on:click={() =>
(buildCommand = frameworkData?.adapters?.ssr?.buildCommand)}>
disabled={ssr?.buildCommand === buildCommand}
on:click={() => (buildCommand = ssr?.buildCommand)}>
Reset
</Button>
</Layout.Stack>
@@ -119,15 +115,12 @@
id="outputDirectory"
label="Output directory"
bind:value={outputDirectory}
placeholder={frameworkData?.adapters?.ssr?.outputDirectory} />
placeholder={ssr?.outputDirectory} />
<Button
secondary
size="s"
disabled={frameworkData?.adapters?.ssr?.outputDirectory ===
outputDirectory}
on:click={() =>
(outputDirectory =
frameworkData?.adapters?.ssr?.outputDirectory)}>
disabled={ssr?.outputDirectory === outputDirectory}
on:click={() => (outputDirectory = ssr?.outputDirectory)}>
Reset
</Button>
</Layout.Stack>
src/routes/(console)/project-[project]/sites/grid.svelte
+14 -9
View File
@@ -11,25 +11,22 @@
import AddCollaboratorModal from './(components)/addCollaboratorModal.svelte';
import SitesActionMenu from './sitesActionMenu.svelte';
import { capitalize } from '$lib/helpers/string';
import { timer } from '$lib/helpers/timeConversion';
export let siteList: Models.SiteList;
export let deployments: Models.Deployment[];
let showAddCollaborator = false;
let selectedSite: Models.Site = null;
function getScreenshot(theme: string, site: Models.Site) {
const deployment =
deployments.find((d) => site.deploymentId && d.$id === site.deploymentId) ?? null;
if (theme === 'dark') {
return deployment?.screenshotDark
? getFilePreview(deployment.screenshotDark)
return site?.deploymentScreenshotDark
? getFilePreview(site?.deploymentScreenshotDark)
: `${base}/images/sites/screenshot-placeholder-dark.svg`;
}
return deployment?.screenshotLight
? getFilePreview(deployment.screenshotLight)
return site?.deploymentScreenshotLight
? getFilePreview(site?.deploymentScreenshotLight)
: `${base}/images/sites/screenshot-placeholder-light.svg`;
}
@@ -38,6 +35,14 @@
const endpoint = getApiEndpoint();
return endpoint + `/storage/buckets/screenshots/files/${fileId}/view?project=console`;
}
function generateDesc(site: Models.Site) {
if (site.latestDeploymentStatus === 'building') {
return `Deployment building ${timer(site.latestDeploymentCreatedAt)}`;
} else {
return `Deployed ${timeFromNow(site.deploymentCreatedAt)}`;
}
}
</script>
<Layout.Grid columns={3} columnsXS={1} columnsXXS={1}>
@@ -47,7 +52,7 @@
padding="xxs">
<Card.Media
title={site.name}
description={`Updated ${timeFromNow(site.$updatedAt)}`}
description={generateDesc(site)}
src={getScreenshot($app.themeInUse, site)}
alt={site.name}
avatar>
src/routes/(console)/project-[project]/sites/site-[site]/deployments/+layout.svelte
+2 -2
View File
@@ -25,8 +25,8 @@
}
if (message.events.includes('sites.*.deployments.*.update')) {
invalidate(Dependencies.DEPLOYMENTS);
invalidate(Dependencies.FUNCTION);
invalidate(Dependencies.SITE);
console.log(message);
return;
}
if (message.events.includes('sites.*.deployments.*.delete')) {
src/routes/(console)/project-[project]/sites/site-[site]/deployments/store.ts
+25 -4
View File
@@ -19,7 +19,7 @@ export const columns = writable<Column[]>([
id: 'buildDuration',
title: 'Build duration',
type: 'integer',
width: { min: 110, max: 170 },
width: { min: 110, max: 190 },
elements: [
{
@@ -37,12 +37,32 @@ export const columns = writable<Column[]>([
],
filter: false
},
{
id: 'totalSize',
title: 'Total size',
type: 'integer',
width: { min: 110, max: 190 },
elements: [
{
value: 2 * 1000 * 1000,
label: 'more than 2MB'
},
{
value: 10 * 1000 * 1000,
label: 'more than 10MB'
},
{
value: 50 * 1000 * 1000,
label: 'more than 50MB'
}
]
},
{
id: 'sourceSize',
title: 'Source size',
type: 'integer',
hide: true,
width: { min: 110, max: 170 },
width: { min: 110, max: 190 },
elements: [
{
value: 2 * 1000 * 1000,
@@ -62,14 +82,15 @@ export const columns = writable<Column[]>([
id: 'buildSize',
title: 'Build size',
type: 'integer',
hide: true,
filter: false,
width: { min: 90, max: 140 }
width: { min: 90, max: 190 }
},
{
id: 'type',
title: 'Source',
type: 'string',
width: { min: 90, max: 140 },
width: { min: 90, max: 160 },
array: true,
format: 'enum',
elements: [
src/routes/(console)/project-[project]/sites/site-[site]/deployments/table.svelte
+2
View File
@@ -68,6 +68,8 @@
{:else}
{formatTimeDetailed(deployment.buildDuration)}
{/if}
{:else if column.id === 'totalSize'}
{calculateSize(deployment.totalSize)}
{:else if column.id === 'sourceSize'}
{calculateSize(deployment.sourceSize)}
{:else if column.id === 'buildSize'}
src/routes/(console)/project-[project]/sites/site-[site]/settings/updateBuildSettings.svelte
+19 -18
View File
@@ -28,15 +28,12 @@
let fallback = site.fallbackFile;
let isButtonDisabled = true;
let showFallback = site.adapter === Adapter.Static;
$: adapterData = selectedFramework.adapters.find((a) => a.key === site.adapter);
onMount(async () => {
installCommand =
site?.installCommand ?? selectedFramework.adapters[site.adapter].defaultInstallCommand;
buildCommand =
site?.buildCommand ?? selectedFramework.adapters[site.adapter].defaultBuildCommand;
outputDirectory =
site?.outputDirectory ??
selectedFramework.adapters[site.adapter].defaultOutputDirectory;
$: onMount(async () => {
installCommand = site?.installCommand ?? adapterData.installCommand;
buildCommand = site?.buildCommand ?? adapterData.buildCommand;
outputDirectory = site?.outputDirectory ?? adapterData.outputDirectory;
});
async function updateName() {
@@ -89,8 +86,9 @@
$: if (adapter === Adapter.Static) {
showFallback = true;
fallback ||= selectedFramework.adapters.static.fallbackFile;
console.log(fallback, selectedFramework.adapters.static);
fallback ||= selectedFramework.adapters.find((a) => a.key === Adapter.Static).fallbackFile;
console.log(selectedFramework.adapters.find((a) => a.key === Adapter.Static));
} else {
showFallback = false;
fallback = undefined;
@@ -101,14 +99,17 @@
}
$: frameworkDataAdapter = selectedFramework.adapters?.length
? selectedFramework.adapters[site.adapter]
: frameworks[0].adapters[site.adapter];
? adapterData
: frameworks[0].adapters.find((a) => a.key === site.adapter);
//TODO: fix after backend type is fixed
$: if (selectedFramework?.adapters?.length <= 1 || !selectedFramework?.adapters?.ssr?.key) {
$: hasSSR = selectedFramework?.adapters?.some((a) => a?.key === Adapter.Ssr);
$: hasStatic = selectedFramework?.adapters?.some((a) => a?.key === Adapter.Static);
$: if (selectedFramework?.adapters?.length <= 1 || !hasSSR) {
adapter = Adapter.Static;
}
$: if (selectedFramework?.adapters?.length <= 1 || !selectedFramework?.adapters?.static?.key) {
$: if (selectedFramework?.adapters?.length <= 1 || !hasStatic) {
adapter = Adapter.Ssr;
}
</script>
@@ -139,7 +140,7 @@
(framework) => framework.key === frameworkKey
);
}} />
{#if selectedFramework.adapters?.length || (selectedFramework.adapters?.ssr?.key && selectedFramework.adapters?.static?.key)}
{#if selectedFramework.adapters?.length || (hasSSR && hasStatic)}
<Layout.Grid columnsXS={1} columns={2} gap="l">
<Card.Selector
title="Server side rendering"
@@ -202,7 +203,7 @@
id="installCommand"
label="Install command"
bind:value={installCommand}
placeholder={frameworkDataAdapter?.defaultInstallCommand} />
placeholder={frameworkDataAdapter?.installCommand} />
<Button
secondary
@@ -220,7 +221,7 @@
id="buildCommand"
label="Build command"
bind:value={buildCommand}
placeholder={frameworkDataAdapter?.defaultBuildCommand} />
placeholder={frameworkDataAdapter?.buildCommand} />
<Button
secondary
size="s"
@@ -237,7 +238,7 @@
id="outputDirectory"
label="Output directory"
bind:value={outputDirectory}
placeholder={frameworkDataAdapter?.defaultOutputDirectory} />
placeholder={frameworkDataAdapter?.outputDirectory} />
<Button
secondary
size="s"