fix: [#1079] adding max width to menu items and also the tooltip to show full text value (#1088)

* fix: [#1079] adding max width to menu items and also the tooltip to show full text value

* chore: removed max-width property

* chore: fixed the interaction for people.sortby

* chore: removed unused code

* chore: fixed the interaction for companies.sortby
This commit is contained in:
Vishwash Bajpai 2023-08-08 01:46:38 +05:30 committed by GitHub
parent 029ba25361
commit 0dcb93ca3b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 4 deletions

View File

@ -6,6 +6,7 @@ import { DropdownMenuHeader } from '@/ui/dropdown/components/DropdownMenuHeader'
import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer'; import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSelectableItem } from '@/ui/dropdown/components/DropdownMenuSelectableItem'; import { DropdownMenuSelectableItem } from '@/ui/dropdown/components/DropdownMenuSelectableItem';
import { DropdownMenuSeparator } from '@/ui/dropdown/components/DropdownMenuSeparator'; import { DropdownMenuSeparator } from '@/ui/dropdown/components/DropdownMenuSeparator';
import { OverflowingTextWithTooltip } from '@/ui/tooltip/OverflowingTextWithTooltip';
import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope'; import { FiltersHotkeyScope } from '../types/FiltersHotkeyScope';
import { SelectedSortType, SortType } from '../types/interface'; import { SelectedSortType, SortType } from '../types/interface';
@ -97,7 +98,7 @@ export function SortDropdownButton<SortField>({
}} }}
> >
{sort.icon} {sort.icon}
{sort.label} <OverflowingTextWithTooltip text={sort.label} />
</DropdownMenuSelectableItem> </DropdownMenuSelectableItem>
))} ))}
</DropdownMenuItemsContainer> </DropdownMenuItemsContainer>

View File

@ -32,7 +32,9 @@ export const SortByName: Story = {
const sortButton = await canvas.findByText('Sort'); const sortButton = await canvas.findByText('Sort');
await userEvent.click(sortButton); await userEvent.click(sortButton);
const nameSortButton = canvas.getByText('Name', { selector: 'li > div' }); const nameSortButton = canvas.getByText('Name', {
selector: 'li > div > div',
});
await userEvent.click(nameSortButton); await userEvent.click(nameSortButton);
expect(await canvas.getByTestId('remove-icon-name')).toBeInTheDocument(); expect(await canvas.getByTestId('remove-icon-name')).toBeInTheDocument();

View File

@ -33,7 +33,9 @@ export const Email: Story = {
const sortButton = await canvas.findByText('Sort'); const sortButton = await canvas.findByText('Sort');
await userEvent.click(sortButton); await userEvent.click(sortButton);
const emailSortButton = canvas.getByText('Email', { selector: 'li > div' }); const emailSortButton = canvas.getByText('Email', {
selector: 'li > div > div',
});
await userEvent.click(emailSortButton); await userEvent.click(emailSortButton);
expect(await canvas.getByTestId('remove-icon-email')).toBeInTheDocument(); expect(await canvas.getByTestId('remove-icon-email')).toBeInTheDocument();
@ -49,7 +51,9 @@ export const Cancel: Story = {
const sortButton = await canvas.findByText('Sort'); const sortButton = await canvas.findByText('Sort');
await userEvent.click(sortButton); await userEvent.click(sortButton);
const emailSortButton = canvas.getByText('Email', { selector: 'li > div' }); const emailSortButton = canvas.getByText('Email', {
selector: 'li > div > div',
});
await userEvent.click(emailSortButton); await userEvent.click(emailSortButton);
expect(await canvas.getByTestId('remove-icon-email')).toBeInTheDocument(); expect(await canvas.getByTestId('remove-icon-email')).toBeInTheDocument();