refactor: organize frontend components into features/ directories

Moved 43 component files into 9 feature domains: - features/git/ — commit-dialog, commit-panel, file-editor, git-mount-editor, git-toolbar, merge-dialog - features/project/ — repositories-settings-tab, repository-create-dialog - features/terminal/ — special-keys-panel, special-keys-strip, terminal-session-tabs, terminal - features/workspace/ — workspace-card, workspace-create-form, workspace-header, workspace-instance-chips - features/session/ — create-session-form, session-card, session-list - features/tool/ — instance-list, manifest-editor, start-tool-fab, start-tool-modal, tool-starter, tools-bottom-sheet - features/notification/ — event-toast-bridge, notification-center, notification-item - features/settings/ — settings-tab-layout - features/mobile/ — mobile-action-sheet, mobile-detail-view, mobile-edit-view, mobile-fab, mobile-list-view, mobile-nav, mobile-page-header, mobile-terminal-header, mobile-terminal-wrapper Updated all imports across pages and components. Root components/ now only contains generic UI pieces: app-shell, code-editor, data-states, icon, protected-route, syntax-highlighter. Quality gates: verified no remaining old imports.
2026-06-04 12:37:24 +02:00
parent 7224afafd1
commit 1021d61be3
54 changed files with 31 additions and 31 deletions
@@ -0,0 +1,159 @@
+import React, { useState } from "react";
+
+import { Icon } from "./icon";
+
+interface CommitDialogProps {
+  isOpen: boolean;
+  filePath: string;
+  originalContent: string;
+  newContent: string;
+  onCommit: (message: string) => Promise<void>;
+  onCancel: () => void;
+}
+
+export const CommitDialog: React.FC<CommitDialogProps> = ({
+  isOpen,
+  filePath,
+  originalContent,
+  newContent,
+  onCommit,
+  onCancel,
+}) => {
+  const [message, setMessage] = useState("");
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(">");
+
+  if (!isOpen) return null;
+
+  const generateDiff = () => {
+    const originalLines = originalContent.split("\n");
+    const newLines = newContent.split("\n");
+    const maxLines = Math.max(originalLines.length, newLines.length);
+    const diff: { type: "same" | "added" | "removed"; line: string; lineNum: number }[] = [];
+
+    for (let i = 0; i < maxLines; i++) {
+      const original = originalLines[i] || "";
+      const updated = newLines[i] || "";
+
+      if (original === updated) {
+        diff.push({ type: "same", line: updated, lineNum: i + 1 });
+      } else {
+        if (original) {
+          diff.push({ type: "removed", line: original, lineNum: i + 1 });
+        }
+        if (updated) {
+          diff.push({ type: "added", line: updated, lineNum: i + 1 });
+        }
+      }
+    }
+
+    return diff;
+  };
+
+  const handleCommit = async () => {
+    if (!message.trim()) {
+      setError("Please enter a commit message");
+      return;
+    }
+
+    setLoading(true);
+    setError("");
+    try {
+      await onCommit(message);
+    } catch {
+      setError("Failed to commit changes");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const diff = generateDiff();
+  const hasChanges = diff.some((d) => d.type !== "same");
+
+  return (
+    <div className="dialog-overlay">
+      <div className="commit-dialog">
+        <div className="dialog-header">
+          <h3>Commit Changes</h3>
+          <button className="dialog-close" onClick={onCancel} type="button">
+            ×
+          </button>
+        </div>
+
+        <div className="dialog-body">
+          <p className="file-info">
+            Editing: <strong>{filePath}</strong>
+          </p>
+
+          {!hasChanges && (
+            <div className="warning-message">No changes to commit</div>
+          )}
+
+          {hasChanges && (
+            <div className="diff-preview">
+              <h4>Changes</h4>
+              <div className="diff-content">
+                {diff.map((line, i) => (
+                  <div
+                    key={i}
+                    className={`diff-line diff-${line.type}`}
+                  >
+                    <span className="diff-line-number">{line.lineNum}</span>
+                    <span className="diff-marker">
+                      {line.type === "added" && "+"}
+                      {line.type === "removed" && "-"}
+                      {line.type === "same" && " "}
+                    </span>
+                    <span className="diff-line-content">{line.line}</span>
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+
+          <div className="form-group">
+            <label>Commit Message *</label>
+            <textarea
+              value={message}
+              onChange={(e) => setMessage(e.target.value)}
+              placeholder="Describe your changes..."
+              rows={3}
+              className="form-textarea"
+            />
+          </div>
+
+          {error && <div className="error-message">{error}</div>}
+        </div>
+
+        <div className="dialog-footer">
+          <button
+            className="btn-secondary"
+            onClick={onCancel}
+            type="button"
+          >
+            <Icon name="cancel" size="sm" />
+            Cancel
+          </button>
+          <button
+            className="btn-primary"
+            onClick={handleCommit}
+            disabled={loading || !hasChanges || !message.trim()}
+            type="button"
+          >
+            {loading ? (
+              <>
+                <Icon name="loading" size="sm" />
+                Committing...
+              </>
+            ) : (
+              <>
+                <Icon name="commit" size="sm" />
+                Commit Changes
+              </>
+            )}
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+};