Merge branch 'pr-328-sharegpt-toggle' from 'uzumaki-inc:main'

src/components/SettingsMenu/SettingsMenu.tsx

@@ -16,6 +16,7 @@ import ChatConfigMenu from '@components/ChatConfigMenu';
 import EnterToSubmitToggle from './EnterToSubmitToggle';
 import TotalTokenCost, { TotalTokenCostToggle } from './TotalTokenCost';
 import ClearConversation from '@components/Menu/MenuOptions/ClearConversation';
+import ShareGPTToggle from './ShareGPTToggle';
 
 const SettingsMenu = () => {
   const { t } = useTranslation();
@@ -51,6 +52,7 @@ const SettingsMenu = () => {
               <InlineLatexToggle />
               <AdvancedModeToggle />
               <TotalTokenCostToggle />
+              <ShareGPTToggle />
             </div>
             <ClearConversation />
             <PromptLibraryMenu />

src/components/SettingsMenu/ShareGPTToggle.tsx

@@ -0,0 +1,28 @@
+import React, { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import useStore from '@store/store';
+import Toggle from '@components/Toggle';
+
+const ShareGPTToggle = () => {
+  const { t } = useTranslation();
+
+  const setShareGPT = useStore((state) => state.setShareGPT);
+
+  const [isChecked, setIsChecked] = useState<boolean>(
+    useStore.getState().shareGPT
+  );
+
+  useEffect(() => {
+    setShareGPT(isChecked);
+  }, [isChecked]);
+
+  return (
+    <Toggle
+      label={t('postOnShareGPT.title') as string}
+      isChecked={isChecked}
+      setIsChecked={setIsChecked}
+    />
+  );
+};
+
+export default ShareGPTToggle;

src/components/ShareGPT/ShareGPT.tsx

@@ -9,6 +9,7 @@ import { ShareGPTSubmitBodyInterface } from '@type/api';
 const ShareGPT = React.memo(() => {
   const { t } = useTranslation();
   const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const isAvailable = useStore((state) => state.shareGPT);
 
   const handleConfirm = async () => {
     const chats = useStore.getState().chats;
@@ -40,15 +41,15 @@ const ShareGPT = React.memo(() => {
 
   return (
     <>
-      <button
+      { isAvailable && (<button
         className='btn btn-neutral'
         onClick={() => {
           setIsModalOpen(true);
         }}
         aria-label={t('postOnShareGPT.title') as string}
       >
         {t('postOnShareGPT.title')}
-      </button>
+      </button>) }
       {isModalOpen && (
         <PopupModal
           setIsModalOpen={setIsModalOpen}

src/store/config-slice.ts

@@ -7,6 +7,7 @@ export interface ConfigSlice {
   openConfig: boolean;
   theme: Theme;
   autoTitle: boolean;
+  shareGPT: boolean;
   hideMenuOptions: boolean;
   advancedMode: boolean;
   defaultChatConfig: ConfigInterface;
@@ -20,6 +21,7 @@ export interface ConfigSlice {
   setOpenConfig: (openConfig: boolean) => void;
   setTheme: (theme: Theme) => void;
   setAutoTitle: (autoTitle: boolean) => void;
+  setShareGPT: (autoTitle: boolean) => void;
   setAdvancedMode: (advancedMode: boolean) => void;
   setDefaultChatConfig: (defaultChatConfig: ConfigInterface) => void;
   setDefaultSystemMessage: (defaultSystemMessage: string) => void;
@@ -38,6 +40,7 @@ export const createConfigSlice: StoreSlice<ConfigSlice> = (set, get) => ({
   hideMenuOptions: false,
   hideSideMenu: false,
   autoTitle: false,
+  shareGPT: false,
   enterToSubmit: true,
   advancedMode: true,
   defaultChatConfig: _defaultChatConfig,
@@ -64,6 +67,12 @@ export const createConfigSlice: StoreSlice<ConfigSlice> = (set, get) => ({
       autoTitle: autoTitle,
     }));
   },
+  setShareGPT: (shareGPT: boolean) => {
+    set((prev: ConfigSlice) => ({
+      ...prev,
+      shareGPT: shareGPT,
+    }));
+  },
   setAdvancedMode: (advancedMode: boolean) => {
     set((prev: ConfigSlice) => ({
       ...prev,

src/store/store.ts

@@ -46,6 +46,7 @@ export const createPartializedState = (state: StoreState) => ({
   apiEndpoint: state.apiEndpoint,
   theme: state.theme,
   autoTitle: state.autoTitle,
+  shareGPT: state.shareGPT,
   advancedMode: state.advancedMode,
   prompts: state.prompts,
   defaultChatConfig: state.defaultChatConfig,