diff --git a/src/assets/blank_pfp.webp b/src/assets/blank_pfp.webp deleted file mode 100644 index f177a45..0000000 Binary files a/src/assets/blank_pfp.webp and /dev/null differ diff --git a/src/assets/bot.png b/src/assets/bot.png new file mode 100644 index 0000000..6e5776c Binary files /dev/null and b/src/assets/bot.png differ diff --git a/src/assets/calendar.png b/src/assets/calendar.png new file mode 100644 index 0000000..132b778 Binary files /dev/null and b/src/assets/calendar.png differ diff --git a/src/assets/chat.png b/src/assets/chat.png new file mode 100644 index 0000000..42543a0 Binary files /dev/null and b/src/assets/chat.png differ diff --git a/src/assets/group.png b/src/assets/group.png new file mode 100644 index 0000000..8355952 Binary files /dev/null and b/src/assets/group.png differ diff --git a/src/assets/icon_136.png b/src/assets/icon_136.png deleted file mode 100644 index 7f8805b..0000000 Binary files a/src/assets/icon_136.png and /dev/null differ diff --git a/src/assets/icon_64.png b/src/assets/icon_64.png deleted file mode 100644 index d52bfab..0000000 Binary files a/src/assets/icon_64.png and /dev/null differ diff --git a/src/assets/logo_36.png b/src/assets/logo_36.png deleted file mode 100644 index 34cac8f..0000000 Binary files a/src/assets/logo_36.png and /dev/null differ diff --git a/src/assets/logo_48.png b/src/assets/logo_48.png deleted file mode 100644 index ac583ac..0000000 Binary files a/src/assets/logo_48.png and /dev/null differ diff --git a/src/assets/logo_80.png b/src/assets/logo_80.png deleted file mode 100644 index 95eb36c..0000000 Binary files a/src/assets/logo_80.png and /dev/null differ diff --git a/src/assets/process.png b/src/assets/process.png new file mode 100644 index 0000000..37474f3 Binary files /dev/null and b/src/assets/process.png differ diff --git a/src/components/area.jsx b/src/components/area.jsx index 3708f50..935b433 100644 --- a/src/components/area.jsx +++ b/src/components/area.jsx @@ -118,6 +118,7 @@ export default function Area(props) { aid: props.areaData.id, undo: editField, redo: { name: e.target.value }, + message: `Edit area name to ${e.target.value}`, }, ]); setRedoStack([]); @@ -159,6 +160,7 @@ export default function Area(props) { aid: props.areaData.id, undo: { color: props.areaData.color }, redo: { color: c }, + message: `Edit area color to ${c}`, }, ]); setRedoStack([]); @@ -194,6 +196,7 @@ export default function Area(props) { aid: props.areaData.id, undo: { color: props.areaData.color }, redo: { color: c }, + message: `Edit area color to ${c}`, }, ]); setRedoStack([]); @@ -251,6 +254,7 @@ export default function Area(props) { aid: props.areaData.id, undo: editField, redo: { name: props.areaData.name }, + message: `Edit area name to ${props.areaData.name}`, }, ]); setRedoStack([]); diff --git a/src/components/area_overview.jsx b/src/components/area_overview.jsx index dead6fd..f29fe5a 100644 --- a/src/components/area_overview.jsx +++ b/src/components/area_overview.jsx @@ -117,6 +117,7 @@ export default function AreaOverview(props) { aid: i, undo: editField, redo: { name: e.target.value }, + message: `Edit area name to ${e.target.value}`, }, ]); setRedoStack([]); @@ -158,6 +159,7 @@ export default function AreaOverview(props) { aid: i, undo: { color: a.color }, redo: { color: c }, + message: `Edit area color to ${c}`, }, ]); setRedoStack([]); @@ -191,6 +193,7 @@ export default function AreaOverview(props) { aid: i, undo: { color: a.color }, redo: { color: c }, + message: `Edit area color to ${c}`, }, ]); setRedoStack([]); diff --git a/src/components/canvas.jsx b/src/components/canvas.jsx index 411621a..61a1347 100644 --- a/src/components/canvas.jsx +++ b/src/components/canvas.jsx @@ -226,8 +226,34 @@ export default function Canvas(props) { const didPan = () => !(settings.pan.x === panning.x && settings.pan.y === panning.y); + const getMoveInfo = () => { + switch (dragging.element) { + case ObjectType.TABLE: + return { + name: "table", + x: tables[dragging.id].x, + y: tables[dragging.id].y, + }; + case ObjectType.AREA: + return { + name: "area", + x: areas[dragging.id].x, + y: areas[dragging.id].y, + }; + case ObjectType.NOTE: + return { + name: "note", + x: notes[dragging.id].x, + y: notes[dragging.id].y, + }; + default: + return false; + } + }; + const handleMouseUp = (e) => { if (coordsDidUpdate(dragging.element)) { + const info = getMoveInfo(); setUndoStack((prev) => [ ...prev, { @@ -236,6 +262,7 @@ export default function Canvas(props) { x: dragging.prevX, y: dragging.prevY, id: dragging.id, + message: `Move ${info.name} to (${info.x}, ${info.y})`, }, ]); setRedoStack([]); @@ -248,6 +275,7 @@ export default function Canvas(props) { action: Action.PAN, undo: { x: panning.x, y: panning.y }, redo: settings.pan, + message: `Move diagram to (${settings.pan.x}, ${settings.pan.y})`, }, ]); setRedoStack([]); @@ -272,6 +300,7 @@ export default function Canvas(props) { height: initCoords.height, }, redo: areas[areaResize.id], + message: `Resize area`, }, ]); setRedoStack([]); diff --git a/src/components/control_panel.jsx b/src/components/control_panel.jsx index 60bb45b..47cb135 100644 --- a/src/components/control_panel.jsx +++ b/src/components/control_panel.jsx @@ -192,8 +192,6 @@ export default function ControlPanel(props) { .filter((e) => e.id !== tables[a.tid].fields.length - 1) .map((t, i) => ({ ...t, id: i })), }); - } else if (a.component === "comment") { - updateTable(a.tid, a.undo, false); } else if (a.component === "index_add") { updateTable(a.tid, { indices: tables[a.tid].indices @@ -320,8 +318,6 @@ export default function ControlPanel(props) { }, ], }); - } else if (a.component === "comment") { - updateTable(a.tid, a.redo, false); } else if (a.component === "index_add") { setTables((prev) => prev.map((table) => { @@ -359,7 +355,7 @@ export default function ControlPanel(props) { .map((t, i) => ({ ...t, id: i })), }); } else if (a.component === "self") { - updateTable(a.tid, a.redo); + updateTable(a.tid, a.redo, false); } } else if (a.element === ObjectType.RELATIONSHIP) { setRelationships((prev) => diff --git a/src/components/note.jsx b/src/components/note.jsx index accb3b9..25d2ebe 100644 --- a/src/components/note.jsx +++ b/src/components/note.jsx @@ -105,6 +105,7 @@ export default function Note(props) { nid: props.data.id, undo: editField, redo: { content: e.target.value, height: newHeight }, + message: `Edit note content to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -155,6 +156,7 @@ export default function Note(props) { nid: props.data.id, undo: editField, redo: { title: e.target.value }, + message: `Edit note title to "${e.target.name}"`, }, ]); setRedoStack([]); @@ -180,6 +182,7 @@ export default function Note(props) { nid: props.data.id, undo: { color: props.data.color }, redo: { color: c }, + message: `Edit note color to ${c}`, }, ]); setRedoStack([]); @@ -233,6 +236,7 @@ export default function Note(props) { aid: props.data.id, undo: editField, redo: { title: props.data.title }, + message: `Edit note title to "${props.data.title}"`, }, ]); setRedoStack([]); diff --git a/src/components/notes_overview.jsx b/src/components/notes_overview.jsx index 090ab63..b301666 100644 --- a/src/components/notes_overview.jsx +++ b/src/components/notes_overview.jsx @@ -129,6 +129,7 @@ export default function NotesOverview(props) { nid: i, undo: editField, redo: { content: e.target.value, height: newHeight }, + message: `Edit note content to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -156,6 +157,7 @@ export default function NotesOverview(props) { nid: i, undo: { color: n.color }, redo: { color: c }, + message: `Edit note color to ${c}`, }, ]); setRedoStack([]); diff --git a/src/components/reference_overview.jsx b/src/components/reference_overview.jsx index fbd368d..7b72e0b 100644 --- a/src/components/reference_overview.jsx +++ b/src/components/reference_overview.jsx @@ -153,6 +153,7 @@ export default function ReferenceOverview(props) { endTableId: r.startTableId, endFieldId: r.startFieldId, }, + message: `Swap primary and foreign tables`, }, ]); setRedoStack([]); @@ -201,6 +202,7 @@ export default function ReferenceOverview(props) { rid: i, undo: { cardinality: r.cardinality }, redo: { cardinality: value }, + message: `Edit relationship cardinality`, }, ]); setRedoStack([]); @@ -230,6 +232,7 @@ export default function ReferenceOverview(props) { rid: i, undo: { updateConstraint: r.updateConstraint }, redo: { updateConstraint: value }, + message: `Edit relationship update constraint`, }, ]); setRedoStack([]); @@ -259,6 +262,7 @@ export default function ReferenceOverview(props) { rid: i, undo: { deleteConstraint: r.deleteConstraint }, redo: { deleteConstraint: value }, + message: `Edit relationship delete constraint`, }, ]); setRedoStack([]); @@ -291,6 +295,7 @@ export default function ReferenceOverview(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Make foreign key mandetory`, }, ]); setRedoStack([]); diff --git a/src/components/sidebar.jsx b/src/components/sidebar.jsx index 8fb5cf8..5079378 100644 --- a/src/components/sidebar.jsx +++ b/src/components/sidebar.jsx @@ -1,12 +1,143 @@ -import React from "react"; +import React, { useContext, useState } from "react"; +import chatIcon from "../assets/chat.png"; +import botIcon from "../assets/bot.png"; +import teamIcon from "../assets/group.png"; +import timeLine from "../assets/process.png"; +import todo from "../assets/calendar.png"; +import { Tooltip, SideSheet } from "@douyinfe/semi-ui"; +import { UndoRedoContext } from "../pages/editor"; +// import { +// IllustrationNoContent, +// IllustrationNoContentDark, +// } from "@douyinfe/semi-illustrations"; export default function Sidebar() { + const SidesheetType = { + NONE: 0, + CHAT: 1, + TEAM: 2, + TODO: 3, + TIMELINE: 4, + BOT: 5, + }; + const [sidesheet, setSidesheet] = useState(SidesheetType.NONE); + const { undoStack } = useContext(UndoRedoContext); + + const getTitle = (type) => { + switch (type) { + case SidesheetType.TIMELINE: + return ( +
+ chat icon +
Timeline
+
+ ); + case SidesheetType.CHAT: + return ( +
+ chat icon +
Chat
+
+ ); + case SidesheetType.TEAM: + return ( +
+ chat icon +
Your team
+
+ ); + default: + break; + } + }; + + const getContent = (type) => { + switch (type) { + case SidesheetType.TIMELINE: + return getTimeline(); + default: + break; + } + }; + return ( -
-
-
-
-
-
+ <> +
+ + + + + + + + + + + + + + + +
+ setSidesheet(SidesheetType.NONE)} + width={340} + title={getTitle(sidesheet)} + style={{ paddingBottom: "16px" }} + > + {getContent(sidesheet)} + + ); + + function getTimeline() { + if (undoStack.length > 0) { + return ( +
+
+ {[...undoStack].reverse().map((e) => ( + <> +
+ +
{e.message}
+
+
+ + ))} +
+ ); + } else { + return ( +
+ You havent added anything to your diagram yet. +
+ // } + // darkModeImage={ + // + // } + // title="No activity" + // description="You have not added anything to your diagram yet." + // /> + ); + } + } } diff --git a/src/components/table.jsx b/src/components/table.jsx index 3e51988..8bc2f9c 100644 --- a/src/components/table.jsx +++ b/src/components/table.jsx @@ -289,6 +289,7 @@ export default function Table(props) { tid: props.tableData.id, undo: editField, redo: { name: e.target.value }, + message: `Edit table name to ${e.target.value}`, }, ]); setRedoStack([]); @@ -318,6 +319,7 @@ export default function Table(props) { fid: j, undo: editField, redo: { name: e.target.value }, + message: `Edit table field name to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -348,6 +350,7 @@ export default function Table(props) { fid: j, undo: { type: f.type }, redo: { type: value }, + message: `Edit table field type to "${value}"`, }, ]); setRedoStack([]); @@ -380,6 +383,9 @@ export default function Table(props) { fid: j, undo: { notNull: f.notNull }, redo: { notNull: !f.notNull }, + message: `Edit table field to${ + f.notNull ? "" : " not" + } null`, }, ]); setRedoStack([]); @@ -405,6 +411,9 @@ export default function Table(props) { fid: j, undo: { primary: f.primary }, redo: { primary: !f.primary }, + message: `Edit table field to${ + f.primary ? " not" : "" + } primary`, }, ]); setRedoStack([]); @@ -447,6 +456,7 @@ export default function Table(props) { fid: j, undo: editField, redo: { default: e.target.value }, + message: `Edit table field default to ${e.target.value}`, }, ]); setRedoStack([]); @@ -484,6 +494,9 @@ export default function Table(props) { fid: j, undo: editField, redo: { values: f.values }, + message: `Edit table field values to "${JSON.stringify( + f.values + )}"`, }, ]); setRedoStack([]); @@ -518,6 +531,7 @@ export default function Table(props) { fid: j, undo: editField, redo: { length: e.target.value }, + message: `Edit table field length to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -547,6 +561,7 @@ export default function Table(props) { fid: j, undo: editField, redo: { check: e.target.value }, + message: `Edit table field check expression to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -574,6 +589,9 @@ export default function Table(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Edit table field to${ + f.unique ? " not" : "" + } unique`, }, ]); setRedoStack([]); @@ -613,6 +631,9 @@ export default function Table(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Edit table field to${ + f.primary ? " not" : "" + } auto increment`, }, ]); setRedoStack([]); @@ -649,6 +670,7 @@ export default function Table(props) { fid: j, undo: editField, redo: { comment: e.target.value }, + message: `Edit table field comment to ${e.target.value}`, }, ]); setRedoStack([]); @@ -667,6 +689,7 @@ export default function Table(props) { component: "field_delete", tid: props.tableData.id, data: f, + message: `Delete field`, }, ]); setRedoStack([]); @@ -738,6 +761,9 @@ export default function Table(props) { fields: [...value], name: `${value.join("_")}_index`, }, + message: `Edit index fields to "${JSON.stringify( + value + )}"`, }, ]); setRedoStack([]); @@ -785,6 +811,9 @@ export default function Table(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Edit table field to${ + idx.unique ? " not" : "" + } unique`, }, ]); setRedoStack([]); @@ -815,6 +844,7 @@ export default function Table(props) { component: "index_delete", tid: props.tableData.id, data: idx, + message: `Delete index`, }, ]); setRedoStack([]); @@ -868,10 +898,11 @@ export default function Table(props) { { action: Action.EDIT, element: ObjectType.TABLE, - component: "comment", + component: "self", tid: props.tableData.id, undo: editField, redo: { comment: e.target.value }, + message: `Edit table comment to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -898,6 +929,7 @@ export default function Table(props) { tid: props.tableData.id, undo: { color: props.tableData.color }, redo: { color: defaultTableTheme }, + message: `Edit table color to default`, }, ]); setRedoStack([]); @@ -929,6 +961,7 @@ export default function Table(props) { tid: props.tableData.id, undo: { color: props.tableData.color }, redo: { color: c }, + message: `Edit table color to ${c}`, }, ]); setRedoStack([]); @@ -961,6 +994,7 @@ export default function Table(props) { tid: props.tableData.id, undo: { color: props.tableData.color }, redo: { color: c }, + message: `Edit table color to ${c}`, }, ]); setRedoStack([]); @@ -997,6 +1031,7 @@ export default function Table(props) { element: ObjectType.TABLE, component: "index_add", tid: props.tableData.id, + message: `Add index`, }, ]); setRedoStack([]); @@ -1026,6 +1061,7 @@ export default function Table(props) { element: ObjectType.TABLE, component: "field_add", tid: props.tableData.id, + message: `Add field`, }, ]); setRedoStack([]); @@ -1120,6 +1156,7 @@ export default function Table(props) { component: "field_delete", tid: props.tableData.id, data: fieldData, + message: `Delete field`, }, ]); setRedoStack([]); diff --git a/src/components/table_overview.jsx b/src/components/table_overview.jsx index 8acfdf2..d9214bc 100644 --- a/src/components/table_overview.jsx +++ b/src/components/table_overview.jsx @@ -150,6 +150,7 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { name: e.target.value }, + message: `Edit table field name to ${e.target.value}`, }, ]); setRedoStack([]); @@ -180,10 +181,10 @@ export default function TableOverview(props) { fid: j, undo: { type: f.type }, redo: { type: value }, + message: `Edit table field type to ${value}`, }, ]); setRedoStack([]); - const incr = f.increment && (value === "INT" || @@ -213,6 +214,9 @@ export default function TableOverview(props) { fid: j, undo: { notNull: f.notNull }, redo: { notNull: !f.notNull }, + message: `Edit table field to${ + f.notNull ? "" : " not" + } null`, }, ]); setRedoStack([]); @@ -238,6 +242,9 @@ export default function TableOverview(props) { fid: j, undo: { primary: f.primary }, redo: { primary: !f.primary }, + message: `Edit table field to${ + f.primary ? " not" : "" + } primary`, }, ]); setRedoStack([]); @@ -281,6 +288,7 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { default: e.target.value }, + message: `Edit table field default to ${e.target.value}`, }, ]); setRedoStack([]); @@ -318,6 +326,9 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { values: f.values }, + message: `Edit table field values to "${JSON.stringify( + f.values + )}"`, }, ]); setRedoStack([]); @@ -351,6 +362,7 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { length: e.target.value }, + message: `Edit table field length to ${e.target.value}`, }, ]); setRedoStack([]); @@ -384,6 +396,7 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { check: e.target.value }, + message: `Edit table field check expression to ${e.target.value}`, }, ]); setRedoStack([]); @@ -450,6 +463,9 @@ export default function TableOverview(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Edit table field to${ + f.increment ? " not" : "" + } auto increment`, }, ]); setRedoStack([]); @@ -487,6 +503,7 @@ export default function TableOverview(props) { fid: j, undo: editField, redo: { comment: e.target.value }, + message: `Edit field comment to "${e.target.value}"`, }, ]); setRedoStack([]); @@ -505,6 +522,7 @@ export default function TableOverview(props) { component: "field_delete", tid: t.id, data: f, + message: `Delete field`, }, ]); setRedoStack([]); @@ -586,6 +604,9 @@ export default function TableOverview(props) { fields: [...value], name: `${value.join("_")}_index`, }, + message: `Edit index fields to "${JSON.stringify( + value + )}"`, }, ]); setRedoStack([]); @@ -635,6 +656,9 @@ export default function TableOverview(props) { [checkedValues.target.value]: checkedValues.target.checked, }, + message: `Edit table field to${ + idx.unique ? " not" : "" + } unique`, }, ]); setRedoStack([]); @@ -666,6 +690,7 @@ export default function TableOverview(props) { component: "index_delete", tid: t.id, data: idx, + message: `Delete index`, }, ]); setRedoStack([]); @@ -725,10 +750,11 @@ export default function TableOverview(props) { { action: Action.EDIT, element: ObjectType.TABLE, - component: "comment", + component: "self", tid: i, undo: editField, redo: { comment: e.target.value }, + message: `Edit table comment to ${e.target.value}`, }, ]); setRedoStack([]); @@ -757,6 +783,7 @@ export default function TableOverview(props) { tid: i, undo: { color: t.color }, redo: { color: defaultTableTheme }, + message: `Edit table color to default`, }, ]); setRedoStack([]); @@ -786,6 +813,7 @@ export default function TableOverview(props) { tid: i, undo: { color: t.color }, redo: { color: c }, + message: `Edit table color to ${c}`, }, ]); setRedoStack([]); @@ -820,6 +848,7 @@ export default function TableOverview(props) { tid: i, undo: { color: t.color }, redo: { color: c }, + message: `Edit table color to ${c}`, }, ]); setRedoStack([]); @@ -859,6 +888,7 @@ export default function TableOverview(props) { element: ObjectType.TABLE, component: "index_add", tid: t.id, + message: `Add index`, }, ]); setRedoStack([]); @@ -888,6 +918,7 @@ export default function TableOverview(props) { element: ObjectType.TABLE, component: "field_add", tid: t.id, + message: `Add field`, }, ]); setRedoStack([]); diff --git a/src/pages/editor.jsx b/src/pages/editor.jsx index 0721312..45defb6 100644 --- a/src/pages/editor.jsx +++ b/src/pages/editor.jsx @@ -104,6 +104,7 @@ export default function Editor(props) { { action: Action.ADD, element: ObjectType.TABLE, + message: `Add new table`, }, ]); setRedoStack([]); @@ -153,6 +154,7 @@ export default function Editor(props) { { action: Action.ADD, element: ObjectType.AREA, + message: `Add new subject area`, }, ]); setRedoStack([]); @@ -186,6 +188,7 @@ export default function Editor(props) { { action: Action.ADD, element: ObjectType.NOTE, + message: `Add new note`, }, ]); setRedoStack([]); @@ -201,6 +204,7 @@ export default function Editor(props) { action: Action.ADD, element: ObjectType.RELATIONSHIP, data: data, + message: `Add new relationship`, }, ]); setRedoStack([]); @@ -223,6 +227,7 @@ export default function Editor(props) { action: Action.DELETE, element: ObjectType.TABLE, data: tables[id], + message: `Delete table`, }, ]); setRedoStack([]); @@ -253,6 +258,7 @@ export default function Editor(props) { action: Action.DELETE, element: ObjectType.AREA, data: areas[id], + message: `Delete subject area`, }, ]); setRedoStack([]); @@ -278,6 +284,7 @@ export default function Editor(props) { action: Action.DELETE, element: ObjectType.NOTE, data: notes[id], + message: `Delete note`, }, ]); setRedoStack([]); @@ -303,6 +310,7 @@ export default function Editor(props) { action: Action.DELETE, element: ObjectType.RELATIONSHIP, data: relationships[id], + message: `Delete relationship`, }, ]); setRedoStack([]); @@ -417,8 +425,8 @@ export default function Editor(props) {
setResize(false)} onMouseMove={dragHandler}