Merge pull request #256 from devchat-ai/94-add-help-command

94 add help command

src/views/components/InputMessage/index.tsx

@@ -83,7 +83,13 @@ const InputMessage = observer((props: any) => {
                 }
                 if ((event.key === 'Enter' || event.key === 'Tab') && !event.shiftKey) {
                     const commandNode = commandMenusNode[currentMenuIndex];
-                    input.setValue(`/${commandNode.props['data-pattern']} `);
+                    const commandPattern = commandNode.props['data-pattern'];
+                    if (commandPattern === 'help') {
+                        chat.helpMessage();
+                        input.setValue('');
+                    } else {
+                        input.setValue(`/${commandPattern} `);
+                    }
                     input.closeMenu();
                     event.preventDefault();
                 }

src/views/stores/ChatStore.ts

@@ -75,7 +75,40 @@ export const ChatStore = types.model('Chat', {
     isTop: false,
     scrollBottom: 0
 })
-    .actions(self => ({
+    .actions(self => {
+
+        const helpMessage = (originalMessage = false) => {
+            self.messages.push(
+                Message.create({
+                    type: 'user',
+                    message: originalMessage ? "How do I use DevChat?" : '/help'
+                }));
+            self.messages.push(
+                Message.create({
+                    type: 'bot',
+                    message: `
+Do you want to write some code or have a question about the project? Simply right-click on your chosen files or code snippets and add them to DevChat. Feel free to ask me anything or let me help you with coding.
+    
+Don't forget to check out the "+" button on the left of the input to add more context. To see a list of workflows you can run in the context, just type "/". Happy prompting!
+
+To get started, here are the things that DevChat can do:
+
+[/code: write code based on your prompt](#code)
+
+[/commit_message: write a commit message based on your code](#commit_message)
+
+[/release_note: write the release code based on your code](#release_note)
+
+[/ask_code: ask questions about your own codebase](#ask_code)
+
+[/extension: create extensions for DevChat](#extension)
+
+<button value="settings">Settings</button>
+                    `}));
+        };
+
+        return {
+            helpMessage,
             startGenerating: (text: string, chatContexts) => {
                 self.generating = true;
                 self.responsed = false;
@@ -208,25 +241,7 @@ export const ChatStore = types.model('Chat', {
                 } else {
                     self.isLastPage = true;
                     if (self.messages.length === 0) {
-                    self.messages.push(
+                        helpMessage(true);
-                        Message.create({
-                            type: 'user',
-                            message: "How do I use DevChat?"
-                        }));
-                    self.messages.push(
-                        Message.create({
-                            type: 'bot',
-                            message: `
-Do you want to write some code or have a question about the project? Simply right-click on your chosen files or code snippets and add them to DevChat. Feel free to ask me anything or let me help you with coding.
-            
-Don't forget to check out the "+" button on the left of the input to add more context. To see a list of workflows you can run in the context, just type "/". Happy prompting!
-
-To get started, here are the things that DevChat can do:
-
-[/ask_code: ask questions about your own codebase](#ask_code)
-
-<button value="settings">Settings</button>
-                            `}));
                     }
                 }
             }),
@@ -237,7 +252,8 @@ To get started, here are the things that DevChat can do:
                     self.messages.splice(index);
                 }
             })
-    }));
+        };
+    });
 
 
 export type IMessage = Instance<typeof Message>;

src/views/stores/InputStore.ts

@@ -101,6 +101,7 @@ export const InputStore = types
             try {
                 const items = yield regCommandMenus();
                 self.commandMenus.push(...items);
+                self.commandMenus.push({ name: 'help', description: 'View the DevChat documentation.', pattern: 'help' });
             } catch (error) {
                 console.error("Failed to fetch command menus", error);
             }