Update Lucide icons imports
This commit is contained in:
		
							parent
							
								
									43f3727369
								
							
						
					
					
						commit
						86d4d53693
					
				| @ -1,25 +1,19 @@ | ||||
| import { useWebSearch } from "~store/web" | ||||
| import { | ||||
|   Globe, | ||||
|   MousePointer, | ||||
|   Boxes | ||||
| } from "lucide-react" | ||||
| 
 | ||||
| 
 | ||||
| export const WebSearch = () => { | ||||
|   const {} = useWebSearch() | ||||
|   const { state, text } = useWebSearch() | ||||
|   return ( | ||||
|     <div className="gradient-border mt-4 flex w-56 items-center gap-4 rounded-lg bg-neutral-100 p-1ccc text-slate-900 dark:bg-neutral-800 dark:text-slate-50"> | ||||
|       <div className="rounded p-1"> | ||||
|         <svg | ||||
|           xmlns="http://www.w3.org/2000/svg" | ||||
|           fill="none" | ||||
|           viewBox="0 0 24 24" | ||||
|           strokeWidth={1.5} | ||||
|           stroke="currentColor" | ||||
|           className="w-6 h-6"> | ||||
|           <path | ||||
|             strokeLinecap="round" | ||||
|             strokeLinejoin="round" | ||||
|             d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418" | ||||
|           /> | ||||
|         </svg> | ||||
|          | ||||
|       </div> | ||||
|       <div className="text-sm font-semibold">Searching Web</div> | ||||
|       <div className="text-sm font-semibold">{text}</div> | ||||
|     </div> | ||||
|   ) | ||||
| } | ||||
|  | ||||
| @ -7,12 +7,8 @@ import { useQuery } from "@tanstack/react-query" | ||||
| import { fetchChatModels } from "~services/ollama" | ||||
| import { useMessageOption } from "~hooks/useMessageOption" | ||||
| import { Settings } from "./Settings" | ||||
| import { GithubIcon } from "~icons/GithubIcon" | ||||
| import { PanelLeftIcon } from "~icons/PanelLeftIcon" | ||||
| import { BrainCircuit } from "~icons/BrainCircuit" | ||||
| import { SquarePen } from "~icons/SquarePen" | ||||
| import { ChevronLeft } from "~icons/ChevronLeft" | ||||
| import { CogIcon } from "~icons/CogIcon" | ||||
| import { BrainCircuit, ChevronLeft, CogIcon, GithubIcon, PanelLeftIcon, SquarePen } from "lucide-react" | ||||
| 
 | ||||
| 
 | ||||
| export default function OptionLayout({ | ||||
|   children | ||||
|  | ||||
| @ -6,9 +6,7 @@ import dayjs from "dayjs" | ||||
| import relativeTime from "dayjs/plugin/relativeTime" | ||||
| import { useState } from "react" | ||||
| import { useForm } from "@mantine/form" | ||||
| import { Download } from "~icons/Download" | ||||
| import { RotateCcw } from "~icons/RotateCcw" | ||||
| import { Trash } from "~icons/Trash" | ||||
| import { Download, RotateCcw, Trash2 } from "lucide-react" | ||||
| 
 | ||||
| dayjs.extend(relativeTime) | ||||
| 
 | ||||
| @ -134,7 +132,7 @@ export const ModelsBody = () => { | ||||
|                           } | ||||
|                         }} | ||||
|                         className="text-red-500 dark:text-red-400"> | ||||
|                         <Trash className="w-5 h-5" /> | ||||
|                         <Trash2 className="w-5 h-5" /> | ||||
|                       </button> | ||||
|                     </Tooltip> | ||||
|                     <Tooltip title="Re-Pull Model"> | ||||
|  | ||||
| @ -1,6 +1,6 @@ | ||||
| import { useQuery } from "@tanstack/react-query" | ||||
| import { RotateCcw } from "lucide-react" | ||||
| import { useEffect, useState } from "react" | ||||
| import { RotateCcw } from "~icons/RotateCcw" | ||||
| import { | ||||
|   getOllamaURL, | ||||
|   isOllamaRunning, | ||||
|  | ||||
| @ -1,4 +1,4 @@ | ||||
| import { PencilSquareIcon } from "~icons/PencilSquareIcon" | ||||
| import { PencilIcon } from "lucide-react" | ||||
| import { useMessage } from "../../../hooks/useMessage" | ||||
| 
 | ||||
| export const PlaygroundNewChat = () => { | ||||
| @ -14,7 +14,7 @@ export const PlaygroundNewChat = () => { | ||||
|     <button | ||||
|       onClick={handleClick} | ||||
|       className="flex w-full border bg-transparent hover:bg-gray-200 dark:hover:bg-gray-800 text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 focus:ring-offset-gray-100 rounded-md p-2 dark:border-gray-800"> | ||||
|       <PencilSquareIcon className="mx-3 h-5 w-5" aria-hidden="true" /> | ||||
|       <PencilIcon className="mx-3 h-5 w-5" aria-hidden="true" /> | ||||
|       <span className="inline-flex font-semibol text-white text-sm"> | ||||
|         New Chat | ||||
|       </span> | ||||
|  | ||||
| @ -4,8 +4,7 @@ import { useMessageOption } from "~hooks/useMessageOption" | ||||
| import { PageAssitDatabase } from "~libs/db" | ||||
| import { Select } from "antd" | ||||
| import { SUPPORTED_LANGUAGES } from "~utils/supporetd-languages" | ||||
| import { Sun } from "~icons/Sun" | ||||
| import { Moon } from "~icons/Moon" | ||||
| import { MoonIcon, SunIcon } from "lucide-react" | ||||
| 
 | ||||
| export const SettingOther = () => { | ||||
|   const { clearChat, speechToTextLanguage, setSpeechToTextLanguage } = | ||||
| @ -46,9 +45,9 @@ export const SettingOther = () => { | ||||
|           onClick={toggleDarkMode} | ||||
|           className={`inline-flex mt-4 items-center rounded-md border border-transparent bg-black px-2 py-2 text-sm font-medium leading-4 text-white shadow-sm  dark:bg-white dark:text-gray-800 disabled:opacity-50 `}> | ||||
|           {mode === "dark" ? ( | ||||
|             <Sun className="w-4 h-4 mr-2" /> | ||||
|             <SunIcon className="w-4 h-4 mr-2" /> | ||||
|           ) : ( | ||||
|             <Moon className="w-4 h-4 mr-2" /> | ||||
|             <MoonIcon className="w-4 h-4 mr-2" /> | ||||
|           )} | ||||
|           {mode === "dark" ? "Light" : "Dark"} | ||||
|         </button> | ||||
|  | ||||
| @ -6,13 +6,10 @@ import { | ||||
|   deleteByHistoryId, | ||||
|   updateHistory | ||||
| } from "~libs/db" | ||||
| import { Dropdown, Empty, Skeleton, Spin } from "antd" | ||||
| import { Empty, Skeleton } from "antd" | ||||
| import { useMessageOption } from "~hooks/useMessageOption" | ||||
| import { Trash } from "~icons/Trash" | ||||
| import { Fragment, useState } from "react" | ||||
| import { PencilIcon } from "~icons/PencilIcon" | ||||
| import { EllipsisHorizontalIcon } from "~icons/EllipsisHorizontalIcon" | ||||
| import { Menu, Transition } from "@headlessui/react" | ||||
| import { useState } from "react" | ||||
| import { PencilIcon, Trash2 } from "lucide-react" | ||||
| 
 | ||||
| type Props = {} | ||||
| 
 | ||||
| @ -117,7 +114,7 @@ export const Sidebar = ({}: Props) => { | ||||
|                     setProcessingId(chat.id) | ||||
|                   }} | ||||
|                   className="text-red-500 dark:text-red-400 opacity-80"> | ||||
|                   <Trash className=" w-4 h-4 " /> | ||||
|                   <Trash2 className=" w-4 h-4 " /> | ||||
|                 </button> | ||||
|               </div> | ||||
|             </div> | ||||
|  | ||||
| @ -1,8 +1,8 @@ | ||||
| import { useQuery } from "@tanstack/react-query" | ||||
| import { Select } from "antd" | ||||
| import { RotateCcw } from "lucide-react" | ||||
| import { useEffect, useState } from "react" | ||||
| import { useMessage } from "~hooks/useMessage" | ||||
| import { RotateCcw } from "~icons/RotateCcw" | ||||
| import { | ||||
|   fetchChatModels, | ||||
|   getOllamaURL, | ||||
|  | ||||
| @ -2,9 +2,7 @@ import logoImage from "data-base64:~assets/icon.png" | ||||
| 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" | ||||
| import { BoxesIcon, CogIcon, RefreshCcw } from "lucide-react" | ||||
| export const SidepanelHeader = () => { | ||||
|   const { clearChat, isEmbedding } = useMessage() | ||||
|   return ( | ||||
| @ -25,7 +23,7 @@ export const SidepanelHeader = () => { | ||||
|             clearChat() | ||||
|           }} | ||||
|           className="flex items-center space-x-1 focus:outline-none focus-visible:ring-2 focus-visible:ring-pink-700"> | ||||
|           <ArrowPathIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" /> | ||||
|           <RefreshCcw className="h-5 w-5 text-gray-500 dark:text-gray-400" /> | ||||
|         </button> | ||||
|         <Link to="/settings"> | ||||
|           <CogIcon className="h-5 w-5 text-gray-500 dark:text-gray-400" /> | ||||
|  | ||||
| @ -19,8 +19,7 @@ import { useDarkMode } from "~hooks/useDarkmode" | ||||
| import { SaveButton } from "~components/Common/SaveButton" | ||||
| import { SUPPORTED_LANGUAGES } from "~utils/supporetd-languages" | ||||
| import { useMessage } from "~hooks/useMessage" | ||||
| import { Sun } from "~icons/Sun" | ||||
| import { Moon } from "~icons/Moon" | ||||
| import { MoonIcon, SunIcon } from "lucide-react" | ||||
| 
 | ||||
| export const SettingsBody = () => { | ||||
|   const [ollamaURL, setOllamaURL] = React.useState<string>("") | ||||
| @ -281,14 +280,14 @@ export const SettingsBody = () => { | ||||
|           <button | ||||
|             onClick={toggleDarkMode} | ||||
|             className="select-none inline-flex w-full rounded-lg border border-gray-900 py-3 px-6 text-center align-middle font-sans text-xs font-bold uppercase text-gray-900 transition-all hover:opacity-75 focus:ring focus:ring-gray-300 active:opacity-[0.85] disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none dark:border-gray-100 dark:text-white dark:hover:opacity-75 dark:focus:ring-dark dark:active:opacity-75 dark:disabled:pointer-events-none dark:disabled:opacity-50 dark:disabled:shadow-none"> | ||||
|             <Sun className="h-4 w-4 mr-2" /> | ||||
|             <SunIcon className="h-4 w-4 mr-2" /> | ||||
|             Light | ||||
|           </button> | ||||
|         ) : ( | ||||
|           <button | ||||
|             onClick={toggleDarkMode} | ||||
|             className="select-none inline-flex w-full rounded-lg border border-gray-900 py-3 px-6 text-center align-middle font-sans text-xs font-bold uppercase text-gray-900 transition-all hover:opacity-75 focus:ring focus:ring-gray-300 active:opacity-[0.85] disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none dark:border-gray-100 dark:text-white dark:hover:opacity-75 dark:focus:ring-dark dark:active:opacity-75 dark:disabled:pointer-events-none dark:disabled:opacity-50 dark:disabled:shadow-none"> | ||||
|             <Moon className="h-4 w-4 mr-2" /> | ||||
|             <MoonIcon className="h-4 w-4 mr-2" /> | ||||
|             Dark | ||||
|           </button> | ||||
|         )} | ||||
|  | ||||
| @ -1,6 +1,6 @@ | ||||
| import logoImage from "data-base64:~assets/icon.png" | ||||
| import { ChevronLeft } from "lucide-react" | ||||
| 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"> | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user