fix(icon-picker): allow selecting the empty/no-icon option (#3298)

The icon picker grid starts with an empty string entry that renders the
"no icon" (prohibit) symbol, but the onClick guard "if (icon)" treated
the empty string as falsy and ignored the click. Change the guard to
check for a defined string value so the empty/no-icon option can be
selected.

Closes #3252
Closes #3261

Co-authored-by: Devin <devin@example.com>
Co-authored-by: Amruth Pillai <im.amruth@gmail.com>

apps/web/src/components/input/icon-picker.test.tsx

@@ -1,6 +1,6 @@
 // @vitest-environment happy-dom
 
-import { render } from "@testing-library/react";
+import { fireEvent, render, screen } from "@testing-library/react";
 import { beforeAll, describe, expect, it, vi } from "vitest";
 import { i18n } from "@lingui/core";
 import { I18nProvider } from "@lingui/react";
@@ -68,4 +68,17 @@ describe("IconPicker", () => {
 		const { container } = renderPicker();
 		expect(container.querySelectorAll("button").length).toBeGreaterThanOrEqual(1);
 	});
+
+	it("calls onChange with an empty string when the no-icon cell is clicked", () => {
+		const onChange = vi.fn();
+		render(
+			<I18nProvider i18n={i18n}>
+				<IconPicker value="globe" onChange={onChange} popoverProps={{ defaultOpen: true }} />
+			</I18nProvider>,
+		);
+
+		const firstCell = screen.getByTestId("grid").querySelector("button");
+		if (firstCell) fireEvent.click(firstCell);
+		expect(onChange).toHaveBeenCalledWith("");
+	});
 });

apps/web/src/components/input/icon-picker.tsx

@@ -58,7 +58,7 @@ function IconCellComponent({ columnIndex, rowIndex, style, icons, onChange }: Ic
 			style={style}
 			tabIndex={-1}
 			onClick={() => {
-				if (icon) onChange(icon);
+				if (typeof icon === "string") onChange(icon);
 			}}
 			className="flex size-full items-center justify-center hover:bg-accent"
 		>