titor/drawDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix opening type and table at the same time

Browse Source
This commit is contained in:
1ilit 2024-05-02 16:23:18 +03:00
parent 4424173a10
commit 62e4318592
4 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/EditorSidePanel/TablesTab/SearchBar.jsx
View File

@ -2,18 +2,19 @@ import { useState } from "react";
import { useSelect, useTables } from "../../../hooks";
import { AutoComplete } from "@douyinfe/semi-ui";
import { IconSearch } from "@douyinfe/semi-icons";
import { ObjectType } from "../../../data/constants";
export default function SearchBar() {
const { tables } = useTables();
const { setSelectedElement } = useSelect();
const [searchText, setSearchText] = useState("");
const [filteredResult, setFilteredResult] = useState(
tables.map((t) => t.name)
tables.map((t) => t.name),
);
const handleStringSearch = (value) => {
setFilteredResult(
tables.map((t) => t.name).filter((i) => i.includes(value))
tables.map((t) => t.name).filter((i) => i.includes(value)),
);
};
@ -33,6 +34,7 @@ export default function SearchBar() {
...prev,
id: id,
open: true,
element: ObjectType.TABLE,
}));
document
.getElementById(`scroll_table_${id}`)

10
src/components/EditorSidePanel/TablesTab/TablesTab.jsx
View File

@ -1,6 +1,7 @@
import { Collapse, Row, Col, Button } from "@douyinfe/semi-ui";
import { IconPlus } from "@douyinfe/semi-icons";
import { useSelect, useTables } from "../../../hooks";
import { ObjectType } from "../../../data/constants";
import SearchBar from "./SearchBar";
import Empty from "../Empty";
import TableInfo from "./TableInfo";
@ -25,12 +26,17 @@ export default function TablesTab() {
<Empty title="No tables" text="Start building your diagram!" />
) : (
<Collapse
activeKey={selectedElement.open ? `${selectedElement.id}` : ""}
activeKey={
selectedElement.open && selectedElement.element === ObjectType.TABLE
? `${selectedElement.id}`
: ""
}
onChange={(k) =>
setSelectedElement((prev) => ({
...prev,
id: parseInt(k),
open: true,
id: parseInt(k),
element: ObjectType.TABLE,
}))
}
accordion

4
src/components/EditorSidePanel/TypesTab/SearchBar.jsx
View File

@ -2,6 +2,7 @@ import { useState } from "react";
import { AutoComplete } from "@douyinfe/semi-ui";
import { IconSearch } from "@douyinfe/semi-icons";
import { useSelect, useTypes } from "../../../hooks";
import { ObjectType } from "../../../data/constants";
export default function Searchbar() {
const { types } = useTypes();
@ -32,8 +33,9 @@ export default function Searchbar() {
const i = types.findIndex((t) => t.name === v);
setSelectedElement((prev) => ({
...prev,
id: parseInt(i),
id: i,
open: true,
element: ObjectType.TYPE,
}));
document
.getElementById(`scroll_type_${i}`)

12
src/components/EditorSidePanel/TypesTab/TypesTab.jsx
View File

@ -1,8 +1,9 @@
import { Collapse, Row, Col, Button, Popover } from "@douyinfe/semi-ui";
import { IconPlus, IconInfoCircle } from "@douyinfe/semi-icons";
import { useSelect, useTypes } from "../../../hooks";
import { ObjectType } from "../../../data/constants";
import Searchbar from "./SearchBar";
import Empty from "../Empty";
import { useSelect, useTypes } from "../../../hooks";
import TypeInfo from "./TypeInfo";
export default function TypesTab() {
@ -54,12 +55,17 @@ export default function TypesTab() {
<Empty title="No types" text="Make your own custom data types" />
) : (
<Collapse
activeKey={selectedElement.open ? `${selectedElement.id}` : ""}
activeKey={
selectedElement.open && selectedElement.element === ObjectType.TYPE
? `${selectedElement.id}`
: ""
}
onChange={(id) =>
setSelectedElement((prev) => ({
...prev,
id: parseInt(id),
open: true,
id: parseInt(id),
element: ObjectType.TYPE,
}))
}
accordion