Merge pull request #2955 from appwrite/fix-csv-import-max-file-size

fix: show correct max file size in CSV import dialog

Author: premtsd-code

src/lib/components/filePicker.svelte

@@ -9,7 +9,7 @@
     import { Button, InputSelect } from '$lib/elements/forms';
     import DualTimeView from './dualTimeView.svelte';
     import type { Models } from '@appwrite.io/console';
-    import { calculateSize } from '$lib/helpers/sizeConvertion';
+    import { calculateSize, humanFileSize, sizeToBytes } from '$lib/helpers/sizeConvertion';
     import InputSearch from '$lib/elements/forms/inputSearch.svelte';
     import { ID, Query, Permission, Role } from '@appwrite.io/console';
     import {
@@ -34,6 +34,8 @@
     import { showCreateBucket } from '$routes/(console)/project-[region]-[project]/storage/+page.svelte';
     import { preferences } from '$lib/stores/preferences';
     import { addNotification } from '$lib/stores/notifications';
+    import { isCloud } from '$lib/system';
+    import { currentPlan } from '$lib/stores/organization';
 
     export let show: boolean;
     export let mimeTypeQuery: string = 'image/';
@@ -53,6 +55,10 @@
     let fileSelector: HTMLInputElement;
     let uploading = false;
     let view: 'grid' | 'list' = 'list';
+    $: planMaxSize =
+        isCloud && $currentPlan?.['fileSize']
+            ? sizeToBytes($currentPlan['fileSize'], 'MB', 1000)
+            : null;
 
     onMount(() => {
         const lastSelectedBucket = preferences.getKey('lastSelectedBucket', null);
@@ -366,7 +372,7 @@
                                         direction="row"
                                         gap="s">
                                         <Typography.Text variant="l-500">
-                                            Drag and drop files here or click to upload
+                                            Drag and drop a file here or click to upload
                                         </Typography.Text>
                                         <Tooltip>
                                             <Layout.Stack
@@ -381,8 +387,12 @@
                                                     : `${allowedExtension} files are allowed`}</svelte:fragment>
                                         </Tooltip>
                                     </Layout.Stack>
-                                    <Typography.Caption variant="400"
-                                        >Max file size: 10MB</Typography.Caption>
+                                    {#if planMaxSize}
+                                        {@const readableMaxSize = humanFileSize(planMaxSize)}
+                                        <Typography.Caption variant="400"
+                                            >Max file size: {readableMaxSize.value +
+                                                readableMaxSize.unit}</Typography.Caption>
+                                    {/if}
                                 </Layout.Stack>
                             </Layout.Stack>
                         </Upload.Dropzone>

src/lib/components/variables/importVariablesModal.svelte

@@ -64,7 +64,7 @@
                 <Layout.Stack alignItems="center" gap="s">
                     <Layout.Stack alignItems="center" justifyContent="center" inline>
                         <Typography.Text variant="l-500" align="center" inline>
-                            Drag and drop files here or click to upload
+                            Drag and drop a file here or click to upload
                             <Layout.Stack
                                 style="display: inline-flex; vertical-align: middle;"
                                 inline

src/routes/(console)/organization-[organization]/domains/domain-[domain]/importRecordModal.svelte

@@ -89,7 +89,7 @@
                             direction="row"
                             gap="s">
                             <Typography.Text variant="l-500">
-                                Drag and drop file here or click to upload
+                                Drag and drop a file here or click to upload
                             </Typography.Text>
                             <Tooltip>
                                 <Layout.Stack alignItems="center" justifyContent="center" inline>

src/routes/(console)/project-[region]-[project]/functions/create-function/manual/+page.svelte

@@ -206,7 +206,7 @@
                         <Layout.Stack alignItems="center" gap="s">
                             <Layout.Stack alignItems="center" justifyContent="center" inline>
                                 <Typography.Text variant="l-500" align="center" inline>
-                                    Drag and drop file here or click to upload
+                                    Drag and drop a file here or click to upload
                                     <Layout.Stack
                                         style="display: inline-flex; vertical-align: middle;"
                                         inline

src/routes/(console)/project-[region]-[project]/functions/function-[function]/(modals)/createManual.svelte

@@ -93,7 +93,7 @@
                         direction="row"
                         gap="s">
                         <Typography.Text variant="l-500">
-                            Drag and drop file here or click to upload
+                            Drag and drop a file here or click to upload
                         </Typography.Text>
                         <Tooltip>
                             <Layout.Stack alignItems="center" justifyContent="center" inline>

src/routes/(console)/project-[region]-[project]/sites/create-site/manual/+page.svelte

@@ -210,7 +210,7 @@
                         <Layout.Stack alignItems="center" gap="s">
                             <Layout.Stack alignItems="center" justifyContent="center" inline>
                                 <Typography.Text variant="l-500" align="center" inline>
-                                    Drag and drop file here or click to upload
+                                    Drag and drop a file here or click to upload
                                     <Layout.Stack
                                         style="display: inline-flex; vertical-align: middle;"
                                         inline

src/routes/(console)/project-[region]-[project]/sites/site-[site]/deployments/createManualDeploymentModal.svelte

@@ -93,7 +93,7 @@
                         direction="row"
                         gap="s">
                         <Typography.Text variant="l-500">
-                            Drag and drop file here or click to upload
+                            Drag and drop a file here or click to upload
                         </Typography.Text>
                         <Tooltip>
                             <Layout.Stack alignItems="center" justifyContent="center" inline>

src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/create/+page.svelte

@@ -122,7 +122,7 @@
                         extensions={data.bucket.allowedFileExtensions}
                         on:invalid={handleInvalid}>
                         <Typography.Text variant="l-500"
-                            >Drag and drop files here or click to upload</Typography.Text>
+                            >Drag and drop a file here or click to upload</Typography.Text>
                     </Upload.Dropzone>
 
                     {#if files}

src/routes/(console)/project-[region]-[project]/uploadVariablesModal.svelte

@@ -148,7 +148,7 @@
             <Layout.Stack alignItems="center" gap="s">
                 <Layout.Stack alignItems="center" justifyContent="center" inline>
                     <Typography.Text variant="l-500" align="center" inline>
-                        Drag and drop files here or click to upload
+                        Drag and drop a file here or click to upload
                         <Layout.Stack
                             style="display: inline-flex; vertical-align: middle;"
                             inline