Major updates to Obsidian Khoj plugin chat interface and editing features #1109
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…of newline characters
…, and edit cancellation
…ng of escape characters
…d preview generation
- Adjust chat message metadata positioning and alignment - Enhance action button styles with smoother transitions and subtle shadows - Fine-tune font sizes and button interactions - Improve hover effects for chat action buttons - Optimize visual consistency across message types
- Redesign chat input row with modern, elevated styling - Add focus and active state effects for improved visual feedback - Increase input height and improve text area styling - Remove commented-out animation code - Adjust footer and input padding and layout - Simplify content update logic in chat view
- Enhance header design with improved spacing, shadows, and transitions - Refine navigation menu with smoother hover and active states - Update button styles for new chat and agent selection with subtle interactions - Improve responsive layout for different screen sizes - Add hover and interaction effects to logo, navigation icons, and buttons
- Implement a dynamic mode dropdown triggered by "/" command - Add keyboard navigation (arrow keys, Enter, Escape) for mode selection - Create responsive dropdown styling with emoji, label, and command - Enhance chat input handling to support mode selection and dropdown interactions - Improve input resizing and positioning logic for dropdown
|
| GitGuardian id | GitGuardian status | Secret | Commit | Filename | |
|---|---|---|---|---|---|
| 15894534 | Triggered | Generic High Entropy Secret | 6f21860 | docker-compose.yml | View secret |
🛠 Guidelines to remediate hardcoded secrets
- Understand the implications of revoking this secret by investigating where it is used in your code.
- Replace and store your secret safely. Learn here the best practices.
- Revoke and rotate this secret.
- If possible, rewrite git history. Rewriting git history is not a trivial act. You might completely break other contributing developers' workflow and you risk accidentally deleting legitimate data.
To avoid such incidents in the future consider
- following these best practices for managing and storing secrets including API keys and other credentials
- install secret detection on pre-commit to catch secret before it leaves your machine and ease remediation.
🦉 GitGuardian detects secrets in your source code to help developers and security teams secure the modern development process. You are seeing this because you or someone else with access to this repository has authorized GitGuardian to scan your pull request.
…and improving HTML transformation. Update styles for better UI responsiveness and visual feedback. Add new entries to .gitignore for cursor and Copilot files.
debanjum
reviewed
Mar 16, 2025
- Introduced a new view for displaying similar documents, allowing users to search and view related content. - Enhanced text formatting handling to support nested highlights and strikethroughs. - Updated styles for improved UI responsiveness and visual feedback. - Added navigation links for the new similar documents feature in the header pane.
…es résultats, ajout de styles pour la réactivité, et ajustement des paramètres par défaut. Modification du texte du titre et des actions de navigation dans la vue de chat.
- Removed support for partial edits in khoj-edit blocks, simplifying the parsing logic. - Enhanced the chat input styles for better responsiveness and user experience. - Updated default settings to increase results count and adjusted navigation actions. - Changed the emoji for the Similar Documents view to better represent its function. - Minor text adjustments in the header for consistency.
- Adjusted padding and border-radius for various UI elements to enhance visual consistency. - Added box-shadow to buttons and input fields for improved depth perception. - Changed the emoji in the Similar Documents view and the icon returned by getIcon() method to better reflect their functionality. - Introduced a new container style for similar results to improve layout.
- Added a loading spinner with updated styles for better user experience during searches. - Introduced new button styles for "Refresh" and "More context" actions, improving visual consistency. - Updated layout and styles for similar results, including new containers and text adjustments for clarity.
- Removed old styles for the "More context" button and updated its hover effects. - Introduced new styles for the "Refresh" button, enhancing visual consistency and user experience. - Adjusted padding, font size, and hover effects for both buttons to improve usability.
- Updated CSS for the chat input to improve layout and responsiveness, including changes to flex properties and height constraints. - Enhanced auto-resize logic in the chat view to accommodate a larger maximum height and adjust overflow behavior based on content size. - Ensured buttons remain centered and do not shrink on mobile for better usability.
… parsing logic - Added an optional `inProgress` field to the `ParseKhojEditResult` interface to track incomplete edits. - Introduced a new `PartialEditBlockResult` interface for detecting and processing partial edit blocks. - Updated `parseKhojEditBlock` method to handle incomplete blocks and extract relevant information. - Enhanced HTML transformation for in-progress and error states in khoj-edit blocks. - Implemented a new method to detect partial edit blocks in messages.
- Introduced a two-phase approach for editing: validation and application, ensuring all blocks are validated before any changes are applied. - Enhanced error handling to provide clearer feedback on validation failures, including specific messages for atomic validation issues. - Updated CSS styles for the khoj-retry-badge to improve visual consistency and responsiveness.
- Introduced a flag to track streaming state, enhancing UI stability during message processing. - Updated CSS styles for chat components, including footer and status messages, to improve layout and responsiveness. - Enhanced auto-resize functionality for chat input, ensuring proper behavior during streaming. - Created dedicated containers for status summaries and retry badges to improve visual separation and clarity.
…hance layout and visual consistency - Centered the retry container and adjusted margins for improved spacing. - Increased padding, border-radius, and gap in the retry badge for better aesthetics. - Updated font sizes and box-shadow for enhanced readability and depth perception.
|
UX/UI Improvements & Feature Additions:
Note: There's an ongoing GitGuardian issue whose origin remains unclear and I don't believe I'm the source. Looking for assistance from someone who could help resolve this issue. |
- Updated CSS styles for the chat interface, including adjustments to padding, margins, and layout for better visual consistency. - Removed radio button mode selectors in favor of a dropdown for a cleaner UI. - Enhanced header styles for a more modern look and improved responsiveness on smaller screens. - Refactored chat view logic to access the chat view directly from the workspace leaves, streamlining the conversation creation process.
- Updated the chat view to conditionally sanitize markdown messages using DOMPurify only if it is available, preventing potential crashes when DOMPurify is not present. - Improved the handling of raw responses by ensuring that the application can gracefully handle cases where sanitization is not possible. - Refactored event listener for creating new conversations to directly access the chat view from workspace leaves, streamlining the process.
- Eliminated the event listener that created new conversations directly from the chat view header, simplifying the header setup process. - This change streamlines the code and focuses on the active navigation pane functionality.
- Removed unnecessary padding and adjusted margins in the CSS for a cleaner appearance. - Eliminated the top control row from the chat view to streamline the interface. - Enhanced overall styling for better visual consistency and user experience.
- Changed the default starting message to "Start with '/' to select the response mode." for better user guidance. - Updated the placeholder message in the chat input to reflect the new starting message, enhancing user experience. - Ensured consistency in the starting message across different states of the chat view.
- Updated the incrementalChat method to select options from the dropdown when Enter is pressed, improving user interaction. - Added filtering for dropdown options based on user input, ensuring only relevant commands are displayed. - Introduced a new method, highlightVisibleOption, to manage the highlighting of selected options among visible dropdown items. - Refactored existing logic to streamline dropdown navigation and selection, enhancing overall usability.
- Updated the chat mode interface to replace emoji representations with icon names for better consistency and scalability. - Adjusted CSS styles to accommodate new icon display, ensuring proper alignment and sizing. - Enhanced the header display in simplified view to utilize icons, improving visual clarity. - Removed emoji-related code and comments for a cleaner implementation.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR introduces significant improvements to the Obsidian Khoj plugin's chat interface and editing capabilities, enhancing the overall user experience and content management functionality.
Features
🔍 Enhanced Communication Mode
I've implemented radio buttons below the chat window for easier communication mode selection. The modes are now displayed as emojis in the conversation for a cleaner interface, replacing the previous text-based system (e.g., /default, /research). I've also documented the search mode functionality in the help command.
Screenshots
💬 Revamped Message Interaction
I've redesigned the message buttons with improved spacing and color coding for better visual differentiation. The new edit button allows quick message modifications - clicking it removes the conversation up to that point and copies the message to the input field for easy editing or retrying questions.
Screenshots
🤖 Advanced Agent Selection System
I've added a new chat creation button with agent selection capability. Users can now choose from their available agents when starting a new chat. While agents can't be switched mid-conversation to maintain context, users can easily start fresh conversations with different agents.
Screenshots
👁️ Real-Time Context Awareness
I've added a button that gives Khoj access to read Obsidian opened tabs. This allows Khoj to read open notes and track changes in real-time, maintaining a history of previous versions to provide more contextual assistance.
Screenshots
✏️ Smart Document Editing
Inspired by Cursor IDE's intelligent editing and ChatGPT's Canvas functionality, I've implemented a first version of a content creation system we've been discussing. Using a JSON-based modification system, Khoj can now make precise changes to specific parts of files, with changes previewed in yellow highlighting before application. Modification code blocks are neatly organized in collapsible sections with clear action summaries. While this is just a first step, it's working remarkably well and I have several ideas for expanding this functionality to make Khoj an even more powerful content creation assistant.
Screenshots