Skip to content

Commit

Permalink
🐛 Trackers: add noDataEmptyState (#1084)
Browse files Browse the repository at this point in the history
  • Loading branch information
gildub authored Jul 6, 2023
1 parent 904efd3 commit b60df11
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 12 deletions.
37 changes: 26 additions & 11 deletions client/src/app/pages/external/jira/trackers.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,15 @@ import * as React from "react";
import {
Button,
ButtonVariant,
EmptyState,
EmptyStateBody,
EmptyStateIcon,
Modal,
PageSection,
PageSectionVariants,
Text,
TextContent,
Title,
Toolbar,
ToolbarContent,
ToolbarGroup,
Expand All @@ -18,7 +22,6 @@ import {
AppTableActionButtons,
ConditionalRender,
ConfirmDialog,
ToolbarBulkSelector,
} from "@app/shared/components";
import {
FilterToolbar,
Expand All @@ -36,6 +39,7 @@ import {
Th,
TableComposable,
} from "@patternfly/react-table";
import CubesIcon from "@patternfly/react-icons/dist/esm/icons/cubes-icon";

import { useLocalTableControls } from "@app/shared/hooks/table-controls";
import { SimplePagination } from "@app/shared/components/simple-pagination";
Expand Down Expand Up @@ -108,7 +112,6 @@ export const JiraTrackers: React.FC = () => {
kind: `${t("terms.instance")} type`,
connection: "Connection",
},
isSelectable: true,
filterCategories: [
{
key: "name",
Expand All @@ -134,10 +137,8 @@ export const JiraTrackers: React.FC = () => {
const {
currentPageItems,
numRenderedColumns,
selectionState: { selectedItems },
propHelpers: {
toolbarProps,
toolbarBulkSelectorProps,
filterToolbarProps,
paginationToolbarItemProps,
paginationProps,
Expand Down Expand Up @@ -166,7 +167,6 @@ export const JiraTrackers: React.FC = () => {
>
<Toolbar {...toolbarProps}>
<ToolbarContent>
<ToolbarBulkSelector {...toolbarBulkSelectorProps} />
<FilterToolbar {...filterToolbarProps} />
<ToolbarGroup variant="button-group">
{/* <RBAC
Expand Down Expand Up @@ -218,12 +218,27 @@ export const JiraTrackers: React.FC = () => {
<ConditionalTableBody
isLoading={isFetching}
isError={!!fetchError}
isNoData={trackers.length === 0}
isNoData={currentPageItems.length === 0}
noDataEmptyState={
<EmptyState variant="small">
<EmptyStateIcon icon={CubesIcon} />
<Title headingLevel="h2" size="lg">
{t("composed.noDataStateTitle", {
what: t("terms.jiraConfig").toLowerCase(),
})}
</Title>
<EmptyStateBody>
{t("composed.noDataStateBody", {
what: t("terms.jiraConfig").toLowerCase(),
})}
</EmptyStateBody>
</EmptyState>
}
numRenderedColumns={numRenderedColumns}
>
<Tbody>
{currentPageItems?.map((tracker, rowIndex) => (
<Tr key={tracker.name}>
{currentPageItems?.map((tracker, rowIndex) => (
<Tbody key={tracker.name}>
<Tr>
<TableRowContentWithControls
{...tableControls}
item={tracker}
Expand Down Expand Up @@ -268,8 +283,8 @@ export const JiraTrackers: React.FC = () => {
</Td>
</TableRowContentWithControls>
</Tr>
))}
</Tbody>
</Tbody>
))}
</ConditionalTableBody>
</TableComposable>
</div>
Expand Down
18 changes: 17 additions & 1 deletion client/src/app/pages/migration-waves/migration-waves.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,16 @@ import {
Button,
ButtonVariant,
DropdownItem,
EmptyState,
EmptyStateBody,
EmptyStateIcon,
Modal,
ModalVariant,
PageSection,
PageSectionVariants,
Text,
TextContent,
Title,
Toolbar,
ToolbarContent,
ToolbarGroup,
Expand All @@ -17,6 +21,7 @@ import {
import { useTranslation } from "react-i18next";
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import CubesIcon from "@patternfly/react-icons/dist/esm/icons/cubes-icon";

import {
useDeleteAllMigrationWavesMutation,
Expand Down Expand Up @@ -325,7 +330,18 @@ export const MigrationWaves: React.FC = () => {
<ConditionalTableBody
isLoading={isFetching}
isError={!!fetchError}
isNoData={migrationWaves.length === 0}
isNoData={currentPageItems.length === 0}
noDataEmptyState={
<EmptyState variant="small">
<EmptyStateIcon icon={CubesIcon} />
<Title headingLevel="h2" size="lg">
No migration waves available
</Title>
<EmptyStateBody>
Use the filter menu above to select your migration wave.
</EmptyStateBody>
</EmptyState>
}
numRenderedColumns={numRenderedColumns}
>
{currentPageItems?.map((migrationWave, rowIndex) => {
Expand Down

0 comments on commit b60df11

Please sign in to comment.