diff --git a/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.jsx b/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.jsx index 0ca7b55791..6a850de029 100644 --- a/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.jsx +++ b/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.jsx @@ -13,16 +13,22 @@ const baseClass = 'scheduled-query-list-item'; const generatePlatformText = (platforms) => { const ALL_PLATFORMS = [ { text: 'All', value: 'all' }, - { text: 'macOS', value: 'darwin' }, { text: 'Windows', value: 'windows' }, { text: 'Linux', value: 'linux' }, + { text: 'macOS', value: 'darwin' }, ]; if (platforms) { - const platformArray = platforms.split(','); + const platformsArray = platforms.split(','); - const textArray = platformArray.map((platform) => { - const text = find(ALL_PLATFORMS, { value: platform }).text; + const textArray = platformsArray.map((platform) => { + // Trim spaces from the platform + const trimmedPlatform = platform.trim(); + const platformObject = find(ALL_PLATFORMS, { value: trimmedPlatform }); + // Convert trimmed value to the corresponding text if the value exists + // in the ALL_PLATFORMS array. + // Otherwise, just use the trimmed value. + const text = platformObject ? platformObject.text : trimmedPlatform; return text; }); @@ -32,7 +38,7 @@ const generatePlatformText = (platforms) => { return displayText; } - return '---'; + return 'All'; }; class ScheduledQueriesListItem extends Component { diff --git a/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.tests.jsx b/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.tests.jsx index 0b59c3a927..7d7a3f42c2 100644 --- a/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.tests.jsx +++ b/frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/ScheduledQueriesListItem.tests.jsx @@ -29,6 +29,24 @@ describe('ScheduledQueriesListItem - component', () => { expect(component.text()).toContain(scheduledQueryStub.shard); }); + it('renders the converted platform attributes', () => { + const scheduledQuery = { ...scheduledQueryStub, platform: 'darwin,linux,all,windows' }; + const component = mount(); + expect(component.text()).toContain('macOS'); + expect(component.text()).toContain('Linux'); + expect(component.text()).toContain('All'); + expect(component.text()).toContain('Windows'); + }); + + it('renders the platform attributes when there are no conversions', () => { + const scheduledQuery = { ...scheduledQueryStub, platform: 'darwin,freebsd, bar, foo' }; + const component = mount(); + expect(component.text()).toContain('macOS'); + expect(component.text()).toContain('freebsd'); + expect(component.text()).toContain('bar'); + expect(component.text()).toContain('foo'); + }); + it('renders a Checkbox component', () => { const component = shallow(); expect(component.find('Checkbox').length).toEqual(1); diff --git a/frontend/components/queries/ScheduledQueriesList/_styles.scss b/frontend/components/queries/ScheduledQueriesList/_styles.scss index 2eb174901a..c74862f3ae 100644 --- a/frontend/components/queries/ScheduledQueriesList/_styles.scss +++ b/frontend/components/queries/ScheduledQueriesList/_styles.scss @@ -91,6 +91,7 @@ letter-spacing: -0.5px; text-align: left; color: $core-black; + white-space: nowrap; } &:nth-child(5),