chore: updates

src/common/component/MarkdownStyleOverride.js

@@ -8,6 +8,9 @@ const MarkdownOverrides = createGlobalStyle`
     .toastui-editor-md-splitter{
       background-color:#D0D5DD ;
     }
+    .ProseMirror{
+      height: 100%;
+    }
   }
     *{
         margin: 0 ;

src/common/component/MixedInput/index.js

@@ -13,6 +13,11 @@ import {
   createSoftBreakPlugin,
   createComboboxPlugin,
   createMentionPlugin,
+  // comboboxSelectors,
+  // getMentionOnSelectItem,
+  // findMentionInput,
+  // removeMentionInput,
+  // isSelectionInMentionInput,
   createPlugins,
   ELEMENT_PARAGRAPH,
   getPlateEditorRef,
@@ -147,6 +152,18 @@ const Plugins = ({
   const handleChange = useCallback(
     async (val) => {
       console.log("tmps changed", val);
+      // const wtf = getMentionOnSelectItem();
+      // const plateEditor = getPlateEditorRef(`${TEXT_EDITOR_PREFIX}_${id}`);
+      // const currentMentionInput = findMentionInput(plateEditor);
+      // const items = comboboxSelectors.filteredItems();
+      // console.log(
+      //   "mention check",
+      //   items,
+      //   isSelectionInMentionInput(plateEditor)
+      // );
+      // if (items?.length == 0 && isSelectionInMentionInput(plateEditor)) {
+      //   removeMentionInput(plateEditor, currentMentionInput[1]);
+      // }
       const tmps = [];
       const getMixedText = (children) => {
         const mentions = [];
@@ -202,7 +219,9 @@ const Plugins = ({
           ? {
               type: "text",
               content: tmp.map((t) => t.content).join("\n"),
-              properties: { mentions: tmp.map((t) => t.mentions).flat() },
+              properties: {
+                mentions: tmp.map((t) => t.properties?.mentions || []).flat(),
+              },
             }
           : tmp;
       });

src/common/component/StyledSettingContainer.js

@@ -1,5 +1,7 @@
 // import React from 'react'
 import styled from "styled-components";
+import { useLocation, NavLink } from "react-router-dom";
+
 import backIcon from "../../assets/icons/arrow.left.svg?url";
 const StyledWrapper = styled.div`
   width: 100vw;
@@ -39,8 +41,6 @@ const StyledWrapper = styled.div`
         margin-bottom: 2px;
       }
       .item {
-        cursor: pointer;
-        padding: 4px 12px;
         font-weight: 500;
         font-size: 14px;
         line-height: 20px;
@@ -50,8 +50,14 @@ const StyledWrapper = styled.div`
         &.curr {
           background: #e7e5e4;
         }
+        > a {
+          display: block;
+          padding: 4px 12px;
+        }
       }
       &.danger .item {
+        cursor: pointer;
+        padding: 4px 12px;
         color: #ef4444;
         &:hover {
           background: none;
@@ -81,12 +87,9 @@ export default function StyledSettingContainer({
   navs = [],
   dangers = [],
   nav,
-  updateNav,
   children,
 }) {
-  const handleNavClick = (name) => {
-    updateNav(name);
-  };
+  const { pathname } = useLocation();
   return (
     <StyledWrapper>
       <div className="left">
@@ -100,10 +103,9 @@ export default function StyledSettingContainer({
                 return (
                   <li
                     key={name}
-                    onClick={handleNavClick.bind(null, name)}
                     className={`item ${name == nav?.name ? "curr" : ""}`}
                   >
-                    {title}
+                    <NavLink to={`${pathname}?nav=${name}`}>{title}</NavLink>
                   </li>
                 );
               })}