diff --git a/static/app/views/explore/content.tsx b/static/app/views/explore/content.tsx index 6aec659f9685db..a2b75375d3a1a8 100644 --- a/static/app/views/explore/content.tsx +++ b/static/app/views/explore/content.tsx @@ -131,7 +131,7 @@ const FilterActions = styled('div')` const Body = styled(Layout.Body)` @media (min-width: ${p => p.theme.breakpoints.large}) { display: grid; - grid-template-columns: 275px minmax(100px, auto); + grid-template-columns: 300px minmax(100px, auto); align-content: start; gap: ${p => (!p.noRowGap ? `${space(3)}` : `0 ${space(3)}`)}; } diff --git a/static/app/views/explore/toolbar/index.spec.tsx b/static/app/views/explore/toolbar/index.spec.tsx index 1506e6608376ae..fb197fbac776f8 100644 --- a/static/app/views/explore/toolbar/index.spec.tsx +++ b/static/app/views/explore/toolbar/index.spec.tsx @@ -89,7 +89,7 @@ describe('ExploreToolbar', function () { await userEvent.click(within(groupBy).getByRole('button', {name: 'None'})); await userEvent.click(within(groupBy).getByRole('option', {name: 'release'})); expect(groupBys).toEqual(['release']); - await userEvent.click(within(groupBy).getByRole('button', {name: 'Add Group By'})); + await userEvent.click(within(groupBy).getByRole('button', {name: 'Add Group'})); expect(groupBys).toEqual(['release', '']); await userEvent.click(samples); diff --git a/static/app/views/explore/toolbar/styles.tsx b/static/app/views/explore/toolbar/styles.tsx index 1170ba45a47b49..c916913687e00f 100644 --- a/static/app/views/explore/toolbar/styles.tsx +++ b/static/app/views/explore/toolbar/styles.tsx @@ -39,6 +39,6 @@ export const ToolbarFooter = styled('div')<{disabled?: boolean}>` export const ToolbarRow = styled('div')` display: flex; flex-direction: row; - gap: ${space(0.5)}; - margin: ${space(0.5)} 0; + gap: ${space(1)}; + margin: ${space(1)} 0; `; diff --git a/static/app/views/explore/toolbar/toolbarDataset.tsx b/static/app/views/explore/toolbar/toolbarDataset.tsx index 2e558c93f517c5..14711c6b59e776 100644 --- a/static/app/views/explore/toolbar/toolbarDataset.tsx +++ b/static/app/views/explore/toolbar/toolbarDataset.tsx @@ -15,12 +15,7 @@ export function ToolbarDataset({dataset, setDataset}: ToolbarDatasetProps) { <ToolbarHeader> <ToolbarLabel>{t('Dataset')}</ToolbarLabel> </ToolbarHeader> - <SegmentedControl - size="sm" - aria-label={t('Dataset')} - value={dataset} - onChange={setDataset} - > + <SegmentedControl aria-label={t('Dataset')} value={dataset} onChange={setDataset}> <SegmentedControl.Item key={DiscoverDatasets.SPANS_EAP}> {t('EAP Spans')} </SegmentedControl.Item> diff --git a/static/app/views/explore/toolbar/toolbarGroupBy.tsx b/static/app/views/explore/toolbar/toolbarGroupBy.tsx index 7a8ff987c1b1e3..c04bed6f28090a 100644 --- a/static/app/views/explore/toolbar/toolbarGroupBy.tsx +++ b/static/app/views/explore/toolbar/toolbarGroupBy.tsx @@ -81,7 +81,6 @@ export function ToolbarGroupBy({disabled}: ToolbarGroupByProps) { <CompactSelect searchable disabled={disabled} - size="sm" options={options} value={groupBy} onChange={newGroupBy => setGroupBy(index, newGroupBy)} diff --git a/static/app/views/explore/toolbar/toolbarResults.tsx b/static/app/views/explore/toolbar/toolbarResults.tsx index 743f1f3d96116e..fc7a6cba2d3fd9 100644 --- a/static/app/views/explore/toolbar/toolbarResults.tsx +++ b/static/app/views/explore/toolbar/toolbarResults.tsx @@ -16,7 +16,6 @@ export function ToolbarResults({resultMode, setResultMode}: ToolbarResultsProps) <ToolbarLabel>{t('Results')}</ToolbarLabel> </ToolbarHeader> <SegmentedControl - size="sm" aria-label={t('Result Mode')} value={resultMode} onChange={setResultMode} diff --git a/static/app/views/explore/toolbar/toolbarSortBy.tsx b/static/app/views/explore/toolbar/toolbarSortBy.tsx index 8035cc8f0845bd..b72dda3340b52b 100644 --- a/static/app/views/explore/toolbar/toolbarSortBy.tsx +++ b/static/app/views/explore/toolbar/toolbarSortBy.tsx @@ -41,11 +41,11 @@ export function ToolbarSortBy({fields, setSorts, sorts}: ToolbarSortByProps) { const kindOptions: SelectOption<Sort['kind']>[] = useMemo(() => { return [ { - label: 'Desc', + label: 'desc', value: 'desc', }, { - label: 'Asc', + label: 'asc', value: 'asc', }, ]; @@ -73,13 +73,11 @@ export function ToolbarSortBy({fields, setSorts, sorts}: ToolbarSortByProps) { <div> <ToolbarRow> <CompactSelect - size="sm" options={fieldOptions} value={sorts[0]?.field} onChange={newSortField => setSortField(0, newSortField)} /> <CompactSelect - size="sm" options={kindOptions} value={sorts[0]?.kind} onChange={newSortKind => setSortKind(0, newSortKind)} diff --git a/static/app/views/explore/toolbar/toolbarVisualize.tsx b/static/app/views/explore/toolbar/toolbarVisualize.tsx index 81eead27e5aa49..a0d1c1a6ba3c7f 100644 --- a/static/app/views/explore/toolbar/toolbarVisualize.tsx +++ b/static/app/views/explore/toolbar/toolbarVisualize.tsx @@ -136,13 +136,11 @@ export function ToolbarVisualize({}: ToolbarVisualizeProps) { {parsedVisualizeGroup.map((parsedVisualize, index) => ( <ToolbarRow key={index}> <CompactSelect - size="sm" options={fieldOptions} value={parsedVisualize.arguments[0]} onChange={newField => setChartField(group, index, newField)} /> <CompactSelect - size="sm" options={aggregateOptions} value={parsedVisualize?.name} onChange={newAggregate =>