update value type

pyannote_viewer/backend/pyannote_viewer/pyannote_viewer.py

@@ -295,7 +295,7 @@ class PyannoteViewer(
             "segments": segments,
             "labels": labels,
             "multichannel": multichannel,
-            "sources_file": FileData(path=audio_filepath, orig_name=orig_name),
+            "audio_file": FileData(path=audio_filepath, orig_name=orig_name),
         }
 
     def stream_output(

pyannote_viewer/frontend/Index.svelte

@@ -10,13 +10,13 @@
 	import InteractiveAudio from "./interactive/InteractiveAudio.svelte";
 	import { StatusTracker } from "@gradio/statustracker";
 	import { Block, UploadText } from "@gradio/atoms";
-	import type { WaveformOptions, Segment } from "./shared/types";
+	import type { WaveformOptions, PipelineOutput } from "./shared/types";
 
 	export let elem_id = "";
 	export let elem_classes: string[] = [];
 	export let visible = true;
 	export let interactive: boolean;
-	export let value: null | {"segments": Segment[], "labels" : string[], "multichannel": boolean, "sources_file": FileData} = null;
+	export let value: PipelineOutput | null = null;
 	export let sources:
 		| ["microphone"]
 		| ["upload"]

pyannote_viewer/frontend/interactive/InteractiveAudio.svelte

@@ -16,9 +16,9 @@
 	import AudioRecorder from "../recorder/AudioRecorder.svelte";
 	import StreamAudio from "../streaming/StreamAudio.svelte";
 	import { SelectSource } from "@gradio/atoms";
-	import type { WaveformOptions, Segment } from "../shared/types";
+	import type { WaveformOptions, PipelineOutput } from "../shared/types";
 
-	export let value: null | {"segments": Segment[], "labels": string[], "sources_file": FileData} = null;
+	export let value: PipelineOutput | null = null;
 	export let label: string;
 	export let root: string;
 	export let show_label = true;
@@ -74,7 +74,7 @@
 
 	const dispatch = createEventDispatcher<{
 		change: typeof value;
-		stream: FileData;
+		stream: typeof value;
 		edit: never;
 		play: never;
 		pause: never;
@@ -95,7 +95,7 @@
 	): Promise<void> => {
 		let _audio_blob = new File(blobs, "audio.wav");
 		const val = await prepare_files([_audio_blob], event === "stream");
-		value.sources_file = (
+		value.audio_file = (
 			(await upload(val, root, undefined, upload_fn))?.filter(
 				Boolean
 			) as FileData[]
@@ -192,8 +192,8 @@
 	}
 
 	function handle_load({ detail }: { detail: FileData }): void {
-		value = {"segments": [], "labels": [], "sources_file": null}
-		value.sources_file = detail;
+		value = {"segments": [], "labels": [], "multichannel": false, "audioFile": null}
+		value.audio_file = detail;
 		dispatch("change", value);
 		dispatch("upload", detail);
 	}
@@ -264,7 +264,7 @@
 			{i18n}
 			on:clear={clear}
 			on:edit={() => (mode = "edit")}
-			download={show_download_button ? value.sources_file.url : null}
+			download={show_download_button ? value.audio_file.url : null}
 			absolute={true}
 		/>
 

pyannote_viewer/frontend/player/AudioPlayer.svelte

@@ -3,15 +3,14 @@
 	import { Music } from "@gradio/icons";
 	import { format_time, type I18nFormatter } from "@gradio/utils";
 	import WaveSurfer from "wavesurfer.js";
-	import RegionsPlugin, {type Region} from "wavesurfer.js/dist/plugins/regions";
-	import { skip_audio, process_audio } from "../shared/utils";
+	import RegionsPlugin from "wavesurfer.js/dist/plugins/regions";
+	import { skip_audio } from "../shared/utils";
 	import WaveformControls from "../shared/WaveformControls.svelte";
 	import { Empty } from "@gradio/atoms";
-	import type { FileData } from "@gradio/client";
-	import type { WaveformOptions, Segment } from "../shared/types";
+	import type { WaveformOptions, PipelineOutput } from "../shared/types";
 	import { createEventDispatcher } from "svelte";
 
-	export let value: null | {"segments": Segment[], "labels": string[], "sources_file": FileData}= null;
+	export let value: PipelineOutput | null = null;
 	export let label: string;
 	export let root: string;
 	export let i18n: I18nFormatter;
@@ -50,7 +49,7 @@
 	}>();
 
 	const create_waveform = (): void => {
-		const audio = new Audio(root + `/file=${value.sources_file.path}`)
+		const audio = new Audio(root + `/file=${value.audio_file.path}`)
 		audio.crossOrigin = "anonymous"
 
 		audioContext = new AudioContext();
@@ -145,10 +144,10 @@
 	<Empty size="small">
 		<Music />
 	</Empty>
-{:else if value.sources_file.is_stream}
+{:else if value.audio_file.is_stream}
 	<audio
 		class="standard-player"
-		src={value.sources_file.url}
+		src={value.audio_file.url}
 		controls
 		autoplay={waveform_settings.autoplay}
 	/>

pyannote_viewer/frontend/shared/types.ts

@@ -1,3 +1,5 @@
+import type { FileData } from "@gradio/client";
+
 export type WaveformOptions = {
 	waveform_color?: string;
 	waveform_progress_color?: string;
@@ -13,3 +15,10 @@ export type Segment = {
 	end: number;
 	channel: number;
 }
+
+export type PipelineOutput = {
+	segments: Segment[];
+	labels: string[];
+	multichannel: boolean;
+	audio_file: FileData;
+}

pyannote_viewer/frontend/static/StaticAudio.svelte

@@ -6,11 +6,10 @@
 	import type { I18nFormatter } from "@gradio/utils";
 	import AudioPlayer from "../player/AudioPlayer.svelte";
 	import { createEventDispatcher } from "svelte";
-	import type { FileData } from "@gradio/client";
 	import { DownloadLink } from "@gradio/wasm/svelte";
-	import type { WaveformOptions, Segment } from "../shared/types";
+	import type { WaveformOptions, PipelineOutput } from "../shared/types";
 
-	export let value: null | {"segments": Segment[], "labels":string[], "sources_file": FileData} = null;
+	export let value: PipelineOutput | null = null;
 	export let label: string;
 	export let root: string;
 	export let show_label = true;
@@ -42,7 +41,7 @@
 {#if value !== null}
 	<div class="icon-buttons">
 		{#if show_download_button}
-			<DownloadLink href={value.sources_file.url} download={value.sources_file.orig_name || value.sources_file.path}>
+			<DownloadLink href={value.audio_file.url} download={value.audio_file.orig_name || value.audio_file.path}>
 				<IconButton Icon={Download} label={i18n("common.download")} />
 			</DownloadLink>
 		{/if}