Update Search Index On Refactor (#436)

#436

Author: dineshsingh1

package.json

@@ -1,7 +1,7 @@
 {
   "name": "mex-alpha",
   "productName": "Mex Alpha",
-  "version": "0.16.2-alpha.2",
+  "version": "0.16.2-alpha.3",
   "description": "Mex it to flex it",
   "main": "dist/main.cjs",
   "scripts": {

src/apis/useSaveApi.ts

@@ -18,7 +18,7 @@ import { allNamespacesHierarchyParser } from '@workduck-io/mex-utils'
 import { defaultContent } from '../data/Defaults/baseData'
 import { DEFAULT_NAMESPACE, WORKSPACE_HEADER } from '../data/Defaults/defaults'
 import { USE_API } from '../data/Defaults/dev_'
-import { useLinks } from '../hooks/useLinks'
+import { getTitleFromPath, useLinks } from '../hooks/useLinks'
 import '../services/apiClient/apiClient'
 import { useAuthStore } from '../services/auth/useAuth'
 import { isRequestedWithin } from '../store/useApiStore'
@@ -95,7 +95,8 @@ export const useApi = () => {
       })
       .then((d) => {
         const metadata = extractMetadata(d.data)
-        updateFromContent(noteId, d.data.data ?? options.content, metadata)
+        const content = deserializeContent(d.data.data ?? options.content)
+        updateFromContent(noteId, content, metadata)
         addLastOpened(noteId)
         return d.data
       })
@@ -646,7 +647,7 @@ export const useApi = () => {
               getDataAPI(ilink.nodeid, false, false, false).then((data) => {
                 mog('toUpdateLocal', { ilink, data })
                 setContent(ilink.nodeid, data.content, data.metadata)
-                updateDocument('archive', ilink.nodeid, data.content)
+                updateDocument('archive', ilink.nodeid, data.content, getTitleFromPath(ilink.path))
               })
             )
           ).then(() => {

src/components/mex/Refactor/Refactor.tsx

@@ -4,6 +4,8 @@ import React, { useEffect } from 'react'
 import arrowRightLine from '@iconify/icons-ri/arrow-right-line'
 import { Icon } from '@iconify/react'
 import useDataStore from '@store/useDataStore'
+import useModalStore, { ModalsType } from '@store/useModalStore'
+import { useUserPreferenceStore } from '@store/userPreferenceStore'
 import Modal from 'react-modal'
 import create from 'zustand'
 
@@ -16,15 +18,12 @@ import { useRefactor } from '../../../hooks/useRefactor'
 import { useKeyListener } from '../../../hooks/useShortcutListener'
 import { useEditorStore } from '../../../store/useEditorStore'
 import { useHelpStore } from '../../../store/useHelpStore'
-import { useLayoutStore } from '../../../store/useLayoutStore'
 import { NodeLink } from '../../../types/relations'
 import { mog } from '../../../utils/lib/helper'
 import { isMatch, isReserved } from '../../../utils/lib/paths'
 import { QuickLink, WrappedNodeSelect } from '../NodeSelect/NodeSelect'
 import { doesLinkRemain } from './doesLinkRemain'
 import { ArrowIcon, MockRefactorMap, ModalControls, ModalHeader, MRMHead, MRMRow } from './styles'
-import { useUserPreferenceStore } from '@store/userPreferenceStore'
-import useModalStore, { ModalsType } from '@store/useModalStore'
 import { RefactorPath } from './types'
 
 // Prefill modal has been added to the Tree via withRefactor from useRefactor

src/components/mex/Search/Search.tsx

@@ -43,7 +43,7 @@ import { Title, TitleText } from '../../../style/Typography'
 import { GenericSearchResult, idxKey } from '../../../types/search'
 import { NodeType } from '../../../types/Types'
 import { SplitType } from '../../../ui/layout/splitView'
-import { getInitialNode } from '../../../utils/helpers'
+import { getInitialNode } from '@utils/initial'
 import { NavigationType, ROUTE_PATHS, useRouting } from '../../../views/routes/urls'
 import Backlinks from '../Backlinks'
 import Metadata from '../Metadata/Metadata'

src/components/mex/Sidebar/TreeItem.tsx

@@ -3,6 +3,7 @@ import React, { useMemo } from 'react'
 import { ItemId, RenderItemParams, TreeItem } from '@atlaskit/tree'
 import { IS_DEV } from '@data/Defaults/dev_'
 import { useLastOpened } from '@hooks/useLastOpened'
+import usePinnedWindows from '@hooks/usePinnedWindow'
 import checkboxBlankCircleFill from '@iconify/icons-ri/checkbox-blank-circle-fill'
 import fileList2Line from '@iconify/icons-ri/file-list-2-line'
 // import { complexTree } from '../mockdata/complexTree'
@@ -31,7 +32,6 @@ import { MexIcon } from '@workduck-io/mex-components'
 
 import { LastOpenedState } from '../../../types/userPreference'
 import { TreeContextMenu } from './TreeWithContextMenu'
-import usePinnedWindows from '@hooks/usePinnedWindow'
 
 const defaultSnap = {
   isDragging: false,
@@ -71,8 +71,8 @@ const ItemTitleWithAnalysis = ({ item }: { item: TreeItem }) => {
     anal.nodeid && anal.nodeid === item.data.nodeid && anal.title !== undefined && anal.title !== ''
       ? anal.title
       : item.data
-        ? item.data.title
-        : 'NoTitle'
+      ? item.data.title
+      : 'NoTitle'
 
   return (
     <ItemTitle>
@@ -128,7 +128,6 @@ export const RenderTreeItem = ({
   onClick
 }: TreeItemProps) => {
   const isTrue = JSON.stringify(snapshot) !== JSON.stringify(defaultSnap)
-
   const lastOpenedNote = useUserPreferenceStore((state) => state.lastOpenedNotes[item?.data?.nodeid])
   const { getLastOpened } = useLastOpened()
 
@@ -141,20 +140,24 @@ export const RenderTreeItem = ({
     return lastOpenedState === LastOpenedState.UNREAD
   }, [lastOpenedState])
 
+  const isItemSelected = isInEditor && item.data && match?.params?.nodeid === item.data.nodeid
+
   return (
     <Tippy theme="mex" placement="right" singleton={target} content={<TooltipContent item={item} />}>
       <span>
         <ContextMenu.Root
           onOpenChange={(open) => {
             if (open) {
               setContextOpenNodeId(item.data.nodeid)
-            } else setContextOpenNodeId(null)
+            } else {
+              setContextOpenNodeId(null)
+            }
           }}
         >
           <ContextMenu.Trigger asChild>
             <StyledTreeItem
               ref={provided.innerRef}
-              selected={isInEditor && item.data && match?.params?.nodeid === item.data.nodeid}
+              selected={isItemSelected}
               isDragging={snapshot.isDragging}
               hasMenuOpen={contextOpenNodeId === item.data.nodeid}
               isStub={item?.data?.stub}
@@ -183,11 +186,13 @@ export const RenderTreeItem = ({
 }
 
 const TreeItemMetaInfo = ({ item, unRead }: { item: any; unRead: boolean }) => {
-  const isPinned = useMultipleEditors(store => store.pinned?.has(item?.data?.nodeid))
+  const isPinned = useMultipleEditors((store) => store.pinned?.has(item?.data?.nodeid))
   const { onUnpinNote } = usePinnedWindows()
 
   if (isPinned) {
-    return <MexIcon onClick={() => onUnpinNote(item?.data?.nodeid)} icon={PinIcon} width={16} height={16} color="white" />
+    return (
+      <MexIcon onClick={() => onUnpinNote(item?.data?.nodeid)} icon={PinIcon} width={16} height={16} color="white" />
+    )
   }
 
   return unRead ? (

src/components/spotlight/Content/index.tsx

@@ -143,7 +143,7 @@ const Content = () => {
     }
 
     if (normalMode) getSearchItems()
-  }, [search.value, actions, selection, activeItem.item, normalMode, pinned, ilinks, events])
+  }, [search.value, actions, selection, activeItem.item, normalMode, recentResearchNodes, pinned, ilinks, events])
 
   // * For setting the preview
   useEffect(() => {

src/components/spotlight/GlobalListener/index.tsx

@@ -1,33 +1,35 @@
-import { AppType, useInitialize } from '../../../hooks/useInitialize'
-import { NavigationType, ROUTE_PATHS, useRouting } from '../../../views/routes/urls'
 import React, { memo, useEffect, useState } from 'react'
 
+// import { useActionsCache } from '../Actions/useActionsCache'
+import { useShareModalStore } from '@components/mex/Mention/ShareModalStore'
+import { useCreateNewNote } from '@hooks/useCreateNewNote'
+// import useDwindleAuthStore from '@workduck-io/dwindle/lib/esm/AuthStore/useAuthStore'
+import syncStores from '@store/syncStore/synced'
+import { getPlateSelectors } from '@udecode/plate'
+import { ipcRenderer } from 'electron'
+
 import { IpcAction } from '../../../data/IpcAction'
+import { useSaver } from '../../../editor/Components/Saver'
 // import { appNotifierWindow } from '../../../electron/utils/notifiers'
 import { getNewDraftKey } from '../../../editor/Components/SyncBlock/getNewBlockData'
-import { getPlateSelectors } from '@udecode/plate'
-import { ipcRenderer } from 'electron'
+import { useGoogleCalendarAutoFetch } from '../../../hooks/useCalendar'
+import { AppType, useInitialize } from '../../../hooks/useInitialize'
 import useAnalytics from '../../../services/analytics'
 import { useAuthStore } from '../../../services/auth/useAuth'
-import useDataStore from '../../../store/useDataStore'
-// import useOnboard from '../../../store/useOnboarding'
-import { useRecentsStore } from '../../../store/useRecentsStore'
-import { useSaver } from '../../../editor/Components/Saver'
-import { useSpotlightAppStore } from '../../../store/app.spotlight'
 import { useSpotlightContext } from '../../../store/Context/context.spotlight'
+import { useSpotlightAppStore } from '../../../store/app.spotlight'
 import { useSpotlightEditorStore } from '../../../store/editor.spotlight'
 import { useSpotlightSettingsStore } from '../../../store/settings.spotlight'
-import ReminderArmer from '../Reminder/ReminderArmer'
-import { useGoogleCalendarAutoFetch } from '../../../hooks/useCalendar'
+import useDataStore from '../../../store/useDataStore'
+// import useOnboard from '../../../store/useOnboarding'
+import { useRecentsStore } from '../../../store/useRecentsStore'
+import { NavigationType, ROUTE_PATHS, useRouting } from '../../../views/routes/urls'
+import { useActionsPerfomerClient } from '../Actions/useActionPerformer'
 // import { useMentionData, useTokenData } from '../../../hooks/useLocalData'
 // import { useRecieveMentions, useRecieveTokens } from '../../../hooks/useSyncData'
 import { useActionStore } from '../Actions/useActionStore'
-import { useActionsPerfomerClient } from '../Actions/useActionPerformer'
-// import { useActionsCache } from '../Actions/useActionsCache'
-import { useShareModalStore } from '@components/mex/Mention/ShareModalStore'
-import { useCreateNewNote } from '@hooks/useCreateNewNote'
-// import useDwindleAuthStore from '@workduck-io/dwindle/lib/esm/AuthStore/useAuthStore'
-import syncStores from '@store/syncStore/synced'
+import ReminderArmer from '../Reminder/ReminderArmer'
+import { useSaveChanges } from '../Search/useSearchProps'
 
 const GlobalListener = memo(() => {
   const [temp, setTemp] = useState<any>()
@@ -50,7 +52,7 @@ const GlobalListener = memo(() => {
   // const { getTokenData } = useTokenData()
   // const { initActionsInStore, initActionsOfGroup } = useActions()
   // const { setReceiveToken } = useRecieveTokens()
-  const { onSave } = useSaver()
+  const { saveIt } = useSaveChanges()
   const { init } = useInitialize()
   const { identifyUser } = useAnalytics()
   const { initActionPerfomerClient } = useActionsPerfomerClient()
@@ -127,7 +129,7 @@ const GlobalListener = memo(() => {
 
         addRecent(node.nodeid)
         addInRecentResearchNodes(node.nodeid)
-        if (saveAfterBlur) onSave(node, true, false, content)
+        if (saveAfterBlur) saveIt({ saveAndClose: false, skipPathCheck: true, notify: false })
         else setSaveAfterBlur(true)
         // appNotifierWindow(IpcAction.NEW_RECENT_ITEM, AppType.SPOTLIGHT, { nodeid: node.nodeid })
         setReset()

src/components/spotlight/Home/useSearch.ts

@@ -101,8 +101,7 @@ export const useSearch = () => {
           )
 
           searchList = isNew ? [CREATE_NEW_ITEM, ...results] : results
-        }
-        else {
+        } else {
           searchList = quickLinks
         }
         break
@@ -122,6 +121,8 @@ export const useSearch = () => {
         const nodeItems = await queryIndex(['node'], search.value)
         const snippetItems = await queryIndex(['snippet', 'template'], search.value)
 
+        mog('Node Items', { nodeItems })
+
         const actionItems = getSearchResults(search.value, actions, { keySelector: (obj) => obj.title })
         const localNodes = []
 

src/components/spotlight/Search/index.tsx

@@ -1,28 +1,30 @@
-import { CategoryType, useSpotlightContext } from '../../../store/Context/context.spotlight'
 /* eslint-disable react/prop-types */
 import React, { useEffect, useRef } from 'react'
-import { StyledInput, StyledSearch } from './styled'
-import { useSaveChanges, useSearchProps } from './useSearchProps'
 
-import { CenterIcon } from '../../../style/spotlight/layout'
-import Message from '../Message'
-import { useContentStore } from '../../../store/useContentStore'
+import NamespaceTag from '@components/mex/NamespaceTag'
+import { useNamespaces } from '@hooks/useNamespaces'
+import { useSpotlightEditorStore } from '@store/editor.spotlight'
+import useDataStore from '@store/useDataStore'
+import { StyledCreatatbleSelect } from '@style/Form'
+import { StyledNamespaceSpotlightSelectComponents } from '@style/Select'
+import { useTheme } from 'styled-components'
 import { useDebouncedCallback } from 'use-debounce'
+
+import { mog } from '@workduck-io/mex-utils'
+
+import { CategoryType, useSpotlightContext } from '../../../store/Context/context.spotlight'
 import { useSpotlightAppStore } from '../../../store/app.spotlight'
-import { useTheme } from 'styled-components'
+import { useContentStore } from '../../../store/useContentStore'
+import { CenterIcon } from '../../../style/spotlight/layout'
 import { withoutContinuousDelimiter } from '../../../utils/lib/helper'
 import { useRouting } from '../../../views/routes/urls'
-import ViewActionHandler from '../ActionStage/Forms/ViewActionHandler'
-import { useActionStore } from '../Actions/useActionStore'
 import { useActionMenuStore } from '../ActionStage/ActionMenu/useActionMenuStore'
+import ViewActionHandler from '../ActionStage/Forms/ViewActionHandler'
 import { getIconType, ProjectIconMex } from '../ActionStage/Project/ProjectIcon'
-import { StyledCreatatbleSelect } from '@style/Form'
-import useDataStore from '@store/useDataStore'
-import { useNamespaces } from '@hooks/useNamespaces'
-import { mog } from '@workduck-io/mex-utils'
-import { StyledNamespaceSpotlightSelectComponents } from '@style/Select'
-import NamespaceTag from '@components/mex/NamespaceTag'
-import { useSpotlightEditorStore } from '@store/editor.spotlight'
+import { useActionStore } from '../Actions/useActionStore'
+import Message from '../Message'
+import { StyledInput, StyledSearch } from './styled'
+import { useSaveChanges, useSearchProps } from './useSearchProps'
 
 type QueryType = {
   value: string
@@ -129,12 +131,6 @@ const Search = () => {
     }
   }
 
-  mog('spotlight', {
-    input,
-    placeholder,
-    editorNode
-  })
-
   return (
     <StyledSearch id="wd-mex-spotlight-search-container">
       <CenterIcon id="wd-mex-search-left-icon" pointer={!normalMode} onClick={onBackClick}>

src/components/spotlight/Search/useSearchProps.tsx

@@ -2,6 +2,7 @@ import { SEPARATOR } from '@components/mex/Sidebar/treeUtils'
 import { defaultContent } from '@data/Defaults/baseData'
 import { getBlockMetadata } from '@editor/Actions/useEditorBlockSelection'
 import { getLatestContent } from '@hooks/useEditorBuffer'
+import { getTitleFromPath } from '@hooks/useLinks'
 import { getPlateSelectors } from '@udecode/plate'
 import { convertValueToTasks } from '@utils/lib/contentConvertTask'
 
@@ -56,6 +57,7 @@ type SaveItProps = {
   isNewTask?: boolean
   path?: string
   notify?: boolean
+  skipPathCheck?: boolean
   // Will not save on blur if false
   // defaults to true if absent
   saveAfterBlur?: boolean
@@ -113,7 +115,7 @@ export const useSaveChanges = () => {
     let path = node.path
     const title = getTitleFromContent(editorContent)
 
-    if (isNewDraftNode && isUntitledDraftNode) {
+    if (isNewDraftNode && isUntitledDraftNode && !options?.skipPathCheck) {
       if (options?.beforeSave) {
         path = path.split(SEPARATOR).slice(0, -1).join(SEPARATOR) + `${SEPARATOR}${title}`
       } else {
@@ -140,7 +142,7 @@ export const useSaveChanges = () => {
       })
     }
 
-    await updateDocument('node', node.nodeid, editorContent)
+    await updateDocument('node', node.nodeid, editorContent, getTitleFromPath(path))
 
     setSearch({ value: '', type: CategoryType.search })
     setInput('')