feat: Add Chrome AI support

src/components/Layouts/SettingsOptionLayout.tsx

@@ -6,11 +6,13 @@ import {
   BlocksIcon,
   InfoIcon,
   CombineIcon,
+  ChromeIcon
 } from "lucide-react"
 import { useTranslation } from "react-i18next"
 import { Link, useLocation } from "react-router-dom"
 import { OllamaIcon } from "../Icons/Ollama"
 import { Tag } from "antd"
+import { BetaTag } from "../Common/Beta"
 
 function classNames(...classes: string[]) {
   return classes.filter(Boolean).join(" ")
@@ -20,10 +22,12 @@ const LinkComponent = (item: {
   href: string
   name: string | JSX.Element
   icon: any
-  current: string
+  current: string,
+  beta?: boolean
 }) => {
   return (
-    <li>
+    <li className="inline-flex items-center">
+
       <Link
         to={item.href}
         className={classNames(
@@ -43,6 +47,9 @@ const LinkComponent = (item: {
         />
         {item.name}
       </Link>
+      {
+        item.beta && <BetaTag />
+        }
     </li>
   )
 }
@@ -65,7 +72,7 @@ export const SettingsLayout = ({ children }: { children: React.ReactNode }) => {
                 icon={OrbitIcon}
                 current={location.pathname}
               />
-               <LinkComponent
+              <LinkComponent
                 href="/settings/rag"
                 name={t("rag.title")}
                 icon={CombineIcon}
@@ -77,6 +84,15 @@ export const SettingsLayout = ({ children }: { children: React.ReactNode }) => {
                 icon={OllamaIcon}
                 current={location.pathname}
               />
+              {import.meta.env.BROWSER === "chrome" && (
+                <LinkComponent
+                  href="/settings/chrome"
+                  name={t("chromeAiSettings.title")}
+                  icon={ChromeIcon}
+                  current={location.pathname}
+                  beta
+                />
+              )}
               <LinkComponent
                 href="/settings/model"
                 name={t("manageModels.title")}