Skip to content

🎨 feat: Enhance UI with Smooth Animations & Image Detail Panel #7653

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jun 2, 2025

Conversation

berry-13
Copy link
Collaborator

Summary

  • ✨ UI Enhancements & Animations:
    • Updated Header and Nav components for smoother transitions on key elements (e.g., sidebar, new chat, navigation menu)
  • 🖼️ Image Dialog Improvements:
    • Refactored DialogImage to include a side panel with rich image details (prompt, quality, size, file size) and animated transitions
    • Extended Image component to support additional metadata and ensured OpenAIImageGen passes these arguments correctly
  • 🌍 Localization Updates:
    • Added new strings supporting image detail features such as "Image Details," "File Size," and more to localization files

Change Type

  • New feature (non-breaking change which adds functionality)
  • Style

Testing

Tested with both generated and non-genereated images

Test Configuration:

Checklist

  • My code adheres to this project's style guidelines
  • I have performed a self-review of my own code
  • I have commented in any complex areas of my code
  • My changes do not introduce new warnings
  • Local unit tests pass with my changes
  • Any changes dependent on mine have been merged and published in downstream modules.

@berry-13 berry-13 changed the title 🎨 feat: Enhance UI with Smooth Animations, Image Detail Panel & Expanded Localization 🎨 feat: Enhance UI with Smooth Animations & Image Detail Panel May 31, 2025
@berry-13 berry-13 changed the base branch from main to dev May 31, 2025 14:04
if (isOpen && src) {
getImageSize(src).then(setImageSize);
}
}, [isOpen, src]);

Check warning

Code scanning / ESLint

verifies the list of dependencies for Hooks like useEffect and similar Warning

React Hook useEffect has a missing dependency: 'getImageSize'. Either include it or remove the dependency array.
@berry-13 berry-13 added ✨ enhancement New feature or request 🎨 design UI/UX improvements labels May 31, 2025
@danny-avila danny-avila merged commit aca8909 into dev Jun 2, 2025
6 checks passed
@danny-avila danny-avila deleted the feat/image-gen-update branch June 2, 2025 11:50
arthurolivierfortin pushed a commit to arthurolivierfortin/LibreChat-Fork that referenced this pull request Jun 4, 2025
* feat: Enhance DialogImage component with image size retrieval and details panel

* feat: Improve UI transitions and responsiveness in Header, DialogImage, Nav, and SearchBar components

* fix: Correct button icon toggle in DialogImage component
arthurolivierfortin pushed a commit to arthurolivierfortin/LibreChat-Fork that referenced this pull request Jun 4, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🎨 design UI/UX improvements ✨ enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants