diff --git a/src/authz-module/audit-user/index.tsx b/src/authz-module/audit-user/index.tsx
index 7e35616f..e528696e 100644
--- a/src/authz-module/audit-user/index.tsx
+++ b/src/authz-module/audit-user/index.tsx
@@ -250,8 +250,9 @@ const AuditUserPage = () => {
,
]
}
+ showDivider
>
-
+
{
expect(screen.getByRole('button', { name: 'Save' })).toBeInTheDocument();
expect(screen.getByRole('region', { name: 'custom action area' })).toBeInTheDocument();
});
+
+ it('does not render the bottom border by default', () => {
+ render();
+ const band = screen.getByRole('heading', { level: 2 }).closest('.page-band');
+ expect(band).not.toHaveClass('title-border-bottom');
+ });
+
+ it('renders the bottom border when borderBottom is true', () => {
+ render();
+ const band = screen.getByRole('heading', { level: 2 }).closest('.page-band');
+ expect(band).toHaveClass('title-border-bottom');
+ });
});
diff --git a/src/authz-module/components/AuthZTitle.tsx b/src/authz-module/components/AuthZTitle.tsx
index 30fe3cee..34d8cb0a 100644
--- a/src/authz-module/components/AuthZTitle.tsx
+++ b/src/authz-module/components/AuthZTitle.tsx
@@ -26,6 +26,7 @@ export interface AuthZTitleProps {
pageSubtitle?: string | ReactNode;
navLinks?: BreadcrumbLink[];
actions?: (Action | ReactNode)[];
+ showDivider?: boolean;
}
export const ActionButton = ({ label, icon, onClick }: Action) => (
@@ -39,12 +40,12 @@ export const ActionButton = ({ label, icon, onClick }: Action) => (
);
const AuthZTitle = ({
- activeLabel, navLinks = [], pageTitle, pageSubtitle, actions = [],
+ activeLabel, navLinks = [], pageTitle, pageSubtitle, actions = [], showDivider = false,
}: AuthZTitleProps) => {
const shouldRenderBreadcrumb = activeLabel || navLinks?.length > 0;
const isDesktop = useMediaQuery({ minWidth: breakpoints.large.minWidth });
return (
-
+
{ shouldRenderBreadcrumb
&& (