apidash icon indicating copy to clipboard operation
apidash copied to clipboard

Adding color support for environments

Open BalaSubramaniam12007 opened this issue 10 months ago • 3 comments

PR Description

This PR introduces full environment color support throughout the application, enabling users to assign and visualize colors for different environments (e.g., red for prod, green for dev).

Key changes include:

Model Update: Added a color field to EnvironmentModel as a String? to store hex colors (e.g., #FF5733), ensuring serialization compatibility with Hive.

State Management: Enhanced EnvironmentsProvider to handle color in loadEnvironments, addEnvironment, updateEnvironment, and duplicateEnvironment.

UI Enhancements: Updated EnvironmentPopupMenu to display environment colors across the entire PopupMenuItem,

Create a new file named EnvEditorTitleAction as a mirror of EditorTitleAction, to add a color palette section feature that is available only for the environment page.

TODO: Added automatic unique color assignment for new environments and random color generation as a fallback, ensuring visual distinction.

Related Issues

  • Closes #601

Checklist

  • [X] I have gone through the contributing guide
  • [X] I have updated my branch and synced it with the project main branch before making this PR
  • [X] I am using the latest Flutter stable branch (run flutter upgrade and verify)
  • [X] I have run the tests (flutter test) and all tests are passing

image

image image

Added/updated tests?

We encourage you to add relevant test cases.

  • [ ] Yes
  • [x] No, and this is why: Initial implementation; test coverage will follow in future PRs.

OS on which you have developed and tested the feature?

  • [ ] Windows
  • [ ] macOS
  • [X] Linux

BalaSubramaniam12007 avatar Apr 23 '25 21:04 BalaSubramaniam12007

The color palatte is hardly visible in the corner. the feature should show the option to pick color prominently. The dropdown text over color is not visible.

animator avatar Apr 24 '25 16:04 animator

Also, test on dark mode.

animator avatar Apr 24 '25 16:04 animator

@animator, thanks for the feedback! I’m a bit unclear on how to make the color palette more prominent.Would you suggest increase the button size, add a color swatch, or reposition it? Could you please clarify what you envision for making the "pick color" option stand out? Also, I plan to use a block picker (like the one I shared) with a curated set of colors for easier selection. Thanks! image

BalaSubramaniam12007 avatar Apr 24 '25 19:04 BalaSubramaniam12007