luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

ToolTip for Table view menu (#4328)

Browse source
This commit is contained in:
Rajat Dabade 2022-12-16 01:47:55 +05:30 committed by GitHub
parent be80d3ca82
commit c5919752a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 543 additions and 347 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
webapp/i18n/en.json
View file

@ -284,6 +284,7 @@
"TableHeaderMenu.insert-right": "Insert right",
"TableHeaderMenu.sort-ascending": "Sort ascending",
"TableHeaderMenu.sort-descending": "Sort descending",
"TableRow.MoreOption": "More actions",
"TableRow.delete": "Delete",
"TableRow.open": "Open",
"TopBar.give-feedback": "Give feedback",
@ -437,4 +438,4 @@
"tutorial_tip.ok": "Next",
"tutorial_tip.out": "Opt out of these tips.",
"tutorial_tip.seen": "Seen this before?"
}
}

529
webapp/src/components/__snapshots__/centerPanel.test.tsx.snap
View file

@ -460,16 +460,21 @@ exports[`components/centerPanel Clicking on the Hidden card count should open a
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -528,16 +533,21 @@ exports[`components/centerPanel Clicking on the Hidden card count should open a
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1711,16 +1721,21 @@ exports[`components/centerPanel return centerPanel and click on new card to edit
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1779,16 +1794,21 @@ exports[`components/centerPanel return centerPanel and click on new card to edit
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -2768,16 +2788,21 @@ exports[`components/centerPanel return centerPanel and press touch ctrl+d for on
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -2836,16 +2861,21 @@ exports[`components/centerPanel return centerPanel and press touch ctrl+d for on
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -3416,16 +3446,21 @@ exports[`components/centerPanel return centerPanel and press touch del for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -3484,16 +3519,21 @@ exports[`components/centerPanel return centerPanel and press touch del for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -4064,16 +4104,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -4132,16 +4177,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -4712,16 +4762,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -4780,16 +4835,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -5360,16 +5420,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -5428,16 +5493,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -6008,16 +6078,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -6076,16 +6151,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -6656,16 +6736,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -6724,16 +6809,21 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -7304,16 +7394,21 @@ exports[`components/centerPanel return centerPanel and select one card and click
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -7372,16 +7467,21 @@ exports[`components/centerPanel return centerPanel and select one card and click
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -7952,16 +8052,21 @@ exports[`components/centerPanel return centerPanel and select one card and click
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -8020,16 +8125,21 @@ exports[`components/centerPanel return centerPanel and select one card and click
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -9913,16 +10023,21 @@ exports[`components/centerPanel should match snapshot for Table 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"

207
webapp/src/components/table/__snapshots__/table.test.tsx.snap
View file

@ -174,16 +174,21 @@ exports[`components/table/Table extended should match snapshot with CreatedAt 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -290,16 +295,21 @@ exports[`components/table/Table extended should match snapshot with CreatedAt 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -614,16 +624,21 @@ exports[`components/table/Table extended should match snapshot with CreatedBy 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -734,16 +749,21 @@ exports[`components/table/Table extended should match snapshot with CreatedBy 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1062,16 +1082,21 @@ exports[`components/table/Table extended should match snapshot with UpdatedAt 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1178,16 +1203,21 @@ exports[`components/table/Table extended should match snapshot with UpdatedAt 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1502,16 +1532,21 @@ exports[`components/table/Table extended should match snapshot with UpdatedBy 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -1622,16 +1657,21 @@ exports[`components/table/Table extended should match snapshot with UpdatedBy 1`
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -2259,16 +2299,21 @@ exports[`components/table/Table should match snapshot 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"

115
webapp/src/components/table/__snapshots__/tableRow.test.tsx.snap
View file

@ -45,16 +45,21 @@ exports[`components/table/TableRow should match snapshot 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -118,16 +123,21 @@ exports[`components/table/TableRow should match snapshot, collapsed tree 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -191,16 +201,21 @@ exports[`components/table/TableRow should match snapshot, display properties 1`]
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -302,16 +317,21 @@ exports[`components/table/TableRow should match snapshot, isSelected 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"
@ -421,16 +441,21 @@ exports[`components/table/TableRow should match snapshot, resizing column 1`] =
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"

23
webapp/src/components/table/__snapshots__/tableRows.test.tsx.snap
View file

@ -45,16 +45,21 @@ exports[`components/table/TableRows should match snapshot, fire events 1`] = `
class="MenuWrapper optionsMenu ml-2 mr-2"
role="button"
>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
<div
class="octo-tooltip tooltip-top"
data-tooltip="More actions"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
<button
aria-label="MenuBtn"
class="IconButton"
title="MenuBtn"
type="button"
>
<i
class="CompassIcon icon-dots-horizontal OptionsIcon"
/>
</button>
</div>
</div>
<div
class="open-button"

13
webapp/src/components/table/tableRow.tsx
View file

@ -20,6 +20,7 @@ import IconButton from '../../widgets/buttons/iconButton'
import CompassIcon from '../../widgets/icons/compassIcon'
import OptionsIcon from '../../widgets/icons/options'
import DeleteIcon from '../../widgets/icons/delete'
import Tooltip from '../../widgets/tooltip'
import ConfirmationDialogBox, {ConfirmationDialogBoxProps} from '../confirmationDialogBox'
import TelemetryClient, {TelemetryActions, TelemetryCategory} from '../../telemetry/telemetryClient'
@ -175,10 +176,14 @@ const TableRow = (props: Props) => {
className='optionsMenu ml-2 mr-2'
stopPropagationOnToggle={true}
>
<IconButton
title='MenuBtn'
icon={<OptionsIcon/>}
/>
<Tooltip
title={intl.formatMessage({id: 'TableRow.MoreOption', defaultMessage: 'More actions'})}
>
<IconButton
title='MenuBtn'
icon={<OptionsIcon/>}
/>
</Tooltip>
<Menu>
<Menu.Text
icon={<DeleteIcon/>}