LyAhn/vibepod
1
0
Fork 0
mirror of https://github.com/JezzWTF/vibepod.git synced 2026-06-01 15:22:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

🧹 [Code Health] Extract duplicated SVG spinner into a shared component\n\n🎯 What: Extracted the duplicated <svg> spinner code in web/components/GenerationControls.tsx into a new lightweight React component SpinnerIcon.\n💡 Why: This improves maintainability and keeps the code DRY by removing the inline duplication of the SVG path and properties.\n✅ Verification: Ran pnpm install and pnpm run build in the web directory, confirming the code compiles successfully.\n✨ Result: The isGenerating and !serverReady branches now cleanly reference the <SpinnerIcon /> component.

Browse Source 
Co-authored-by: LyAhn <27559362+LyAhn@users.noreply.github.com>
This commit is contained in:
google-labs-jules[bot]
2026-04-28 14:53:41 +00:00
parent e2f52473ea
commit 2d2ab26994
1 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/components/GenerationControls.tsx
+12 -8
View File
@@ -35,6 +35,16 @@ const STATUS_CONFIG: Record<
error: { color: "var(--error)", label: () => "Server error — check the terminal for details." }, error: { color: "var(--error)", label: () => "Server error — check the terminal for details." },
}; };
function SpinnerIcon() {
return (
<svg className="animate-spin w-4 h-4" viewBox="0 0 24 24" fill="none">
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
</svg>
);
}
export default function GenerationControls({ export default function GenerationControls({
speaker, speaker,
availableVoices, availableVoices,
@@ -237,18 +247,12 @@ export default function GenerationControls({
> >
{isGenerating ? ( {isGenerating ? (
<> <>
<svg className="animate-spin w-4 h-4" viewBox="0 0 24 24" fill="none"> <SpinnerIcon />
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
</svg>
Generating... Generating...
</> </>
) : !serverReady ? ( ) : !serverReady ? (
<> <>
<svg className="animate-spin w-4 h-4" viewBox="0 0 24 24" fill="none"> <SpinnerIcon />
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
</svg>
{serverStatus === "downloading" ? "Downloading model..." : "Waiting for server..."} {serverStatus === "downloading" ? "Downloading model..." : "Waiting for server..."}
</> </>
) : ( ) : (