feat: add singleton mode support.

refactor: docs upload page.

refactor: index setting page danger zone.

src/components/Breadcrumb.tsx

@@ -2,6 +2,7 @@ import { useMatchRoute } from '@tanstack/react-router';
 import { useTranslation } from 'react-i18next';
 import { Breadcrumbs, BreadcrumbItem } from '@nextui-org/react';
 import { useAppStore } from '@/store';
+import { isSingletonMode } from '@/utils/conn';
 
 export const DashBreadcrumb = () => {
   const matchRoute = useMatchRoute();
@@ -11,22 +12,21 @@ export const DashBreadcrumb = () => {
   const insKeysRoute = matchRoute({ to: '/ins/$insID/keys', fuzzy: true }) as unknown as { insID: string };
   const insTasksRoute = matchRoute({ to: '/ins/$insID/tasks', fuzzy: true }) as unknown as { insID: string };
   const indexRoute = matchRoute({ to: '/ins/$insID/index/$indexUID', fuzzy: true }) as unknown as { indexUID: string };
-  const indexDocsRoute = matchRoute({ to: '/ins/$insID/index/$indexUID/documents', fuzzy: true }) as unknown as {
-    indexUID: string;
-  };
-  const indexSettingRoute = matchRoute({ to: '/ins/$insID/index/$indexUID/setting', fuzzy: true }) as unknown as {
-    indexUID: string;
-  };
+  const indexDocsRoute = matchRoute({ to: '/ins/$insID/index/$indexUID/documents', fuzzy: true });
+  const indexDocsUploadRoute = matchRoute({ to: '/ins/$insID/index/$indexUID/documents/upload', fuzzy: true });
+  const indexSettingRoute = matchRoute({ to: '/ins/$insID/index/$indexUID/setting', fuzzy: true });
 
   const currentInstance = useAppStore((state) => state.instances.find((i) => i.id === parseInt(insRoute.insID)));
 
+  console.log(11, isSingletonMode());
+
   return (
     <Breadcrumbs color="primary" variant="light">
-      <BreadcrumbItem href={import.meta.env.BASE_URL ?? '/'}>🏠</BreadcrumbItem>
+      {!isSingletonMode() && <BreadcrumbItem href={import.meta.env.BASE_URL ?? '/'}>🏠</BreadcrumbItem>}
       {insRoute && (
-        <BreadcrumbItem
-          href={`/ins/${insRoute.insID}`}
-        >{`#${insRoute.insID} ${t('common:instance')} ${currentInstance?.name}`}</BreadcrumbItem>
+        <BreadcrumbItem href={`/ins/${insRoute.insID}`}>
+          {isSingletonMode() ? '🏠' : `#${insRoute.insID} ${t('common:instance')} ${currentInstance?.name}`}
+        </BreadcrumbItem>
       )}
       {insKeysRoute && <BreadcrumbItem href={`/ins/${insRoute.insID}/keys`}>{`${t('common:keys')}`}</BreadcrumbItem>}
       {insTasksRoute && <BreadcrumbItem href={`/ins/${insRoute.insID}/tasks`}>{`${t('common:tasks')}`}</BreadcrumbItem>}
@@ -40,6 +40,11 @@ export const DashBreadcrumb = () => {
           href={`/ins/${insRoute.insID}/index/${indexRoute.indexUID}/documents`}
         >{`${t('documents')}`}</BreadcrumbItem>
       )}
+      {indexDocsUploadRoute && (
+        <BreadcrumbItem
+          href={`/ins/${insRoute.insID}/index/${indexRoute.indexUID}/documents/upload`}
+        >{`${t('upload:title')}`}</BreadcrumbItem>
+      )}
       {indexSettingRoute && (
         <BreadcrumbItem
           href={`/ins/${insRoute.insID}/index/${indexRoute.indexUID}/setting`}

src/components/Footer/Copyright.tsx

@@ -4,13 +4,11 @@ import { useTranslation } from 'react-i18next';
 export const Copyright: FC = () => {
   const { t } = useTranslation('footer');
   return (
-    <div className={``}>
-      <p>
-        {t('powered_by') + ' '}
-        <a className={`hover:underline`} href={`https://ricco.riccox.com`} target="_blank" rel="noreferrer">
-          Ricco Xie
-        </a>
-      </p>
+    <div className={`text-nowrap`}>
+      {t('powered_by') + ' '}
+      <a className={`hover:underline`} href={`https://ricco.riccox.com`} target="_blank" rel="noreferrer">
+        Ricco Xie
+      </a>
     </div>
   );
 };

src/components/Footer/Singleton.tsx

@@ -0,0 +1,13 @@
+import { isSingletonMode } from '@/utils/conn';
+import { Tag } from '@douyinfe/semi-ui';
+import type { FC } from 'react';
+import { useTranslation } from 'react-i18next';
+
+export const Singleton: FC = () => {
+  const { t } = useTranslation('common');
+  if (!isSingletonMode()) {
+    return <></>;
+  } else {
+    return <Tag size="small">{t('singleton_mode')}</Tag>;
+  }
+};

src/components/Footer/Version.tsx

@@ -8,7 +8,7 @@ export const Version: FC = () => {
   const gitHash = __GIT_HASH__ || 'unknown';
 
   return (
-    <span>
+    <span className="text-nowrap">
       {t('common:version')}: {gitHash.slice(0, 7)}
     </span>
   );

src/components/Footer/index.tsx

@@ -2,21 +2,24 @@ import type { FC } from 'react';
 import { Copyright } from '@/components/Footer/Copyright';
 import { LangSelector } from '../lang';
 import { Version } from './Version';
+import { Singleton } from './Singleton';
+import { cn } from '@/lib/cn';
 
 interface Props {
   className?: string;
 }
 
 export const Footer: FC<Props> = ({ className = '' }) => {
   return (
-    <div className={`${className} gap-x-2 flex justify-center w-full text-neutral-400 text-xs`}>
+    <div className={cn(`gap-2 flex justify-center items-center w-full text-neutral-400 text-xs`, className)}>
       <Copyright /> -
       <Version /> -
       <a className={`hover:underline`} href={`//github.com/riccox/meilisearch-ui`} target="_blank" rel="noreferrer">
         Github
       </a>
       -
       <LangSelector />
+      <Singleton />
     </div>
   );
 };