Spaces:
Running on CPU Upgrade
Running on CPU Upgrade
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <title>Agentic Space Factory</title> | |
| <link rel="stylesheet" href="/custom-static/app.css?v=v198.26.32" /> | |
| </head> | |
| <body> | |
| <div class="app-shell onepage-shell"> | |
| <header class="topbar onepage-topbar"> | |
| <div class="brand"> | |
| <div class="brand-mark">🚀</div> | |
| <div> | |
| <h1>Agentic Space Factory</h1> | |
| <p>Build, inspect, validate Gradio Spaces from model cards.</p> | |
| </div> | |
| </div> | |
| <div class="top-actions"> | |
| <span class="auth-lifetime-badge neutral" id="authLifetimeBadge" title="HF OAuth session lifetime">HF Auth: unknown</span> | |
| <a class="user-chip" id="userChip" href="/oauth/huggingface/login">Sign in</a> | |
| <a class="logout-link" id="logoutLink" href="/auth/logout-local" hidden>Logout</a> | |
| </div> | |
| </header> | |
| <div class="toast-layer" id="toastLayer" aria-live="polite"><section class="operation-status floating-toast" id="operationStatus" hidden></section></div> | |
| <main class="onepage-main"> | |
| <section class="auth-panel" id="authPanel" hidden></section> | |
| <section class="workspace-grid"> | |
| <div class="left-stack"> | |
| <section class="panel bucket-setup-panel compact-storage" id="bucketSetupPanel"> | |
| <div class="bucket-status-card"> | |
| <div class="bucket-status-main"> | |
| <span class="bucket-status-orb" id="bucketInlineOrb"><span class="status-dot" id="bucketInlineDot"></span></span> | |
| <div> | |
| <div class="mini-kicker">Run storage</div> | |
| <strong id="bucketInlineLabel">loading…</strong> | |
| <p id="bucketFeedbackText">Checking private bucket access…</p> | |
| </div> | |
| </div> | |
| <span class="badge" id="bucketInlineStatus">Checking</span> | |
| </div> | |
| <div class="inline-actions bucket-actions compact"> | |
| <button class="secondary small" id="checkBucket">Check</button> | |
| <button class="secondary small" id="createBucket">Create</button> | |
| </div> | |
| </section> | |
| <section class="panel build-panel" id="newBuildCard"> | |
| <div class="section-head compact"> | |
| <div> | |
| <span class="panel-icon">⌘</span> | |
| <h2>New Build</h2> | |
| </div> | |
| </div> | |
| <div class="field-stack"> | |
| <label>Model card URL or model ID<input id="modelId" value="Tongyi-MAI/Z-Image-Turbo" /></label> | |
| <section class="model-prescan-card" id="modelPreScanCard" aria-live="polite"> | |
| <div class="model-prescan-head"> | |
| <div><span class="mini-kicker">Model pre-scan</span><strong id="modelPreScanTitle">Not scanned yet</strong></div> | |
| <span class="badge neutral" id="modelPreScanBadge">Required</span> | |
| </div> | |
| <p class="muted" id="modelPreScanSummary">Run a fast metadata scan before launching a paid Job. It checks the model card guidance, runnable examples, Diffusers signals, files, safetensors, gated access and custom-code risk without downloading weights.</p> | |
| <div class="model-prescan-signals" id="modelPreScanSignals" hidden></div> | |
| <label class="model-risk-ack" id="modelRiskAckWrap" hidden><input id="modelRiskAck" type="checkbox" /> <span>I reviewed the risk signals and still want to launch.</span></label> | |
| <button class="secondary small" id="scanModel" type="button">Scan model</button> | |
| </section> | |
| <label>Target Space name <span class="optional-label">optional</span><input id="targetSpace" placeholder="z-image-turbo-demo" /></label> | |
| <div class="form-grid two-cols"> | |
| <label>Pi model<select id="piModel"> | |
| <option value="Qwen/Qwen3-Coder-Next" selected>Qwen/Qwen3-Coder-Next</option> | |
| <option value="moonshotai/Kimi-K2-Instruct-0905">moonshotai/Kimi-K2-Instruct-0905</option> | |
| <option value="zai-org/GLM-4.7">zai-org/GLM-4.7</option> | |
| <option value="zai-org/GLM-4.5-Air">zai-org/GLM-4.5-Air</option> | |
| <option value="deepseek-ai/DeepSeek-V3.2">deepseek-ai/DeepSeek-V3.2</option> | |
| <option value="Qwen/Qwen3-Coder-480B-A35B-Instruct">Qwen/Qwen3-Coder-480B-A35B-Instruct</option> | |
| </select></label> | |
| <label>Implementation mode<select id="implementationMode"> | |
| <option value="full-inference-gated" selected>Strict inference</option> | |
| <option value="full-inference-attempt">Best effort inference</option> | |
| <option value="safe-scaffold">Demo scaffold only</option> | |
| </select></label> | |
| </div> | |
| <p class="implementation-mode-help" id="implementationModeHelp">Strict inference requires a real working inference endpoint. The run fails if the generated Space only boots without producing a valid output.</p> | |
| <div class="form-grid two-cols"> | |
| <label>Preferred GPU<select id="preferredHardware"><option value="zero-a10g" selected>ZeroGPU</option></select></label> | |
| <label>Fallback GPU<select id="fallbackHardware"><option value="a10g-large" selected>A10G Large</option><option value="l40sx1">L40S x1</option><option value="t4-medium">T4 Medium</option><option value="cpu-basic">CPU Basic</option></select></label> | |
| </div> | |
| <div class="toggle-list compact-toggles"> | |
| <label><span>Try ZeroGPU first</span><input id="tryZeroGpu" type="checkbox" checked /></label> | |
| <label><span>Allow fixed GPU fallback</span><input id="allowFallback" type="checkbox" checked /></label> | |
| </div> | |
| <label>Expected output type<select id="buildExpectedOutput"><option value="text">Text</option><option value="image">Image</option><option value="video">Video</option><option value="audio">Audio</option><option value="any">Any</option></select></label> | |
| </div> | |
| <button class="primary full" id="launchBuild" disabled>Build private Space</button> | |
| <p class="auth-build-hint" id="authBuildHint" hidden></p> | |
| <p class="muted build-gate" id="buildGateText">Checking your run bucket before enabling builds…</p> | |
| </section> | |
| </div> | |
| <div class="center-stack"> | |
| <div class="center-tabs" role="tablist" aria-label="Run workspace tabs"> | |
| <button class="center-tab active" id="activeRunTab" type="button" role="tab" aria-selected="true" aria-controls="activeRunPanel" data-center-tab="active">Active Run</button> | |
| <button class="center-tab" id="spaceTestTab" type="button" role="tab" aria-selected="false" aria-controls="spaceTestSection" data-center-tab="validate">Space Test <span class="tab-status-dot" id="spaceTestTabDot" aria-hidden="true"></span></button> | |
| </div> | |
| <section class="panel active-run-panel center-tab-panel active" id="activeRunPanel" role="tabpanel" aria-labelledby="activeRunTab" data-center-panel="active"> | |
| <div class="section-head compact"> | |
| <div><span class="panel-icon">▷</span><h2>Active Run</h2></div> | |
| <span class="badge neutral" id="progressStatus">Idle</span> | |
| </div> | |
| <div class="summary-meta active-meta"> | |
| <div><span>Run ID</span><strong id="detailRunId">—</strong></div> | |
| <div><span>Target Space</span><strong id="detailSpace">—</strong></div> | |
| <div><span>Model</span><strong id="selectedModelId">—</strong></div> | |
| <div><span>Build goal</span><strong id="detailImplementationMode">—</strong></div> | |
| <div><span>Target GPU</span><strong id="detailTargetGpu">—</strong></div> | |
| <div><span>Fallback GPU</span><strong id="detailFallbackGpu">—</strong></div> | |
| <div><span>Expected output</span><strong id="detailExpectedOutput">—</strong></div> | |
| <div><span>Pi assistant</span><strong id="detailPiAssistant">—</strong></div> | |
| <div><span>Elapsed time</span><strong id="elapsed">—</strong></div> | |
| </div> | |
| <div class="active-run-actions" aria-label="Active run actions"> | |
| <a class="link-btn disabled" id="activeOpenSpace" target="_blank">Space ↗</a> | |
| <a class="link-btn disabled" id="activeOpenSettings" target="_blank">Settings ↗</a> | |
| <a class="link-btn disabled" id="activeOpenJob" target="_blank">Job ↗</a> | |
| <a class="link-btn disabled" id="activeOpenArtifacts" target="_blank">Artifacts ↗</a> | |
| <button class="secondary small" id="activePrefillSpaceTest" disabled>Prefill Space Test</button> | |
| <button class="secondary danger small" id="deleteActiveRun" disabled>Delete run</button> | |
| <button class="secondary danger small" id="cancelRun" disabled>Cancel Job</button> | |
| </div> | |
| <div class="blockers" id="selectedBlockers" hidden></div> | |
| <div class="progress-caption"><span id="progressCaptionLabel">Overall progress</span><strong id="progressPercent">0%</strong></div> | |
| <div class="progress-bar" id="progressBar" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div id="progressFill" style="width:0%"></div></div> | |
| <div class="progress-semantics" id="progressSemantics" hidden></div> | |
| <div class="timeline-trace-note" id="timelineTraceNote" hidden></div> | |
| <div class="timeline" id="timeline"></div> | |
| <div class="timeline-phase-details" id="timelinePhaseDetails" hidden></div> | |
| <div class="manual-action" id="manualActionPanel" hidden> | |
| <div> | |
| <strong id="manualActionTitle">Manual hardware required</strong> | |
| <p id="manualActionText">Open Space settings, choose the recommended GPU, then run Space Test.</p> | |
| </div> | |
| <div class="inline-actions"> | |
| <a class="link-btn" id="manualOpenSettings" target="_blank">Open Space settings ↗</a> | |
| <button class="secondary small" id="manualGoValidate">Prefill Space Test</button> | |
| </div> | |
| </div> | |
| <section class="mini-panel latest-events-card"> | |
| <div class="card-title-row"> | |
| <h4>Latest events</h4> | |
| <span class="muted">Typed activity</span> | |
| </div> | |
| <div id="activityFeed" class="activity-feed"><div class="empty">No activity yet.</div></div> | |
| </section> | |
| <section class="mini-panel agent-recovery-card" id="agentRecoveryCard" aria-label="Agent recovery status" hidden> | |
| <div class="card-title-row"> | |
| <h4>Agent recovery</h4> | |
| <span class="badge neutral" id="agentRecoveryBadge">Not needed</span> | |
| </div> | |
| <div id="agentRecoveryBody" class="agent-recovery-body"> | |
| <div class="empty compact-empty">Recovery details appear when Pi diagnoses a build or runtime blockage.</div> | |
| </div> | |
| </section> | |
| <section class="mini-panel active-latency-card" id="activeLatencyCard" aria-label="Active run inference latency"> | |
| <div class="card-title-row"> | |
| <h4>Inference latency</h4> | |
| <span class="muted" id="activeLatencySource">measured when smoke test passes</span> | |
| </div> | |
| <div class="active-latency-grid"> | |
| <div><span>Observed</span><strong id="activeLatencyValue">—</strong></div> | |
| <div><span>ZeroGPU duration</span><strong id="activeZeroGpuDuration">—</strong></div> | |
| </div> | |
| <p id="activeLatencyNote" class="latency-note">When available, the live smoke-test latency is used to recommend the `@spaces.GPU(duration=...)` value for ZeroGPU apps.</p> | |
| </section> | |
| <section class="mini-panel run-eval-archive-card" id="runEvalArchiveCard" aria-label="Run anonymous eval archive status" hidden> | |
| <div class="card-title-row"> | |
| <h4>Eval archive</h4> | |
| <span class="badge neutral" id="evalArchiveBadge">Not checked</span> | |
| </div> | |
| <div id="evalArchiveBody" class="eval-archive-body"> | |
| <div class="empty compact-empty">Archive publication status appears after the backend checks the run-local eval record.</div> | |
| </div> | |
| </section> | |
| <section class="mini-panel run-documents-card" id="runDocumentsCard" aria-label="Run traces document dock"> | |
| <div class="card-title-row"> | |
| <h4>Run traces</h4> | |
| <span class="muted">Document dock · source files</span> | |
| </div> | |
| <div id="runDocumentsDock" class="run-documents-dock"> | |
| <div class="empty">Source traces and documents will appear as files are written to the bucket.</div> | |
| </div> | |
| </section> | |
| </section> | |
| <section class="panel space-test-panel center-tab-panel" id="spaceTestSection" role="tabpanel" aria-labelledby="spaceTestTab" data-center-panel="validate" hidden> | |
| <div class="space-test-grid"> | |
| <div> | |
| <div class="section-head compact"><div><span class="panel-icon">⚗</span><h2>Space Test</h2></div></div> | |
| <p class="muted validation-help">Space Test is linked to the selected Build Run. It can replay a successful automatic smoke test, complete a partial run, or recover validation for the generated Space. Validation launches a separate validation run linked to the selected Build Run; it does not replace the current Active Run. Before each linked validation, the Job resolves the endpoint, normalizes the request payload to the current Gradio schema, and discovers the Gradio API schema before testing when endpoint details are missing. Test kwargs are endpoint-specific and the validation Job inspects the Gradio API schema and ignores unsupported kwargs with a warning.</p> | |
| <div class="form-grid test-top-row"> | |
| <label>Target Space ID<input id="validateSpace" placeholder="fffiloni/z-image-turbo-demo" /></label> | |
| <label>API name<input id="validateApi" value="/predict" /></label> | |
| <label>Expected output type<select id="expectedOutput"><option value="text">Text</option><option value="image">Image</option><option value="video">Video</option><option value="audio">Audio</option><option value="any">Any</option></select></label> | |
| <label>Timeout (s)<input id="validateTimeout" value="60" /></label> | |
| </div> | |
| <details class="space-test-advanced" open> | |
| <summary>Advanced request payload</summary> | |
| <div class="editor-grid"> | |
| <label>Test args (JSON array)<textarea id="testArgs" rows="7">[ | |
| "Explain the concept of agentic AI in one paragraph." | |
| ]</textarea></label> | |
| <label>Optional kwargs (JSON object)<textarea id="testKwargs" rows="7">{}</textarea></label> | |
| </div> | |
| </details> | |
| <p class="validation-args-note" id="spaceTestArgsNote" hidden>Arguments filled from discovered Gradio schema.</p> | |
| <p class="validation-args-note launch-readiness" id="spaceTestLaunchReadiness" hidden></p> | |
| </div> | |
| <div class="validation-result-card" id="spaceTestPreview"> | |
| <div class="validation-grid"> | |
| <div><span>Validation status</span><strong><span class="badge neutral" id="spaceTestStatus">Pending</span></strong></div> | |
| <div><span>Latency</span><strong id="spaceTestLatency">—</strong></div> | |
| <div><span>Endpoint</span><strong id="spaceTestEndpoint">—</strong></div> | |
| <div><span>Validation run ID</span><strong id="spaceTestOutput">Not launched</strong></div> | |
| <div><span>Started at</span><strong id="validationStartedAt">—</strong></div> | |
| <div><span>Verdict</span><strong id="spaceTestVerdict">pending</strong></div> | |
| </div> | |
| <div class="validation-endpoints-card" id="spaceTestContextCard"> | |
| <div class="card-title-row"><h4 id="spaceTestContextTitle">Linked validation context</h4><span class="muted" id="spaceTestContextHint">Build Run context · discovered by Gradio client when available</span></div> | |
| <div id="spaceTestEndpoints" class="validation-endpoints"><div class="empty compact-empty">No Gradio endpoints discovered yet.</div></div> | |
| </div> | |
| <div class="validation-progress-caption"><span>Validation progress</span><strong id="spaceTestProgressPercent">0%</strong></div> | |
| <div class="validation-progress-bar"><div id="spaceTestProgressFill" class="validation-progress-fill" style="width:0%"></div></div> | |
| <div class="validation-timeline" id="spaceTestTimeline"><div class="empty">No validation selected yet.</div></div> | |
| <div class="validation-actions"> | |
| <button class="primary full" id="launchValidate">Launch validation</button> | |
| <button class="secondary danger full" id="deleteValidationRun" disabled>Delete validation run</button> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| </div> | |
| <section class="panel runs-explorer-panel" id="runsExplorerPanel"> | |
| <div class="section-head compact"> | |
| <div><span class="panel-icon">☰</span><h2>Runs Explorer</h2></div> | |
| </div> | |
| <div class="search-wrap"><input id="runSearchFull" placeholder="Search runs by ID, model, or space…" /><span>⌕</span></div> | |
| <div class="run-filters" id="runFilters"> | |
| <button class="filter active" data-status="all">All</button> | |
| <button class="filter" data-status="running">Running</button> | |
| <button class="filter" data-status="full_inference_success">Success</button> | |
| <button class="filter" data-status="validated_after_manual_space_test">Validated</button> | |
| <button class="filter" data-status="recovered_by_manual_validation">Recovered</button> | |
| <button class="filter" data-status="partial_validation">Partial</button> | |
| <button class="filter" data-status="manual_hardware_required">Manual</button> | |
| <button class="filter" data-status="failed">Failed</button> | |
| <button class="filter" data-status="stale">Stale</button> | |
| </div> | |
| <div id="runsTable" class="runs-table">Loading runs…</div> | |
| <div id="runsPagination" class="runs-pagination"></div> | |
| <section class="run-stats-card" id="runStatsPanel" aria-label="Aggregated run statistics"> | |
| <div class="card-title-row"> | |
| <h4>Run Stats</h4> | |
| <span class="badge neutral" id="runStatsBadge">No runs</span> | |
| </div> | |
| <div class="run-stats-list" id="runStatsList"> | |
| <div class="empty">Run stats will appear after the first refresh.</div> | |
| </div> | |
| </section> | |
| <section class="eval-archive-panel" id="evalArchiveCard" hidden aria-label="Anonymous eval archive"> | |
| <div class="card-title-row eval-archive-title-row"> | |
| <div> | |
| <span class="mini-kicker">Eval archive</span> | |
| <h4 id="evalArchiveTitle">Checking…</h4> | |
| </div> | |
| <span class="badge neutral" id="evalArchiveStateBadge">Checking</span> | |
| </div> | |
| <p id="anonymousEvalText" class="eval-archive-summary">Anonymous project eval archive: checking…</p> | |
| <div class="eval-archive-actions" id="evalArchiveActions"> | |
| <button class="secondary small eval-enable-button" id="enableEvalArchive" hidden>Enable</button> | |
| <button class="secondary small" id="verifyEvalArchive" hidden>Verify</button> | |
| <button class="secondary small danger" id="disableEvalArchive" hidden>Disable</button> | |
| <button class="secondary small danger eval-flush-button" id="flushEvalArchive" hidden>Flush records</button> | |
| </div> | |
| </section> | |
| <section class="panel billing-panel" id="billingPanel"> | |
| <div class="section-head compact"> | |
| <div><span class="panel-icon">¢</span><h2>Billing & compute</h2></div> | |
| <span class="badge neutral" id="billingStatusBadge">Check billing</span> | |
| </div> | |
| <div class="billing-warning-simple billing-cost-note" role="note"> | |
| <strong>This can cost money.</strong> | |
| <p>Builds launch Hugging Face Jobs. Pi uses Hugging Face Inference Providers for Qwen and other selected assistant models, and usage may consume paid inference credits. Before running builds, open your Hugging Face Billing dashboard and make sure payment, quotas and spend limits are okay.</p> | |
| </div> | |
| <div class="billing-simple billing-compat" hidden aria-hidden="true"> | |
| <span id="billingUsage">Dashboard only</span> | |
| <span>Payment readiness</span> | |
| <span>Pi assistant</span> | |
| <span>Build Job</span> | |
| <span>Generated Space</span> | |
| <span>Guardrail</span> | |
| <span>Hugging Face Inference Providers</span> | |
| <span>Pi uses Hugging Face Inference Providers for Qwen and other selected assistant models. Usage may consume paid inference credits.</span> | |
| <span>A100/H200</span> | |
| <span>Review spend and quotas</span> | |
| </div> | |
| <a class="link-btn small full" id="openBilling" href="https://huggingface.co/settings/billing" target="_blank">Open billing dashboard ↗</a> | |
| </section> | |
| </section> | |
| </section><div class="support-elements" hidden> | |
| <input id="runSearch" /> | |
| <input id="runId" /> | |
| <textarea id="buildGoal"></textarea> | |
| <button id="refreshRuns"></button> | |
| <div id="runsTableHome"></div> | |
| <button id="refreshRunsHome"></button> | |
| <a id="runHeaderSpace" target="_blank"></a> | |
| <span id="progressTitle"></span><span id="lastEvent"></span><span id="lastPolled"></span><span id="hardwarePlan"></span> | |
| <span id="detailJobStatus"></span><span id="detailGateStatus"></span><span id="detailHardware"></span><span id="detailTraces"></span><span id="homeRunDetailStatus"></span> | |
| <span id="selectedModelIdHidden"></span><span id="selectedHardwareHidden"></span> | |
| <ul id="selectedValidation"></ul><ul id="zeroGpuChecklist"></ul><div id="statusChips"></div> | |
| <div id="diagBuildStatus"></div><div id="diagBuildStep"></div> | |
| <div id="issueCard"><strong id="issueTitle"></strong><p id="issueDetail"></p></div> | |
| <ul id="metricsList"></ul> | |
| <pre id="reportPreview"></pre><div id="artifactList"></div> | |
| </div> | |
| </main> | |
| </div> | |
| <script src="/custom-static/api.js?v=v198.26.32"></script> | |
| <script src="/custom-static/components.js?v=v198.26.32"></script> | |
| <script src="/custom-static/progress.js?v=v198.26.32"></script> | |
| <script src="/custom-static/runs.js?v=v198.26.32"></script> | |
| <script src="/custom-static/app.js?v=v198.26.32"></script> | |
| </body> | |
| </html> | |