[FIX] dropdown cell text color + current value on relationship filter form (#5796)

* fix wrong text color in dropdown cell caused by chromium bug

* Set current filter value when opening relationship form

Author: bilalabbad

frontend/app/src/entities/nodes/object/ui/filters/attribute-filter-form.tsx

@@ -82,6 +82,7 @@ export function AttributeFilterForm({ attributeSchema, onSuccess }: AttributeFil
           handleSubmit(formData);
           onSuccess?.();
         }}
+        data-testid="attribute-filter-form"
       >
         {condition === FILTER_CONDITION.CONTAINS && (
           <FormField

frontend/app/src/entities/nodes/object/ui/filters/relationship-filter-form.tsx

@@ -96,10 +96,12 @@ export function RelationshipFilterForm({
           handleSubmit(formData as FormData);
           onSuccess?.();
         }}
+        data-testid="relationship-filter-form"
       >
         {condition === "is any of" && (
           <FormField
             name="relationships"
+            defaultValue={currentFilter?.value}
             render={({ field }) => {
               const value = field.value as RelationshipNode[] | undefined;
 

frontend/app/src/entities/nodes/object/ui/object-table/cells/dropdown-cell.tsx

@@ -8,7 +8,7 @@ export function DropdownCell({ dropdown }: { dropdown: Dropdown }) {
         dropdown.color
           ? {
               backgroundColor: dropdown.color,
-              color: `lch(from ${dropdown.color} calc((50 - l) * infinity) 0 0)`, // https://x.com/devongovett/status/1863733091409461256
+              color: `lch(from ${dropdown.color} calc((50 - l) * 999) 0 0)`, // https://x.com/devongovett/status/1863733091409461256
             }
           : undefined
       }

frontend/app/src/entities/nodes/object/ui/object-table/cells/generics/kind-header-cell.tsx

@@ -25,10 +25,7 @@ export function KindHeaderCell({ schema }: { schema: iGenericSchema }) {
 
   return (
     <Popover open={showFilters} onOpenChange={setShowFilters}>
-      <PopoverTrigger
-        className={classNames(cellsStyle, cellHeaderStyle)}
-        data-testid="table-header-cell"
-      >
+      <PopoverTrigger className={classNames(cellsStyle, cellHeaderStyle)}>
         <Icon icon="mdi:code-json" className="text-stone-400" />
         <span className="truncate mr-2">Kind</span>
         <Icon

frontend/app/tests/e2e/objects/object-filters.spec.ts

@@ -34,6 +34,9 @@ test.describe("Object filters", () => {
       await expect(page.getByRole("link", { name: "atl1-edge1" })).toBeVisible();
       await expect(page.getByRole("link", { name: "den1-edge1" })).toBeVisible();
       await expect(page.getByRole("link", { name: "atl1-core1" })).not.toBeVisible();
+
+      await page.getByRole("button", { name: "Role" }).click();
+      await expect(page.getByTestId("attribute-filter-form")).toContainText("Edge Router");
     });
 
     await test.step("filter using a relationship of cardinality one", async () => {
@@ -47,6 +50,9 @@ test.describe("Object filters", () => {
       await expect(page.getByRole("link", { name: "atl1-edge1" })).toBeVisible();
       await expect(page.getByRole("link", { name: "den1-edge1" })).not.toBeVisible();
       await expect(page.getByRole("link", { name: "atl1-core1" })).not.toBeVisible();
+
+      await page.getByRole("button", { name: "Site" }).click();
+      await expect(page.getByTestId("relationship-filter-form")).toContainText("atl1×");
     });
 
     await test.step("remove an attribute filter", async () => {
@@ -72,6 +78,9 @@ test.describe("Object filters", () => {
       await expect(page.getByRole("link", { name: "atl1-core1" })).toBeVisible();
       await expect(page.getByRole("link", { name: "atl1-edge1" })).not.toBeVisible();
       await expect(page.getByRole("link", { name: "den1-edge1" })).not.toBeVisible();
+
+      await page.getByRole("button", { name: "Tags" }).click();
+      await expect(page.getByTestId("relationship-filter-form")).toContainText("blue×");
     });
 
     await test.step("clear all filters", async () => {
@@ -100,6 +109,9 @@ test.describe("Object filters", () => {
       await expect(page.getByLabel("Kind contains InfraInterfaceL3")).toBeVisible();
       await expect(page.getByTestId("object-items")).toContainText("Interface L3");
       await expect(page.getByTestId("object-items")).not.toContainText("Interface L2");
+
+      await page.getByRole("button", { name: "Kind", exact: true }).click();
+      await expect(page.getByLabel("kind", { exact: true })).toContainText("Interface L3 Infra");
     });
 
     await test.step("clear kind filter", async () => {