chore: update svg icons

src/routes/home/Menu.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react";
 import { NavLink, useLocation } from "react-router-dom";
 import Tooltip from "../../common/component/Tooltip";
-import settingIcon from "../../assets/icons/setting.svg?url";
+import IconSetting from "../../assets/icons/setting.svg";
 type Props = {};
 const Menu: FC<Props> = () => {
   const { pathname } = useLocation();
@@ -10,7 +10,7 @@ const Menu: FC<Props> = () => {
       <li className="cursor-pointer flex items-center p-2.5 gap-2.5 link_navs">
         <NavLink className="link" to={`/setting/overview?f=${pathname}`}>
           <Tooltip placement="right" tip="Settings">
-            <img src={settingIcon} alt="setting icon" className="w-6 h-6 max-w-[unset]" />
+            <IconSetting className="w-6 h-6 dark:fill-gray-400" />
           </Tooltip>
         </NavLink>
       </li>

src/routes/setting/config/SMTP.tsx

@@ -3,7 +3,7 @@ import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 
 import { useSendTestEmailMutation } from "../../../app/services/server";
-import iconQuestion from "../../../assets/icons/question.svg?url";
+import IconQuestion from "../../../assets/icons/question.svg";
 import useConfig from "../../../common/hook/useConfig";
 import Input from "../../../common/component/styled/Input";
 import Button from "../../../common/component/styled/Button";
@@ -118,7 +118,7 @@ export default function ConfigSMTP() {
         </div>
       </div>
       <div className="tip">
-        <img src={iconQuestion} alt="question icon" />
+        <IconQuestion className="dark:fill-gray-300" />
         <a
           href="https://doc.voce.chat/setting/smtp/smtp-gmail"
           target="_blank"

src/routes/users/Search.tsx

@@ -1,6 +1,6 @@
 import Tippy from "@tippyjs/react";
-import searchIcon from "../../assets/icons/search.svg?url";
-import addIcon from "../../assets/icons/add.svg?url";
+import IconSearch from "../../assets/icons/search.svg";
+import IconAdd from "../../assets/icons/add.svg";
 import AddEntriesMenu from "../../common/component/AddEntriesMenu";
 import Tooltip from "../../common/component/Tooltip";
 import { FC, ChangeEvent } from "react";
@@ -17,12 +17,12 @@ const Search: FC<Props> = ({ input, updateInput }) => {
   return (
     <div className="hidden md:flex relative min-h-[56px] px-2 py-3 items-center justify-between gap-2 shadow-[rgb(0_0_0_/_10%)_0px_1px_0px] dark:border-b-gray-500">
       <div className="flex items-center gap-1">
-        <img src={searchIcon} alt="search icon" />
+        <IconSearch className="dark:fill-gray-400 w-6 h-6 shrink-0" />
         <input value={input} placeholder={`${t("action.search")}...`} className="w-full text-sm bg-transparent dark:text-gray-50" onChange={handleInput} />
       </div>
       <Tooltip tip={t("more")} placement="bottom">
         <Tippy interactive placement="bottom-end" trigger="click" content={<AddEntriesMenu />}>
-          <img src={addIcon} alt="add icon" className="cursor-pointer" />
+          <IconAdd role="button" className="dark:fill-gray-400" />
         </Tippy>
       </Tooltip>
     </div>