fix confuse UI commit

This commit is contained in:
taDuc
2026-05-10 23:38:07 +07:00
parent c371d70993
commit 9be308b65c
5 changed files with 58 additions and 34 deletions
-6
View File
@@ -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}
+2 -2
View File
@@ -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,
})
);
}
+54 -16
View File
@@ -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>
);
}
@@ -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) {
@@ -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,