Fix color picker on manual hex code entry

[Copilot]

Issue

When manually entering a hex color code in the graph editor's color picker, the application would display an error message "something went wrong" instead of accepting the input.

Root Cause

The issue occurred because the hexToColor function was not handling errors when creating a Color object from an invalid or incomplete hex string. When the user was typing a value (which could be temporarily invalid during typing), this would cause an unhandled exception to be thrown.

Solution

Added proper validation and error handling in two key locations:

1. In the ColorField component:

   • Added a isValidHexColor function to validate hex color format
   • Enhanced onChange handler to validate input before conversion
   • Added try/catch blocks to handle conversion errors gracefully
   • Applied the same improvements to the delayed update handler

2. In the hexToColor utility function:

   • Added error handling to return a default color (black) instead of crashing
   • This provides a graceful fallback when conversion fails

Testing

Tested manually by entering various hex codes, including:

• Valid formats (e.g., #fff, #000000)
• Partial inputs during typing (e.g., #f, #ff)
• Invalid formats

The color picker now accepts valid input and gracefully handles invalid input without error messages.

Fixes #702.

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• telemetry.nextjs.org
  • Triggering command: /opt/hostedtoolcache/node/20.19.1/x64/bin/node /home/REDACTED/work/graph-engine/graph-engine/packages/ui/node_modules/.bin/next build (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to my firewall allow list

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[changeset-bot]

⚠️ No Changeset found

Latest commit: fc58212

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR