diff --git a/gradio/components.py b/gradio/components.py
index 3e3205b0a6..491277699d 100644
--- a/gradio/components.py
+++ b/gradio/components.py
@@ -2335,7 +2335,10 @@ class File(Changeable, Clearable, IOComponent):
else:
return process_single_file(x)
else:
- return [process_single_file(f) for f in x]
+ if isinstance(x, list):
+ return [process_single_file(f) for f in x]
+ else:
+ return process_single_file(x)
def save_flagged(self, dir, label, data, encryption_key):
"""
diff --git a/ui/packages/app/src/components/File/File.svelte b/ui/packages/app/src/components/File/File.svelte
index ae593bfb50..d83c9f8d51 100644
--- a/ui/packages/app/src/components/File/File.svelte
+++ b/ui/packages/app/src/components/File/File.svelte
@@ -53,6 +53,6 @@
upload_text={$_("interface.click_to_upload")}
/>
{:else}
-
+
{/if}
diff --git a/ui/packages/file/src/File.svelte b/ui/packages/file/src/File.svelte
index 9c297c49fb..30b6071738 100644
--- a/ui/packages/file/src/File.svelte
+++ b/ui/packages/file/src/File.svelte
@@ -11,27 +11,52 @@
export let value: FileData | null;
export let label: string;
export let show_label: boolean;
+ export let file_count: string;
{#if value}
-
- {display_file_name(value)}
-
-
- {display_file_size(value)}
-
-
+ {#if Array.isArray(value)}
+ {#each value as file}
+
+
+ {display_file_name(file)}
+
+
+ {display_file_size(file)}
+
+
+
+ {/each}
+ {:else}
+
+
+ {display_file_name(value)}
+
+
+ {display_file_size(value)}
+
+
+
+ {/if}
{:else}
diff --git a/ui/packages/file/src/FileUpload.svelte b/ui/packages/file/src/FileUpload.svelte
index a885cb83ad..330f0a6d15 100644
--- a/ui/packages/file/src/FileUpload.svelte
+++ b/ui/packages/file/src/FileUpload.svelte
@@ -58,21 +58,45 @@
{:else}
-
- {display_file_name(value)}
-
-
- {display_file_size(value)}
-
-
+ {#if Array.isArray(value)}
+ {#each value as file}
+
+
+ {display_file_name(file)}
+
+
+ {display_file_size(file)}
+
+
+
+ {/each}
+ {:else}
+
+
+ {display_file_name(value)}
+
+
+ {display_file_size(value)}
+
+
+
+ {/if}
{/if}
diff --git a/ui/packages/file/src/utils.ts b/ui/packages/file/src/utils.ts
index f53d7e8962..64a4a84c68 100644
--- a/ui/packages/file/src/utils.ts
+++ b/ui/packages/file/src/utils.ts
@@ -15,34 +15,18 @@ export const display_file_name = (
value: FileData | Array
): string => {
var str: string;
- if (Array.isArray(value)) {
- if (value.length > 1) {
- return value.length + " files";
- } else {
- str = value[0].name;
- }
- } else {
- str = value.name;
- }
+ str = value.name;
if (str.length > 30) {
return `${str.substr(0, 30)}...`;
} else return str;
};
export const download_files = (value: FileData | Array): string => {
- return Array.isArray(value) ? value[0].data : value.data;
+ return value.data;
};
export const display_file_size = (
value: FileData | Array
): string => {
- var total_size = 0;
- if (Array.isArray(value)) {
- for (var file of value) {
- total_size += file.size;
- }
- } else {
- total_size = value.size;
- }
- return prettyBytes(total_size || 0);
+ return prettyBytes(value.size || 0);
};