feat: add more tip in ai-assistant plugin

msgbyte · Nov 4, 2023 · caad90c · caad90c
1 parent 86088a3
commit caad90c
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 25 deletions.
diff --git a/client/web/plugins/com.msgbyte.ai-assistant/src/popover.tsx b/client/web/plugins/com.msgbyte.ai-assistant/src/popover.tsx
@@ -51,6 +51,11 @@ const ActionButton = styled.div`
   }
 `;
 
+const ActionTip = styled.div`
+  font-size: 12px;
+  opacity: 0.6;
+`;
+
 export const AssistantPopover: React.FC<{
   onCompleted: () => void;
 }> = React.memo((props) => {
@@ -115,31 +120,6 @@ export const AssistantPopover: React.FC<{
 
       <Tip>{Translate.helpMeTo}</Tip>
 
-      {typeof message === 'string' && message.length > 0 && (
-        <>
-          <ActionButton
-            onClick={() => handleCallAI(improveTextPrompt + message)}
-          >
-            {Translate.improveText}
-          </ActionButton>
-          <ActionButton
-            onClick={() => handleCallAI(shorterTextPrompt + message)}
-          >
-            {Translate.makeShorter}
-          </ActionButton>
-          <ActionButton
-            onClick={() => handleCallAI(longerTextPrompt + message)}
-          >
-            {Translate.makeLonger}
-          </ActionButton>
-          <ActionButton
-            onClick={() => handleCallAI(translateTextPrompt + message)}
-          >
-            {Translate.translateInputText}
-          </ActionButton>
-        </>
-      )}
-
       <ActionButton
         onClick={async () => {
           const plainMessages = (
@@ -165,6 +145,33 @@ export const AssistantPopover: React.FC<{
       >
         {Translate.summaryMessages}
       </ActionButton>
+
+      {typeof message === 'string' && message.length > 0 ? (
+        <>
+          <ActionButton
+            onClick={() => handleCallAI(improveTextPrompt + message)}
+          >
+            {Translate.improveText}
+          </ActionButton>
+          <ActionButton
+            onClick={() => handleCallAI(shorterTextPrompt + message)}
+          >
+            {Translate.makeShorter}
+          </ActionButton>
+          <ActionButton
+            onClick={() => handleCallAI(longerTextPrompt + message)}
+          >
+            {Translate.makeLonger}
+          </ActionButton>
+          <ActionButton
+            onClick={() => handleCallAI(translateTextPrompt + message)}
+          >
+            {Translate.translateInputText}
+          </ActionButton>
+        </>
+      ) : (
+        <ActionTip>{Translate.inputTextShowMoreActionTip}</ActionTip>
+      )}
     </Root>
   );
 });

diff --git a/client/web/plugins/com.msgbyte.ai-assistant/src/translate.ts b/client/web/plugins/com.msgbyte.ai-assistant/src/translate.ts
@@ -29,6 +29,10 @@ export const Translate = {
     'zh-CN': '翻译输入内容',
     'en-US': 'Translate Input',
   }),
+  inputTextShowMoreActionTip: localTrans({
+    'zh-CN': '或者输入内容后展示更多操作',
+    'en-US': 'Or input message then show more actions',
+  }),
   usage: localTrans({
     'zh-CN': '用时',
     'en-US': 'Usage',