fix(tooltip): add tooltips for undo/redo buttons (#1095)
* fix(tooltip): add lack tooltips for undo/redo buttons * fix: change id of undo/redo buttons
This commit is contained in:
parent
33dde339aa
commit
60728e069a
1 changed files with 19 additions and 7 deletions
|
@ -1,6 +1,7 @@
|
|||
import * as React from 'react'
|
||||
import { useIntl } from 'react-intl'
|
||||
import { Panel } from '~components/Primitives/Panel'
|
||||
import { ToolButton } from '~components/Primitives/ToolButton'
|
||||
import { ToolButton, ToolButtonWithTooltip } from '~components/Primitives/ToolButton'
|
||||
import { UndoIcon } from '~components/Primitives/icons'
|
||||
import { useTldrawApp } from '~hooks'
|
||||
import { styled } from '~styles'
|
||||
|
@ -28,6 +29,7 @@ export function _TopPanel({
|
|||
showMultiplayerMenu,
|
||||
}: TopPanelProps) {
|
||||
const app = useTldrawApp()
|
||||
const intl = useIntl()
|
||||
|
||||
return (
|
||||
<StyledTopPanel>
|
||||
|
@ -45,12 +47,22 @@ export function _TopPanel({
|
|||
<ReadOnlyLabel>Read Only</ReadOnlyLabel>
|
||||
) : (
|
||||
<>
|
||||
<ToolButton>
|
||||
<UndoIcon onClick={app.undo} />
|
||||
</ToolButton>
|
||||
<ToolButton>
|
||||
<UndoIcon onClick={app.redo} flipHorizontal />
|
||||
</ToolButton>
|
||||
<ToolButtonWithTooltip
|
||||
kbd={'#Z'}
|
||||
label={intl.formatMessage({ id: 'undo' })}
|
||||
onClick={app.undo}
|
||||
id="TD-TopPanel-Undo"
|
||||
>
|
||||
<UndoIcon />
|
||||
</ToolButtonWithTooltip>
|
||||
<ToolButtonWithTooltip
|
||||
kbd={'#⇧Z'}
|
||||
label={intl.formatMessage({ id: 'redo' })}
|
||||
onClick={app.redo}
|
||||
id="TD-TopPanel-Redo"
|
||||
>
|
||||
<UndoIcon flipHorizontal />
|
||||
</ToolButtonWithTooltip>
|
||||
</>
|
||||
)}
|
||||
{showZoom && <ZoomMenu />}
|
||||
|
|
Loading…
Reference in a new issue