- Moved chatSlice and inputSlice from views to reducers folder.
- Updated import paths for chatSlice and inputSlice in various files.
- Adjusted import paths for chatSlice and inputSlice in store.ts.
- Moved InputMessage and InputContexts from views to components folder.
- Updated import paths for InputMessage in ChatPanel.tsx.
- Adjusted import paths for inputSlice and chatSlice in InputMessage and InputContexts.
- Improved code formatting in InputMessage.tsx.
- Moved StopButton and RegenerationButton from views to components folder.
- Updated import paths for StopButton and RegenerationButton in ChatPanel.tsx.
- Adjusted import paths for chatSlice in StopButton and RegenerationButton.
- Improved code formatting in ChatPanel.tsx.
- Extracted RegenerationButton and StopButton components from ChatPanel into separate files.
- Removed unused imports and state from ChatPanel.
- Updated ChatPanel to use the new button components.
- Registered a new handler for 'systemMessage' in ChatPanel.
- Added a new action 'startSystemMessage' in chatSlice to handle system messages.
- The new action updates the state to indicate the start of a system message.
- Added condition to check if `action.payload.hasDone` is true, then update the hash of the last two messages in `state.messages`.
- Fixed the `splice` method in `deleteMessage.fulfilled` to correctly remove the message from `state.messages`.
- Updated `stopGenerating` dispatch in `ChatPanel.tsx` to include the message in the payload.
- Modified the delete message action in `MessageHeader.tsx` to handle the case when `item.hash` is not present.
- Passed dynamic width from ChatPanel to CurrentMessage component.
- Imported Container from "@mantine/core" for better layout control in CurrentMessage.
- Added styling to the CurrentMessage component to handle dynamic width and improve text display.
- Added 'whiteSpace: 'break-spaces'' to preserve white spaces and line breaks in the preformatted text.
- Modified the stopGenerating action to accept a payload indicating if the task has been completed.
- Added a new state property 'hasDone' to track if a task has been completed.
- Updated the CurrentMessage component to handle the new 'hasDone' state and update the last message accordingly.
- Introduced a new action 'updateLastMessage' to update the last message in the state.
- Added a new state property 'lastMessage' to keep track of the last message.
- Refactored the CurrentMessage component to split the message into blocks for better rendering.
- Extracted current message handling logic into a new component, CurrentMessage.tsx.
- Removed redundant code and imports from ChatPanel.tsx.
- Removed MessageBlink component from MessageContainer.tsx as it's now part of CurrentMessage.tsx.
- Added import for CurrentMessage in ChatPanel.tsx.
- Removed unused selectors from ChatPanel.tsx.
- Simplified useEffect hooks in ChatPanel.tsx by moving some logic to CurrentMessage.tsx.
- Remove selectMessageCount, selectIsMiddle, and related useEffect in ChatPanel.tsx.
- Add selectPageIndex and selectIsLastPage to chatSlice.ts.
- Update fetchHistoryMessages to accept pageIndex parameter.
- Modify chatSlice to handle pageIndex and isLastPage states.
- Replace relative import paths with '@/...' alias in multiple files.
- Update tsconfig.json to include paths configuration.
- Add alias configuration to webpack.config.js.
- Added selectors for isTop, isBottom, and isMiddle in chatSlice.
- Removed scrollPosition and stopScrolling states from ChatPanel.
- Added onScrollPositionChange function to handle scroll events.
- Dispatch onMessagesTop, onMessagesBottom, and onMessagesMiddle actions based on scroll position.
- Remove messageUtil.sendMessage from ChatPanel.tsx.
- Add fetchCommandMenus to inputSlice using createAsyncThunk.
- Replace local commandMenus state with Redux store in InputMessage.tsx.
- Move context menu fetching to inputSlice using createAsyncThunk.
- Remove redundant message handler registration in InputMessage.tsx.
- Use fetched context menus from the Redux store.
The ChatPanel.tsx file was moved to ChatPanel/index.tsx to better organize the project structure. The import statement for MessageUtil was also updated to reflect the new file path.
- Use VSCode theme variables for colors and fonts in App.tsx and ChatPanel.tsx
- Update background, foreground, and border colors for various components
- Update hover and disabled states for buttons and icons
- Change the keyboard shortcut for sending a message from Ctrl+Enter to Enter without Shift
- Update the placeholder text to remove the reference to the old shortcut
- Added a messageCount constant to limit the number of displayed messages
- Removed excess messages when the message length exceeds double the messageCount
- Ensured only the last 5 messages are loaded from the history
- Add a setTimeout function to scrollToBottom in useEffect to ensure smooth scrolling when ChatPanel is mounted.
- Adjust the height of the ScrollArea based on the generating state.
- Move the "Stop generating" button to a more appropriate location in the UI.
- Update the display property of the blinking cursor for better visibility.
Add a new message handler to load history messages when the ChatPanel component is mounted. The handler receives a list of message entries and appends them to the messageHandlers state. Each entry contains a hash, user, date, request, response, and context. The context is an array of objects with a content and role property, which is parsed and added to the messageHandlers state as well.
Also, add a useEffect hook to the ChatPanel component to call the new message handler when the component is mounted.
Add a button to stop generating messages during a dev chat session. The button is displayed when generating messages and stops the generation process when clicked. The button is represented by the IconPlayerStop icon from the Tabler Icons library. The button is disabled during message generation.
This commit adds the ability to commit code blocks with the commit message syntax highlighting. The commit button appears only when the code block is a commit message. The commit button sends the commit message content to the server. The commit button changes color to teal when the commit is successful.
Add focus to input when chat menu is opened to improve user experience. This commit modifies the onChange function in ChatPanel.tsx to set focus to the input field when the menu is opened.
Refactored `ChatPanel` to handle missing contexts by adding conditional rendering for the `Accordion` and `contexts` map. Also, added `pre` tag styling to the message content.
The user's message now includes a context object that contains the file and context information. This allows the extension to process the message more accurately. The context object is also displayed in the chat UI.
Added a context menu to DevChat that allows users to select code or file and right-click to add it as a context. The context is then added to the list of contexts in the chat panel.
Added a context menu to the ChatPanel component that allows users to quickly insert context-specific commands. The context menu is populated with items based on the `contexts` array.
Add a padding to the top of the chat container to prevent the first message from being hidden behind the input field. Also, focus on the input field when the chat panel mounts for better user experience.
- Remove unused CSS class
- Add dynamic height to chat container
- Add smooth scrolling to bottom when new messages are received
- Fix input field width to match container width
- Use Mantine's useResizeObserver hook to get input field width
- Remove console.log statements
Add useEffect hooks to display received messages in the chat UI as bot messages. Also, update the Input component to use Textarea and add the ability to send messages using Ctrl + Enter
Add a copy button to code blocks in ChatPanel.tsx. The copy button allows users to easily copy code snippets to their clipboard. The button is implemented using the CopyButton component from @mantine/core and the IconCopy and IconCheck components from @tabler/icons-react.
Add react-syntax-highlighter and react-markdown to package.json to enable syntax highlighting and markdown rendering in the chat panel.
Also, update ChatPanel.tsx to use ReactMarkdown instead of Remark for markdown rendering. Additionally, add SyntaxHighlighter from react-syntax-highlighter to render code blocks with syntax highlighting.
This commit adds message handling for sending and receiving messages between the chat panel and the extension. It also displays the messages in the chat panel. The messages are displayed as a list of messages, with each message containing an avatar and the message content. The message content is displayed using the `Remark` component from the `react-remark` library.
Create a singleton instance for MessageUtil to avoid multiple instances of the class. The instance is created only once and returned on subsequent calls. This commit also removes the creation of a new instance of MessageUtil in ChatPanel.tsx.
