GH-94 : [UI][STYLES] Update states, redirects and chart visuals

[sehansi-9]

this pr closes #94

This pr fixes redirect issue from org to data tabs, updates the states in data catalog loading, handles chart labels in a more dynamic and user friendly way by introducing tilt-able x-axis labels and dynamic positioning.
Further for better readability chart values are converted to their nearest thousands, millions or billions value with suffixes such as k, m and b

[gemini-code-assist]

Summary of Changes

Hello @sehansi-9, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly enhances the user experience within the application's data catalog and visualization features. It streamlines navigation, provides clearer feedback during data loading, and makes chart data more digestible through dynamic labeling and number formatting. The changes aim to create a more intuitive and visually appealing interface for exploring datasets.

Highlights

• Chart Visualization Enhancements: Implemented dynamic X-axis labels with tilt functionality and intelligent multi-line rendering. Introduced number abbreviation (K, M, B, T) for chart values to improve readability.
• Data Catalog User Experience: Improved loading states for categories and datasets with visual indicators, preventing UI flicker and enhancing responsiveness during navigation. Fixed redirect issues and refined breadcrumb management for a smoother user journey.
• Version Component Refinement: Simplified the version display component to directly read from global configurations and updated its visual presentation.
• Styling and Navigation Consistency: Updated feedback button styling and ensured consistent navigation paths from organization pages to the data catalog, including proper breadcrumb initialization.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces several valuable UI/UX improvements, particularly enhancing the charting capabilities and data catalog navigation. The code is now cleaner, with simplified state management in the Version component and more robust loading states in the DataPage. The new chart features, such as tiltable labels and number abbreviation, are excellent additions. I've included a few comments with suggestions for refactoring to improve code consistency and maintainability. Overall, this is a solid update.

[ChanukaUOJ]

LGTM!