From 4e94092730c50cc791ecacd67969127461fa908d Mon Sep 17 00:00:00 2001 From: bbassie <17990055+bbassie@users.noreply.github.com> Date: Thu, 25 Jun 2026 00:55:47 +0000 Subject: [PATCH] Type UsersTable columns instead of any UsersTable declared its columns as any[], which masked a few type mismatches. Type them as ColumnType[] (matching InstanceList) and fix what surfaced: the Roles column and onFilterUser value types (antd keys include bigint) and useUserFilter's filterDropdown prop type (FilterDropdownProps instead of a hand-written string[] shape). Co-Authored-By: Claude Opus 4.8 (1M context) --- packages/web_ui/src/components/UsersFilters.tsx | 11 +++-------- packages/web_ui/src/components/UsersTable.tsx | 5 +++-- 2 files changed, 6 insertions(+), 10 deletions(-) diff --git a/packages/web_ui/src/components/UsersFilters.tsx b/packages/web_ui/src/components/UsersFilters.tsx index 71ea2cd0..4c32ee78 100644 --- a/packages/web_ui/src/components/UsersFilters.tsx +++ b/packages/web_ui/src/components/UsersFilters.tsx @@ -79,7 +79,7 @@ function matchesTriState(value: boolean, filter?: boolean) { } export function onFilterUser( - value: string | number | boolean, + value: boolean | React.Key, record: UserDetails ) { const filter = decodeFilter(String(value)); @@ -126,14 +126,9 @@ export function useUserFilter(withStatus?: boolean) { setSelectedKeys, confirm, clearFilters, - }: { - selectedKeys: string[]; - setSelectedKeys: (keys: string[]) => void; - confirm: FilterDropdownProps["confirm"]; - clearFilters: FilterDropdownProps["clearFilters"]; - }) { + }: FilterDropdownProps) { const filter: UserFilter = selectedKeys[0] - ? decodeFilter(selectedKeys[0]) + ? decodeFilter(String(selectedKeys[0])) : {}; function update(next: Partial) { diff --git a/packages/web_ui/src/components/UsersTable.tsx b/packages/web_ui/src/components/UsersTable.tsx index 7009a565..2e9e65e7 100644 --- a/packages/web_ui/src/components/UsersTable.tsx +++ b/packages/web_ui/src/components/UsersTable.tsx @@ -2,6 +2,7 @@ import React from "react"; import { Table, Tag } from "antd"; import { SearchOutlined } from "@ant-design/icons"; import { useNavigate } from "react-router-dom"; +import type { ColumnType } from "antd/es/table/interface"; import * as lib from "@clusterio/lib"; @@ -91,7 +92,7 @@ export default function UsersTable( } } - const columns: any[] = [ + const columns: ColumnType[] = [ { title: "Name", key: "name", @@ -112,7 +113,7 @@ export default function UsersTable( key: "roles", filters: roleFilters, filterMultiple: true, - onFilter: (value: string | number | boolean, record: lib.UserDetails) => ( + onFilter: (value: boolean | React.Key, record: lib.UserDetails) => ( record.roleIds.has(Number(value)) ), render: (_: any, user: lib.UserDetails) => (