fix confuse UI commit
This commit is contained in:
@@ -113,8 +113,6 @@ export default function Page() {
|
|||||||
setNewSectionTitle,
|
setNewSectionTitle,
|
||||||
commitTitle,
|
commitTitle,
|
||||||
setCommitTitle,
|
setCommitTitle,
|
||||||
commitNote,
|
|
||||||
setCommitNote,
|
|
||||||
editorUserIdInput,
|
editorUserIdInput,
|
||||||
activeSection,
|
activeSection,
|
||||||
setActiveSection,
|
setActiveSection,
|
||||||
@@ -375,7 +373,6 @@ export default function Page() {
|
|||||||
snapshotEntityWikiLinks,
|
snapshotEntityWikiLinks,
|
||||||
baselineSnapshot,
|
baselineSnapshot,
|
||||||
commitTitle,
|
commitTitle,
|
||||||
commitNote,
|
|
||||||
setActiveSection,
|
setActiveSection,
|
||||||
setSelectedSectionId,
|
setSelectedSectionId,
|
||||||
setSectionState,
|
setSectionState,
|
||||||
@@ -394,7 +391,6 @@ export default function Page() {
|
|||||||
setAvailableSections,
|
setAvailableSections,
|
||||||
setNewSectionTitle,
|
setNewSectionTitle,
|
||||||
setCommitTitle,
|
setCommitTitle,
|
||||||
setCommitNote,
|
|
||||||
});
|
});
|
||||||
const {
|
const {
|
||||||
openSectionForEditing,
|
openSectionForEditing,
|
||||||
@@ -1141,9 +1137,7 @@ export default function Page() {
|
|||||||
sectionTitle={activeSection?.title || "Đang tải project"}
|
sectionTitle={activeSection?.title || "Đang tải project"}
|
||||||
sectionStatus={sectionState?.status || "editing"}
|
sectionStatus={sectionState?.status || "editing"}
|
||||||
commitTitle={commitTitle}
|
commitTitle={commitTitle}
|
||||||
commitNote={commitNote}
|
|
||||||
onCommitTitleChange={setCommitTitle}
|
onCommitTitleChange={setCommitTitle}
|
||||||
onCommitNoteChange={setCommitNote}
|
|
||||||
commitCount={sectionCommits.length}
|
commitCount={sectionCommits.length}
|
||||||
hasHeadCommit={Boolean(sectionState?.head_commit_id)}
|
hasHeadCommit={Boolean(sectionState?.head_commit_id)}
|
||||||
headCommitId={sectionState?.head_commit_id || null}
|
headCommitId={sectionState?.head_commit_id || null}
|
||||||
|
|||||||
@@ -124,7 +124,7 @@ export async function restoreSectionCommit(
|
|||||||
return { commit: headCommit, state };
|
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
|
// Submit latest commit of project
|
||||||
const project = await requestJson<Section>(`${API_ENDPOINTS.projects}/${encodeURIComponent(sectionId)}`);
|
const project = await requestJson<Section>(`${API_ENDPOINTS.projects}/${encodeURIComponent(sectionId)}`);
|
||||||
const commitId = project.latest_commit_id;
|
const commitId = project.latest_commit_id;
|
||||||
@@ -137,7 +137,7 @@ export async function submitSection(sectionId: string): Promise<SectionSubmissio
|
|||||||
jsonRequestInit("POST", {
|
jsonRequestInit("POST", {
|
||||||
project_id: sectionId,
|
project_id: sectionId,
|
||||||
commit_id: commitId,
|
commit_id: commitId,
|
||||||
content: "",
|
content: content,
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import type { ReactNode } from "react";
|
import { useState, type ReactNode } from "react";
|
||||||
import type { UndoAction } from "@/uhm/lib/useEditorState";
|
import type { UndoAction } from "@/uhm/lib/useEditorState";
|
||||||
import type { EditorMode } from "@/uhm/lib/editor/session/sessionTypes";
|
import type { EditorMode } from "@/uhm/lib/editor/session/sessionTypes";
|
||||||
|
|
||||||
@@ -10,16 +10,14 @@ type Props = {
|
|||||||
entityStatus?: string | null;
|
entityStatus?: string | null;
|
||||||
onUndo: () => void;
|
onUndo: () => void;
|
||||||
onCommit: () => void;
|
onCommit: () => void;
|
||||||
onSubmit: () => void;
|
onSubmit: (content: string) => void;
|
||||||
onRestoreCommit: (commitId: string) => void;
|
onRestoreCommit: (commitId: string) => void;
|
||||||
isSaving: boolean;
|
isSaving: boolean;
|
||||||
isSubmitting: boolean;
|
isSubmitting: boolean;
|
||||||
sectionTitle: string;
|
sectionTitle: string;
|
||||||
sectionStatus: string;
|
sectionStatus: string;
|
||||||
commitTitle: string;
|
commitTitle: string;
|
||||||
commitNote: string;
|
|
||||||
onCommitTitleChange: (title: string) => void;
|
onCommitTitleChange: (title: string) => void;
|
||||||
onCommitNoteChange: (note: string) => void;
|
|
||||||
commitCount: number;
|
commitCount: number;
|
||||||
hasHeadCommit: boolean;
|
hasHeadCommit: boolean;
|
||||||
headCommitId: string | null;
|
headCommitId: string | null;
|
||||||
@@ -58,9 +56,7 @@ export default function Editor({
|
|||||||
sectionTitle,
|
sectionTitle,
|
||||||
sectionStatus,
|
sectionStatus,
|
||||||
commitTitle,
|
commitTitle,
|
||||||
commitNote,
|
|
||||||
onCommitTitleChange,
|
onCommitTitleChange,
|
||||||
onCommitNoteChange,
|
|
||||||
commitCount,
|
commitCount,
|
||||||
hasHeadCommit,
|
hasHeadCommit,
|
||||||
headCommitId,
|
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 recentUndoLabels = (() => {
|
||||||
const seen = new Set<string>();
|
const seen = new Set<string>();
|
||||||
const labels: string[] = [];
|
const labels: string[] = [];
|
||||||
@@ -227,18 +240,10 @@ export default function Editor({
|
|||||||
<input
|
<input
|
||||||
value={commitTitle}
|
value={commitTitle}
|
||||||
onChange={(event) => onCommitTitleChange(event.target.value)}
|
onChange={(event) => onCommitTitleChange(event.target.value)}
|
||||||
placeholder="Commit title"
|
placeholder="Edit Summary (Commit Title)"
|
||||||
disabled={isSaving || isSubmitting}
|
disabled={isSaving || isSubmitting}
|
||||||
style={textInputStyle}
|
style={textInputStyle}
|
||||||
/>
|
/>
|
||||||
<textarea
|
|
||||||
value={commitNote}
|
|
||||||
onChange={(event) => onCommitNoteChange(event.target.value)}
|
|
||||||
placeholder="Commit note"
|
|
||||||
disabled={isSaving || isSubmitting}
|
|
||||||
rows={3}
|
|
||||||
style={textAreaStyle}
|
|
||||||
/>
|
|
||||||
<button
|
<button
|
||||||
style={{
|
style={{
|
||||||
...primaryButtonStyle,
|
...primaryButtonStyle,
|
||||||
@@ -261,7 +266,7 @@ export default function Editor({
|
|||||||
cursor: isSubmitting || !hasHeadCommit ? "not-allowed" : "pointer",
|
cursor: isSubmitting || !hasHeadCommit ? "not-allowed" : "pointer",
|
||||||
opacity: !hasHeadCommit ? 0.6 : 1,
|
opacity: !hasHeadCommit ? 0.6 : 1,
|
||||||
}}
|
}}
|
||||||
onClick={onSubmit}
|
onClick={handleOpenSubmitModal}
|
||||||
disabled={isSubmitting || !hasHeadCommit}
|
disabled={isSubmitting || !hasHeadCommit}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
@@ -382,6 +387,39 @@ export default function Editor({
|
|||||||
</ul>
|
</ul>
|
||||||
)}
|
)}
|
||||||
</Panel>
|
</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>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -37,7 +37,6 @@ type Options = {
|
|||||||
snapshotEntityWikiLinks: EntityWikiLinkSnapshot[];
|
snapshotEntityWikiLinks: EntityWikiLinkSnapshot[];
|
||||||
baselineSnapshot: EditorSnapshot | null;
|
baselineSnapshot: EditorSnapshot | null;
|
||||||
commitTitle: string;
|
commitTitle: string;
|
||||||
commitNote: string;
|
|
||||||
setActiveSection: Dispatch<SetStateAction<Section | null>>;
|
setActiveSection: Dispatch<SetStateAction<Section | null>>;
|
||||||
setSelectedSectionId: Dispatch<SetStateAction<string>>;
|
setSelectedSectionId: Dispatch<SetStateAction<string>>;
|
||||||
setSectionState: Dispatch<SetStateAction<SectionState | null>>;
|
setSectionState: Dispatch<SetStateAction<SectionState | null>>;
|
||||||
@@ -56,7 +55,6 @@ type Options = {
|
|||||||
setAvailableSections: Dispatch<SetStateAction<Section[]>>;
|
setAvailableSections: Dispatch<SetStateAction<Section[]>>;
|
||||||
setNewSectionTitle: Dispatch<SetStateAction<string>>;
|
setNewSectionTitle: Dispatch<SetStateAction<string>>;
|
||||||
setCommitTitle: Dispatch<SetStateAction<string>>;
|
setCommitTitle: Dispatch<SetStateAction<string>>;
|
||||||
setCommitNote: Dispatch<SetStateAction<string>>;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export function useSectionCommands(options: Options) {
|
export function useSectionCommands(options: Options) {
|
||||||
@@ -107,7 +105,6 @@ export function useSectionCommands(options: Options) {
|
|||||||
hasPersistedFeature: options.editor.hasPersistedFeature,
|
hasPersistedFeature: options.editor.hasPersistedFeature,
|
||||||
});
|
});
|
||||||
const editSummary = options.commitTitle.trim()
|
const editSummary = options.commitTitle.trim()
|
||||||
|| options.commitNote.trim()
|
|
||||||
|| `Edit ${new Date().toLocaleString()}`;
|
|| `Edit ${new Date().toLocaleString()}`;
|
||||||
|
|
||||||
// Guardrail: commit payload can get large and some deployments reject/close connections for big bodies.
|
// 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.setInitialData(options.editor.draft);
|
||||||
options.editor.clearChanges();
|
options.editor.clearChanges();
|
||||||
options.setCommitTitle("");
|
options.setCommitTitle("");
|
||||||
options.setCommitNote("");
|
|
||||||
options.setSectionCommits(await fetchSectionCommits(options.activeSection.id));
|
options.setSectionCommits(await fetchSectionCommits(options.activeSection.id));
|
||||||
options.setEntityFormStatus("Đã tạo commit.");
|
options.setEntityFormStatus("Đã tạo commit.");
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
@@ -218,7 +214,7 @@ export function useSectionCommands(options: Options) {
|
|||||||
}
|
}
|
||||||
}, [openSectionForEditing, options]);
|
}, [openSectionForEditing, options]);
|
||||||
|
|
||||||
const submitCurrentSection = useCallback(async () => {
|
const submitCurrentSection = useCallback(async (content: string) => {
|
||||||
if (!options.activeSection || !options.sectionState?.head_commit_id) {
|
if (!options.activeSection || !options.sectionState?.head_commit_id) {
|
||||||
options.setEntityStatus("Section hiện tại chưa có head để submit.");
|
options.setEntityStatus("Section hiện tại chưa có head để submit.");
|
||||||
return;
|
return;
|
||||||
@@ -231,7 +227,7 @@ export function useSectionCommands(options: Options) {
|
|||||||
options.setIsSubmitting(true);
|
options.setIsSubmitting(true);
|
||||||
options.setEntityStatus(null);
|
options.setEntityStatus(null);
|
||||||
try {
|
try {
|
||||||
const submission = await submitSection(options.activeSection.id);
|
const submission = await submitSection(options.activeSection.id, content);
|
||||||
options.setEntityStatus(`Đã submit, submission ${submission.id}.`);
|
options.setEntityStatus(`Đã submit, submission ${submission.id}.`);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (err instanceof ApiError) {
|
if (err instanceof ApiError) {
|
||||||
|
|||||||
@@ -41,8 +41,6 @@ export function useSectionSessionState(options: Options) {
|
|||||||
const [newSectionTitle, setNewSectionTitle] = useState("");
|
const [newSectionTitle, setNewSectionTitle] = useState("");
|
||||||
// Input title cho commit.
|
// Input title cho commit.
|
||||||
const [commitTitle, setCommitTitle] = useState("");
|
const [commitTitle, setCommitTitle] = useState("");
|
||||||
// Input note cho commit.
|
|
||||||
const [commitNote, setCommitNote] = useState("");
|
|
||||||
// User ID dùng để gắn vào commit/submit/lock.
|
// User ID dùng để gắn vào commit/submit/lock.
|
||||||
const [editorUserIdInput, setEditorUserIdInput] = useState(options.defaultEditorUserId);
|
const [editorUserIdInput, setEditorUserIdInput] = useState(options.defaultEditorUserId);
|
||||||
// Section đang mở để edit (null nếu chưa mở).
|
// Section đang mở để edit (null nếu chưa mở).
|
||||||
@@ -69,8 +67,6 @@ export function useSectionSessionState(options: Options) {
|
|||||||
setNewSectionTitle,
|
setNewSectionTitle,
|
||||||
commitTitle,
|
commitTitle,
|
||||||
setCommitTitle,
|
setCommitTitle,
|
||||||
commitNote,
|
|
||||||
setCommitNote,
|
|
||||||
editorUserIdInput,
|
editorUserIdInput,
|
||||||
setEditorUserIdInput,
|
setEditorUserIdInput,
|
||||||
activeSection,
|
activeSection,
|
||||||
|
|||||||
Reference in New Issue
Block a user