index.html の更新 by chi20253032 · Pull Request #747 · mindcraft-bots/mindcraft

chi20253032 · 2026-03-28T07:32:07Z

No description provided.

Copilot

Pull request overview

This PR rewrites src/mindcraft/public/index.html, aiming to modernize the Mindcraft web dashboard UI with theming and multi-language support.

Changes:

Replaced the previous dashboard layout/styles with a new “card/grid” UI, sticky header, fixed footer, and toast styling.
Added language selection + theme toggle with persistence via localStorage.
Removed most of the prior client-side functionality (agent rendering, create-agent flow, settings modals, and live state subscriptions).

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-03-29T21:39:46Z

+        socket.on('connect', () => updateStatus(true));
+        socket.on('disconnect', () => updateStatus(false));



The dashboard no longer subscribes to agent updates: there’s no socket.emit('listen-to-agents') on connect and no handlers for agents-status / state-update. As a result, #agents will never render and #noAgents will never be updated, effectively breaking the UI. Reintroduce the subscription and rendering logic (or equivalent) tied to these existing server events.

Copilot · 2026-03-29T21:39:47Z

-                </div>
-            </div>
+    <footer class="footer">
+        <div><button id="openCreateAgentBtn"><span data-lang="en">➕ New Agent</span></button></div>


openCreateAgentBtn is still rendered, but the Create Agent modal and all related JS (fetching /settings_spec.json, profile upload, emitting create-agent, etc.) were removed. This leaves a dead control and removes the ability to create agents from the web UI even though the server still supports create-agent. Either restore the create-agent flow or remove the button to avoid a broken UX.

Suggested change

<div><button id="openCreateAgentBtn"><span data-lang="en">➕ New Agent</span></button></div>

Copilot · 2026-03-29T21:39:47Z

+        function updateStatus(connected) {
+            const statusEl = document.getElementById('msStatus');
+            statusEl.classList.remove('offline', 'online');
+            statusEl.classList.add(connected ? 'online' : 'offline');


updateStatus() only toggles the online/offline classes but never updates the status text, and the markup hard-codes every language string as “Offline”. After a successful connect the badge will still say “Offline”. Consider updating the visible [data-lang] span text (or swapping between separate online/offline spans) when connection state changes.

Suggested change

statusEl.classList.add(connected ? 'online' : 'offline');

statusEl.classList.add(connected ? 'online' : 'offline');

// Update visible status text for all localized spans within the status element

const statusText = connected ? 'Online' : 'Offline';

const localizedSpans = statusEl.querySelectorAll('[data-lang]');

if (localizedSpans.length > 0) {

localizedSpans.forEach(span => {

span.textContent = statusText;

});

} else {

statusEl.textContent = statusText;

}

Copilot · 2026-03-29T21:39:47Z

+        }
+        .status-badge.online { color: var(--success); border-color: var(--success); }
+        .status-badge.offline { color: var(--danger); border-color: var(--danger); }
+        .status-dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse 2s infinite; }


.status-dot has size/animation but no background-color, so it will likely be invisible. If the intent is a colored status indicator, set background (e.g., currentColor) and/or override it in .status-badge.online/.offline.

Suggested change

.status-dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse 2s infinite; }

.status-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: pulse 2s infinite; }

Copilot · 2026-03-29T21:39:47Z

+<body data-theme="dark">
+    <header class="header">
+        <div class="header-title">


Theme initialization is inconsistent: <body data-theme="dark"> sets a data-theme attribute on body, but the CSS and setTheme() both use html[data-theme]. This body attribute is unused and can be misleading; consider removing it or switching to a single source of truth.

Copilot · 2026-03-29T21:39:48Z

+                <span data-lang="id" style="display:none;">Offline</span>
+                <span data-lang="uk" style="display:none;">Автономний</span>
+                <span data-lang="cs" style="display:none;">Offline</span>
+                <span data-lang="el" style="display:none;">Σύνδεση</span>


Greek translation for the offline status appears incorrect: Σύνδεση means “connection/connected”, not “offline”. If this badge is meant to indicate offline, use the appropriate Greek phrase (e.g., “Εκτός σύνδεσης”).

Suggested change

<span data-lang="el" style="display:none;">Σύνδεση</span>

<span data-lang="el" style="display:none;">Εκτός σύνδεσης</span>

Copilot · 2026-03-29T21:39:48Z

+        .modal-backdrop.active { display: flex; }
+        .modal { background: var(--bg-surface); border-radius: 12px; width: 90vw; max-width: 600px; max-height: 80vh; overflow-y: auto; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3); padding: 20px; }
+        [data-lang] { display: none; }
+        [data-lang="en"] { display: auto; }


CSS uses display: auto for language toggling ([data-lang="en"] { display: auto; }), but auto is not a valid value for display. Because [data-lang] { display: none; } hides everything, this rule won’t re-enable English content. Use a valid display value (e.g., inline/block) or toggle a class/hidden attribute instead.

Suggested change

[data-lang="en"] { display: auto; }

[data-lang="en"] { display: inline; }

Copilot · 2026-03-29T21:39:48Z

+            currentLang = lang;
+            localStorage.setItem('mindcraft-lang', lang);
+            document.querySelectorAll('[data-lang]').forEach(el => {
+                el.style.display = el.getAttribute('data-lang') === lang ? 'auto' : 'none';


setLanguage() assigns el.style.display = 'auto', but auto is not a valid display value. For elements that start with style="display:none", setting an invalid value can leave them hidden, so language switching won’t work. Set to a valid value (e.g., '', inline, block) or use hidden/CSS classes for toggling.

Suggested change

el.style.display = el.getAttribute('data-lang') === lang ? 'auto' : 'none';

el.style.display = el.getAttribute('data-lang') === lang ? '' : 'none';

修正しました。

chi20253032 added 2 commits March 28, 2026 16:00

index.html の更新

94fdf57

Fix HTML structure by removing language attribute

3b2626e

Sweaterdog requested review from Ninot1Quyi and Copilot March 29, 2026 21:37

Copilot started reviewing on behalf of Sweaterdog March 29, 2026 21:37 View session

Copilot AI reviewed Mar 29, 2026

View reviewed changes

Updated index.html to fix various issues as requested.

9e6b938

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

index.html の更新#747

index.html の更新#747
chi20253032 wants to merge 3 commits intomindcraft-bots:developfrom
chi20253032:develop

chi20253032 commented Mar 28, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

Copilot AI Mar 29, 2026

Uh oh!

chi20253032 Mar 29, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		socket.on('connect', () => updateStatus(true));
		socket.on('disconnect', () => updateStatus(false));

-            statusEl.classList.add(connected ? 'online' : 'offline');
+            statusEl.classList.add(connected ? 'online' : 'offline');
+            // Update visible status text for all localized spans within the status element
+            const statusText = connected ? 'Online' : 'Offline';
+            const localizedSpans = statusEl.querySelectorAll('[data-lang]');
+            if (localizedSpans.length > 0) {
+                localizedSpans.forEach(span => {
+                    span.textContent = statusText;
+                });
+            } else {
+                statusEl.textContent = statusText;
+            }

	.status-dot { width: 8px; height: 8px; border-radius: 50%; animation: pulse 2s infinite; }
	.status-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: pulse 2s infinite; }

	<span data-lang="el" style="display:none;">Σύνδεση</span>
	<span data-lang="el" style="display:none;">Εκτός σύνδεσης</span>

	[data-lang="en"] { display: auto; }
	[data-lang="en"] { display: inline; }

	el.style.display = el.getAttribute('data-lang') === lang ? 'auto' : 'none';
	el.style.display = el.getAttribute('data-lang') === lang ? '' : 'none';

Conversation

chi20253032 commented Mar 28, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

chi20253032 Mar 29, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants