@ansible/ansible-ui-framework 0.0.393 → 0.0.394
Sign up to get free protection for your applications and to get access to all the features.
@@ -153,6 +153,14 @@ function useColumnsToTableCardFn(columns, keyFn) {
|
|
153
153
|
}
|
154
154
|
return pageTableCard;
|
155
155
|
};
|
156
|
-
}, [
|
156
|
+
}, [
|
157
|
+
cardColumns,
|
158
|
+
countColumns,
|
159
|
+
descriptionColumn,
|
160
|
+
labelColumn,
|
161
|
+
nameColumn,
|
162
|
+
subtitleColumn,
|
163
|
+
keyFn,
|
164
|
+
]);
|
157
165
|
}
|
158
166
|
exports.useColumnsToTableCardFn = useColumnsToTableCardFn;
|
@@ -7,7 +7,7 @@
|
|
7
7
|
Each table uses a view using a React hook. The view handles the state for the table. Sorting, filtering, pagination, etc...
|
8
8
|
|
9
9
|
```tsx
|
10
|
-
const view = useView()
|
10
|
+
const view = useView();
|
11
11
|
```
|
12
12
|
|
13
13
|
For different backends, the view can be wrapped to make a specific view hook for the API.
|
@@ -44,7 +44,7 @@ The PageTable component takes in the properties from the view and shows a table
|
|
44
44
|
|
45
45
|
```tsx
|
46
46
|
export function Users() {
|
47
|
-
const view = useMyApiView<IUser>({ url: '/api/users' })
|
47
|
+
const view = useMyApiView<IUser>({ url: '/api/users' });
|
48
48
|
const tableColumns = useMemo<ITableColumn<IUser>[]>(
|
49
49
|
() => [
|
50
50
|
{
|
@@ -54,7 +54,7 @@ export function Users() {
|
|
54
54
|
},
|
55
55
|
],
|
56
56
|
[]
|
57
|
-
)
|
57
|
+
);
|
58
58
|
return (
|
59
59
|
<PageLayout>
|
60
60
|
<PageHeader title="Users" />
|
@@ -62,7 +62,7 @@ export function Users() {
|
|
62
62
|
<PageTable<IUser> tableColumns={tableColumns} {...view} />
|
63
63
|
</PageBody>
|
64
64
|
</PageLayout>
|
65
|
-
)
|
65
|
+
);
|
66
66
|
}
|
67
67
|
```
|
68
68
|
|