move artifacts into mask settings

app/components/chat.tsx

@@ -98,7 +98,6 @@ import {
   REQUEST_TIMEOUT_MS,
   UNFINISHED_INPUT,
   ServiceProvider,
-  ArtifactsPlugin,
 } from "../constant";
 import { Avatar } from "./emoji";
 import { ContextPrompts, MaskAvatar, MaskConfig } from "./mask";
@@ -727,38 +726,26 @@ export function ChatActions(props: {
         />
       )}
 
-      <ChatAction
-        onClick={() => setShowPluginSelector(true)}
-        text={Locale.Plugin.Name}
-        icon={<PluginIcon />}
-      />
-      {showPluginSelector && (
+      {showPlugins(currentProviderName, currentModel) && (
+        <ChatAction
+          onClick={() => setShowPluginSelector(true)}
+          text={Locale.Plugin.Name}
+          icon={<PluginIcon />}
+        />
+      )}
+      {showPluginSelector && showPlugins(currentProviderName, currentModel) && (
         <Selector
           multiple
           defaultSelectedValue={chatStore.currentSession().mask?.plugin}
-          items={[
-            {
-              title: Locale.Plugin.Artifacts,
-              value: ArtifactsPlugin.Artifacts as string,
-            },
-          ].concat(
-            showPlugins(currentProviderName, currentModel)
-              ? pluginStore.getAll().map((item) => ({
-                  // @ts-ignore
-                  title: `${item?.title}@${item?.version}`,
-                  // @ts-ignore
-                  value: item?.id,
-                }))
-              : [],
-          )}
+          items={pluginStore.getAll().map((item) => ({
+            title: `${item?.title}@${item?.version}`,
+            value: item?.id,
+          }))}
           onClose={() => setShowPluginSelector(false)}
           onSelection={(s) => {
             chatStore.updateCurrentSession((session) => {
               session.mask.plugin = s as string[];
             });
-            if (s.includes(ArtifactsPlugin.Artifacts)) {
-              showToast(ArtifactsPlugin.Artifacts);
-            }
           }}
         />
       )}

app/components/markdown.tsx

@@ -19,7 +19,6 @@ import {
   HTMLPreview,
   HTMLPreviewHander,
 } from "./artifacts";
-import { ArtifactsPlugin } from "../constant";
 import { useChatStore } from "../store";
 import { IconButton } from "./button";
 
@@ -77,7 +76,6 @@ export function PreCode(props: { children: any }) {
   const { height } = useWindowSize();
   const chatStore = useChatStore();
   const session = chatStore.currentSession();
-  const plugins = session.mask?.plugin;
 
   const renderArtifacts = useDebouncedCallback(() => {
     if (!ref.current) return;
@@ -94,10 +92,7 @@ export function PreCode(props: { children: any }) {
     }
   }, 600);
 
-  const enableArtifacts = useMemo(
-    () => plugins?.includes(ArtifactsPlugin.Artifacts),
-    [plugins],
-  );
+  const enableArtifacts = session.mask?.enableArtifacts !== false;
 
   //Wrap the paragraph for plain-text
   useEffect(() => {

app/components/mask.tsx

@@ -167,6 +167,22 @@ export function MaskConfig(props: {
           ></input>
         </ListItem>
 
+        <ListItem
+          title={Locale.Mask.Config.Artifacts.Title}
+          subTitle={Locale.Mask.Config.Artifacts.SubTitle}
+        >
+          <input
+            aria-label={Locale.Mask.Config.Artifacts.Title}
+            type="checkbox"
+            checked={props.mask.enableArtifacts}
+            onChange={(e) => {
+              props.updateMask((mask) => {
+                mask.enableArtifacts = e.currentTarget.checked;
+              });
+            }}
+          ></input>
+        </ListItem>
+
         {!props.shouldSyncFromGlobal ? (
           <ListItem
             title={Locale.Mask.Config.Share.Title}