Skip to content

Commit

Permalink
Ensure File component uploads files to the server. (#5253)
Browse files Browse the repository at this point in the history 
* fix dynamic -> interactive

* fix checks

* add changeset

* add changeset

* fix changeset

* fix linting issues

* fix typing issue

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: Abubakar Abid <abubakar@huggingface.co>
  • Loading branch information
@pngwn @gradio-pr-bot @abidlabs
3 people committed Aug 17, 2023
1 parent c57d4c2 commit ddac7e4
Show file tree
Hide file tree
Showing 32 changed files with 58 additions and 126 deletions.
6 changes: 6 additions & 0 deletions .changeset/curly-hands-carry.md
View file
@@ -0,0 +1,6 @@
---
"@gradio/file": minor
"gradio": minor
---

fix:Ensure File component uploads files to the server.
3 changes: 2 additions & 1 deletion .config/.prettierignore
View file
Expand Up @@ -23,4 +23,5 @@
**/.vscode/**
sweep.yaml
**/.vercel/**
**/build/**
**/build/**
**/*.md
2 changes: 1 addition & 1 deletion guides/08_other-tutorials/creating-a-new-component.md
View file
Expand Up @@ -273,7 +273,7 @@ Here you will have three files, the first file is for the Svelte application, an

export let loading_status: LoadingStatus;

export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
</script>

<Block
Expand Down
2 changes: 1 addition & 1 deletion guides/cn/07_other-tutorials/creating-a-new-component.md
View file
Expand Up @@ -275,7 +275,7 @@ class TestColorPicker(unittest.TestCase):
export let loading_status: LoadingStatus;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
</script>
<Block
Expand Down
4 changes: 2 additions & 2 deletions js/app/src/Login.svelte
View file
Expand Up @@ -52,7 +52,7 @@
lines={1}
show_label={true}
max_lines={1}
mode="dynamic"
mode="interactive"
on:submit={submit}
bind:value={username}
/>
Expand All @@ -61,7 +61,7 @@
lines={1}
show_label={true}
max_lines={1}
mode="dynamic"
mode="interactive"
type="password"
on:submit={submit}
bind:value={password}
Expand Down
5 changes: 2 additions & 3 deletions js/audio/index.svelte
View file
Expand Up @@ -10,7 +10,7 @@
export let elem_id = "";
export let elem_classes: string[] = [];
export let visible = true;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let value: null | FileData | string = null;
export let name: string;
export let source: "microphone" | "upload";
Expand All @@ -30,12 +30,11 @@
export let show_edit_button = true;
</script>

{#if mode === "dynamic"}
{#if mode === "interactive"}
<Audio
{elem_id}
{elem_classes}
{visible}
{mode}
bind:value
{name}
{source}
Expand Down
5 changes: 1 addition & 4 deletions js/audio/interactive/InteractiveAudio.svelte
View file
Expand Up @@ -23,7 +23,6 @@
export let elem_id = "";
export let elem_classes: string[] = [];
export let visible = true;
export let mode: "static" | "dynamic";
export let value: null | FileData | string = null;
export let name: string;
export let source: "microphone" | "upload";
Expand Down Expand Up @@ -56,9 +55,7 @@
</script>

<Block
variant={mode === "dynamic" && value === null && source === "upload"
? "dashed"
: "solid"}
variant={value === null && source === "upload" ? "dashed" : "solid"}
border_mode={dragging ? "focus" : "base"}
padding={false}
{elem_id}
Expand Down
4 changes: 2 additions & 2 deletions js/audio/static/StaticAudio.svelte
View file
Expand Up @@ -22,7 +22,7 @@
export let elem_id = "";
export let elem_classes: string[] = [];
export let visible = true;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let value: null | FileData | string = null;
export let source: "microphone" | "upload";
export let label: string;
Expand Down Expand Up @@ -53,7 +53,7 @@
</script>

<Block
variant={mode === "dynamic" && value === null && source === "upload"
variant={mode === "interactive" && value === null && source === "upload"
? "dashed"
: "solid"}
border_mode={dragging ? "focus" : "base"}
Expand Down
16 changes: 8 additions & 8 deletions js/chatbot/Chatbot.stories.svelte
View file
Expand Up @@ -10,20 +10,20 @@
label: {
control: "text",
description: "The textbox label",
name: "label",
name: "label"
},
show_label: {
options: [true, false],
description: "Whether to show the label",
control: { type: "boolean" },
defaultValue: true,
defaultValue: true
},
rtl: {
options: [true, false],
description: "Whether to render right-to-left",
control: { type: "boolean" },
defaultValue: false,
},
defaultValue: false
}
}}
/>

Expand All @@ -33,9 +33,9 @@
value={[
[
"Can you write a function in Python?",
"```py\ndef test():\n\tprint(x)\n```",
"```py\ndef test():\n\tprint(x)\n```"
],
["Can you do math?", "$$1+1=2$$"],
["Can you do math?", "$$1+1=2$$"]
]}
/>
</Template>
Expand All @@ -54,7 +54,7 @@
name="Chatbot with text rendered right-to-left"
args={{
rtl: true,
latex_delimiters: [{ left: "$$", right: "$$", display: true }],
latex_delimiters: [{ left: "$$", right: "$$", display: true }]
}}
/>

Expand All @@ -63,6 +63,6 @@
args={{
rtl: true,
latex_delimiters: [{ left: "$$", right: "$$", display: true }],
show_copy_button: true,
show_copy_button: true
}}
/>
4 changes: 2 additions & 2 deletions js/chatbot/static/ChatBot.svelte
View file
Expand Up @@ -13,7 +13,7 @@
light: (): Promise<typeof import("prismjs/themes/prism.css")> =>
import("prismjs/themes/prism.css"),
dark: (): Promise<typeof import("prismjs/themes/prism.css")> =>
import("prismjs/themes/prism-dark.css"),
import("prismjs/themes/prism-dark.css")
};
export let value:
Expand Down Expand Up @@ -83,7 +83,7 @@
): void {
dispatch("select", {
index: [i, j],
value: message,
value: message
});
}
</script>
Expand Down
8 changes: 6 additions & 2 deletions js/chatbot/utils.ts
View file
Expand Up @@ -83,14 +83,18 @@ const renderer: Partial<

if (!lang) {
return (
'<div class="code_wrap">' + COPY_BUTTON_CODE + "<pre><code>" +
'<div class="code_wrap">' +
COPY_BUTTON_CODE +
"<pre><code>" +
(escaped ? code : escape(code, true)) +
"</code></pre></div>\n"
);
}

return (
'<div class="code_wrap">' + COPY_BUTTON_CODE + '<pre><code class="' +
'<div class="code_wrap">' +
COPY_BUTTON_CODE +
'<pre><code class="' +
this.options.langPrefix +
escape(lang) +
'">' +
Expand Down
2 changes: 1 addition & 1 deletion js/checkbox/index.svelte
View file
Expand Up @@ -10,7 +10,7 @@
export let value_is_output = false;
export let label = "Checkbox";
export let info: string | undefined = undefined;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let container = true;
export let scale: number | null = null;
export let min_width: number | undefined = undefined;
Expand Down
2 changes: 1 addition & 1 deletion js/checkboxgroup/index.svelte
View file
Expand Up @@ -13,7 +13,7 @@
export let container = true;
export let scale: number | null = null;
export let min_width: number | undefined = undefined;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let label = "Checkbox Group";
export let info: string | undefined = undefined;
export let show_label: boolean;
Expand Down
2 changes: 1 addition & 1 deletion js/code/index.svelte
View file
Expand Up @@ -15,7 +15,7 @@
export let elem_id = "";
export let elem_classes: string[] = [];
export let visible = true;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let label = "Code";
export let show_label = true;
export let loading_status: LoadingStatus;
Expand Down
2 changes: 1 addition & 1 deletion js/colorpicker/index.svelte
View file
Expand Up @@ -18,7 +18,7 @@
export let scale: number | null = null;
export let min_width: number | undefined = undefined;
export let loading_status: LoadingStatus;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let interactive: boolean;
</script>

Expand Down
2 changes: 1 addition & 1 deletion js/dataframe/index.svelte
View file
Expand Up @@ -13,7 +13,7 @@
export let elem_classes: string[] = [];
export let visible = true;
export let value_is_output = false;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let col_count: [number, "fixed" | "dynamic"];
export let row_count: [number, "fixed" | "dynamic"];
export let label: string | null = null;
Expand Down
2 changes: 1 addition & 1 deletion js/dropdown/index.svelte
View file
Expand Up @@ -20,7 +20,7 @@
export let loading_status: LoadingStatus;
export let allow_custom_value = false;
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
if (multiselect && !value) {
value = [];
Expand Down
2 changes: 1 addition & 1 deletion js/file/index.svelte
View file
Expand Up @@ -19,7 +19,7 @@
export let elem_classes: string[] = [];
export let visible = true;
export let value: null | FileData | FileData[];
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let root: string;
export let label: string;
export let show_label: boolean;
Expand Down
6 changes: 3 additions & 3 deletions js/file/interactive/InteractiveFile.svelte
View file
Expand Up @@ -21,7 +21,7 @@
export let value: null | FileData | FileData[];
let old_value: null | FileData | FileData[];
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let root: string;
export let label: string;
export let show_label: boolean;
Expand Down Expand Up @@ -62,7 +62,7 @@
) {
pending_upload = false;
dispatch("change");
} else if (mode === "dynamic") {
} else if (mode === "interactive") {
let files = (Array.isArray(_value) ? _value : [_value]).map(
(file_data) => file_data.blob!
);
Expand Down Expand Up @@ -105,7 +105,7 @@

<Block
{visible}
variant={mode === "dynamic" && value === null ? "dashed" : "solid"}
variant={value === null ? "dashed" : "solid"}
border_mode={dragging ? "focus" : "base"}
padding={false}
{elem_id}
Expand Down
6 changes: 3 additions & 3 deletions js/file/static/StaticFile.svelte
View file
Expand Up @@ -21,7 +21,7 @@
export let value: null | FileData | FileData[];
let old_value: null | FileData | FileData[];
export let mode: "static" | "dynamic";
export let mode: "static" | "interactive";
export let root: string;
export let label: string;
export let show_label: boolean;
Expand Down Expand Up @@ -61,7 +61,7 @@
) {
pending_upload = false;
dispatch("change");
} else if (mode === "dynamic") {
} else if (mode === "interactive") {
let files = (Array.isArray(_value) ? _value : [_value]).map(
(file_data) => file_data.blob!
);
Expand Down Expand Up @@ -104,7 +104,7 @@

<Block
{visible}
variant={mode === "dynamic" && value === null ? "dashed" : "solid"}
variant={value === null ? "dashed" : "solid"}
border_mode={dragging ? "focus" : "base"}
padding={false}
{elem_id}
Expand Down

0 comments on commit ddac7e4

Please sign in to comment.