From 9be308b65c2e188776e217fd1d13ed57a003cb18 Mon Sep 17 00:00:00 2001
From: taDuc <tranduc.wsp@gmail.com>
Date: Sun, 10 May 2026 23:38:07 +0700
Subject: [PATCH] fix confuse UI commit

---
 src/app/editor/[id]/page.tsx                  |  6 --
 src/uhm/api/sections.ts                       |  4 +-
 src/uhm/components/Editor.tsx                 | 70 ++++++++++++++-----
 .../lib/editor/section/useSectionCommands.ts  |  8 +--
 .../editor/session/useSectionSessionState.ts  |  4 --
 5 files changed, 58 insertions(+), 34 deletions(-)

diff --git a/src/app/editor/[id]/page.tsx b/src/app/editor/[id]/page.tsx
index e9b6cbe..89fc70b 100644
--- a/src/app/editor/[id]/page.tsx
+++ b/src/app/editor/[id]/page.tsx
@@ -113,8 +113,6 @@ export default function Page() {
         setNewSectionTitle,
         commitTitle,
         setCommitTitle,
-        commitNote,
-        setCommitNote,
         editorUserIdInput,
         activeSection,
         setActiveSection,
@@ -375,7 +373,6 @@ export default function Page() {
         snapshotEntityWikiLinks,
         baselineSnapshot,
         commitTitle,
-        commitNote,
         setActiveSection,
         setSelectedSectionId,
         setSectionState,
@@ -394,7 +391,6 @@ export default function Page() {
         setAvailableSections,
         setNewSectionTitle,
         setCommitTitle,
-        setCommitNote,
     });
     const {
         openSectionForEditing,
@@ -1141,9 +1137,7 @@ export default function Page() {
                 sectionTitle={activeSection?.title || "Đang tải project"}
                 sectionStatus={sectionState?.status || "editing"}
                 commitTitle={commitTitle}
-                commitNote={commitNote}
                 onCommitTitleChange={setCommitTitle}
-                onCommitNoteChange={setCommitNote}
                 commitCount={sectionCommits.length}
                 hasHeadCommit={Boolean(sectionState?.head_commit_id)}
                 headCommitId={sectionState?.head_commit_id || null}
diff --git a/src/uhm/api/sections.ts b/src/uhm/api/sections.ts
index 7290082..c6f3af1 100644
--- a/src/uhm/api/sections.ts
+++ b/src/uhm/api/sections.ts
@@ -124,7 +124,7 @@ export async function restoreSectionCommit(
     return { commit: headCommit, state };
 }
 
-export async function submitSection(sectionId: string): Promise<SectionSubmission> {
+export async function submitSection(sectionId: string, content: string): Promise<SectionSubmission> {
     // Submit latest commit of project
     const project = await requestJson<Section>(`${API_ENDPOINTS.projects}/${encodeURIComponent(sectionId)}`);
     const commitId = project.latest_commit_id;
@@ -137,7 +137,7 @@ export async function submitSection(sectionId: string): Promise<SectionSubmissio
         jsonRequestInit("POST", {
             project_id: sectionId,
             commit_id: commitId,
-            content: "",
+            content: content,
         })
     );
 }
diff --git a/src/uhm/components/Editor.tsx b/src/uhm/components/Editor.tsx
index 816ba03..0c1c699 100644
--- a/src/uhm/components/Editor.tsx
+++ b/src/uhm/components/Editor.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import type { ReactNode } from "react";
+import { useState, type ReactNode } from "react";
 import type { UndoAction } from "@/uhm/lib/useEditorState";
 import type { EditorMode } from "@/uhm/lib/editor/session/sessionTypes";
 
@@ -10,16 +10,14 @@ type Props = {
     entityStatus?: string | null;
     onUndo: () => void;
     onCommit: () => void;
-    onSubmit: () => void;
+    onSubmit: (content: string) => void;
     onRestoreCommit: (commitId: string) => void;
     isSaving: boolean;
     isSubmitting: boolean;
     sectionTitle: string;
     sectionStatus: string;
     commitTitle: string;
-    commitNote: string;
     onCommitTitleChange: (title: string) => void;
-    onCommitNoteChange: (note: string) => void;
     commitCount: number;
     hasHeadCommit: boolean;
     headCommitId: string | null;
@@ -58,9 +56,7 @@ export default function Editor({
     sectionTitle,
     sectionStatus,
     commitTitle,
-    commitNote,
     onCommitTitleChange,
-    onCommitNoteChange,
     commitCount,
     hasHeadCommit,
     headCommitId,
@@ -80,6 +76,23 @@ export default function Editor({
         }
     };
 
+    const [isSubmitModalOpen, setIsSubmitModalOpen] = useState(false);
+    const [submitContent, setSubmitContent] = useState("");
+
+    const handleOpenSubmitModal = () => {
+        setSubmitContent("");
+        setIsSubmitModalOpen(true);
+    };
+
+    const handleConfirmSubmit = () => {
+        setIsSubmitModalOpen(false);
+        onSubmit(submitContent);
+    };
+
+    const handleCancelSubmit = () => {
+        setIsSubmitModalOpen(false);
+    };
+
     const recentUndoLabels = (() => {
         const seen = new Set<string>();
         const labels: string[] = [];
@@ -227,18 +240,10 @@ export default function Editor({
                 <input
                     value={commitTitle}
                     onChange={(event) => onCommitTitleChange(event.target.value)}
-                    placeholder="Commit title"
+                    placeholder="Edit Summary (Commit Title)"
                     disabled={isSaving || isSubmitting}
                     style={textInputStyle}
                 />
-                <textarea
-                    value={commitNote}
-                    onChange={(event) => onCommitNoteChange(event.target.value)}
-                    placeholder="Commit note"
-                    disabled={isSaving || isSubmitting}
-                    rows={3}
-                    style={textAreaStyle}
-                />
                 <button
                     style={{
                         ...primaryButtonStyle,
@@ -261,7 +266,7 @@ export default function Editor({
                         cursor: isSubmitting || !hasHeadCommit ? "not-allowed" : "pointer",
                         opacity: !hasHeadCommit ? 0.6 : 1,
                     }}
-                    onClick={onSubmit}
+                    onClick={handleOpenSubmitModal}
                     disabled={isSubmitting || !hasHeadCommit}
                 >
                     Submit
@@ -382,6 +387,39 @@ export default function Editor({
                     </ul>
                 )}
             </Panel>
+
+            {isSubmitModalOpen && (
+                <div style={{
+                    position: "fixed",
+                    top: 0, left: 0, right: 0, bottom: 0,
+                    backgroundColor: "rgba(0, 0, 0, 0.7)",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    zIndex: 1000
+                }}>
+                    <div style={{
+                        background: "#0b1220",
+                        padding: 20,
+                        borderRadius: 8,
+                        border: "1px solid #334155",
+                        width: 400,
+                        color: "white"
+                    }}>
+                        <h3 style={{ marginTop: 0 }}>Nội dung Submit</h3>
+                        <textarea
+                            value={submitContent}
+                            onChange={(e) => setSubmitContent(e.target.value)}
+                            placeholder="Nhập nội dung submit..."
+                            style={{ ...textAreaStyle, height: 100 }}
+                        />
+                        <div style={{ display: "flex", justifyContent: "flex-end", gap: 10, marginTop: 15 }}>
+                            <button onClick={handleCancelSubmit} style={{ padding: "8px 16px", borderRadius: 6, cursor: "pointer", border: "1px solid #334155", background: "transparent", color: "white" }}>Hủy</button>
+                            <button onClick={handleConfirmSubmit} style={{ padding: "8px 16px", borderRadius: 6, cursor: "pointer", border: "none", background: "#16a34a", color: "white", fontWeight: "bold" }}>Gửi Submit</button>
+                        </div>
+                    </div>
+                </div>
+            )}
         </div>
     );
 }
diff --git a/src/uhm/lib/editor/section/useSectionCommands.ts b/src/uhm/lib/editor/section/useSectionCommands.ts
index 57f03d9..2f4d6d9 100644
--- a/src/uhm/lib/editor/section/useSectionCommands.ts
+++ b/src/uhm/lib/editor/section/useSectionCommands.ts
@@ -37,7 +37,6 @@ type Options = {
     snapshotEntityWikiLinks: EntityWikiLinkSnapshot[];
     baselineSnapshot: EditorSnapshot | null;
     commitTitle: string;
-    commitNote: string;
     setActiveSection: Dispatch<SetStateAction<Section | null>>;
     setSelectedSectionId: Dispatch<SetStateAction<string>>;
     setSectionState: Dispatch<SetStateAction<SectionState | null>>;
@@ -56,7 +55,6 @@ type Options = {
     setAvailableSections: Dispatch<SetStateAction<Section[]>>;
     setNewSectionTitle: Dispatch<SetStateAction<string>>;
     setCommitTitle: Dispatch<SetStateAction<string>>;
-    setCommitNote: Dispatch<SetStateAction<string>>;
 };
 
 export function useSectionCommands(options: Options) {
@@ -107,7 +105,6 @@ export function useSectionCommands(options: Options) {
                 hasPersistedFeature: options.editor.hasPersistedFeature,
             });
             const editSummary = options.commitTitle.trim()
-                || options.commitNote.trim()
                 || `Edit ${new Date().toLocaleString()}`;
 
             // Guardrail: commit payload can get large and some deployments reject/close connections for big bodies.
@@ -141,7 +138,6 @@ export function useSectionCommands(options: Options) {
             options.setInitialData(options.editor.draft);
             options.editor.clearChanges();
             options.setCommitTitle("");
-            options.setCommitNote("");
             options.setSectionCommits(await fetchSectionCommits(options.activeSection.id));
             options.setEntityFormStatus("Đã tạo commit.");
         } catch (err) {
@@ -218,7 +214,7 @@ export function useSectionCommands(options: Options) {
         }
     }, [openSectionForEditing, options]);
 
-    const submitCurrentSection = useCallback(async () => {
+    const submitCurrentSection = useCallback(async (content: string) => {
         if (!options.activeSection || !options.sectionState?.head_commit_id) {
             options.setEntityStatus("Section hiện tại chưa có head để submit.");
             return;
@@ -231,7 +227,7 @@ export function useSectionCommands(options: Options) {
         options.setIsSubmitting(true);
         options.setEntityStatus(null);
         try {
-            const submission = await submitSection(options.activeSection.id);
+            const submission = await submitSection(options.activeSection.id, content);
             options.setEntityStatus(`Đã submit, submission ${submission.id}.`);
         } catch (err) {
             if (err instanceof ApiError) {
diff --git a/src/uhm/lib/editor/session/useSectionSessionState.ts b/src/uhm/lib/editor/session/useSectionSessionState.ts
index 18d0b7c..aa866a8 100644
--- a/src/uhm/lib/editor/session/useSectionSessionState.ts
+++ b/src/uhm/lib/editor/session/useSectionSessionState.ts
@@ -41,8 +41,6 @@ export function useSectionSessionState(options: Options) {
     const [newSectionTitle, setNewSectionTitle] = useState("");
     // Input title cho commit.
     const [commitTitle, setCommitTitle] = useState("");
-    // Input note cho commit.
-    const [commitNote, setCommitNote] = useState("");
     // User ID dùng để gắn vào commit/submit/lock.
     const [editorUserIdInput, setEditorUserIdInput] = useState(options.defaultEditorUserId);
     // Section đang mở để edit (null nếu chưa mở).
@@ -69,8 +67,6 @@ export function useSectionSessionState(options: Options) {
         setNewSectionTitle,
         commitTitle,
         setCommitTitle,
-        commitNote,
-        setCommitNote,
         editorUserIdInput,
         setEditorUserIdInput,
         activeSection,