fix: update title on mounted

This commit is contained in:
Huy Bui 2024-07-21 14:26:29 +07:00
parent 9393f5c933
commit 1bff574d56
2 changed files with 13 additions and 10 deletions

View File

@ -76,7 +76,6 @@ export default function ControlPanel({
}) {
const [modal, setModal] = useState(MODAL.NONE);
const [sidesheet, setSidesheet] = useState(SIDESHEET.NONE);
const [prevTitle, setPrevTitle] = useState(title);
const [showEditName, setShowEditName] = useState(false);
const [importDb, setImportDb] = useState("");
const [exportData, setExportData] = useState({
@ -728,7 +727,6 @@ export default function ControlPanel({
rename: {
function: () => {
setModal(MODAL.RENAME);
setPrevTitle(title);
},
},
delete_diagram: {
@ -1309,10 +1307,8 @@ export default function ControlPanel({
setExportData={setExportData}
title={title}
setTitle={setTitle}
setPrevTitle={setPrevTitle}
setDiagramId={setDiagramId}
setModal={setModal}
prevTitle={prevTitle}
importDb={importDb}
/>
<Sidesheet

View File

@ -6,7 +6,7 @@ import {
Modal as SemiUIModal,
} from "@douyinfe/semi-ui";
import { DB, MODAL, STATUS } from "../../../data/constants";
import { useState } from "react";
import { useEffect, useState } from "react";
import { db } from "../../../data/db";
import {
useAreas,
@ -48,8 +48,6 @@ export default function Modal({
setModal,
title,
setTitle,
prevTitle,
setPrevTitle,
setDiagramId,
exportData,
setExportData,
@ -65,6 +63,7 @@ export default function Modal({
const { setTasks } = useTasks();
const { setTransform } = useTransform();
const { setUndoStack, setRedoStack } = useUndoRedo();
const [uncontrolledTitle, setUncontrolledTitle] = useState(title);
const [importSource, setImportSource] = useState({
src: "",
overwrite: true,
@ -78,6 +77,12 @@ export default function Modal({
const [selectedDiagramId, setSelectedDiagramId] = useState(0);
const [saveAsTitle, setSaveAsTitle] = useState(title);
useEffect(() => {
if (title !== uncontrolledTitle) {
setUncontrolledTitle(title);
}
}, [title]);
const overwriteDiagram = () => {
setTables(importData.tables);
setRelationships(importData.relationships);
@ -212,7 +217,7 @@ export default function Modal({
setModal(MODAL.NONE);
return;
case MODAL.RENAME:
setPrevTitle(title);
setTitle(uncontrolledTitle);
setModal(MODAL.NONE);
return;
case MODAL.SAVEAS:
@ -256,7 +261,9 @@ export default function Modal({
/>
);
case MODAL.RENAME:
return <Rename title={title} setTitle={setTitle} />;
return (
<Rename title={uncontrolledTitle} setTitle={setUncontrolledTitle} />
);
case MODAL.OPEN:
return (
<Open
@ -339,7 +346,7 @@ export default function Modal({
});
}}
onCancel={() => {
if (modal === MODAL.RENAME) setTitle(prevTitle);
if (modal === MODAL.RENAME) setUncontrolledTitle(title);
setModal(MODAL.NONE);
}}
centered