fix: resolve Content Viewer text overflow and update branding elements#23
Conversation
- Change page title from 'Vite + React + TS' to 'OpenContext' - Replace default Vite favicon with custom OpenContext logo - Add SVG logo file matching the sidebar branding design - Improve professional appearance for production deployment
- Fix text overflow issue with proper container constraints and word breaking - Remove File Type field that was not working correctly - Restructure metadata grid from 3 columns to 2 columns for better layout - Add proper text wrapping with break-all and overflow handling - Remove non-functional View Source button and clean up imports - Improve content scrolling within fixed height container
- Change 'Environment: development' to 'Deployment: Self-Hosted Instance' - Remove developer-specific terminology for better user experience - Align with open-source project identity and professional presentation - Make system information more accessible to end users
- Reflect recent UI improvements and fixes - Update component descriptions and usage guidelines - Document branding changes and professional presentation
There was a problem hiding this comment.
Pull Request Overview
This PR improves the Admin UI's branding and resolves text overflow issues in the Search interface. The changes focus on replacing default Vite branding with OpenContext branding and enhancing the Content Viewer's display functionality.
- Updated browser tab title and favicon from Vite defaults to OpenContext branding
- Fixed Content Viewer text overflow issues and improved metadata display layout
- Made environment labeling more user-friendly by changing "Environment" to "Deployment" with "Self-Hosted Instance" label
Reviewed Changes
Copilot reviewed 4 out of 5 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| admin-ui/index.html | Updated page title and favicon reference to OpenContext branding |
| admin-ui/src/pages/Search.tsx | Fixed text overflow in Content Viewer and improved metadata grid layout |
| admin-ui/src/pages/Settings.tsx | Changed development-specific labels to user-friendly terms |
| admin-ui/README.md | Removed contributing section from documentation |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| <pre className="whitespace-pre-wrap text-sm text-gray-800 font-mono leading-relaxed"> | ||
| <div className="bg-white border rounded-lg overflow-hidden"> | ||
| <div className="p-4 max-h-96 overflow-y-auto"> | ||
| <pre className="whitespace-pre-wrap text-sm text-gray-800 font-mono leading-relaxed overflow-hidden text-ellipsis" style={{ wordBreak: 'break-all', whiteSpace: 'pre-wrap' }}> |
There was a problem hiding this comment.
The inline style duplicates the 'whitespace-pre-wrap' CSS class. The style object sets 'whiteSpace: 'pre-wrap'' which is redundant with the 'whitespace-pre-wrap' class. Consider removing the redundant style property.
| <pre className="whitespace-pre-wrap text-sm text-gray-800 font-mono leading-relaxed overflow-hidden text-ellipsis" style={{ wordBreak: 'break-all', whiteSpace: 'pre-wrap' }}> | |
| <pre className="whitespace-pre-wrap text-sm text-gray-800 font-mono leading-relaxed overflow-hidden text-ellipsis" style={{ wordBreak: 'break-all' }}> |
| <div className="text-gray-600 font-mono text-xs"> | ||
| {contentData.chunkId} | ||
| <div className="text-gray-600 font-mono text-xs break-all"> | ||
| {selectedChunk} |
There was a problem hiding this comment.
The variable 'selectedChunk' is being used instead of 'contentData.chunkId'. This appears to be incorrect as the original code displayed 'contentData.chunkId' which is the actual chunk ID from the API response, while 'selectedChunk' likely contains a different value used for selection logic.
| {selectedChunk} | |
| {contentData.chunkId} |
Summary of Changes
This PR addresses several UI/UX improvements for the Admin UI, focusing on the Search interface and overall branding consistency.
Key Implementation Notes
Files Modified
admin-ui/index.html- Updated page title and favicon referenceadmin-ui/public/logo.svg- Added custom OpenContext logo (new file)admin-ui/src/pages/Search.tsx- Fixed text overflow, improved metadata grid, removed broken featuresadmin-ui/src/pages/Settings.tsx- Changed development-specific labels to user-friendly termsadmin-ui/README.md- Updated documentation to reflect changesTesting Instructions
http://localhost:5173/searchRelated Issues
Addresses user feedback regarding: