Skip to content

Commit 68c1bdc

Browse files
committed
Merge remote-tracking branch 'origin/master' into add/collector-health-status
2 parents 3bbc6b1 + 1004f64 commit 68c1bdc

11 files changed

Lines changed: 51 additions & 83 deletions

File tree

graylog2-web-interface/src/components/inputs/InputsOveriew/ExpandedSectionToggleWrapper.tsx renamed to graylog2-web-interface/src/components/common/EntityDataTable/ExpandedSectionToggleWrapper.tsx

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,24 +15,33 @@
1515
* <http://www.mongodb.com/licensing/server-side-public-license>.
1616
*/
1717
import React from 'react';
18-
import { styled } from 'styled-components';
18+
import { styled, css } from 'styled-components';
1919

2020
import useExpandedSections from 'components/common/EntityDataTable/hooks/useExpandedSections';
2121

22-
const StyledWrapper = styled.div`
23-
cursor: pointer;
24-
`;
22+
const StyledWrapper = styled.div<{ $align?: 'right' }>(
23+
({ $align }) => css`
24+
display: flex;
25+
cursor: pointer;
26+
height: 100%;
27+
width: 100%;
28+
align-items: center;
29+
justify-content: ${$align === 'right' ? 'flex-end' : 'flex-start'};
30+
`,
31+
);
2532

2633
type Props = React.PropsWithChildren<{
2734
id: string;
35+
align?: 'right';
36+
section: string;
2837
}>;
2938

30-
const ExpandedSectionToggleWrapper = ({ id, children = undefined }: Props) => {
39+
const ExpandedSectionToggleWrapper = ({ id, section, align = undefined, children = undefined }: Props) => {
3140
const { toggleSection } = useExpandedSections();
32-
const _toggleSection = () => toggleSection(id, 'configuration');
41+
const _toggleSection = () => toggleSection(id, section);
3342

3443
return (
35-
<StyledWrapper title="show details" onClick={_toggleSection}>
44+
<StyledWrapper title="Show details" onClick={_toggleSection} $align={align}>
3645
{children}
3746
</StyledWrapper>
3847
);

graylog2-web-interface/src/components/common/EntityDataTable/index.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,9 @@
1717
import EntityDataTable from './EntityDataTable';
1818
import MoreActions from './MoreActions';
1919
import type { ColumnRenderers, ColumnSchema } from './types';
20+
import ExpandedSectionToggleWrapper from './ExpandedSectionToggleWrapper';
2021

2122
export { default as useTableEventHandlers } from './hooks/useTableEventHandlers';
2223

23-
export { ColumnRenderers, ColumnSchema, MoreActions };
24+
export { ColumnRenderers, ColumnSchema, MoreActions, ExpandedSectionToggleWrapper };
2425
export default EntityDataTable;

graylog2-web-interface/src/components/common/Icon/Icon.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ const spinAnimation = keyframes`
4141
}
4242
`;
4343

44-
type ColorVariants = 'success' | 'warning';
44+
type ColorVariants = 'success' | 'warning' | 'info';
4545

4646
const StyledSpan = styled.span<{
4747
$size: string;

graylog2-web-interface/src/components/common/MoreActions.tsx

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,11 @@
1515
* <http://www.mongodb.com/licensing/server-side-public-license>.
1616
*/
1717
import * as React from 'react';
18-
import styled from 'styled-components';
1918

2019
import { DropdownButton } from 'components/bootstrap';
21-
import type { StyleProps } from 'components/bootstrap/Button';
2220

23-
import Icon from './Icon';
2421
import type { SizeProp } from './Icon';
22+
import Icon from './Icon';
2523

2624
type MoreActionsIconProps = {
2725
size?: SizeProp;
@@ -31,21 +29,17 @@ export const MoreActionsIcon = ({ size = undefined }: MoreActionsIconProps) => <
3129
type MoreActionsMenuProps = {
3230
'aria-label'?: string;
3331
size?: SizeProp;
34-
bsStyle?: StyleProps;
3532
className?: string;
3633
id?: string;
3734
keepMounted?: boolean;
3835
pullRight?: boolean;
3936
title?: string;
4037
solid?: boolean;
4138
};
42-
const StyledDropdownButton = styled(DropdownButton)<{ $transparent?: boolean }>`
43-
${({ $transparent }) => ($transparent ? 'background-color: transparent;' : '')}
44-
`;
39+
4540
export const MoreActionsMenu = ({
4641
'aria-label': ariaLabel,
4742
size = 'xs',
48-
bsStyle = undefined,
4943
children = undefined,
5044
className = undefined,
5145
id = undefined,
@@ -54,10 +48,9 @@ export const MoreActionsMenu = ({
5448
title = 'More Actions',
5549
solid = false,
5650
}: React.PropsWithChildren<MoreActionsMenuProps>) => (
57-
<StyledDropdownButton
58-
$transparent={!solid}
51+
<DropdownButton
5952
aria-label={ariaLabel}
60-
bsStyle={bsStyle}
53+
bsStyle={solid ? undefined : 'transparent'}
6154
buttonTitle={title}
6255
className={className}
6356
id={id}
@@ -67,5 +60,5 @@ export const MoreActionsMenu = ({
6760
title={<MoreActionsIcon size={size} />}
6861
withinPortal>
6962
{children}
70-
</StyledDropdownButton>
63+
</DropdownButton>
7164
);

graylog2-web-interface/src/components/event-definitions/event-definitions/SchedulingCell.tsx

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -51,8 +51,8 @@ const DetailValue = styled.dd(
5151
`,
5252
);
5353

54-
const DetailsButton = styled(Button)`
55-
padding: 6px 8px;
54+
const DetailsOverlayTrigger = styled(OverlayTrigger)`
55+
vertical-align: bottom;
5656
`;
5757

5858
const getTimeRange = (scheduler: Scheduler) => {
@@ -144,17 +144,15 @@ const SchedulingInfo = ({
144144
return (
145145
<>
146146
{`Runs ${executeEveryFormatted}${searchWithinMessage} `}
147-
<OverlayTrigger
147+
<DetailsOverlayTrigger
148148
trigger="click"
149149
rootClose
150150
placement="left"
151151
title={`${title} details.`}
152152
overlay={detailsPopover(scheduler, clearNotifications)}
153153
width={500}>
154-
<DetailsButton bsStyle="link">
155-
<Icon name="info" />
156-
</DetailsButton>
157-
</OverlayTrigger>
154+
<Icon name="info" title={`${title} details.`} bsStyle={'info'} />
155+
</DetailsOverlayTrigger>
158156
</>
159157
);
160158
};

graylog2-web-interface/src/components/indices/IndexSetFieldTypes/hooks/useCustomColumnRenderers.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,10 @@
1717
import React, { useMemo } from 'react';
1818

1919
import type { FieldTypeOrigin } from 'components/indices/IndexSetFieldTypes/types';
20-
import ExpandedRowToggleWrapper from 'components/indices/IndexSetFieldTypes/originBadges/ExpandedRowToggleWrapper';
2120
import { Icon } from 'components/common';
2221
import useFieldTypesForMappings from 'views/logic/fieldactions/ChangeFieldType/hooks/useFieldTypesForMappings';
2322
import OriginCell from 'components/indices/IndexSetFieldTypes/originBadges/OriginCell';
23+
import { ExpandedSectionToggleWrapper } from 'components/common/EntityDataTable';
2424

2525
const useCustomColumnRenderers = () => {
2626
const {
@@ -35,9 +35,9 @@ const useCustomColumnRenderers = () => {
3535
},
3636
origin: {
3737
renderCell: (origin: FieldTypeOrigin, { id }) => (
38-
<ExpandedRowToggleWrapper id={id}>
38+
<ExpandedSectionToggleWrapper id={id} section="overriddenProfile">
3939
<OriginCell origin={origin} />
40-
</ExpandedRowToggleWrapper>
40+
</ExpandedSectionToggleWrapper>
4141
),
4242
staticWidth: 200,
4343
},

graylog2-web-interface/src/components/indices/IndexSetFieldTypes/originBadges/ExpandedRowToggleWrapper.tsx

Lines changed: 0 additions & 37 deletions
This file was deleted.

graylog2-web-interface/src/components/inputs/InputsOveriew/ColumnRenderers.tsx

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,11 @@
1717
import * as React from 'react';
1818

1919
import type { ColumnRenderers } from 'components/common/EntityDataTable';
20+
import { ExpandedSectionToggleWrapper } from 'components/common/EntityDataTable';
2021
import type { InputSummary } from 'hooks/usePaginatedInputs';
2122
import type { InputTypesSummary } from 'hooks/useInputTypes';
2223
import type { InputStates } from 'hooks/useInputsStates';
23-
import { TypeCell, NodeCell, ThroughputCell, ExpandedSectionToggleWrapper } from 'components/inputs/InputsOveriew';
24+
import { TypeCell, NodeCell, ThroughputCell } from 'components/inputs/InputsOveriew';
2425
import FailuresCell from 'components/inputs/InputsOveriew/cells/FailuresCell';
2526
import MessageCountCell from 'components/inputs/InputsOveriew/cells/MessageCountCell';
2627
import ExtractorCountCell from 'components/inputs/InputsOveriew/cells/ExtractorCountCell';
@@ -30,6 +31,8 @@ import { InputStateBadge } from 'components/inputs';
3031
import Routes from 'routing/Routes';
3132
import { Link } from 'components/common';
3233

34+
const EXPANDED_SECTION = 'configuration';
35+
3336
type Props = {
3437
inputTypes: InputTypesSummary;
3538
inputStates?: InputStates;
@@ -39,7 +42,7 @@ const customColumnRenderers = ({ inputTypes, inputStates }: Props): ColumnRender
3942
attributes: {
4043
title: {
4144
renderCell: (_title: string, input: InputSummary) => (
42-
<ExpandedSectionToggleWrapper id={input.id}>
45+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION}>
4346
<Link to={Routes.SYSTEM.INPUT_DIAGNOSIS(input.id)} title={`show input diagnosis for ${input.title}`}>
4447
{input.title}
4548
</Link>
@@ -49,31 +52,31 @@ const customColumnRenderers = ({ inputTypes, inputStates }: Props): ColumnRender
4952
},
5053
type: {
5154
renderCell: (type: string, input: InputSummary) => (
52-
<ExpandedSectionToggleWrapper id={input.id}>
55+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION}>
5356
<TypeCell type={type} inputTypes={inputTypes} />
5457
</ExpandedSectionToggleWrapper>
5558
),
5659
width: 0.5,
5760
},
5861
desired_state: {
5962
renderCell: (_state: string, input: InputSummary) => (
60-
<ExpandedSectionToggleWrapper id={input.id}>
63+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION}>
6164
<InputStateBadge input={input} inputStates={inputStates} />
6265
</ExpandedSectionToggleWrapper>
6366
),
6467
staticWidth: 130,
6568
},
6669
node_id: {
6770
renderCell: (_type: string, input: InputSummary) => (
68-
<ExpandedSectionToggleWrapper id={input.id}>
71+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION}>
6972
<NodeCell input={input} />
7073
</ExpandedSectionToggleWrapper>
7174
),
7275
staticWidth: 150,
7376
},
7477
traffic: {
7578
renderCell: (_traffic: string, input: InputSummary) => (
76-
<ExpandedSectionToggleWrapper id={input.id}>
79+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION} align="right">
7780
<ThroughputCell input={input} />
7881
</ExpandedSectionToggleWrapper>
7982
),
@@ -82,7 +85,7 @@ const customColumnRenderers = ({ inputTypes, inputStates }: Props): ColumnRender
8285
},
8386
input_failures: {
8487
renderCell: (_failures: string, input: InputSummary) => (
85-
<ExpandedSectionToggleWrapper id={input.id}>
88+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION} align="right">
8689
<FailuresCell input={input} />
8790
</ExpandedSectionToggleWrapper>
8891
),
@@ -91,15 +94,17 @@ const customColumnRenderers = ({ inputTypes, inputStates }: Props): ColumnRender
9194
},
9295
address: {
9396
renderCell: (_address: string, input: InputSummary) => (
94-
<ExpandedSectionToggleWrapper id={input.id}>
97+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION}>
9598
{input.attributes?.bind_address || 'N/A'}
9699
</ExpandedSectionToggleWrapper>
97100
),
98101
staticWidth: 125,
99102
},
100103
port: {
101104
renderCell: (_port: string, input: InputSummary) => (
102-
<ExpandedSectionToggleWrapper id={input.id}>{input.attributes?.port || 'N/A'}</ExpandedSectionToggleWrapper>
105+
<ExpandedSectionToggleWrapper id={input.id} section={EXPANDED_SECTION} align="right">
106+
{input.attributes?.port || 'N/A'}
107+
</ExpandedSectionToggleWrapper>
103108
),
104109
staticWidth: 'matchHeader',
105110
},

graylog2-web-interface/src/components/inputs/InputsOveriew/index.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ export { default as FailuresCell } from './cells/FailuresCell';
2525
export { default as MessageCountCell } from './cells/MessageCountCell';
2626
export { default as ExtractorCountCell } from './cells/ExtractorCountCell';
2727
export { default as AssociatedStreamsCell } from './cells/AssociatedStreamsCell';
28-
export { default as ExpandedSectionToggleWrapper } from './ExpandedSectionToggleWrapper';
2928
export { default as ThroughputSection } from './expanded-sections/ThroughputSection';
3029
export { default as Connections } from './expanded-sections/Connections';
3130
export { default as NetworkIOStats } from './expanded-sections/NetworkIOStats';

graylog2-web-interface/src/views/components/searchbar/saved-search/SearchActionsMenu.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -252,7 +252,7 @@ const SearchActionsMenu = () => {
252252
bsStyle="default"
253253
disabledInfo={isNew && 'Only saved searches can be shared.'}
254254
/>
255-
<MoreActionsMenu aria-label="Open search actions dropdown" id="search-actions-dropdown" pullRight>
255+
<MoreActionsMenu aria-label="Open search actions dropdown" id="search-actions-dropdown" pullRight solid>
256256
<MenuItem onSelect={toggleMetadataEdit} disabled={!isAllowedToEdit} icon="edit">
257257
Edit metadata
258258
</MenuItem>

0 commit comments

Comments
 (0)