pre chat cleanup

electron/preload/index.ts

@@ -108,6 +108,7 @@ const fileSystem = {
   getFilesystemPathsAsDBItems: createIPCHandler<(paths: string[]) => Promise<DBEntry[]>>(
     'get-filesystem-paths-as-db-items',
   ),
+  getAllFilenamesInDirectory: createIPCHandler<(dirName: string) => Promise<string[]>>('get-files-in-directory'),
 }
 
 const path = {
@@ -120,7 +121,6 @@ const path = {
     'add-extension-if-no-extension-present',
   ),
   pathSep: createIPCHandler<() => Promise<string>>('path-sep'),
-  getAllFilenamesInDirectory: createIPCHandler<(dirName: string) => Promise<string[]>>('get-files-in-directory'),
 }
 
 const llm = {

src/components/Chat/AddContextFiltersModal.tsx

@@ -17,12 +17,12 @@ import { ChatFilters } from './types'
 interface Props {
   isOpen: boolean
   onClose: () => void
-  vaultDirectory: string
   setChatFilters: (chatFilters: ChatFilters) => void
   chatFilters: ChatFilters
 }
 
-const AddContextFiltersModal: React.FC<Props> = ({ vaultDirectory, isOpen, onClose, chatFilters, setChatFilters }) => {
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const AddContextFiltersModal: React.FC<Props> = ({ isOpen, onClose, chatFilters, setChatFilters }) => {
   const [internalFilesSelected, setInternalFilesSelected] = useState<string[]>(chatFilters?.files || [])
   const [searchText, setSearchText] = useState<string>('')
   const [suggestionsState, setSuggestionsState] = useState<SuggestionsState | null>(null)
@@ -41,16 +41,16 @@ const AddContextFiltersModal: React.FC<Props> = ({ vaultDirectory, isOpen, onClo
     { label: 'Past year', value: 'lastYear' },
   ]
 
-  useEffect(() => {
-    const updatedChatFilters: ChatFilters = {
-      ...chatFilters,
-      files: [...new Set([...chatFilters.files, ...internalFilesSelected])],
-      numberOfChunksToFetch,
-      minDate: minDate || undefined,
-      maxDate: maxDate || undefined,
-    }
-    setChatFilters(updatedChatFilters)
-  }, [internalFilesSelected, numberOfChunksToFetch, minDate, maxDate, chatFilters, setChatFilters])
+  // useEffect(() => {
+  //   const updatedChatFilters: ChatFilters = {
+  //     ...chatFilters,
+  //     files: [...new Set([...chatFilters.files, ...internalFilesSelected])],
+  //     numberOfChunksToFetch,
+  //     minDate: minDate || undefined,
+  //     maxDate: maxDate || undefined,
+  //   }
+  //   setChatFilters(updatedChatFilters)
+  // }, [internalFilesSelected, numberOfChunksToFetch, minDate, maxDate, setChatFilters])
 
   const handleNumberOfChunksChange = (event: Event, value: number | number[]) => {
     const newValue = Array.isArray(value) ? value[0] : value
@@ -110,7 +110,6 @@ const AddContextFiltersModal: React.FC<Props> = ({ vaultDirectory, isOpen, onClo
           <div className="flex-1">
             <h3 className="mb-2 text-lg text-white">Select files for context</h3>
             <SearchBarWithFilesSuggestion
-              vaultDirectory={vaultDirectory}
               searchText={searchText}
               setSearchText={setSearchText}
               onSelectSuggestion={(file: string) => {

src/components/Chat/ChatMessages.tsx

@@ -32,7 +32,6 @@ interface ChatMessagesProps {
   isAddContextFiltersModalOpen: boolean
   setUserTextFieldInput: Dispatch<SetStateAction<string>>
   defaultModelName: string
-  vaultDirectory: string
   setIsAddContextFiltersModalOpen: Dispatch<SetStateAction<boolean>>
   handlePromptSelection: (prompt: string | undefined) => void
   askText: AskOptions
@@ -44,7 +43,6 @@ const ChatMessages: React.FC<ChatMessagesProps> = ({
   isAddContextFiltersModalOpen,
   setUserTextFieldInput,
   defaultModelName,
-  vaultDirectory,
   setIsAddContextFiltersModalOpen,
   handlePromptSelection,
   askText,
@@ -213,7 +211,6 @@ const ChatMessages: React.FC<ChatMessagesProps> = ({
 
         {isAddContextFiltersModalOpen && (
           <AddContextFiltersModal
-            vaultDirectory={vaultDirectory}
             isOpen={isAddContextFiltersModalOpen}
             onClose={() => setIsAddContextFiltersModalOpen(false)}
             chatFilters={chatFilters}

src/components/Chat/index.tsx

@@ -15,11 +15,10 @@ import { useChatContext } from '@/contexts/ChatContext'
 import { useTabsContext } from '@/contexts/TabContext'
 
 interface ChatComponentProps {
-  vaultDirectory: string
   showSimilarFiles: boolean
 }
 
-const ChatComponent: React.FC<ChatComponentProps> = ({ vaultDirectory, showSimilarFiles }) => {
+const ChatComponent: React.FC<ChatComponentProps> = ({ showSimilarFiles }) => {
   const [userTextFieldInput, setUserTextFieldInput] = useState<string>('')
   const [askText] = useState<AskOptions>(AskOptions.Ask)
   const [loadingResponse, setLoadingResponse] = useState<boolean>(false)
@@ -185,7 +184,6 @@ const ChatComponent: React.FC<ChatComponentProps> = ({ vaultDirectory, showSimil
           isAddContextFiltersModalOpen={isAddContextFiltersModalOpen}
           setUserTextFieldInput={setUserTextFieldInput}
           defaultModelName={defaultModelName}
-          vaultDirectory={vaultDirectory}
           setIsAddContextFiltersModalOpen={setIsAddContextFiltersModalOpen}
           handlePromptSelection={handleNewChatMessage}
           askText={askText}

src/components/Common/SearchBarWithFilesSuggestion.tsx

@@ -1,10 +1,9 @@
 import React, { useEffect, useRef, useState } from 'react'
 
 import InEditorBacklinkSuggestionsDisplay, { SuggestionsState } from '../Editor/BacklinkSuggestionsDisplay'
-import useFileInfoTree from '../Sidebars/FileSideBar/hooks/use-file-info-tree'
+import useFileInfoTreeHook from '../Sidebars/FileSideBar/hooks/use-file-info-tree'
 
 interface Props {
-  vaultDirectory: string
   searchText: string
   setSearchText: (text: string) => void
   onSelectSuggestion: (suggestion: string) => void
@@ -13,14 +12,16 @@ interface Props {
 }
 
 const SearchBarWithFilesSuggestion = ({
-  vaultDirectory,
   searchText,
   setSearchText,
   onSelectSuggestion,
   suggestionsState,
   setSuggestionsState,
 }: Props) => {
-  const { flattenedFiles } = useFileInfoTree(vaultDirectory)
+  const [sidebarWidth, setSidebarWidth] = useState(0)
+  const [vaultDirectory, setVaultDirectory] = useState<string | null>(null)
+
+  const { flattenedFiles } = useFileInfoTreeHook(vaultDirectory)
   const inputRef = useRef<HTMLInputElement>(null)
 
   const initializeSuggestionsStateOnFocus = () => {
@@ -39,7 +40,13 @@ const SearchBarWithFilesSuggestion = ({
     })
   }
 
-  const [sidebarWidth, setSidebarWidth] = useState(0)
+  useEffect(() => {
+    const setFileDirectory = async () => {
+      const windowDirectory = await window.electronStore.getVaultDirectoryForWindow()
+      setVaultDirectory(windowDirectory)
+    }
+    setFileDirectory()
+  }, [])
 
   useEffect(() => {
     // Calculate the width of the sidebar

src/components/Flashcard/FlashcardCreateModal.tsx

@@ -14,7 +14,7 @@ import FlashcardCore from './FlashcardsCore'
 import { FlashcardQAPairSchema, FlashcardQAPairUI } from './types'
 import { storeFlashcardPairsAsJSON } from './utils'
 import { resolveLLMClient } from '../Chat/utils'
-import useFileInfoTree from '../Sidebars/FileSideBar/hooks/use-file-info-tree'
+import useFileInfoTreeHook from '../Sidebars/FileSideBar/hooks/use-file-info-tree'
 
 interface FlashcardCreateModalProps {
   isOpen: boolean
@@ -29,7 +29,7 @@ const FlashcardCreateModal: React.FC<FlashcardCreateModalProps> = ({ isOpen, onC
   const [selectedFile, setSelectedFile] = useState<string>(initialFlashcardFile)
   const [vaultDirectory, setVaultDirectory] = useState<string>('')
 
-  const { flattenedFiles } = useFileInfoTree(vaultDirectory)
+  const { flattenedFiles } = useFileInfoTreeHook(vaultDirectory)
   const { suggestionsState, setSuggestionsState } = useFileByFilepath()
 
   const [searchText, setSearchText] = useState<string>(initialFlashcardFile)

src/components/Flashcard/FlashcardReviewModal.tsx

@@ -21,7 +21,7 @@ const FlashcardReviewModal: React.FC<FlashcardReviewModalProps> = ({ isOpen, onC
   useEffect(() => {
     const getFlashcardsFromDirectory = async () => {
       const vaultDirectoryWithFlashcards = await getFlashcardVaultDirectory()
-      const files = await window.path.getAllFilenamesInDirectory(vaultDirectoryWithFlashcards)
+      const files = await window.fileSystem.getAllFilenamesInDirectory(vaultDirectoryWithFlashcards)
       setFlashcardFiles(files)
       setCurrentSelectedFlashcard(0)
     }

src/components/MainPage.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import React, { useState } from 'react'
 
 import '../styles/global.css'
 import ChatComponent from './Chat'
@@ -17,20 +17,11 @@ import ModalProvider from '@/contexts/ModalContext'
 
 const MainPageContent: React.FC = () => {
   const [showSimilarFiles, setShowSimilarFiles] = useState(true)
-  const [vaultDirectory, setVaultDirectory] = useState<string>('')
 
   const { currentlyOpenFilePath } = useFileContext()
 
   const { showChatbot } = useChatContext()
 
-  useEffect(() => {
-    const setFileDirectory = async () => {
-      const windowDirectory = await window.electronStore.getVaultDirectoryForWindow()
-      setVaultDirectory(windowDirectory)
-    }
-    setFileDirectory()
-  }, [])
-
   return (
     <div className="relative overflow-x-hidden">
       <div id="tooltip-container" />
@@ -74,7 +65,7 @@ const MainPageContent: React.FC = () => {
 
         {showChatbot && (
           <div className="h-below-titlebar w-full">
-            <ChatComponent vaultDirectory={vaultDirectory} showSimilarFiles={showSimilarFiles} />
+            <ChatComponent showSimilarFiles={showSimilarFiles} />
           </div>
         )}
       </div>

src/components/Sidebars/FileSideBar/hooks/use-file-info-tree.tsx

@@ -4,7 +4,7 @@ import { FileInfo, FileInfoTree } from 'electron/main/filesystem/types'
 
 import flattenFileInfoTree, { sortFilesAndDirectories } from '../utils'
 
-const useFileInfoTree = (currentFilePath: string | null) => {
+const useFileInfoTreeHook = (filePath: string | null) => {
   const [fileInfoTree, setFileInfoTree] = useState<FileInfoTree>([])
   const [flattenedFiles, setFlattenedFiles] = useState<FileInfo[]>([])
   const [expandedDirectories, setExpandedDirectories] = useState<Map<string, boolean>>(new Map())
@@ -20,29 +20,39 @@ const useFileInfoTree = (currentFilePath: string | null) => {
 
   // upon indexing, update the file info tree and expand relevant directories
   useEffect(() => {
-    const findRelevantDirectoriesToBeOpened = () => {
-      if (currentFilePath === null) {
+    const findRelevantDirectoriesToBeOpened = async () => {
+      if (filePath === null) {
         return expandedDirectories
       }
-      const pathSegments = currentFilePath.split('/').filter((segment) => segment !== '')
-      pathSegments.pop() // Remove the file name from the path
 
-      let currentPath = ''
+      const pathSep = await window.path.pathSep()
+      const isAbsolute = await window.path.isAbsolute(filePath)
+
+      const currentPath = isAbsolute ? '' : '.'
       const newExpandedDirectories = new Map(expandedDirectories)
-      pathSegments.forEach((segment) => {
-        currentPath += `/${segment}`
-        newExpandedDirectories.set(currentPath, true)
-      })
+
+      const pathSegments = filePath.split(pathSep).filter((segment) => segment !== '')
+
+      pathSegments.pop()
+
+      const updatedPath = pathSegments.reduce(async (pathPromise, segment) => {
+        const path = await pathPromise
+        const newPath = await window.path.join(path, segment)
+        newExpandedDirectories.set(newPath, true)
+        return newPath
+      }, Promise.resolve(currentPath))
+
+      await updatedPath
 
       return newExpandedDirectories
     }
 
-    const handleFileUpdate = (updatedFiles: FileInfoTree) => {
+    const handleFileUpdate = async (updatedFiles: FileInfoTree) => {
       const sortedFiles = sortFilesAndDirectories(updatedFiles, null)
       setFileInfoTree(sortedFiles)
       const updatedFlattenedFiles = flattenFileInfoTree(sortedFiles)
       setFlattenedFiles(updatedFlattenedFiles)
-      const directoriesToBeExpanded = findRelevantDirectoriesToBeOpened()
+      const directoriesToBeExpanded = await findRelevantDirectoriesToBeOpened()
       setExpandedDirectories(directoriesToBeExpanded)
     }
 
@@ -51,7 +61,7 @@ const useFileInfoTree = (currentFilePath: string | null) => {
     return () => {
       removeFilesListListener()
     }
-  }, [currentFilePath, expandedDirectories])
+  }, [filePath, expandedDirectories])
 
   // initial load of files
   useEffect(() => {
@@ -74,4 +84,4 @@ const useFileInfoTree = (currentFilePath: string | null) => {
   }
 }
 
-export default useFileInfoTree
+export default useFileInfoTreeHook

src/contexts/ChatContext.tsx

@@ -92,24 +92,6 @@ export const ChatProvider: React.FC<{ children: React.ReactNode }> = ({ children
     }
   }, [setCurrentChatHistory, setChatFilters, setShowChatbot])
 
-  // const openTabContent = React.useCallback(
-  //   async (path: string, optionalContentToWriteOnCreate?: string) => {
-  //     if (!path) return
-  //     const chatID = getChatIdFromPath(path)
-  //     if (chatID) {
-  //       if (chatID === UNINITIALIZED_STATE) return
-  //       const chat = await window.electronStore.getChatHistory(chatID)
-  //       openChatSidebarAndChat(chat)
-  //     } else {
-  //       setShowChatbot(false)
-  //       setSidebarShowing('files')
-  //       openOrCreateFile(path, optionalContentToWriteOnCreate)
-  //     }
-  //     setCurrentTab(path)
-  //   },
-  //   [getChatIdFromPath, openChatSidebarAndChat, setShowChatbot, setSidebarShowing, openOrCreateFile, setCurrentTab],
-  // )
-
   const value = React.useMemo(
     () => ({
       // openTabContent,

src/contexts/FileContext.tsx

@@ -1,9 +1,9 @@
 import React, { createContext, useContext, ReactNode } from 'react'
 import useFileByFilepath from '@/components/File/hooks/use-file-by-filepath'
-import useFileInfoTree from '@/components/Sidebars/FileSideBar/hooks/use-file-info-tree'
+import useFileInfoTreeHook from '@/components/Sidebars/FileSideBar/hooks/use-file-info-tree'
 
 type FileByFilepathType = ReturnType<typeof useFileByFilepath>
-type FileInfoTreeType = ReturnType<typeof useFileInfoTree>
+type FileInfoTreeType = ReturnType<typeof useFileInfoTreeHook>
 
 type FileContextType = FileByFilepathType & FileInfoTreeType
 
@@ -19,7 +19,7 @@ export const useFileContext = () => {
 
 export const FileProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
   const fileByFilepathValue = useFileByFilepath()
-  const fileInfoTreeValue = useFileInfoTree(fileByFilepathValue.currentlyOpenFilePath)
+  const fileInfoTreeValue = useFileInfoTreeHook(fileByFilepathValue.currentlyOpenFilePath)
 
   const combinedContextValue: FileContextType = React.useMemo(
     () => ({