Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-08-08 23:35:31 +02:00
Code Issues Releases Activity

refactor(ui/datatables): allow datatable to globally filter on object value [EE-5824] (#9955)

Browse source
This commit is contained in:
Chaim Lev-Ari 2023-09-04 10:33:07 +01:00 • committed by GitHub
parent 440f4e8dda
commit cb7377ead6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
34 changed files with 271 additions and 186 deletions
Download patch file Download diff file Expand all files Collapse all files

6
app/react/portainer/environments/ListView/EnvironmentsDatatable.tsx
View file

@ -37,8 +37,10 @@ export function EnvironmentsDatatable({
excludeSnapshots: true,
page: page + 1,
pageLimit: tableState.pageSize,
sort: isSortType(tableState.sortBy.id) ? tableState.sortBy.id : undefined,
order: tableState.sortBy.desc ? 'desc' : 'asc',
sort: isSortType(tableState.sortBy?.id)
? tableState.sortBy?.id
: undefined,
order: tableState.sortBy?.desc ? 'desc' : 'asc',
},
{ enabled: groupsQuery.isSuccess, refetchInterval: 30 * 1000 }
);

4
app/react/portainer/environments/environment-groups/components/GroupAssociationTable.tsx
View file

@ -38,8 +38,8 @@ export function GroupAssociationTable({
pageLimit: tableState.pageSize,
page: page + 1,
search: tableState.search,
sort: tableState.sortBy.id as 'Name',
order: tableState.sortBy.desc ? 'desc' : 'asc',
sort: tableState.sortBy?.id as 'Name',
order: tableState.sortBy?.desc ? 'desc' : 'asc',
...query,
});

2
app/react/portainer/environments/queries/useEnvironmentList.ts
View file

@ -14,7 +14,7 @@ export const ENVIRONMENTS_POLLING_INTERVAL = 30000; // in ms
export const SortOptions = ['Name', 'Group', 'Status'] as const;
export type SortType = (typeof SortOptions)[number];
export function isSortType(value: string): value is SortType {
export function isSortType(value?: string): value is SortType {
return SortOptions.includes(value as SortType);
}

4
app/react/portainer/environments/update-schedules/ListView/columns/index.ts
View file

@ -1,4 +1,4 @@
import { buildNameColumn } from '@@/datatables/NameCell';
import { buildNameColumn } from '@@/datatables/buildNameColumn';
import { EdgeUpdateListItemResponse } from '../../queries/list';
@ -9,7 +9,7 @@ import { scheduledTime } from './scheduled-time';
import { scheduleType } from './type';
export const columns = [
buildNameColumn<EdgeUpdateListItemResponse>('name', 'id', '.item'),
buildNameColumn<EdgeUpdateListItemResponse>('name', '.item'),
scheduledTime,
groups,
scheduleType,

4
app/react/portainer/settings/EdgeComputeView/FDOProfilesDatatable/columns/index.tsx
View file

@ -1,10 +1,10 @@
import { Profile } from '@/portainer/hostmanagement/fdo/model';
import { buildNameColumn } from '@@/datatables/NameCell';
import { buildNameColumn } from '@@/datatables/buildNameColumn';
import { created } from './created';
export const columns = [
buildNameColumn<Profile>('name', 'id', 'portainer.endpoints.profile.edit'),
buildNameColumn<Profile>('name', 'portainer.endpoints.profile.edit'),
created,
];

8
app/react/portainer/users/teams/ItemView/TeamAssociationSelector/TeamMembersList/TeamMembersList.tsx
View file

@ -33,7 +33,9 @@ export function TeamMembersList({ users, roles, disabled, teamId }: Props) {
const [search, setSearch] = useState('');
const [pageSize, setPageSize] = useState(10);
const [sortBy, setSortBy] = useState({ id: 'name', desc: false });
const [sortBy, setSortBy] = useState<
{ id: string; desc: boolean } | undefined
>({ id: 'name', desc: false });
const { isAdmin } = useUser();
@ -79,8 +81,8 @@ export function TeamMembersList({ users, roles, disabled, teamId }: Props) {
</RowProvider>
);
function handleSetSort(colId: string, desc: boolean) {
setSortBy({ id: colId, desc });
function handleSetSort(colId: string | undefined, desc: boolean) {
setSortBy(colId ? { id: colId, desc } : undefined);
}
function handleRemoveMembers(userIds: UserId[]) {

8
app/react/portainer/users/teams/ItemView/TeamAssociationSelector/UsersList/UsersList.tsx
View file

@ -25,7 +25,9 @@ export function UsersList({ users, disabled, teamId }: Props) {
const [search, setSearch] = useState('');
const [pageSize, setPageSize] = useState(10);
const addMemberMutation = useAddMemberMutation(teamId);
const [sortBy, setSortBy] = useState({ id: 'name', desc: false });
const [sortBy, setSortBy] = useState<
{ id: string; desc: boolean } | undefined
>({ id: 'name', desc: false });
const { isAdmin } = useUser();
@ -62,8 +64,8 @@ export function UsersList({ users, disabled, teamId }: Props) {
</RowProvider>
);
function handleSetSort(colId: string, desc: boolean) {
setSortBy({ id: colId, desc });
function handleSetSort(colId: string | undefined, desc: boolean) {
setSortBy(colId ? { id: colId, desc } : undefined);
}
function handleAddAllMembers(userIds: UserId[]) {

6
app/react/portainer/users/teams/ListView/TeamsDatatable/TeamsDatatable.tsx
View file

@ -10,14 +10,14 @@ import { deleteTeam } from '@/react/portainer/users/teams/teams.service';
import { confirmDelete } from '@@/modals/confirm';
import { Datatable } from '@@/datatables';
import { Button } from '@@/buttons';
import { buildNameColumn } from '@@/datatables/NameCell';
import { buildNameColumn } from '@@/datatables/buildNameColumn';
import { createPersistedStore } from '@@/datatables/types';
import { useTableState } from '@@/datatables/useTableState';
const storageKey = 'teams';
const columns: ColumnDef<Team>[] = [
buildNameColumn<Team>('Name', 'Id', 'portainer.teams.team'),
buildNameColumn<Team>('Name', 'portainer.teams.team'),
];
interface Props {
@ -25,7 +25,7 @@ interface Props {
isAdmin: boolean;
}
const settingsStore = createPersistedStore(storageKey);
const settingsStore = createPersistedStore(storageKey, 'name');
export function TeamsDatatable({ teams, isAdmin }: Props) {
const { handleRemove } = useRemoveMutation();