Skip to content

Commit ab0ff28

Browse files
committed
Merge branch 'main' into gmurcia/file-explorer-timeout-airgapped
2 parents 23888c9 + 1ce3f26 commit ab0ff28

67 files changed

Lines changed: 2770 additions & 315 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

frontend/src/app/App.tsx

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -125,10 +125,7 @@ const App: React.FC = () => {
125125
</Alert>
126126
</StackItem>
127127
<StackItem>
128-
<Button
129-
variant="secondary"
130-
onClick={() => logout().then(() => window.location.reload())}
131-
>
128+
<Button variant="secondary" onClick={() => logout()}>
132129
Logout
133130
</Button>
134131
</StackItem>

frontend/src/app/HeaderTools.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -60,11 +60,7 @@ const HeaderTools: React.FC<Props> = ({ onNotificationsClick, ...devFeatureFlags
6060

6161
const handleLogout = () => {
6262
setUserMenuOpen(false);
63-
logout().then(() => {
64-
/* eslint-disable-next-line no-console */
65-
console.log('logged out');
66-
window.location.reload();
67-
});
63+
logout();
6864
};
6965

7066
const userMenuItems = [

frontend/src/app/SessionExpiredModal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const SessionExpiredModal: React.FC = () => (
2828
data-testid="modal-login-button"
2929
key="confirm"
3030
variant="primary"
31-
onClick={() => logout().then(() => window.location.reload())}
31+
onClick={() => logout()}
3232
>
3333
Log in
3434
</Button>

frontend/src/app/appUtils.ts

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1-
export const logout = (): Promise<unknown> =>
2-
/* eslint-disable-next-line no-console */
3-
fetch('/oauth2/sign_out').catch((err) => console.error('Error logging out', err));
1+
import { DEV_MODE } from '#~/utilities/const';
2+
3+
export const logout = (): void => {
4+
if (DEV_MODE) {
5+
/* eslint-disable-next-line no-console */
6+
console.log('you have been logged out in dev mode');
7+
window.location.reload();
8+
return;
9+
}
10+
window.location.href = '/oauth2/sign_out';
11+
};

frontend/src/app/useTimeBasedRefresh.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@ const useTimeBasedRefresh = (): SetTime => {
3333
lastDate.setHours(lastDate.getHours() + 1);
3434
if (lastDate < refreshDateMarker) {
3535
setNewDateString(refreshDateMarker.toString());
36-
console.log('Logging out and refreshing');
37-
logout().then(() => window.location.reload());
36+
console.log('Logging out and redirecting');
37+
logout();
3838
} else {
3939
console.error(
4040
`We should have refreshed but it appears the last time we auto-refreshed was less than an hour ago. '${KEY_NAME}' session storage setting can be cleared for this to refresh again within the hour from the last refresh.`,

frontend/src/components/TypeaheadSelect.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,8 @@ export interface TypeaheadSelectProps extends Omit<SelectProps, 'toggle' | 'onSe
9898
dataTestId?: string;
9999
/** Flag to indicate if showing the description under the toggle */
100100
previewDescription?: boolean;
101+
/** Optional icon rendered inside the text input */
102+
inputIcon?: React.ReactNode;
101103
}
102104

103105
const defaultNoOptionsFoundMessage = (filter: string) => `No results found for "${filter}"`;
@@ -127,6 +129,7 @@ const TypeaheadSelect: React.FunctionComponent<TypeaheadSelectProps> = ({
127129
isRequired = true,
128130
previewDescription = true,
129131
dataTestId,
132+
inputIcon,
130133
...props
131134
}: TypeaheadSelectProps) => {
132135
const [isOpen, setIsOpen] = React.useState(false);
@@ -439,9 +442,11 @@ const TypeaheadSelect: React.FunctionComponent<TypeaheadSelectProps> = ({
439442
autoComplete="off"
440443
innerRef={textInputRef}
441444
placeholder={placeholder}
445+
icon={inputIcon}
442446
{...(activeItemId && { 'aria-activedescendant': activeItemId })}
443447
role="combobox"
444448
isExpanded={isOpen}
449+
className="pf-v6-u-w-100"
445450
/>
446451
</FlexItem>
447452
{selected && selected.selectedLabel && <FlexItem>{selected.selectedLabel}</FlexItem>}

frontend/src/concepts/areas/useIsAreaAvailable.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import * as React from 'react';
22
import { AreaContext } from '#~/concepts/areas/AreaContext';
3-
import { IsAreaAvailableStatus, SupportedArea } from './types';
3+
import { IsAreaAvailableStatus, SupportedAreaType } from './types';
44

5-
const useIsAreaAvailable = (area: SupportedArea): IsAreaAvailableStatus =>
5+
const useIsAreaAvailable = (area: SupportedAreaType): IsAreaAvailableStatus =>
66
React.useContext(AreaContext).areasStatus[area] ?? {
77
status: false,
88
devFlags: null,

frontend/src/concepts/design/CollapsibleSection.tsx

Lines changed: 32 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,13 @@
11
import * as React from 'react';
2-
import { Button, Flex, FlexItem, Content, ContentVariants } from '@patternfly/react-core';
2+
import {
3+
Button,
4+
Flex,
5+
FlexItem,
6+
Content,
7+
ContentVariants,
8+
Stack,
9+
StackItem,
10+
} from '@patternfly/react-core';
311
import { AngleDownIcon, AngleRightIcon } from '@patternfly/react-icons';
412

513
interface CollapsibleSectionProps {
@@ -26,45 +34,30 @@ const CollapsibleSection: React.FC<CollapsibleSectionProps> = ({
2634
const titleId = `${localId}-title`;
2735

2836
return (
29-
<>
30-
<Flex
31-
gap={{ default: 'gapMd' }}
32-
alignItems={{ default: 'alignItemsCenter' }}
33-
style={
34-
(open ?? innerOpen) || showChildrenWhenClosed
35-
? {
36-
marginBottom: 'var(--pf-t--global--spacer--md)',
37-
}
38-
: undefined
39-
}
40-
>
41-
<FlexItem>
42-
<Button
43-
icon={open ?? innerOpen ? <AngleDownIcon /> : <AngleRightIcon />}
44-
aria-labelledby={titleId}
45-
aria-expanded={open}
46-
variant="plain"
47-
style={{
48-
paddingLeft: 0,
49-
paddingRight: 0,
50-
fontSize:
51-
titleVariant === ContentVariants.h2
52-
? 'var(--pf-t--global--icon--size--font--heading--h2)'
53-
: 'var(--pf-t--global--icon--size--font--heading--h1)', // Could use icon--size--font--[md|lg|xl] for a smaller icon
54-
}}
55-
onClick={() => (setOpen ? setOpen(!open) : setInnerOpen((prev) => !prev))}
56-
/>
57-
</FlexItem>
58-
<FlexItem>
59-
<Content>
60-
<Content id={titleId} component={titleVariant}>
61-
{title}
37+
<Stack hasGutter>
38+
<StackItem>
39+
<Flex gap={{ default: 'gapMd' }} alignItems={{ default: 'alignItemsCenter' }}>
40+
<FlexItem>
41+
<Button
42+
icon={open ?? innerOpen ? <AngleDownIcon /> : <AngleRightIcon />}
43+
aria-labelledby={titleId}
44+
aria-expanded={open ?? innerOpen}
45+
variant="plain"
46+
className="pf-v6-u-px-0"
47+
onClick={() => (setOpen ? setOpen(!open) : setInnerOpen((prev) => !prev))}
48+
/>
49+
</FlexItem>
50+
<FlexItem>
51+
<Content>
52+
<Content id={titleId} component={titleVariant}>
53+
{title}
54+
</Content>
6255
</Content>
63-
</Content>
64-
</FlexItem>
65-
</Flex>
66-
{(open ?? innerOpen) || showChildrenWhenClosed ? children : null}
67-
</>
56+
</FlexItem>
57+
</Flex>
58+
</StackItem>
59+
{(open ?? innerOpen) || showChildrenWhenClosed ? <StackItem>{children}</StackItem> : null}
60+
</Stack>
6861
);
6962
};
7063

frontend/src/concepts/design/HeaderIcon.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ const HeaderIcon: React.FC<HeaderIconProps> = ({
2525
sectionType,
2626
}) => (
2727
<div
28+
aria-hidden
2829
style={{
2930
display,
3031
width: size,
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import * as React from 'react';
2+
import {
3+
SectionType,
4+
sectionTypeBackgroundColor,
5+
sectionTypeIconColor,
6+
} from '#~/concepts/design/utils';
7+
8+
type SectionIconProps = {
9+
icon: React.ComponentType<{ style?: React.CSSProperties }>;
10+
sectionType: SectionType;
11+
size?: number;
12+
padding?: number;
13+
display?: string;
14+
};
15+
16+
const SectionIcon: React.FC<SectionIconProps> = ({
17+
icon: IconComponent,
18+
sectionType,
19+
size = 40,
20+
padding = 8,
21+
display = 'inline-block',
22+
}) => (
23+
<div
24+
aria-hidden
25+
style={{
26+
display,
27+
width: size,
28+
height: size,
29+
padding,
30+
borderRadius: size / 2,
31+
background: sectionTypeBackgroundColor(sectionType),
32+
color: sectionTypeIconColor(sectionType),
33+
}}
34+
>
35+
<IconComponent style={{ width: size - padding * 2, height: size - padding * 2 }} />
36+
</div>
37+
);
38+
39+
export default SectionIcon;

0 commit comments

Comments
 (0)