Migrate to Vite from CRA

This commit is contained in:
1ilit
2023-12-16 05:39:13 +02:00
parent 503d55b528
commit 46685a98fe
52 changed files with 2292 additions and 15125 deletions

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import {
Empty,
Row,
@@ -27,7 +27,7 @@ import {
} from "../data/data";
import { AreaContext, UndoRedoContext } from "../pages/Editor";
export default function AreaOverview(props) {
export default function AreaOverview() {
const { areas, addArea, deleteArea, updateArea } = useContext(AreaContext);
const { setUndoStack, setRedoStack } = useContext(UndoRedoContext);
const [editField, setEditField] = useState({});

View File

@@ -1,4 +1,4 @@
import { React, useContext, useState } from "react";
import { useContext, useState } from "react";
import {
IconCaretdown,
IconChevronRight,
@@ -71,7 +71,6 @@ export default function ControlPanel({
state,
setState,
lastSaved,
setLastSaved,
}) {
const MODAL = {
NONE: 0,
@@ -209,7 +208,7 @@ export default function ControlPanel({
updateField(a.tid, a.fid, a.undo);
} else if (a.component === "field_delete") {
setTables((prev) =>
prev.map((t, i) => {
prev.map((t) => {
if (t.id === a.tid) {
const temp = t.fields.slice();
temp.splice(a.data.id, 0, a.data);
@@ -243,7 +242,7 @@ export default function ControlPanel({
});
} else if (a.component === "index_delete") {
setTables((prev) =>
prev.map((table, i) => {
prev.map((table) => {
if (table.id === a.tid) {
const temp = table.indices.slice();
temp.splice(a.data.id, 0, a.data);
@@ -488,7 +487,7 @@ export default function ControlPanel({
.then(() => {
Toast.success("Copied to clipboard.");
})
.catch((e) => {
.catch(() => {
Toast.error("Could not copy to clipboard.");
});
});
@@ -617,21 +616,21 @@ export default function ControlPanel({
case ObjectType.TABLE:
navigator.clipboard
.writeText(JSON.stringify({ ...tables[selectedElement.id] }))
.catch((e) => {
.catch(() => {
Toast.error("Could not copy");
});
break;
case ObjectType.NOTE:
navigator.clipboard
.writeText(JSON.stringify({ ...notes[selectedElement.id] }))
.catch((e) => {
.catch(() => {
Toast.error("Could not copy");
});
break;
case ObjectType.AREA:
navigator.clipboard
.writeText(JSON.stringify({ ...areas[selectedElement.id] }))
.catch((e) => {
.catch(() => {
Toast.error("Could not copy");
});
break;
@@ -754,7 +753,7 @@ export default function ControlPanel({
setUndoStack([]);
setRedoStack([]);
})
.catch((e) => Toast.error("Oops! Something went wrong."));
.catch(() => Toast.error("Oops! Something went wrong."));
},
},
"Flush storage": {
@@ -764,7 +763,7 @@ export default function ControlPanel({
Toast.success("Storage flushed");
window.location.reload(false);
})
.catch((error) => {
.catch(() => {
Toast.error("Oops! Something went wrong.");
});
},
@@ -1170,12 +1169,13 @@ export default function ControlPanel({
`${exportData.filename}.${exportData.extension}`
);
return;
case MODAL.CODE:
case MODAL.CODE: {
const blob = new Blob([exportData.data], {
type: "application/json",
});
saveAs(blob, `${exportData.filename}.${exportData.extension}`);
return;
}
case MODAL.IMPORT:
if (error.type !== STATUS.ERROR) {
setSettings((prev) => ({ ...prev, pan: { x: 0, y: 0 } }));
@@ -1494,7 +1494,7 @@ export default function ControlPanel({
visible={visible !== MODAL.NONE}
onOk={getModalOnOk}
afterClose={() => {
setExportData((prev) => ({
setExportData(() => ({
data: "",
extension: "",
filename: `diagram_${new Date().toISOString()}`,

View File

@@ -1,5 +1,3 @@
import React from "react";
export function IconAddTable({ theme }) {
return (
<svg height="26" width="26">

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import { Button, Input, Avatar } from "@douyinfe/semi-ui";
import { IconSend } from "@douyinfe/semi-icons";
import { BotMessageContext } from "../pages/Editor";

View File

@@ -1,4 +1,4 @@
import React, { useState } from "react";
import { useState } from "react";
import { Link } from "react-router-dom";
import logo from "../assets/logo_light_46.png";
import { SideSheet } from "@douyinfe/semi-ui";

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import {
Empty,
Row,
@@ -24,7 +24,7 @@ import {
import { NoteContext, UndoRedoContext } from "../pages/Editor";
import { noteThemes, Action, ObjectType } from "../data/data";
export default function NotesOverview(props) {
export default function NotesOverview() {
const { notes, updateNote, addNote, deleteNote } = useContext(NoteContext);
const { setUndoStack, setRedoStack } = useContext(UndoRedoContext);
const [value, setValue] = useState("");

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import {
AutoComplete,
Collapse,
@@ -24,7 +24,7 @@ import {
import { Cardinality, Constraint, Action, ObjectType } from "../data/data";
import { TableContext, UndoRedoContext } from "../pages/Editor";
export default function ReferenceOverview(props) {
export default function ReferenceOverview() {
const columns = [
{
title: "Primary",

View File

@@ -1,4 +1,4 @@
import { React, useContext } from "react";
import { useContext } from "react";
import { Tabs } from "@douyinfe/semi-ui";
import TableOverview from "./TableOverview";
import ReferenceOverview from "./ReferenceOverview";
@@ -21,11 +21,11 @@ const SidePanel = (props) => {
{ tab: "Types", itemKey: Tab.types },
];
const contentList = [
<TableOverview />,
<ReferenceOverview />,
<AreaOverview />,
<NotesOverview />,
<TypesOverview />,
<TableOverview key={1}/>,
<ReferenceOverview key={2}/>,
<AreaOverview key={3}/>,
<NotesOverview key={4}/>,
<TypesOverview key={5}/>,
];
return (

View File

@@ -1,4 +1,4 @@
import { React, useContext, useState } from "react";
import { useContext, useState } from "react";
import {
Action,
ObjectType,
@@ -43,7 +43,7 @@ import {
} from "../pages/Editor";
import { getSize, hasCheck, hasPrecision, isSized } from "../utils";
export default function TableOverview(props) {
export default function TableOverview() {
const [indexActiveKey, setIndexActiveKey] = useState("");
const [value, setValue] = useState("");
const {
@@ -392,10 +392,10 @@ export default function TableOverview(props) {
onChange={(v) =>
updateField(i, j, { values: v })
}
onFocus={(e) =>
onFocus={() =>
setEditField({ values: f.values })
}
onBlur={(e) => {
onBlur={() => {
if (
JSON.stringify(editField.values) ===
JSON.stringify(f.values)

View File

@@ -1,4 +1,4 @@
import { React, useContext, useState } from "react";
import { useContext, useState } from "react";
import { Action, ObjectType, sqlDataTypes } from "../data/data";
import {
Collapse,
@@ -30,7 +30,7 @@ import {
import { TypeContext, UndoRedoContext } from "../pages/Editor";
import { isSized, hasPrecision, getSize } from "../utils";
export default function TableOverview(props) {
export default function TableOverview() {
const [value, setValue] = useState("");
const { types, addType, deleteType, updateType } = useContext(TypeContext);
const { setUndoStack, setRedoStack } = useContext(UndoRedoContext);
@@ -268,10 +268,10 @@ export default function TableOverview(props) {
),
})
}
onFocus={(e) =>
onFocus={() =>
setEditField({ values: f.values })
}
onBlur={(e) => {
onBlur={() => {
if (
JSON.stringify(editField.values) ===
JSON.stringify(f.values)

View File

@@ -1,4 +1,4 @@
import { React, useContext, useState } from "react";
import { useContext, useState } from "react";
import { Button, Popover, Input, Toast } from "@douyinfe/semi-ui";
import {
IconEdit,

View File

@@ -1,4 +1,4 @@
import React, { useContext, useRef, useState, useEffect } from "react";
import { useContext, useRef, useState, useEffect } from "react";
import Table from "./Table";
import { Action, Cardinality, Constraint, ObjectType } from "../data/data";
import Area from "./Area";
@@ -14,7 +14,7 @@ import {
import Note from "./Note";
import { Toast } from "@douyinfe/semi-ui";
export default function Canvas(props) {
export default function Canvas() {
const { tables, updateTable, relationships, addRelationship } =
useContext(TableContext);
const { areas, updateArea } = useContext(AreaContext);
@@ -255,7 +255,7 @@ export default function Canvas(props) {
}
};
const handleMouseUp = (e) => {
const handleMouseUp = () => {
if (coordsDidUpdate(dragging.element)) {
const info = getMoveInfo();
setUndoStack((prev) => [
@@ -320,7 +320,7 @@ export default function Canvas(props) {
});
};
const handleGripField = (id) => {
const handleGripField = () => {
setPanning(false);
setDragging({ element: ObjectType.NONE, id: -1, prevX: 0, prevY: 0 });
setLinking(true);

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import { Button, Input, Tag, Avatar } from "@douyinfe/semi-ui";
import { IconSend } from "@douyinfe/semi-icons";
import { socket } from "../data/socket";

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState, useEffect } from "react";
import { useContext, useState, useEffect } from "react";
import { Collapse, Badge } from "@douyinfe/semi-ui";
import { SettingsContext, TableContext, TypeContext } from "../pages/Editor";
import { validateDiagram, arrayIsEqual } from "../utils";

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import {
LayoutContext,
NoteContext,

View File

@@ -1,4 +1,4 @@
import { React, useState } from "react";
import { useState } from "react";
import { calcPath } from "../utils";
export default function Relationship(props) {

View File

@@ -1,4 +1,4 @@
import React, { useContext, useEffect, useState } from "react";
import { useContext, useEffect, useState } from "react";
import chatIcon from "../assets/chat.png";
import botIcon from "../assets/bot.png";
import teamIcon from "../assets/group.png";
@@ -193,8 +193,9 @@ export default function Sidebar() {
if (undoStack.length > 0) {
return (
<List className="sidesheet-theme">
{[...undoStack].reverse().map((e) => (
{[...undoStack].reverse().map((e, i) => (
<List.Item
key={i}
style={{ padding: "4px 18px 4px 18px" }}
className="hover-1"
>

View File

@@ -1,4 +1,4 @@
import { React, useState, useContext } from "react";
import { useState, useContext } from "react";
import {
sqlDataTypes,
tableThemes,
@@ -535,8 +535,8 @@ export default function Table(props) {
values: v,
})
}
onFocus={(e) => setEditField({ values: f.values })}
onBlur={(e) => {
onFocus={() => setEditField({ values: f.values })}
onBlur={() => {
if (
JSON.stringify(editField.values) ===
JSON.stringify(f.values)
@@ -1238,7 +1238,7 @@ export default function Table(props) {
<div className={`${hoveredField === index ? "text-zinc-400" : ""}`}>
<button
className={`w-[10px] h-[10px] bg-[#2f68ad] opacity-80 z-50 rounded-full me-2`}
onMouseDown={(ev) => {
onMouseDown={() => {
props.handleGripField(index);
props.setLine((prev) => ({
...prev,

View File

@@ -1,4 +1,4 @@
import React, { useContext, useState } from "react";
import { useContext, useState } from "react";
import {
Checkbox,
Input,