Skip to content

Commit

Permalink
Fix Storybook crashes, simplify stories to make them more readable
Browse files Browse the repository at this point in the history
  • Loading branch information
@nikitaindik
nikitaindik committed Dec 11, 2024
1 parent c423e3e commit aa4a6f2
Show file tree
Hide file tree
Showing 38 changed files with 307 additions and 1,136 deletions.
51 changes: 22 additions & 29 deletions ...ails/three_way_diff/final_readonly/fields/alert_suppression/alert_suppression.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,7 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { AlertSuppressionReadOnly } from './alert_suppression';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { mockCustomQueryRule } from '../../storybook/mocks';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';

export default {
Expand All @@ -19,29 +15,26 @@ export default {
'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/alert_suppression',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
}
export const OtherRuleTypes = () => (
<ThreeWayDiffStorybookProviders>
<AlertSuppressionReadOnly
ruleType="query"
alertSuppression={{
group_by: ['host.name'],
duration: { value: 5, unit: 'm' },
missing_fields_strategy: 'suppress',
}}
/>
</ThreeWayDiffStorybookProviders>
);

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
finalDiffableRule={args.finalDiffableRule}
fieldName="alert_suppression"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const Default = Template.bind({});

Default.args = {
finalDiffableRule: mockCustomQueryRule({
alert_suppression: {
group_by: ['host.name'],
duration: { value: 5, unit: 'm' },
missing_fields_strategy: 'suppress',
},
}),
};
export const Threshold = () => (
<ThreeWayDiffStorybookProviders>
<AlertSuppressionReadOnly
ruleType="threshold"
alertSuppression={{
duration: { value: 5, unit: 'm' },
}}
/>
</ThreeWayDiffStorybookProviders>
);
28 changes: 1 addition & 27 deletions ...ails/three_way_diff/final_readonly/fields/anomaly_threshold/anomaly_threshold.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,12 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { AnomalyThresholdReadOnly } from './anomaly_threshold';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { mockMachineLearningRule } from '../../storybook/mocks';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';

export default {
component: AnomalyThresholdReadOnly,
title:
'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/anomaly_threshold',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
}

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
finalDiffableRule={args.finalDiffableRule}
fieldName="anomaly_threshold"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const Default = Template.bind({});

Default.args = {
finalDiffableRule: mockMachineLearningRule({
anomaly_threshold: 50,
}),
};
export const Default = () => <AnomalyThresholdReadOnly anomalyThreshold={50} />;
30 changes: 2 additions & 28 deletions ...le_details/three_way_diff/final_readonly/fields/building_block/building_block.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,39 +6,13 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { BuildingBlockReadOnly } from './building_block';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { mockCustomQueryRule } from '../../storybook/mocks';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';

export default {
component: BuildingBlockReadOnly,
title: 'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/building_block',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
}
export const Default = () => <BuildingBlockReadOnly buildingBlock={{ type: 'default' }} />;

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
finalDiffableRule={args.finalDiffableRule}
fieldName="building_block"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const Default = Template.bind({});

Default.args = {
finalDiffableRule: mockCustomQueryRule({
building_block: {
type: 'default',
},
}),
};
export const NoValue = () => <BuildingBlockReadOnly />;
61 changes: 18 additions & 43 deletions ...nts/rule_details/three_way_diff/final_readonly/fields/data_source/data_source.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,58 +6,33 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';
import {
dataSourceWithDataView,
dataSourceWithIndexPatterns,
mockDataView,
mockCustomQueryRule,
} from '../../storybook/mocks';
import { DataSourceReadOnly } from './data_source';

export default {
component: FieldFinalReadOnly,
component: DataSourceReadOnly,
title: 'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/data_source',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
kibanaServicesOverrides?: Record<string, unknown>;
}

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
kibanaServicesOverrides={args.kibanaServicesOverrides}
finalDiffableRule={args.finalDiffableRule}
fieldName="data_source"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const DataSourceWithIndexPatterns = Template.bind({});

DataSourceWithIndexPatterns.args = {
finalDiffableRule: mockCustomQueryRule({
data_source: dataSourceWithIndexPatterns,
}),
};

export const DataSourceWithDataView = Template.bind({});

DataSourceWithDataView.args = {
finalDiffableRule: mockCustomQueryRule({
data_source: dataSourceWithDataView,
}),
kibanaServicesOverrides: {
data: {
dataViews: {
get: async () => mockDataView(),
export const DataSourceWithIndexPatterns = () => (
<DataSourceReadOnly dataSource={dataSourceWithIndexPatterns} />
);

export const DataSourceWithDataView = () => (
<ThreeWayDiffStorybookProviders
kibanaServicesOverrides={{
data: {
dataViews: {
get: async () => mockDataView(),
},
},
},
},
};
}}
>
<DataSourceReadOnly dataSource={dataSourceWithDataView} />
</ThreeWayDiffStorybookProviders>
);
31 changes: 3 additions & 28 deletions ...nts/rule_details/three_way_diff/final_readonly/fields/description/description.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,13 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { DescriptionReadOnly } from './description';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { mockCustomQueryRule } from '../../storybook/mocks';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';

export default {
component: DescriptionReadOnly,
title: 'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/description',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
}

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
finalDiffableRule={args.finalDiffableRule}
fieldName="description"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const Default = Template.bind({});

Default.args = {
finalDiffableRule: mockCustomQueryRule({
description:
"Identifies the occurrence of a security alert from the Google Workspace alerts center. Google Workspace's security alert center provides an overview of actionable alerts that may be affecting an organization's domain. An alert is a warning of a potential security issue that Google has detected.",
}),
};
export const Default = () => (
<DescriptionReadOnly description="Identifies the occurrence of a security alert from the Google Workspace alerts center. Google Workspace's security alert center provides an overview of actionable alerts that may be affecting an organization's domain. An alert is a warning of a potential security issue that Google has detected." />
);
75 changes: 25 additions & 50 deletions ...ponents/rule_details/three_way_diff/final_readonly/fields/eql_query/eql_query.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,69 +6,44 @@
*/

import React from 'react';
import type { Story } from '@storybook/react';
import { FieldFinalReadOnly } from '../../field_final_readonly';
import type { DiffableRule } from '../../../../../../../../../common/api/detection_engine';
import { ThreeWayDiffStorybookProviders } from '../../storybook/three_way_diff_storybook_providers';
import { EqlQueryReadOnly } from './eql_query';
import {
dataSourceWithDataView,
dataSourceWithIndexPatterns,
eqlQuery,
mockDataView,
mockEqlRule,
} from '../../storybook/mocks';

export default {
component: EqlQueryReadOnly,
title: 'Rule Management/Prebuilt Rules/Upgrade Flyout/ThreeWayDiff/FieldReadOnly/eql_query',
};

interface TemplateProps {
finalDiffableRule: DiffableRule;
kibanaServicesOverrides?: Record<string, unknown>;
}

const Template: Story<TemplateProps> = (args) => {
return (
<ThreeWayDiffStorybookProviders
kibanaServicesOverrides={args.kibanaServicesOverrides}
finalDiffableRule={args.finalDiffableRule}
fieldName="eql_query"
>
<FieldFinalReadOnly />
</ThreeWayDiffStorybookProviders>
);
};

export const EqlQueryWithIndexPatterns = Template.bind({});

EqlQueryWithIndexPatterns.args = {
finalDiffableRule: mockEqlRule({
eql_query: eqlQuery,
data_source: dataSourceWithIndexPatterns,
}),
kibanaServicesOverrides: {
data: {
dataViews: {
create: async () => mockDataView(),
export const EqlQueryWithIndexPatterns = () => (
<ThreeWayDiffStorybookProviders
kibanaServicesOverrides={{
data: {
dataViews: {
create: async () => mockDataView(),
},
},
},
},
};

export const EqlQueryWithDataView = Template.bind({});

EqlQueryWithDataView.args = {
finalDiffableRule: mockEqlRule({
eql_query: eqlQuery,
data_source: dataSourceWithDataView,
}),
kibanaServicesOverrides: {
data: {
dataViews: {
get: async () => mockDataView(),
}}
>
<EqlQueryReadOnly eqlQuery={eqlQuery} dataSource={dataSourceWithIndexPatterns} />
</ThreeWayDiffStorybookProviders>
);

export const EqlQueryWithDataView = () => (
<ThreeWayDiffStorybookProviders
kibanaServicesOverrides={{
data: {
dataViews: {
get: async () => mockDataView(),
},
},
},
},
};
}}
>
<EqlQueryReadOnly eqlQuery={eqlQuery} dataSource={dataSourceWithDataView} />
</ThreeWayDiffStorybookProviders>
);
Loading

0 comments on commit aa4a6f2

Please sign in to comment.