diff --git a/src/app/[orgId]/settings/access/roles/RolesDataTable.tsx b/src/app/[orgId]/settings/access/roles/RolesDataTable.tsx index 8073e166..e4e0fb9c 100644 --- a/src/app/[orgId]/settings/access/roles/RolesDataTable.tsx +++ b/src/app/[orgId]/settings/access/roles/RolesDataTable.tsx @@ -39,6 +39,7 @@ export function RolesDataTable({ }: DataTableProps) { const [sorting, setSorting] = useState([]); const [columnFilters, setColumnFilters] = useState([]); + const [globalFilter, setGlobalFilter] = useState([]); const table = useReactTable({ data, @@ -49,6 +50,7 @@ export function RolesDataTable({ getSortedRowModel: getSortedRowModel(), onColumnFiltersChange: setColumnFilters, getFilteredRowModel: getFilteredRowModel(), + onGlobalFilterChange: setGlobalFilter, initialState: { pagination: { pageSize: 20, @@ -57,7 +59,8 @@ export function RolesDataTable({ }, state: { sorting, - columnFilters + columnFilters, + globalFilter } }); @@ -67,15 +70,9 @@ export function RolesDataTable({
- table - .getColumn("name") - ?.setFilterValue(event.target.value) + value={globalFilter ?? ""} + onChange={(e) => + table.setGlobalFilter(String(e.target.value)) } className="w-full pl-8" /> diff --git a/src/app/[orgId]/settings/access/users/UsersDataTable.tsx b/src/app/[orgId]/settings/access/users/UsersDataTable.tsx index 87cebf7d..b47424ba 100644 --- a/src/app/[orgId]/settings/access/users/UsersDataTable.tsx +++ b/src/app/[orgId]/settings/access/users/UsersDataTable.tsx @@ -39,6 +39,7 @@ export function UsersDataTable({ }: DataTableProps) { const [sorting, setSorting] = useState([]); const [columnFilters, setColumnFilters] = useState([]); + const [globalFilter, setGlobalFilter] = useState([]); const table = useReactTable({ data, @@ -49,6 +50,7 @@ export function UsersDataTable({ getSortedRowModel: getSortedRowModel(), onColumnFiltersChange: setColumnFilters, getFilteredRowModel: getFilteredRowModel(), + onGlobalFilterChange: setGlobalFilter, initialState: { pagination: { pageSize: 20, @@ -57,7 +59,8 @@ export function UsersDataTable({ }, state: { sorting, - columnFilters + columnFilters, + globalFilter } }); @@ -67,15 +70,9 @@ export function UsersDataTable({
- table - .getColumn("email") - ?.setFilterValue(event.target.value) + value={globalFilter ?? ""} + onChange={(e) => + table.setGlobalFilter(String(e.target.value)) } className="w-full pl-8" /> diff --git a/src/app/[orgId]/settings/resources/ResourcesDataTable.tsx b/src/app/[orgId]/settings/resources/ResourcesDataTable.tsx index ffb6bf40..9cc0f79f 100644 --- a/src/app/[orgId]/settings/resources/ResourcesDataTable.tsx +++ b/src/app/[orgId]/settings/resources/ResourcesDataTable.tsx @@ -40,6 +40,7 @@ export function ResourcesDataTable({ }: ResourcesDataTableProps) { const [sorting, setSorting] = useState([]); const [columnFilters, setColumnFilters] = useState([]); + const [globalFilter, setGlobalFilter] = useState([]); const table = useReactTable({ data, @@ -50,6 +51,7 @@ export function ResourcesDataTable({ getSortedRowModel: getSortedRowModel(), onColumnFiltersChange: setColumnFilters, getFilteredRowModel: getFilteredRowModel(), + onGlobalFilterChange: setGlobalFilter, initialState: { pagination: { pageSize: 20, @@ -58,7 +60,8 @@ export function ResourcesDataTable({ }, state: { sorting, - columnFilters + columnFilters, + globalFilter } }); @@ -68,15 +71,9 @@ export function ResourcesDataTable({
- table - .getColumn("name") - ?.setFilterValue(event.target.value) + value={globalFilter ?? ""} + onChange={(e) => + table.setGlobalFilter(String(e.target.value)) } className="w-full pl-8" /> diff --git a/src/app/[orgId]/settings/share-links/ShareLinksDataTable.tsx b/src/app/[orgId]/settings/share-links/ShareLinksDataTable.tsx index 612a1790..ea0cfd91 100644 --- a/src/app/[orgId]/settings/share-links/ShareLinksDataTable.tsx +++ b/src/app/[orgId]/settings/share-links/ShareLinksDataTable.tsx @@ -40,6 +40,7 @@ export function ShareLinksDataTable({ }: ShareLinksDataTableProps) { const [sorting, setSorting] = useState([]); const [columnFilters, setColumnFilters] = useState([]); + const [globalFilter, setGlobalFilter] = useState([]); const table = useReactTable({ data, @@ -50,6 +51,7 @@ export function ShareLinksDataTable({ getSortedRowModel: getSortedRowModel(), onColumnFiltersChange: setColumnFilters, getFilteredRowModel: getFilteredRowModel(), + onGlobalFilterChange: setGlobalFilter, initialState: { pagination: { pageSize: 20, @@ -58,7 +60,8 @@ export function ShareLinksDataTable({ }, state: { sorting, - columnFilters + columnFilters, + globalFilter } }); @@ -68,15 +71,9 @@ export function ShareLinksDataTable({
- table - .getColumn("title") - ?.setFilterValue(event.target.value) + value={globalFilter ?? ""} + onChange={(e) => + table.setGlobalFilter(String(e.target.value)) } className="w-full pl-8" /> diff --git a/src/app/[orgId]/settings/sites/SitesDataTable.tsx b/src/app/[orgId]/settings/sites/SitesDataTable.tsx index a30bab12..ef6909f1 100644 --- a/src/app/[orgId]/settings/sites/SitesDataTable.tsx +++ b/src/app/[orgId]/settings/sites/SitesDataTable.tsx @@ -40,6 +40,7 @@ export function SitesDataTable({ }: DataTableProps) { const [sorting, setSorting] = useState([]); const [columnFilters, setColumnFilters] = useState([]); + const [globalFilter, setGlobalFilter] = useState([]); const table = useReactTable({ data, @@ -50,6 +51,7 @@ export function SitesDataTable({ getSortedRowModel: getSortedRowModel(), onColumnFiltersChange: setColumnFilters, getFilteredRowModel: getFilteredRowModel(), + onGlobalFilterChange: setGlobalFilter, initialState: { pagination: { pageSize: 20, @@ -58,7 +60,8 @@ export function SitesDataTable({ }, state: { sorting, - columnFilters + columnFilters, + globalFilter } }); @@ -68,15 +71,9 @@ export function SitesDataTable({
- table - .getColumn("name") - ?.setFilterValue(event.target.value) + value={globalFilter ?? ""} + onChange={(e) => + table.setGlobalFilter(String(e.target.value)) } className="w-full pl-8" />