diff --git a/.gitignore b/.gitignore index af97caf9b..031f4a1f9 100644 --- a/.gitignore +++ b/.gitignore @@ -153,4 +153,6 @@ dist # Sentry Config File .sentryclirc -.idea + +# IDE specifics +.idea \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index a91385e60..99e2a1c2e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6,7 +6,7 @@ "": { "name": "@appwrite/console", "dependencies": { - "@appwrite.io/console": "1.1.0", + "@appwrite.io/console": "^1.2.0", "@appwrite.io/pink": "0.25.0", "@appwrite.io/pink-icons": "0.25.0", "@popperjs/core": "^2.11.8", @@ -149,9 +149,10 @@ "integrity": "sha512-TD+xbmsBLyYy/IxFimW/YL/9L2IEnM7/EoV9Aeh56U64Ify8o27HJcKjo38XY9Tcn0uOq1AX3thkKgvtWvwFQg==" }, "node_modules/@appwrite.io/console": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/@appwrite.io/console/-/console-1.1.0.tgz", - "integrity": "sha512-jWg+NW9RJxh2pnE/14xwpXBcChiSLYBnG3Jkr5RnMJ1mH7BYmbAuLTyxFn3UFy5llB7jVq8pHNYGqA93ZoEMsQ==" + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@appwrite.io/console/-/console-1.2.0.tgz", + "integrity": "sha512-VglATKgjuhr9jYihz500VbqghOY/695aDwhXtx3beLMzvjjFK+eN+5BOgcNMTj01COl3kBu4wrvbXpDmVemStA==", + "license": "BSD-3-Clause" }, "node_modules/@appwrite.io/pink": { "version": "0.25.0", diff --git a/package.json b/package.json index a1e12394c..d32370db7 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "e2e:ui": "playwright test tests/e2e --ui" }, "dependencies": { - "@appwrite.io/console": "1.1.0", + "@appwrite.io/console": "^1.2.0", "@appwrite.io/pink": "0.25.0", "@appwrite.io/pink-icons": "0.25.0", "@popperjs/core": "^2.11.8", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 64f87bea5..f1c2dcaf3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -9,8 +9,8 @@ importers: .: dependencies: '@appwrite.io/console': - specifier: 1.1.0 - version: 1.1.0 + specifier: ^1.2.0 + version: 1.2.0 '@appwrite.io/pink': specifier: 0.25.0 version: 0.25.0 @@ -193,8 +193,8 @@ packages: '@analytics/type-utils@0.6.2': resolution: {integrity: sha512-TD+xbmsBLyYy/IxFimW/YL/9L2IEnM7/EoV9Aeh56U64Ify8o27HJcKjo38XY9Tcn0uOq1AX3thkKgvtWvwFQg==} - '@appwrite.io/console@1.1.0': - resolution: {integrity: sha512-jWg+NW9RJxh2pnE/14xwpXBcChiSLYBnG3Jkr5RnMJ1mH7BYmbAuLTyxFn3UFy5llB7jVq8pHNYGqA93ZoEMsQ==} + '@appwrite.io/console@1.2.0': + resolution: {integrity: sha512-VglATKgjuhr9jYihz500VbqghOY/695aDwhXtx3beLMzvjjFK+eN+5BOgcNMTj01COl3kBu4wrvbXpDmVemStA==} '@appwrite.io/pink-icons@0.25.0': resolution: {integrity: sha512-0O3i2oEuh5mWvjO80i+X6rbzrWLJ1m5wmv2/M3a1p2PyBJsFxN8xQMTEmTn3Wl/D26SsM7SpzbdW6gmfgoVU9Q==} @@ -3697,7 +3697,7 @@ snapshots: '@analytics/type-utils@0.6.2': {} - '@appwrite.io/console@1.1.0': {} + '@appwrite.io/console@1.2.0': {} '@appwrite.io/pink-icons@0.25.0': {} diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index 4d3f8ccf6..be9f955e9 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -56,7 +56,7 @@ export { default as PaginationWithLimit } from './paginationWithLimit.svelte'; export { default as ClickableList } from './clickableList.svelte'; export { default as ClickableListItem } from './clickableListItem.svelte'; export { default as Id } from './id.svelte'; -export { default as ProgressBar } from './progressBar.svelte'; +export * from './progressbar'; export { default as ProgressBarBig } from './progressBarBig.svelte'; export { default as CreditCardInfo } from './creditCardInfo.svelte'; export { default as CreditCardBrandImage } from './creditCardBrandImage.svelte'; diff --git a/src/lib/components/progressBarBig.svelte b/src/lib/components/progressBarBig.svelte index 3a177f6a3..1ad497660 100644 --- a/src/lib/components/progressBarBig.svelte +++ b/src/lib/components/progressBarBig.svelte @@ -1,36 +1,36 @@
-
-
-

- {currentValue} - {currentUnit} + {#if currentValue !== undefined && currentUnit !== undefined && progress !== undefined && maxValue !== undefined && maxUnit !== undefined} +

+
+

+ {currentValue} + {currentUnit} +

+

{progress}%

+
+ +

+ {maxValue} + {maxUnit}

-

{progress}%

-

- {maxValue} - {maxUnit} -

-
- {#if showBar} -
= 75 && progress < 100} - class:is-danger={progress >= 100} - style:--graph-size={Math.max(Math.min(progress, maximum), minimum) + '%'} /> + {/if} + {#if showBar && progressBarData.length > 0} + {/if}
diff --git a/src/lib/components/progressBar.svelte b/src/lib/components/progressBarDeprecated.svelte similarity index 100% rename from src/lib/components/progressBar.svelte rename to src/lib/components/progressBarDeprecated.svelte diff --git a/src/lib/components/progressbar/ProgressBar.svelte b/src/lib/components/progressbar/ProgressBar.svelte new file mode 100644 index 000000000..575c782c0 --- /dev/null +++ b/src/lib/components/progressbar/ProgressBar.svelte @@ -0,0 +1,92 @@ + + +
+ {#each $$props.data as item} +
${item.tooltip.title} ${item.tooltip.label}` + }}> +
+ {/each} + {#if remainder > 0} +
+ {/if} +
+ + diff --git a/src/lib/components/progressbar/index.ts b/src/lib/components/progressbar/index.ts new file mode 100644 index 000000000..48c2711b8 --- /dev/null +++ b/src/lib/components/progressbar/index.ts @@ -0,0 +1,17 @@ +export type ProgressbarData = { + size: number; + color: string; + tooltip?: { + title: string; + label: string; + // linkTitle?: string; + // linkPath?: string; + }; +}; + +export type ProgressbarProps = { + maxSize: number; + data: Array; +}; + +export { default as ProgressBar } from './ProgressBar.svelte'; diff --git a/src/lib/sdk/billing.ts b/src/lib/sdk/billing.ts index f0fd8ec08..ba68502fc 100644 --- a/src/lib/sdk/billing.ts +++ b/src/lib/sdk/billing.ts @@ -178,6 +178,9 @@ export type OrganizationUsage = { bandwidth: Array; executions: Array; executionsTotal: number; + filesStorageTotal: number; + buildsStorageTotal: number; + deploymentsStorageTotal: number; storageTotal: number; users: Array; usersTotal: number; diff --git a/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.svelte b/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.svelte index d1fbdf0ee..8a220599e 100644 --- a/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.svelte +++ b/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.svelte @@ -282,6 +282,32 @@ {@const current = data.organizationUsage.storageTotal} {@const currentHumanized = humanFileSize(current)} {@const max = getServiceLimit('storage', tier)} + {@const progressBarStorageDate = [ + { + size: bytesToSize(data.organizationUsage.filesStorageTotal, 'GB'), + color: '#85DBD8', + tooltip: { + title: 'File storage', + label: `${Math.round(bytesToSize(data.organizationUsage.filesStorageTotal, 'GB') * 100) / 100}GB` + } + }, + { + size: bytesToSize(data.organizationUsage.deploymentsStorageTotal, 'GB'), + color: '#7C67FE', + tooltip: { + title: 'Deployments storage', + label: `${Math.round(bytesToSize(data.organizationUsage.deploymentsStorageTotal, 'GB') * 100) / 100}GB` + } + }, + { + size: bytesToSize(data.organizationUsage.buildsStorageTotal, 'GB'), + color: '#FE9567', + tooltip: { + title: 'Builds storage', + label: `${Math.round(bytesToSize(data.organizationUsage.buildsStorageTotal, 'GB') * 100) / 100}GB` + } + } + ]} + progressBarData={progressBarStorageDate} /> {#if project?.length > 0} {/if} diff --git a/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.ts b/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.ts index cb8264f1a..75b9d65c2 100644 --- a/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.ts +++ b/src/routes/(console)/organization-[organization]/usage/[[invoice]]/+page.ts @@ -19,6 +19,9 @@ export const load: PageLoad = async ({ params, parent }) => { users: null, usersTotal: null, storageTotal: null, + filesStorageTotal: null, + buildsStorageTotal: null, + deploymentsStorageTotal: null, executions: null, executionsTotal: null, projects: null diff --git a/src/routes/(console)/project-[project]/settings/usage/[[invoice]]/+page.svelte b/src/routes/(console)/project-[project]/settings/usage/[[invoice]]/+page.svelte index 265b063c1..828c5d019 100644 --- a/src/routes/(console)/project-[project]/settings/usage/[[invoice]]/+page.svelte +++ b/src/routes/(console)/project-[project]/settings/usage/[[invoice]]/+page.svelte @@ -1,6 +1,6 @@