upgrade to Gradio 4 (#363)

* upgrade to gradio 4

* add theme, disabled extensions

* tortoise add model loading messages

* fix ReactUI's rvc

* upgrade ReactUI for gradio 4

* fix React pipeline rendering

* change gradio theme

* refactor hyperparameters

* update package versions

* remove waveform images

* add management to extensions list

* add XTTS-Simple extension

* Refactor React UI, fix bugs, change Tortoise TTS system

* fix React build

extensions.json

@@ -149,6 +149,21 @@
             "website": "https://github.com/rsxdalv/extension_huggingface_cache_manager",
             "extension_website": "https://github.com/rsxdalv/extension_huggingface_cache_manager",
             "extension_platform_version": "0.0.1"
+        },
+        {
+            "package_name": "extension_xtts_simple",
+            "name": "XTTS-Simple",
+            "version": "0.0.1",
+            "requirements": "git+https://github.com/rsxdalv/extension_xtts_rvc_ui@simple",
+            "description": "XTTS-Simple is a Gradio UI for XTTSv2",
+            "extension_type": "interface",
+            "extension_class": "text-to-speech",
+            "author": "rsxdalv",
+            "extension_author": "rsxdalv",
+            "license": "MIT",
+            "website": "https://github.com/rsxdalv/extension_xtts_rvc_ui",
+            "extension_website": "https://github.com/rsxdalv/extension_xtts_rvc_ui",
+            "extension_platform_version": "0.0.1"
         }
     ],
     "post_generation_extensions": [

extensions/builtin/extension_gallery_history/main.py

@@ -45,16 +45,16 @@ def get_wav_files_img(directory: str):
 
 def clear_audio():
     return [
-        gr.Audio.update(value=None),
-        gr.Image.update(value=None),
-        gr.JSON.update(value=None),
-        gr.Button.update(visible=False),
+        gr.Audio(value=None),
+        gr.Image(value=None),
+        gr.JSON(value=None),
+        gr.Button(visible=False),
     ]
 
 
 def save_to_voices_cb(npz_filename: str):
     shutil.copy(npz_filename, "voices/")
-    return gr.Button.update(value="Saved")
+    return gr.Button(value="Saved")
 
 
 def history_content(directory, show_collections):
@@ -66,7 +66,7 @@ def history_content(directory, show_collections):
         visible=show_collections,
     )
     collections_directories_atom.change(
-        fn=lambda x: gr.Dropdown.update(choices=x),
+        fn=lambda x: gr.Dropdown(choices=x),
         inputs=[collections_directories_atom],
         outputs=[directory_dropdown],
     )
@@ -141,18 +141,18 @@ def history_content(directory, show_collections):
 
     def _select_audio_history(filename: str, json_text):
         return {
-            history_bundle_name: gr.Textbox.update(value=os.path.dirname(filename)),
+            history_bundle_name: gr.Textbox(value=os.path.dirname(filename)),
             history_bundle_name_data: os.path.dirname(filename),
-            history_audio: gr.Audio.update(value=filename, label=filename),
-            history_image: gr.Image.update(value=filename.replace(".wav", ".png")),
-            history_json: gr.JSON.update(value=json_text),
-            history_npz: gr.Textbox.update(value=filename.replace(".wav", ".npz")),
-            delete_from_history: gr.Button.update(visible=True),
-            save_to_favorites_history: gr.Button.update(
+            history_audio: gr.Audio(value=filename, label=filename),
+            history_image: gr.Image(value=filename.replace(".wav", ".png")),
+            history_json: gr.JSON(value=json_text),
+            history_npz: gr.Textbox(value=filename.replace(".wav", ".npz")),
+            delete_from_history: gr.Button(visible=True),
+            save_to_favorites_history: gr.Button(
                 visible=directory != "favorites", value="Save to favorites"
             ),
-            save_to_voices: gr.Button.update(visible=True, value="Save to voices"),
-            open_folder_button: gr.Button.update(visible=True),
+            save_to_voices: gr.Button(visible=True, value="Save to voices"),
+            open_folder_button: gr.Button(visible=True),
         }
 
     def select_audio_history2(_list, evt: gr.SelectData):
@@ -183,7 +183,7 @@ def select_audio_history2(_list, evt: gr.SelectData):
     def update_history_tab(directory: str):
         global audio_list_img
         audio_list_img = get_wav_files_img(directory)
-        return gr.Gallery.update(value=audio_list_img)
+        return gr.Gallery(value=audio_list_img)
 
     delete_from_history.click(
         fn=clear_audio,
@@ -228,7 +228,7 @@ def save_to_collection_ui(
     )
 
     directories_state.change(
-        fn=lambda x: gr.Dropdown.update(choices=x),
+        fn=lambda x: gr.Dropdown(choices=x),
         inputs=[directories_state],
         outputs=[move_to_collection],
     )
@@ -241,13 +241,13 @@ def create_collection(new_collection_name):
         os.makedirs(os.path.join("collections", new_collection_name))
         return [
             get_collections(),
-            gr.Button.update(value="Created"),
+            gr.Button(value="Created"),
         ]
 
     create_collection_button = gr.Button(value="Create collection")
 
     new_collection_name.change(
-        fn=lambda: gr.Button.update(value="Create collection"),
+        fn=lambda: gr.Button(value="Create collection"),
         outputs=[create_collection_button],
     )
     create_collection_button.click(

extensions/builtin/extension_huggingface_cache_manager/main.py

@@ -78,11 +78,8 @@ def scan_cache_ui():
         api_name="scan_huggingface_cache",
     )
 
-    # scan_cache_json_api = gr.JSON(visible=False)
-    # scan_cache_button_api = gr.Button("API_SCAN_CACHE", visible=False)
-    # visible 
-    scan_cache_json_api = gr.JSON(visible=True)
-    scan_cache_button_api = gr.Button("API_SCAN_CACHE_JSON", visible=True)
+    scan_cache_json_api = gr.JSON(visible=False)
+    scan_cache_button_api = gr.Button("API_SCAN_CACHE", visible=False)
     scan_cache_button_api.click(
         fn=scan_cache_json,
         outputs=[scan_cache_json_api],
@@ -91,10 +88,9 @@ def scan_cache_ui():
 
     gr.Markdown("Delete revisions")
 
-    # delete_revision_id = gr.Textbox(label="Revision ID", value="")
     delete_revision_id = gr.Dropdown(
         label="Revision ID",
-        choices=[],
+        choices=[""],
         value="",
         show_label=True,
         interactive=True,
@@ -110,7 +106,7 @@ def refresh_revision_id_button_fn():
             for repo in hf_cache_info.repos
             for revision in repo.revisions
         ]
-        return gr.Dropdown.update(choices=revision_ids)
+        return gr.Dropdown(choices=revision_ids)
 
 
     refresh_revision_id_button.click(

extensions/builtin/extension_simple_remixer/main.py

@@ -40,42 +40,16 @@ def create_slot(id=0):
             elem_classes="tts-slot",
         ):
             audio = gr.Audio(label=f"Slot {str(id)}", elem_classes="tts-audio")
-            image = gr.Image(
-                show_label=False,
-                elem_classes="tts-image-tiny",
-                interactive=False,
-            )
 
-            audio.change(
-                fn=lambda x: (
-                    image.update(
-                        plot_waveform_as_image(x[1]),
-                    )
-                    if x is not None
-                    else None
-                ),
-                inputs=[audio],
-                outputs=[image],
-            )
             with gr.Row():
                 clear = gr_mini_button("delete").click(
-                    fn=lambda: [
-                        audio.update(None),
-                        image.update(None),
-                    ],
-                    outputs=[audio, image],
+                    fn=lambda: [gr.Audio(None)],
+                    outputs=[audio],
                 )
                 copy_from_input = gr_mini_button("keyboard_return").click(
-                    fn=lambda input_value: [
-                        audio.update(input_value),
-                        image.update(plot_waveform_as_image(input_value[1])),
-                    ],
+                    fn=lambda input_value: [gr.Audio(input_value)],
                     inputs=[input_audio],
-                    # outputs=[audio],
-                    outputs=[
-                        audio,
-                        image,
-                    ],
+                    outputs=[audio],
                 )
         return audio
 
@@ -131,11 +105,11 @@ def mix_audio(x):
 
         merged_audios = [mix_audio(x) for x in stacked_audios]
         if non_null_audios := [x for x in merged_audios if x is not None]:
-            return output_audio.update(
+            return gr.Audio(
                 (sample_rate, torch.cat(non_null_audios).cpu().numpy())
             )
         else:
-            return output_audio.update(None)
+            return gr.Audio(None)
 
     def resample_from_to(in_sr: int, out_sr: int, in_wav):
         return torchaudio.transforms.Resample(in_sr, out_sr)(
@@ -151,7 +125,7 @@ def resample_from_to(in_sr: int, out_sr: int, in_wav):
     send_to_input = gr.Button("Send to input")
 
     send_to_input.click(
-        fn=lambda x: input_audio.update(x),
+        fn=lambda x: gr.Audio(x),
         inputs=output_audio,
         outputs=input_audio,
     )

extensions/builtin/extension_whisper/main.py

@@ -90,7 +90,7 @@ def transcribe_ui():
             audio = gr.Audio(
                 label="Audio",
                 type="filepath",
-                source="upload",
+                sources="upload",
                 elem_classes="tts-audio",
             )
             model_dropdown = gr.Dropdown(
@@ -117,7 +117,7 @@ def transcribe_ui():
         outputs=[text],
         api_name="whisper_transcribe",
     ).then(
-        fn=lambda: gr.Button.update(value="Unload models"),
+        fn=lambda: gr.Button(value="Unload models"),
         outputs=[unload_models_button],
     )
 

installer_scripts/versions.json

@@ -1,6 +1,6 @@
 {
     "version": "0.0.2",
-    "pip_packages": 2,
-    "npm_packages": 1,
-    "react_ui": 1
+    "pip_packages": 3,
+    "npm_packages": 2,
+    "react_ui": 2
 }