@patternfly/react-table 6.3.1-prerelease.20 → 6.3.1-prerelease.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/components/package.json +1 -1
- package/deprecated/package.json +1 -1
- package/dist/dynamic/components/Table/package.json +1 -1
- package/dist/dynamic/components/Table/utils/decorators/package.json +1 -1
- package/dist/dynamic/components/Table/utils/package.json +1 -1
- package/dist/dynamic/deprecated/components/Table/base/package.json +1 -1
- package/dist/dynamic/deprecated/components/Table/package.json +1 -1
- package/dist/dynamic/deprecated/components/package.json +1 -1
- package/dist/umd/assets/{output-vF2-t1Hj.css → output-DBMfvVdR.css} +2040 -2039
- package/package.json +3 -3
- package/src/demos/examples/TableCompact.tsx +36 -39
- package/src/demos/examples/TableEmptyStateDefault.tsx +34 -37
- package/src/demos/examples/TableEmptyStateError.tsx +30 -32
- package/src/demos/examples/TableEmptyStateLoading.tsx +21 -23
- package/src/demos/examples/TableExpandCollapseAll.tsx +48 -50
- package/src/demos/examples/TableSortableResponsive.tsx +77 -80
- package/src/demos/examples/TableStaticBottomPagination.tsx +28 -31
- package/src/demos/examples/TableStickyFirstColumn.tsx +81 -89
- package/src/demos/examples/TableStickyHeader.tsx +32 -34
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@patternfly/react-table",
|
|
3
|
-
"version": "6.3.1-prerelease.
|
|
3
|
+
"version": "6.3.1-prerelease.22",
|
|
4
4
|
"description": "This library provides a set of React table components for use with the PatternFly 4",
|
|
5
5
|
"main": "dist/js/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"subpaths": "node ../../scripts/exportSubpaths.mjs --config subpaths.config.json"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
|
-
"@patternfly/react-core": "^6.3.1-prerelease.
|
|
43
|
+
"@patternfly/react-core": "^6.3.1-prerelease.20",
|
|
44
44
|
"@patternfly/react-icons": "^6.3.1-prerelease.1",
|
|
45
45
|
"@patternfly/react-styles": "^6.3.1-prerelease.1",
|
|
46
46
|
"@patternfly/react-tokens": "^6.3.1-prerelease.1",
|
|
@@ -51,5 +51,5 @@
|
|
|
51
51
|
"react": "^17 || ^18 || ^19",
|
|
52
52
|
"react-dom": "^17 || ^18 || ^19"
|
|
53
53
|
},
|
|
54
|
-
"gitHead": "
|
|
54
|
+
"gitHead": "0c3218ffa84a0359f3b6242c118d1620b30278c9"
|
|
55
55
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { Fragment, useState } from 'react';
|
|
2
2
|
import {
|
|
3
3
|
Button,
|
|
4
|
-
Card,
|
|
5
4
|
MenuToggle,
|
|
6
5
|
MenuToggleElement,
|
|
7
6
|
Pagination,
|
|
@@ -130,45 +129,43 @@ export const TableCompact: React.FunctionComponent = () => {
|
|
|
130
129
|
<Fragment>
|
|
131
130
|
<DashboardWrapper hasPageTemplateTitle>
|
|
132
131
|
<PageSection isFilled aria-label="Compact table data">
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
<
|
|
136
|
-
<
|
|
137
|
-
<
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
132
|
+
{tableToolbar}
|
|
133
|
+
<Table variant="compact" aria-label="Compact Table">
|
|
134
|
+
<Thead>
|
|
135
|
+
<Tr>
|
|
136
|
+
<Th key={0}>{columns[0]}</Th>
|
|
137
|
+
<Th key={1}>{columns[1]}</Th>
|
|
138
|
+
<Th key={2}>{columns[2]}</Th>
|
|
139
|
+
<Th key={3}>{columns[3]}</Th>
|
|
140
|
+
<Th key={4}>{columns[4]}</Th>
|
|
141
|
+
<Th key={5}>{columns[5]}</Th>
|
|
142
|
+
<Th key={6}>{columns[6]}</Th>
|
|
143
|
+
<Th key={7} width={10}>
|
|
144
|
+
{columns[7]}
|
|
145
|
+
</Th>
|
|
146
|
+
</Tr>
|
|
147
|
+
</Thead>
|
|
148
|
+
<Tbody>
|
|
149
|
+
{paginatedRows.map((row, rowIndex) => (
|
|
150
|
+
<Tr key={rowIndex}>
|
|
151
|
+
<>
|
|
152
|
+
<Td dataLabel={columns[0]}>{row.name}</Td>
|
|
153
|
+
<Td dataLabel={columns[1]}>{row.threads}</Td>
|
|
154
|
+
<Td dataLabel={columns[2]}>{row.applications}</Td>
|
|
155
|
+
<Td dataLabel={columns[3]}>{row.workspaces}</Td>
|
|
156
|
+
<Td dataLabel={columns[4]}>{renderLabel(row.status)}</Td>
|
|
157
|
+
<Td dataLabel={columns[5]}>{row.location}</Td>
|
|
158
|
+
<Td dataLabel={columns[6]}>{row.lastModified}</Td>
|
|
159
|
+
<Td dataLabel={columns[7]} modifier="truncate">
|
|
160
|
+
<TableText>
|
|
161
|
+
<a href="#">{row.url}</a>
|
|
162
|
+
</TableText>
|
|
163
|
+
</Td>
|
|
164
|
+
</>
|
|
148
165
|
</Tr>
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
<Tr key={rowIndex}>
|
|
153
|
-
<>
|
|
154
|
-
<Td dataLabel={columns[0]}>{row.name}</Td>
|
|
155
|
-
<Td dataLabel={columns[1]}>{row.threads}</Td>
|
|
156
|
-
<Td dataLabel={columns[2]}>{row.applications}</Td>
|
|
157
|
-
<Td dataLabel={columns[3]}>{row.workspaces}</Td>
|
|
158
|
-
<Td dataLabel={columns[4]}>{renderLabel(row.status)}</Td>
|
|
159
|
-
<Td dataLabel={columns[5]}>{row.location}</Td>
|
|
160
|
-
<Td dataLabel={columns[6]}>{row.lastModified}</Td>
|
|
161
|
-
<Td dataLabel={columns[7]} modifier="truncate">
|
|
162
|
-
<TableText>
|
|
163
|
-
<a href="#">{row.url}</a>
|
|
164
|
-
</TableText>
|
|
165
|
-
</Td>
|
|
166
|
-
</>
|
|
167
|
-
</Tr>
|
|
168
|
-
))}
|
|
169
|
-
</Tbody>
|
|
170
|
-
</Table>
|
|
171
|
-
</Card>
|
|
166
|
+
))}
|
|
167
|
+
</Tbody>
|
|
168
|
+
</Table>
|
|
172
169
|
</PageSection>
|
|
173
170
|
</DashboardWrapper>
|
|
174
171
|
</Fragment>
|
|
@@ -2,7 +2,6 @@ import { Table, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
|
|
|
2
2
|
import {
|
|
3
3
|
Bullseye,
|
|
4
4
|
Button,
|
|
5
|
-
Card,
|
|
6
5
|
EmptyState,
|
|
7
6
|
EmptyStateVariant,
|
|
8
7
|
EmptyStateBody,
|
|
@@ -16,42 +15,40 @@ import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/Dashboa
|
|
|
16
15
|
export const TableEmptyStateDefault: React.FunctionComponent = () => (
|
|
17
16
|
<DashboardWrapper hasPageTemplateTitle>
|
|
18
17
|
<PageSection padding={{ default: 'noPadding', xl: 'padding' }} aria-label="Empty state table data">
|
|
19
|
-
<
|
|
20
|
-
<
|
|
21
|
-
<
|
|
22
|
-
<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
<
|
|
31
|
-
<
|
|
32
|
-
<
|
|
33
|
-
<
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
>
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
<
|
|
44
|
-
<
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
</Table>
|
|
54
|
-
</Card>
|
|
18
|
+
<Table aria-label="Empty state table">
|
|
19
|
+
<Thead>
|
|
20
|
+
<Tr>
|
|
21
|
+
<Th>Repositories</Th>
|
|
22
|
+
<Th>Branches</Th>
|
|
23
|
+
<Th>Pull requests</Th>
|
|
24
|
+
<Th>Workspaces</Th>
|
|
25
|
+
<Th>Last commit</Th>
|
|
26
|
+
</Tr>
|
|
27
|
+
</Thead>
|
|
28
|
+
<Tbody>
|
|
29
|
+
<Tr>
|
|
30
|
+
<Td colSpan={8}>
|
|
31
|
+
<Bullseye>
|
|
32
|
+
<EmptyState
|
|
33
|
+
titleText="No results found"
|
|
34
|
+
icon={SearchIcon}
|
|
35
|
+
headingLevel="h2"
|
|
36
|
+
variant={EmptyStateVariant.sm}
|
|
37
|
+
>
|
|
38
|
+
<EmptyStateBody>
|
|
39
|
+
No results match this filter criteria. Clear all filters and try again.
|
|
40
|
+
</EmptyStateBody>
|
|
41
|
+
<EmptyStateFooter>
|
|
42
|
+
<EmptyStateActions>
|
|
43
|
+
<Button variant="link">Clear all filters</Button>
|
|
44
|
+
</EmptyStateActions>
|
|
45
|
+
</EmptyStateFooter>
|
|
46
|
+
</EmptyState>
|
|
47
|
+
</Bullseye>
|
|
48
|
+
</Td>
|
|
49
|
+
</Tr>
|
|
50
|
+
</Tbody>
|
|
51
|
+
</Table>
|
|
55
52
|
</PageSection>
|
|
56
53
|
</DashboardWrapper>
|
|
57
54
|
);
|
|
@@ -1,42 +1,40 @@
|
|
|
1
1
|
import { Table, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
|
|
2
|
-
import { Bullseye,
|
|
2
|
+
import { Bullseye, EmptyState, EmptyStateVariant, EmptyStateBody, PageSection } from '@patternfly/react-core';
|
|
3
3
|
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
|
|
4
4
|
import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
|
|
5
5
|
|
|
6
6
|
export const TableEmptyStateError: React.FunctionComponent = () => (
|
|
7
7
|
<DashboardWrapper hasPageTemplateTitle>
|
|
8
8
|
<PageSection padding={{ default: 'noPadding', xl: 'padding' }} aria-label="Empty state table with error">
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
<
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<
|
|
21
|
-
<
|
|
22
|
-
<
|
|
23
|
-
<
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
>
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
</Table>
|
|
39
|
-
</Card>
|
|
9
|
+
<Table aria-label="Loading table demo">
|
|
10
|
+
<Thead>
|
|
11
|
+
<Tr>
|
|
12
|
+
<Th>Repositories</Th>
|
|
13
|
+
<Th>Branches</Th>
|
|
14
|
+
<Th>Pull requests</Th>
|
|
15
|
+
<Th>Workspaces</Th>
|
|
16
|
+
<Th>Last commit</Th>
|
|
17
|
+
</Tr>
|
|
18
|
+
</Thead>
|
|
19
|
+
<Tbody>
|
|
20
|
+
<Tr>
|
|
21
|
+
<Td colSpan={8}>
|
|
22
|
+
<Bullseye>
|
|
23
|
+
<EmptyState
|
|
24
|
+
icon={ExclamationCircleIcon}
|
|
25
|
+
titleText="Unable to connect"
|
|
26
|
+
headingLevel="h2"
|
|
27
|
+
variant={EmptyStateVariant.sm}
|
|
28
|
+
>
|
|
29
|
+
<EmptyStateBody>
|
|
30
|
+
There was an error retrieving data. Check your connection and reload the page.
|
|
31
|
+
</EmptyStateBody>
|
|
32
|
+
</EmptyState>
|
|
33
|
+
</Bullseye>
|
|
34
|
+
</Td>
|
|
35
|
+
</Tr>
|
|
36
|
+
</Tbody>
|
|
37
|
+
</Table>
|
|
40
38
|
</PageSection>
|
|
41
39
|
</DashboardWrapper>
|
|
42
40
|
);
|
|
@@ -1,32 +1,30 @@
|
|
|
1
1
|
import { Table, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
|
|
2
|
-
import { Bullseye,
|
|
2
|
+
import { Bullseye, EmptyState, PageSection, Spinner } from '@patternfly/react-core';
|
|
3
3
|
import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
|
|
4
4
|
|
|
5
5
|
export const TableEmptyStateLoading: React.FunctionComponent = () => (
|
|
6
6
|
<DashboardWrapper hasPageTemplateTitle>
|
|
7
7
|
<PageSection padding={{ default: 'noPadding', xl: 'padding' }} aria-label="Empty state table loading">
|
|
8
|
-
<
|
|
9
|
-
<
|
|
10
|
-
<
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
<
|
|
20
|
-
<
|
|
21
|
-
<
|
|
22
|
-
<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
</Table>
|
|
29
|
-
</Card>
|
|
8
|
+
<Table aria-label="Loading table demo">
|
|
9
|
+
<Thead>
|
|
10
|
+
<Tr>
|
|
11
|
+
<Th>Repositories</Th>
|
|
12
|
+
<Th>Branches</Th>
|
|
13
|
+
<Th>Pull requests</Th>
|
|
14
|
+
<Th>Workspaces</Th>
|
|
15
|
+
<Th>Last commit</Th>
|
|
16
|
+
</Tr>
|
|
17
|
+
</Thead>
|
|
18
|
+
<Tbody>
|
|
19
|
+
<Tr>
|
|
20
|
+
<Td colSpan={8}>
|
|
21
|
+
<Bullseye>
|
|
22
|
+
<EmptyState titleText="Loading" icon={Spinner} headingLevel="h2" />
|
|
23
|
+
</Bullseye>
|
|
24
|
+
</Td>
|
|
25
|
+
</Tr>
|
|
26
|
+
</Tbody>
|
|
27
|
+
</Table>
|
|
30
28
|
</PageSection>
|
|
31
29
|
</DashboardWrapper>
|
|
32
30
|
);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Fragment, ReactNode, useEffect, useState } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Content, Label, PageSection } from '@patternfly/react-core';
|
|
3
3
|
import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
|
|
4
4
|
import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
|
|
5
5
|
|
|
@@ -155,56 +155,54 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
|
|
|
155
155
|
}}
|
|
156
156
|
aria-label="Collapsible table data"
|
|
157
157
|
>
|
|
158
|
-
<
|
|
159
|
-
<
|
|
160
|
-
<
|
|
161
|
-
<
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
{
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
</Thead>
|
|
158
|
+
<Table isExpandable hasAnimations aria-label="Collapsible table">
|
|
159
|
+
<Thead>
|
|
160
|
+
<Tr>
|
|
161
|
+
<Th
|
|
162
|
+
expand={{
|
|
163
|
+
areAllExpanded: !areAllExpanded,
|
|
164
|
+
collapseAllAriaLabel,
|
|
165
|
+
onToggle: onCollapseAll
|
|
166
|
+
}}
|
|
167
|
+
aria-label="Row expansion"
|
|
168
|
+
/>
|
|
169
|
+
{expandableColumns.map((column) => (
|
|
170
|
+
<Th key={column}>{column}</Th>
|
|
171
|
+
))}
|
|
172
|
+
</Tr>
|
|
173
|
+
</Thead>
|
|
175
174
|
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
</Card>
|
|
175
|
+
{serverData.map((server, serverIndex) => (
|
|
176
|
+
<Tbody key={server.name} isExpanded={isServerExpanded(server)}>
|
|
177
|
+
<Tr isContentExpanded={isServerExpanded(server)}>
|
|
178
|
+
<Td
|
|
179
|
+
expand={
|
|
180
|
+
server.details
|
|
181
|
+
? {
|
|
182
|
+
rowIndex: serverIndex,
|
|
183
|
+
isExpanded: isServerExpanded(server),
|
|
184
|
+
onToggle: () => setServerExpanded(server, !isServerExpanded(server))
|
|
185
|
+
}
|
|
186
|
+
: undefined
|
|
187
|
+
}
|
|
188
|
+
>
|
|
189
|
+
<ExpandableRowContent>{server.details}</ExpandableRowContent>
|
|
190
|
+
</Td>
|
|
191
|
+
<Td>{server?.name}</Td>
|
|
192
|
+
<Td>{server?.threads}</Td>
|
|
193
|
+
<Td>{server?.applications}</Td>
|
|
194
|
+
<Td>{server?.workspaces}</Td>
|
|
195
|
+
<Td>{server?.status?.title}</Td>
|
|
196
|
+
</Tr>
|
|
197
|
+
<Tr isExpanded={isServerExpanded(server)}>
|
|
198
|
+
<Td></Td>
|
|
199
|
+
<Td colSpan={expandableColumns.length}>
|
|
200
|
+
<ExpandableRowContent>{server?.details}</ExpandableRowContent>
|
|
201
|
+
</Td>
|
|
202
|
+
</Tr>
|
|
203
|
+
</Tbody>
|
|
204
|
+
))}
|
|
205
|
+
</Table>
|
|
208
206
|
</PageSection>
|
|
209
207
|
</DashboardWrapper>
|
|
210
208
|
</Fragment>
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { Fragment, useEffect, useState } from 'react';
|
|
2
2
|
import {
|
|
3
3
|
Button,
|
|
4
|
-
Card,
|
|
5
4
|
Content,
|
|
6
5
|
Dropdown,
|
|
7
6
|
DropdownList,
|
|
@@ -245,86 +244,84 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
|
|
|
245
244
|
}}
|
|
246
245
|
aria-label="Sortable table data"
|
|
247
246
|
>
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
<
|
|
251
|
-
<
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
247
|
+
{tableToolbar}
|
|
248
|
+
<Table aria-label="Sortable Table">
|
|
249
|
+
<Thead>
|
|
250
|
+
<Tr>
|
|
251
|
+
{columns.map((column, columnIndex) => {
|
|
252
|
+
const sortParams = {
|
|
253
|
+
sort: {
|
|
254
|
+
sortBy: {
|
|
255
|
+
index: activeSortIndex,
|
|
256
|
+
direction: activeSortDirection
|
|
257
|
+
},
|
|
258
|
+
onSort,
|
|
259
|
+
columnIndex
|
|
260
|
+
}
|
|
261
|
+
};
|
|
262
|
+
return (
|
|
263
|
+
<Th modifier={columnIndex !== 6 ? 'wrap' : undefined} key={columnIndex} {...sortParams}>
|
|
264
|
+
{column}
|
|
265
|
+
</Th>
|
|
266
|
+
);
|
|
267
|
+
})}
|
|
268
|
+
</Tr>
|
|
269
|
+
</Thead>
|
|
270
|
+
<Tbody>
|
|
271
|
+
{sortedRows.map((row, rowIndex) => (
|
|
272
|
+
<Tr key={rowIndex}>
|
|
273
|
+
<>
|
|
274
|
+
<Td dataLabel={columns[0]} width={15}>
|
|
275
|
+
<div>{row.name}</div>
|
|
276
|
+
</Td>
|
|
277
|
+
<Td dataLabel={columns[1]} width={10}>
|
|
278
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
279
|
+
<FlexItem>
|
|
280
|
+
<CodeBranchIcon key="icon" />
|
|
281
|
+
</FlexItem>
|
|
282
|
+
<FlexItem>{row.threads}</FlexItem>
|
|
283
|
+
</Flex>
|
|
284
|
+
</Td>
|
|
285
|
+
<Td dataLabel={columns[2]} width={10}>
|
|
286
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
287
|
+
<FlexItem>
|
|
288
|
+
<CodeIcon key="icon" />
|
|
289
|
+
</FlexItem>
|
|
290
|
+
<FlexItem>{row.applications}</FlexItem>
|
|
291
|
+
</Flex>
|
|
292
|
+
</Td>
|
|
293
|
+
<Td dataLabel={columns[3]} width={10}>
|
|
294
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
295
|
+
<FlexItem>
|
|
296
|
+
<CubeIcon key="icon" />
|
|
297
|
+
</FlexItem>
|
|
298
|
+
<FlexItem>{row.workspaces}</FlexItem>
|
|
299
|
+
</Flex>
|
|
300
|
+
</Td>
|
|
301
|
+
<Td dataLabel={columns[4]} width={15}>
|
|
302
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
303
|
+
<FlexItem>{renderLabel(row.status)}</FlexItem>
|
|
304
|
+
</Flex>
|
|
305
|
+
</Td>
|
|
306
|
+
<Td dataLabel={columns[5]} width={10}>
|
|
307
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
308
|
+
<FlexItem>{row.location}</FlexItem>
|
|
309
|
+
</Flex>
|
|
310
|
+
</Td>
|
|
311
|
+
<Td dataLabel={columns[6]} width={10}>
|
|
312
|
+
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
313
|
+
<FlexItem>{row.lastModified[0]} days ago</FlexItem>
|
|
314
|
+
</Flex>
|
|
315
|
+
</Td>
|
|
316
|
+
<Td dataLabel={columns[7]} modifier="truncate">
|
|
317
|
+
<a href="#">{row.url}</a>
|
|
318
|
+
</Td>
|
|
319
|
+
</>
|
|
270
320
|
</Tr>
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
<>
|
|
276
|
-
<Td dataLabel={columns[0]} width={15}>
|
|
277
|
-
<div>{row.name}</div>
|
|
278
|
-
</Td>
|
|
279
|
-
<Td dataLabel={columns[1]} width={10}>
|
|
280
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
281
|
-
<FlexItem>
|
|
282
|
-
<CodeBranchIcon key="icon" />
|
|
283
|
-
</FlexItem>
|
|
284
|
-
<FlexItem>{row.threads}</FlexItem>
|
|
285
|
-
</Flex>
|
|
286
|
-
</Td>
|
|
287
|
-
<Td dataLabel={columns[2]} width={10}>
|
|
288
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
289
|
-
<FlexItem>
|
|
290
|
-
<CodeIcon key="icon" />
|
|
291
|
-
</FlexItem>
|
|
292
|
-
<FlexItem>{row.applications}</FlexItem>
|
|
293
|
-
</Flex>
|
|
294
|
-
</Td>
|
|
295
|
-
<Td dataLabel={columns[3]} width={10}>
|
|
296
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
297
|
-
<FlexItem>
|
|
298
|
-
<CubeIcon key="icon" />
|
|
299
|
-
</FlexItem>
|
|
300
|
-
<FlexItem>{row.workspaces}</FlexItem>
|
|
301
|
-
</Flex>
|
|
302
|
-
</Td>
|
|
303
|
-
<Td dataLabel={columns[4]} width={15}>
|
|
304
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
305
|
-
<FlexItem>{renderLabel(row.status)}</FlexItem>
|
|
306
|
-
</Flex>
|
|
307
|
-
</Td>
|
|
308
|
-
<Td dataLabel={columns[5]} width={10}>
|
|
309
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
310
|
-
<FlexItem>{row.location}</FlexItem>
|
|
311
|
-
</Flex>
|
|
312
|
-
</Td>
|
|
313
|
-
<Td dataLabel={columns[6]} width={10}>
|
|
314
|
-
<Flex spaceItems={{ default: 'spaceItemsSm' }}>
|
|
315
|
-
<FlexItem>{row.lastModified[0]} days ago</FlexItem>
|
|
316
|
-
</Flex>
|
|
317
|
-
</Td>
|
|
318
|
-
<Td dataLabel={columns[7]} modifier="truncate">
|
|
319
|
-
<a href="#">{row.url}</a>
|
|
320
|
-
</Td>
|
|
321
|
-
</>
|
|
322
|
-
</Tr>
|
|
323
|
-
))}
|
|
324
|
-
</Tbody>
|
|
325
|
-
</Table>
|
|
326
|
-
{renderPagination('bottom', false)}
|
|
327
|
-
</Card>
|
|
321
|
+
))}
|
|
322
|
+
</Tbody>
|
|
323
|
+
</Table>
|
|
324
|
+
{renderPagination('bottom', false)}
|
|
328
325
|
</PageSection>
|
|
329
326
|
</DashboardWrapper>
|
|
330
327
|
</Fragment>
|