mod-arch-shared
Version:
Shared UI components and utilities for modular architecture micro-frontend projects
42 lines • 3.27 kB
JavaScript
import React from 'react';
import { ExclamationCircleIcon, QuestionCircleIcon } from '@patternfly/react-icons';
import { PageSection, Content, EmptyState, EmptyStateVariant, Spinner, EmptyStateBody, PageBreadcrumb, StackItem, Stack, Flex, } from '@patternfly/react-core';
const ApplicationsPage = ({ title, breadcrumb, description, loaded, empty, loadError, children, errorMessage, emptyMessage, emptyStatePage, headerAction, headerContent, provideChildrenPadding, removeChildrenTopPadding, subtext, loadingContent, noHeader, }) => {
const renderHeader = () => (React.createElement(PageSection, { hasBodyWrapper: false },
React.createElement(Stack, { hasGutter: true },
React.createElement(StackItem, null,
React.createElement(Flex, { justifyContent: { default: 'justifyContentSpaceBetween' }, flexWrap: { default: 'nowrap' } },
React.createElement(Content, { className: "pf-m-full-width" },
React.createElement(Content, { component: "h1", "data-testid": "app-page-title" }, title),
React.createElement(Stack, { hasGutter: true },
subtext && React.createElement(StackItem, null, subtext),
description && React.createElement(StackItem, null, description))),
headerAction)),
headerContent && React.createElement(StackItem, null, headerContent))));
const renderContents = () => {
if (loadError) {
return (React.createElement(PageSection, { hasBodyWrapper: false, isFilled: true },
React.createElement(EmptyState, { headingLevel: "h1", icon: ExclamationCircleIcon, titleText: errorMessage !== undefined ? errorMessage : 'Error loading components', variant: EmptyStateVariant.lg, "data-id": "error-empty-state" },
React.createElement(EmptyStateBody, null, loadError.message))));
}
if (!loaded) {
return (loadingContent || (React.createElement(PageSection, { hasBodyWrapper: false, isFilled: true },
React.createElement(EmptyState, { headingLevel: "h1", titleText: "Loading", variant: EmptyStateVariant.lg, "data-id": "loading-empty-state" },
React.createElement(Spinner, { size: "xl" })))));
}
if (empty) {
return !emptyStatePage ? (React.createElement(PageSection, { hasBodyWrapper: false, isFilled: true },
React.createElement(EmptyState, { headingLevel: "h1", icon: QuestionCircleIcon, titleText: emptyMessage !== undefined ? emptyMessage : 'No Components Found', variant: EmptyStateVariant.lg, "data-id": "empty-empty-state" }))) : (emptyStatePage);
}
if (provideChildrenPadding) {
return (React.createElement(PageSection, { hasBodyWrapper: false, isFilled: true, style: removeChildrenTopPadding ? { paddingTop: 0 } : undefined }, children));
}
return children;
};
return (React.createElement(React.Fragment, null,
breadcrumb && React.createElement(PageBreadcrumb, { hasBodyWrapper: false }, breadcrumb),
!noHeader && renderHeader(),
renderContents()));
};
export default ApplicationsPage;
//# sourceMappingURL=ApplicationsPage.js.map