Merge branch 'main' into feat/token

Author: maekawataiki

packages/web/public/locales/translation/en.yaml

@@ -742,6 +742,7 @@ setting:
     login_status: Login status
     rag_enabled: RAG (Amazon Kendra) Enabled
     rag_kb_enabled: RAG (Knowledge Base) Enabled
+    show_email: Show Email
     show_tools: Show Tools
     show_use_case_builder: Show Use Case Builder
     stats: Statistics

packages/web/public/locales/translation/ja.yaml

@@ -583,6 +583,7 @@ setting:
     login_status: ログイン状態
     rag_enabled: RAG (Amazon Kendra) 有効
     rag_kb_enabled: RAG (Knowledge Base) 有効
+    show_email: メールアドレスの表示
     show_tools: ツールの表示
     show_use_case_builder: ユースケースビルダーの表示
     stats: 利用統計

packages/web/src/components/DrawerBase.tsx

@@ -6,6 +6,7 @@ import useVersion from '../hooks/useVersion';
 import IconWithDot from './IconWithDot';
 import { PiChartBar, PiGear } from 'react-icons/pi';
 import { fetchAuthSession } from 'aws-amplify/auth';
+import useUserSetting from '../hooks/useUserSetting';
 import { useTranslation } from 'react-i18next';
 
 type Props = BaseProps & {
@@ -15,6 +16,7 @@ type Props = BaseProps & {
 
 const DrawerBase: React.FC<Props> = (props) => {
   const { getHasUpdate } = useVersion();
+  const { settingShowEmail } = useUserSetting();
   const { t } = useTranslation();
 
   // The first argument is not required, but if it is not included, the request will not be made, so 'user' string is entered
@@ -38,17 +40,13 @@ const DrawerBase: React.FC<Props> = (props) => {
         className={`bg-aws-squid-ink flex h-screen w-64 flex-col justify-between text-sm text-white  print:hidden`}>
         <div className="flex h-full flex-col">
           {props.children}
-          <div className="flex flex-none items-center gap-2 border-t border-gray-400 px-3 py-2">
-            <Link
-              to={settingUrl}
-              className="mr-2 overflow-x-hidden hover:brightness-75">
-              <span className="text-sm">{email}</span>
-            </Link>
+          <div className="flex flex-none items-center justify-between gap-x-2 border-t border-gray-400 px-3 py-2">
+            {settingShowEmail && <div className="text-sm">{email}</div>}
             <div className="grow" />
             <Link to="/stats" title={t('stat.title')}>
               <PiChartBar className="text-lg" />
             </Link>
-            <Link to={settingUrl} title={t('navigation.settings')}>
+            <Link to={settingUrl}>
               <IconWithDot showDot={hasUpdate}>
                 <PiGear className="text-lg" />
               </IconWithDot>

packages/web/src/hooks/useUserSetting.ts

@@ -9,6 +9,10 @@ const useUserSetting = () => {
     'showTools',
     true
   );
+  const [settingShowEmail, setSettingShowEmail] = useLocalStorageBoolean(
+    'showEmail',
+    true
+  );
 
   return {
     settingTypingAnimation,
@@ -17,6 +21,8 @@ const useUserSetting = () => {
     setSettingShowUseCaseBuilder,
     settingShowTools,
     setSettingShowTools,
+    settingShowEmail,
+    setSettingShowEmail,
   };
 };
 

packages/web/src/pages/Setting.tsx

@@ -63,6 +63,8 @@ const Setting = () => {
     setSettingShowUseCaseBuilder,
     settingShowTools,
     setSettingShowTools,
+    settingShowEmail,
+    setSettingShowEmail,
   } = useUserSetting();
 
   const onClickSignout = useCallback(() => {
@@ -145,6 +147,16 @@ const Setting = () => {
             />
           }></SettingItem>
 
+        <SettingItem
+          name={t('setting.items.show_email')}
+          value={
+            <Switch
+              checked={settingShowEmail}
+              label=""
+              onSwitch={setSettingShowEmail}
+            />
+          }></SettingItem>
+
         <SettingItem
           name={t('setting.items.login_status')}
           value={