Hugging Face's logo

Spaces:
NOT-OMEGA
/
AutoForge
Runtime error

App Files Community
AutoForge
File size: 5,155 Bytes
6a0ff33
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="AutoForge Workflow Details">
    <title>AutoForge — Workflow</title>
    <link rel="stylesheet" href="/css/style.css">
</head>
<body>
    <div class="app-layout">
        <!-- Sidebar -->
        <nav class="sidebar">
            <div class="sidebar-header">
                <div class="sidebar-brand">
                    <div class="logo">⚡</div>
                    <h1>AutoForge</h1>
                </div>
            </div>
            <div class="sidebar-nav">
                <a href="dashboard.html" class="nav-item">
                    <span class="icon">📊</span><span>Dashboard</span>
                </a>
                <a href="workflow.html" class="nav-item active">
                    <span class="icon">⚙️</span><span>Workflow</span>
                </a>
                <a href="history.html" class="nav-item">
                    <span class="icon">📜</span><span>History</span>
                </a>
                <a href="settings.html" class="nav-item">
                    <span class="icon">🔧</span><span>Settings</span>
                </a>
            </div>
            <div class="sidebar-footer">
                <div class="user-menu" id="logout-btn">
                    <div class="user-avatar" id="user-avatar">U</div>
                    <span class="user-name" id="user-display-name">User</span>
                </div>
            </div>
        </nav>

        <!-- Main Content -->
        <main class="main-content">
            <div class="page-header">
                <h2>Workflow Details</h2>
                <p id="workflow-id-display">Loading…</p>
            </div>

            <div id="workflow-detail">
                <div class="spinner" style="margin: 3rem auto;"></div>
            </div>
        </main>
    </div>

    <script src="/js/api.js"></script>
    <script src="/js/auth.js"></script>
    <script src="/js/router.js"></script>
    <script src="/js/app.js"></script>
    <script>
        if (Router.init()) {
            App.initSidebar();

            const params = new URLSearchParams(window.location.search);
            const id = params.get('id');

            if (id) {
                loadWorkflowDetail(id);
            } else {
                document.getElementById('workflow-detail').innerHTML = `
                    <div class="placeholder-content">
                        <div class="icon-placeholder">⚙️</div>
                        <h3>Select a Workflow</h3>
                        <p>Choose a workflow from the dashboard to view its details and execution progress.</p>
                    </div>
                `;
            }

            async function loadWorkflowDetail(workflowId) {
                try {
                    const wf = await API.get(`/api/workflows/${workflowId}`);
                    document.getElementById('workflow-id-display').textContent = `ID: ${wf.id}`;
                    document.getElementById('workflow-detail').innerHTML = `
                        <div class="card glass fade-in" style="margin-bottom: 1.5rem;">
                            <div class="card-header">
                                <span class="card-title">Prompt</span>
                                <span class="badge badge-${wf.status}">${wf.status}</span>
                            </div>
                            <p style="color: var(--text-secondary); line-height: 1.7; font-family: var(--font-mono); font-size: 0.9rem;">${wf.prompt}</p>
                        </div>
                        <div class="card glass fade-in" style="animation-delay: 0.1s;">
                            <div class="card-header">
                                <span class="card-title">Tasks</span>
                                <span class="badge badge-pending">${wf.tasks.length} task(s)</span>
                            </div>
                            ${wf.tasks.length === 0
                                ? '<p style="color: var(--text-muted);">No tasks created yet. DAG execution will populate tasks in a future phase.</p>'
                                : wf.tasks.map(t => `
                                    <div style="padding: 0.75rem; border-bottom: 1px solid var(--border-subtle);">
                                        <strong>${t.task_type}</strong> — <span class="badge badge-${t.status}">${t.status}</span>
                                    </div>
                                `).join('')
                            }
                        </div>
                    `;
                } catch (err) {
                    document.getElementById('workflow-detail').innerHTML = `
                        <div class="placeholder-content">
                            <div class="icon-placeholder">❌</div>
                            <h3>Error</h3>
                            <p>${err.message}</p>
                        </div>
                    `;
                }
            }
        }
    </script>
</body>
</html>