Update Lucide icons imports

This commit is contained in:
n4ze3m 2024-02-25 18:55:29 +05:30
parent 43f3727369
commit 86d4d53693
11 changed files with 30 additions and 49 deletions

View File

@ -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>
)
}

View File

@ -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

View File

@ -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">

View File

@ -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,

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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,

View File

@ -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" />

View File

@ -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>
)}

View File

@ -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">