Skip to content

Commit 4a19970

Browse files
1ilitewqazxc
1ilit
authored and
ewqazxc
committed
Add ids to enums (drawdb-io#713)
* Add ids to enums * Add enum deleted translation
1 parent 6ed6b30 commit 4a19970

File tree

8 files changed

+93
-45
lines changed

8 files changed

+93
-45
lines changed

‎src/components/EditorHeader/ControlPanel.jsx‎

Lines changed: 21 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,7 @@ export default function ControlPanel({
182182
} else if (a.element === ObjectType.TYPE) {
183183
deleteType(a.data.type.id, false);
184184
} else if (a.element === ObjectType.ENUM) {
185-
deleteEnum(enums.length - 1, false);
185+
deleteEnum(a.data.enum.id, false);
186186
}
187187
setRedoStack((prev) => [...prev, a]);
188188
} else if (a.action === Action.MOVE) {
@@ -216,7 +216,7 @@ export default function ControlPanel({
216216
} else if (a.element === ObjectType.TYPE) {
217217
addType(a.data, false);
218218
} else if (a.element === ObjectType.ENUM) {
219-
addEnum({ id: a.id, ...a.data }, false);
219+
addEnum(a.data, false);
220220
}
221221
setRedoStack((prev) => [...prev, a]);
222222
} else if (a.action === Action.EDIT) {
@@ -354,7 +354,7 @@ export default function ControlPanel({
354354
} else if (a.element === ObjectType.TYPE) {
355355
addType(a.data, false);
356356
} else if (a.element === ObjectType.ENUM) {
357-
addEnum(null, false);
357+
addEnum(a.data, false);
358358
}
359359
setUndoStack((prev) => [...prev, a]);
360360
} else if (a.action === Action.MOVE) {
@@ -387,7 +387,7 @@ export default function ControlPanel({
387387
} else if (a.element === ObjectType.TYPE) {
388388
deleteType(a.data.type.id, false);
389389
} else if (a.element === ObjectType.ENUM) {
390-
deleteEnum(a.id, false);
390+
deleteEnum(a.data.enum.id, false);
391391
}
392392
setUndoStack((prev) => [...prev, a]);
393393
} else if (a.action === Action.EDIT) {
@@ -822,11 +822,24 @@ export default function ControlPanel({
822822
setUndoStack([]);
823823
setRedoStack([]);
824824
if (databases[database].hasTypes) {
825-
setTypes(diagram.types ?? []);
826-
}
827-
if (databases[database].hasEnums) {
828-
setEnums(diagram.enums ?? []);
825+
setTypes(
826+
diagram.types.map((t) =>
827+
t.id
828+
? t
829+
: {
830+
...t,
831+
id: nanoid(),
832+
fields: t.fields.map((f) =>
833+
f.id ? f : { ...f, id: nanoid() },
834+
),
835+
},
836+
),
837+
);
829838
}
839+
setEnums(
840+
diagram.enums.map((e) => (!e.id ? { ...e, id: nanoid() } : e)) ??
841+
[],
842+
);
830843
window.name = `d ${diagram.id}`;
831844
} else {
832845
window.name = "";

‎src/components/EditorHeader/Modal/Modal.jsx‎

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ import Rename from "./Rename";
4141
import SetTableWidth from "./SetTableWidth";
4242
import Share from "./Share";
4343
import { IdContext } from "../../Workspace";
44+
import { nanoid } from "nanoid";
4445

4546
const extensionToLanguage = {
4647
md: "markdown",
@@ -130,11 +131,24 @@ export default function Modal({
130131
setUndoStack([]);
131132
setRedoStack([]);
132133
if (databases[database].hasTypes) {
133-
setTypes(diagram.types ?? []);
134-
}
135-
if (databases[database].hasEnums) {
136-
setEnums(diagram.enums ?? []);
134+
setTypes(
135+
diagram.types.map((t) =>
136+
t.id
137+
? t
138+
: {
139+
...t,
140+
id: nanoid(),
141+
fields: t.fields.map((f) =>
142+
f.id ? f : { ...f, id: nanoid() },
143+
),
144+
},
145+
),
146+
);
137147
}
148+
setEnums(
149+
diagram.enums.map((e) => (!e.id ? { ...e, id: nanoid() } : e)) ??
150+
[],
151+
);
138152
window.name = `d ${diagram.id}`;
139153
setSaveState(State.SAVING);
140154
} else {

‎src/components/EditorSidePanel/EnumsTab/EnumDetails.jsx‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { useDiagram, useEnums, useLayout, useUndoRedo } from "../../../hooks";
55
import { Action, ObjectType } from "../../../data/constants";
66
import { useTranslation } from "react-i18next";
77

8-
export default function EnumDetails({ data, i }) {
8+
export default function EnumDetails({ data }) {
99
const { t } = useTranslation();
1010
const { layout } = useLayout();
1111
const { deleteEnum, updateEnum } = useEnums();
@@ -23,7 +23,7 @@ export default function EnumDetails({ data, i }) {
2323
placeholder={t("name")}
2424
validateStatus={data.name.trim() === "" ? "error" : "default"}
2525
onChange={(value) => {
26-
updateEnum(i, { name: value });
26+
updateEnum(data.id, { name: value });
2727
tables.forEach((table) => {
2828
table.fields.forEach((field) => {
2929
if (field.type.toLowerCase() === data.name.toLowerCase()) {
@@ -52,7 +52,7 @@ export default function EnumDetails({ data, i }) {
5252
{
5353
action: Action.EDIT,
5454
element: ObjectType.ENUM,
55-
id: i,
55+
id: data.id,
5656
undo: editField,
5757
redo: { name: e.target.value },
5858
updatedFields,
@@ -75,8 +75,7 @@ export default function EnumDetails({ data, i }) {
7575
validateStatus={data.values.length === 0 ? "error" : "default"}
7676
onChange={(v) => {
7777
if (layout.readOnly) return;
78-
79-
updateEnum(i, { values: v });
78+
updateEnum(data.id, { values: v });
8079
}}
8180
onFocus={() => setEditField({ values: data.values })}
8281
onBlur={() => {
@@ -87,7 +86,7 @@ export default function EnumDetails({ data, i }) {
8786
{
8887
action: Action.EDIT,
8988
element: ObjectType.ENUM,
90-
id: i,
89+
id: data.id,
9190
undo: editField,
9291
redo: { values: data.values },
9392
message: t("edit_enum", {
@@ -104,7 +103,7 @@ export default function EnumDetails({ data, i }) {
104103
type="danger"
105104
icon={<IconDeleteStroked />}
106105
disabled={layout.readOnly}
107-
onClick={() => deleteEnum(i, true)}
106+
onClick={() => deleteEnum(data.id, true)}
108107
>
109108
{t("delete")}
110109
</Button>

‎src/components/EditorSidePanel/EnumsTab/EnumsTab.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,18 +30,18 @@ export default function EnumsTab() {
3030
<Empty title={t("no_enums")} text={t("no_enums_text")} />
3131
) : (
3232
<Collapse accordion className="overflow-auto">
33-
{enums.map((e, i) => (
33+
{enums.map((e) => (
3434
<Collapse.Panel
35-
key={`enum_${i}`}
36-
id={`scroll_enum_${i}`}
35+
key={`enum_${e.id}`}
36+
id={`scroll_enum_${e.id}`}
3737
header={
3838
<div className="overflow-hidden text-ellipsis whitespace-nowrap">
3939
{e.name}
4040
</div>
4141
}
42-
itemKey={`${i}`}
42+
itemKey={e.id}
4343
>
44-
<EnumDetails data={e} i={i} />
44+
<EnumDetails data={e} />
4545
</Collapse.Panel>
4646
))}
4747
</Collapse>

‎src/components/EditorSidePanel/EnumsTab/SearchBar.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,9 @@ export default function SearchBar() {
3030
emptyContent={<div className="p-3 popover-theme">{t("not_found")}</div>}
3131
onChange={(v) => setValue(v)}
3232
onSelect={(v) => {
33-
const i = enums.findIndex((t) => t.name === v);
33+
const e = enums.find((t) => t.name === v);
3434
document
35-
.getElementById(`scroll_enum_${i}`)
35+
.getElementById(`scroll_enum_${e.id}`)
3636
.scrollIntoView({ behavior: "smooth" });
3737
}}
3838
className="w-full"

‎src/components/Workspace.jsx‎

Lines changed: 20 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -216,7 +216,9 @@ export default function WorkSpace() {
216216
}
217217
}
218218
if (databases[database].hasEnums) {
219-
setEnums(d.enums ?? []);
219+
setEnums(
220+
d.enums.map((e) => (!e.id ? { ...e, id: nanoid() } : e)) ?? [],
221+
);
220222
}
221223
window.name = `d ${d.id}`;
222224
} else {
@@ -269,8 +271,12 @@ export default function WorkSpace() {
269271
setTypes([]);
270272
}
271273
}
272-
if (databases[initDatabase].hasEnums) {
273-
setEnums(diagram.enums ?? []);
274+
if (databases[database].hasEnums) {
275+
setEnums(
276+
diagram.enums.map((e) =>
277+
!e.id ? { ...e, id: nanoid() } : e,
278+
) ?? [],
279+
);
274280
}
275281
window.name = `d ${diagram.id}`;
276282
} else {
@@ -324,8 +330,12 @@ export default function WorkSpace() {
324330
setTypes([]);
325331
}
326332
}
327-
if (databases[initDatabase].hasEnums) {
328-
setEnums(diagram.enums ?? []);
333+
if (databases[database].hasEnums) {
334+
setEnums(
335+
diagram.enums.map((e) =>
336+
!e.id ? { ...e, id: nanoid() } : e,
337+
) ?? [],
338+
);
329339
}
330340
} else {
331341
if (initDatabase === "") setShowSelectDbModal(true);
@@ -379,7 +389,11 @@ export default function WorkSpace() {
379389
}
380390
}
381391
if (databases[parsedDiagram.database].hasEnums) {
382-
setEnums(parsedDiagram.enums ?? []);
392+
setEnums(
393+
parsedDiagram.enums.map((e) =>
394+
!e.id ? { ...e, id: nanoid() } : e,
395+
) ?? [],
396+
);
383397
}
384398
} catch (e) {
385399
console.error(e);

‎src/context/EnumsContext.jsx‎

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Action, ObjectType } from "../data/constants";
33
import { Toast } from "@douyinfe/semi-ui";
44
import { useTranslation } from "react-i18next";
55
import { useUndoRedo } from "../hooks";
6+
import { nanoid } from "nanoid";
67

78
export const EnumsContext = createContext(null);
89

@@ -12,26 +13,29 @@ export default function EnumsContextProvider({ children }) {
1213
const { setUndoStack, setRedoStack } = useUndoRedo();
1314

1415
const addEnum = (data, addToHistory = true) => {
16+
const newEnum = {
17+
id: nanoid(),
18+
name: `enum_${enums.length}`,
19+
values: [],
20+
};
1521
if (data) {
1622
setEnums((prev) => {
1723
const temp = prev.slice();
18-
temp.splice(data.id, 0, data);
24+
temp.splice(data.index, 0, data.enum);
1925
return temp;
2026
});
2127
} else {
22-
setEnums((prev) => [
23-
...prev,
24-
{
25-
name: `enum_${prev.length}`,
26-
values: [],
27-
},
28-
]);
28+
setEnums((prev) => [...prev, newEnum]);
2929
}
3030
if (addToHistory) {
3131
setUndoStack((prev) => [
3232
...prev,
3333
{
3434
action: Action.ADD,
35+
data: {
36+
index: enums.length,
37+
enum: data?.enum ?? newEnum,
38+
},
3539
element: ObjectType.ENUM,
3640
message: t("add_enum"),
3741
},
@@ -41,28 +45,31 @@ export default function EnumsContextProvider({ children }) {
4145
};
4246

4347
const deleteEnum = (id, addToHistory = true) => {
48+
const enumIndex = enums.findIndex((e) => e.id === id);
4449
if (addToHistory) {
4550
Toast.success(t("enum_deleted"));
4651
setUndoStack((prev) => [
4752
...prev,
4853
{
4954
action: Action.DELETE,
5055
element: ObjectType.ENUM,
51-
id: id,
52-
data: enums[id],
56+
data: {
57+
index: enumIndex,
58+
enum: enums[enumIndex],
59+
},
5360
message: t("delete_enum", {
54-
enumName: enums[id].name,
61+
enumName: enums[enumIndex].name,
5562
}),
5663
},
5764
]);
5865
setRedoStack([]);
5966
}
60-
setEnums((prev) => prev.filter((_, i) => i !== id));
67+
setEnums((prev) => prev.filter((e) => e.id !== id));
6168
};
6269

6370
const updateEnum = (id, values) => {
6471
setEnums((prev) =>
65-
prev.map((e, i) => (i === id ? { ...e, ...values } : e)),
72+
prev.map((e) => (e.id === id ? { ...e, ...values } : e)),
6673
);
6774
};
6875

‎src/i18n/locales/en.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -238,6 +238,7 @@ const en = {
238238
enum_w_no_name: "Found enum with no name",
239239
enum_w_no_values: "Found enum '{{enumName}}' with no values",
240240
duplicate_enums: "Duplicate enums with the name '{{enumName}}'",
241+
enum_deleted: "Enum deleted",
241242
no_enums: "No enums",
242243
no_enums_text: "Define enums here",
243244
declare_array: "Declare array",

0 commit comments

Comments
 (0)