Open note in tab after clicking edit button

src/components/EditorCanvas/Note.jsx

@@ -61,22 +61,18 @@ export default function Note({ data, onMouseDown }) {
   };
 
   const edit = () => {
-    if (layout.sidebar) {
     setSelectedElement((prev) => ({
       ...prev,
-        currentTab: Tab.NOTES,
+      ...(layout.sidebar && { currentTab: Tab.NOTES }),
-      }));
+      ...(!layout.sidebar && { element: ObjectType.NOTE }),
-      if (selectedElement.currentTab !== Tab.NOTES) return;
-      document
-        .getElementById(`scroll_note_${data.id}`)
-        .scrollIntoView({ behavior: "smooth" });
-    } else {
-      setSelectedElement((prev) => ({
-        ...prev,
-        element: ObjectType.NOTE,
       id: data.id,
       open: true,
     }));
+
+    if (layout.sidebar && selectedElement.currentTab === Tab.NOTES) {
+      document
+        .getElementById(`scroll_note_${data.id}`)
+        .scrollIntoView({ behavior: "smooth" });
     }
   };
 

src/components/EditorSidePanel/NotesTab/NotesTab.jsx

@@ -1,20 +1,27 @@
 import { useState } from "react";
 import { Row, Col, Button, Collapse } from "@douyinfe/semi-ui";
 import { IconPlus } from "@douyinfe/semi-icons";
-import { useNotes } from "../../../hooks";
+import { useNotes, useSelect } from "../../../hooks";
 import Empty from "../Empty";
 import SearchBar from "./SearchBar";
 import NoteInfo from "./NoteInfo";
 
 export default function NotesTab() {
   const { notes, addNote } = useNotes();
-  const [activeKey, setActiveKey] = useState("");
+  const { selectedElement, setSelectedElement } = useSelect();
 
   return (
     <>
       <Row gutter={6}>
         <Col span={16}>
-          <SearchBar setActiveKey={setActiveKey} />
+          <SearchBar
+            setActiveKey={(activeKey) =>
+              setSelectedElement((prev) => ({
+                ...prev,
+                id: parseInt(activeKey),
+              }))
+            }
+          />
         </Col>
         <Col span={8}>
           <Button icon={<IconPlus />} block onClick={() => addNote()}>
@@ -26,8 +33,14 @@ export default function NotesTab() {
         <Empty title="No text notes" text="Add notes cuz why not!" />
       ) : (
         <Collapse
-          activeKey={activeKey}
+          activeKey={selectedElement.open ? `${selectedElement.id}` : ""}
-          onChange={(k) => setActiveKey(k)}
+          onChange={(activeKey) => {
+            setSelectedElement((prev) => ({
+              ...prev,
+              id: parseInt(activeKey),
+              open: true,
+            }));
+          }}
           accordion
         >
           {notes.map((n, i) => (