Update dependencies and import paths

src/components/Sidepanel/Chat/empty.tsx

@@ -1,9 +1,9 @@
 import { useQuery } from "@tanstack/react-query"
-import { RotateCcw } from "lucide-react"
 import { useEffect, useState } from "react"
 import { useMessage } from "~hooks/useMessage"
+import { RotateCcw } from "~icons/RotateCcw"
 import {
-  fetchModels,
+  fetchChatModels,
   getOllamaURL,
   isOllamaRunning,
   setOllamaURL as saveOllamaURL
@@ -21,7 +21,7 @@ export const EmptySidePanel = () => {
     queryFn: async () => {
       const ollamaURL = await getOllamaURL()
       const isOk = await isOllamaRunning()
-      const models = await fetchModels()
+      const models = await fetchChatModels()
 
       return {
         isOk,

src/components/Sidepanel/Chat/form.tsx

@@ -3,12 +3,12 @@ import { useMutation } from "@tanstack/react-query"
 import React from "react"
 import useDynamicTextareaSize from "~hooks/useDynamicTextareaSize"
 import { useMessage } from "~hooks/useMessage"
-import PhotoIcon from "@heroicons/react/24/outline/PhotoIcon"
-import XMarkIcon from "@heroicons/react/24/outline/XMarkIcon"
 import { toBase64 } from "~libs/to-base64"
-import { MicIcon } from "lucide-react"
 import { Image, Tooltip } from "antd"
 import { useSpeechRecognition } from "~hooks/useSpeechRecognition"
+import { MicIcon } from "~icons/MicIcon"
+import { PhotoIcon } from "~icons/PhotoIcon"
+import { XMarkIcon } from "~icons/XMarkIcon"
 
 type Props = {
   dropedFile: File | undefined

src/components/Sidepanel/Chat/header.tsx

@@ -1,10 +1,10 @@
 import logoImage from "data-base64:~assets/icon.png"
-import CogIcon from "@heroicons/react/24/outline/CogIcon"
-import Squares2X2Icon from "@heroicons/react/24/outline/Squares2X2Icon"
-import { ArrowPathIcon } from "@heroicons/react/24/outline"
 import { useMessage } from "~hooks/useMessage"
 import { Link } from "react-router-dom"
 import { Tooltip } from "antd"
+import { CogIcon } from "~icons/CogIcon"
+import { BoxesIcon } from "~icons/BoxesIcon"
+import { ArrowPathIcon } from "~icons/ArrowPathIcon"
 export const SidepanelHeader = () => {
   const { clearChat, isEmbedding } = useMessage()
   return (
@@ -16,11 +16,8 @@ export const SidepanelHeader = () => {
 
       <div className="flex items-center space-x-3">
         {isEmbedding ? (
-          <Tooltip 
-          title="It may take a few minutes to embed the page. Please wait..."
-          >
-          <Squares2X2Icon className="h-5 w-5 text-gray-500 dark:text-gray-400 animate-bounce animate-infinite" />
-
+          <Tooltip title="It may take a few minutes to embed the page. Please wait...">
+            <BoxesIcon className="h-5 w-5 text-gray-500 dark:text-gray-400 animate-bounce animate-infinite" />
           </Tooltip>
         ) : null}
         <button

src/components/Sidepanel/Settings/body.tsx

@@ -12,9 +12,10 @@ import {
 import { Skeleton, Radio, Select } from "antd"
 import { useDarkMode } from "~hooks/useDarkmode"
 import { SaveButton } from "~components/Common/SaveButton"
-import { Moon, Sun } from "lucide-react"
 import { SUPPORTED_LANGUAGES } from "~utils/supporetd-languages"
 import { useMessage } from "~hooks/useMessage"
+import { Sun } from "~icons/Sun"
+import { Moon } from "~icons/Moon"
 
 export const SettingsBody = () => {
   const [ollamaURL, setOllamaURL] = React.useState<string>("")

src/components/Sidepanel/Settings/header.tsx

@@ -1,11 +1,11 @@
 import logoImage from "data-base64:~assets/icon.png"
-import { ChevronLeftIcon } from "@heroicons/react/24/outline"
 import { Link } from "react-router-dom"
+import { ChevronLeft } from "~icons/ChevronLeft"
 export const SidepanelSettingsHeader = () => {
   return (
     <div className="flex px-3 justify-start gap-3 bg-white dark:bg-[#171717] border-b border-gray-300 dark:border-gray-700  py-4 items-center">
       <Link to="/">
-        <ChevronLeftIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" />
+        <ChevronLeft className="h-5 w-5 text-gray-500 dark:text-gray-400" />
       </Link>
       <div className="focus:outline-none focus-visible:ring-2 focus-visible:ring-pink-700 flex items-center dark:text-white">
         <img className="h-6 w-auto" src={logoImage} alt="Page Assist" />