diff options
Diffstat (limited to 'src/features')
3 files changed, 28 insertions, 10 deletions
diff --git a/src/features/webControls/components/WebControls.tsx b/src/features/webControls/components/WebControls.tsx index e76fca6a2..54f45c843 100644 --- a/src/features/webControls/components/WebControls.tsx +++ b/src/features/webControls/components/WebControls.tsx | |||
@@ -9,6 +9,7 @@ import { | |||
9 | mdiHomeOutline, | 9 | mdiHomeOutline, |
10 | mdiEarth, | 10 | mdiEarth, |
11 | } from '@mdi/js'; | 11 | } from '@mdi/js'; |
12 | import { Tooltip as ReactTooltip } from 'react-tooltip'; | ||
12 | import Icon from '../../../components/ui/icon'; | 13 | import Icon from '../../../components/ui/icon'; |
13 | 14 | ||
14 | const messages = defineMessages({ | 15 | const messages = defineMessages({ |
@@ -151,7 +152,8 @@ class WebControls extends Component<IProps, IState> { | |||
151 | onClick={goHome} | 152 | onClick={goHome} |
152 | type="button" | 153 | type="button" |
153 | className={classes.button} | 154 | className={classes.button} |
154 | data-tip={intl.formatMessage(messages.goHome)} | 155 | data-tooltip-id="tooltip-web-controls" |
156 | data-tooltip-content={intl.formatMessage(messages.goHome)} | ||
155 | data-place="bottom" | 157 | data-place="bottom" |
156 | > | 158 | > |
157 | <Icon icon={mdiHomeOutline} className={classes.icon} /> | 159 | <Icon icon={mdiHomeOutline} className={classes.icon} /> |
@@ -161,7 +163,8 @@ class WebControls extends Component<IProps, IState> { | |||
161 | type="button" | 163 | type="button" |
162 | className={classes.button} | 164 | className={classes.button} |
163 | disabled={!canGoBack} | 165 | disabled={!canGoBack} |
164 | data-tip={intl.formatMessage(messages.back)} | 166 | data-tooltip-id="tooltip-web-controls" |
167 | data-tooltip-content={intl.formatMessage(messages.back)} | ||
165 | data-place="bottom" | 168 | data-place="bottom" |
166 | > | 169 | > |
167 | <Icon icon={mdiArrowLeft} className={classes.icon} /> | 170 | <Icon icon={mdiArrowLeft} className={classes.icon} /> |
@@ -171,7 +174,8 @@ class WebControls extends Component<IProps, IState> { | |||
171 | type="button" | 174 | type="button" |
172 | className={classes.button} | 175 | className={classes.button} |
173 | disabled={!canGoForward} | 176 | disabled={!canGoForward} |
174 | data-tip={intl.formatMessage(messages.forward)} | 177 | data-tooltip-id="tooltip-web-controls" |
178 | data-tooltip-content={intl.formatMessage(messages.forward)} | ||
175 | data-place="bottom" | 179 | data-place="bottom" |
176 | > | 180 | > |
177 | <Icon icon={mdiArrowRight} className={classes.icon} /> | 181 | <Icon icon={mdiArrowRight} className={classes.icon} /> |
@@ -180,7 +184,8 @@ class WebControls extends Component<IProps, IState> { | |||
180 | onClick={reload} | 184 | onClick={reload} |
181 | type="button" | 185 | type="button" |
182 | className={classes.button} | 186 | className={classes.button} |
183 | data-tip={intl.formatMessage(messages.reload)} | 187 | data-tooltip-id="tooltip-web-controls" |
188 | data-tooltip-content={intl.formatMessage(messages.reload)} | ||
184 | data-place="bottom" | 189 | data-place="bottom" |
185 | > | 190 | > |
186 | <Icon icon={mdiReload} className={classes.icon} /> | 191 | <Icon icon={mdiReload} className={classes.icon} /> |
@@ -232,11 +237,18 @@ class WebControls extends Component<IProps, IState> { | |||
232 | onClick={openInBrowser} | 237 | onClick={openInBrowser} |
233 | type="button" | 238 | type="button" |
234 | className={classes.button} | 239 | className={classes.button} |
235 | data-tip={intl.formatMessage(messages.openInBrowser)} | 240 | data-tooltip-id="tooltip-web-controls" |
241 | data-tooltip-content={intl.formatMessage(messages.openInBrowser)} | ||
236 | data-place="bottom" | 242 | data-place="bottom" |
237 | > | 243 | > |
238 | <Icon icon={mdiEarth} className={classes.icon} /> | 244 | <Icon icon={mdiEarth} className={classes.icon} /> |
239 | </button> | 245 | </button> |
246 | <ReactTooltip | ||
247 | id="tooltip-web-controls" | ||
248 | place="bottom" | ||
249 | variant="dark" | ||
250 | style={{ height: 'auto' }} | ||
251 | /> | ||
240 | </div> | 252 | </div> |
241 | ); | 253 | ); |
242 | } | 254 | } |
diff --git a/src/features/workspaces/components/WorkspaceDrawer.tsx b/src/features/workspaces/components/WorkspaceDrawer.tsx index 61284d81a..1c827e9dd 100644 --- a/src/features/workspaces/components/WorkspaceDrawer.tsx +++ b/src/features/workspaces/components/WorkspaceDrawer.tsx | |||
@@ -2,7 +2,7 @@ import { Component, ReactElement } from 'react'; | |||
2 | import { observer } from 'mobx-react'; | 2 | import { observer } from 'mobx-react'; |
3 | import withStyles, { WithStylesProps } from 'react-jss'; | 3 | import withStyles, { WithStylesProps } from 'react-jss'; |
4 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; | 4 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; |
5 | import ReactTooltip from 'react-tooltip'; | 5 | import { Tooltip as ReactTooltip } from 'react-tooltip'; |
6 | import { mdiPlusBox, mdiCog } from '@mdi/js'; | 6 | import { mdiPlusBox, mdiCog } from '@mdi/js'; |
7 | import { noop } from 'lodash'; | 7 | import { noop } from 'lodash'; |
8 | import { H1 } from '../../../components/ui/headline'; | 8 | import { H1 } from '../../../components/ui/headline'; |
@@ -96,7 +96,6 @@ interface IProps extends WithStylesProps<typeof styles>, WrappedComponentProps { | |||
96 | class WorkspaceDrawer extends Component<IProps> { | 96 | class WorkspaceDrawer extends Component<IProps> { |
97 | componentDidMount(): void { | 97 | componentDidMount(): void { |
98 | try { | 98 | try { |
99 | ReactTooltip.rebuild(); | ||
100 | getUserWorkspacesRequest.execute(); | 99 | getUserWorkspacesRequest.execute(); |
101 | } catch (error) { | 100 | } catch (error) { |
102 | console.log(error); | 101 | console.log(error); |
@@ -121,7 +120,8 @@ class WorkspaceDrawer extends Component<IProps> { | |||
121 | onClick={() => { | 120 | onClick={() => { |
122 | workspaceActions.openWorkspaceSettings(); | 121 | workspaceActions.openWorkspaceSettings(); |
123 | }} | 122 | }} |
124 | data-tip={`${intl.formatMessage( | 123 | data-tooltip-id="tooltip-workspaces-drawer" |
124 | data-tooltip-content={`${intl.formatMessage( | ||
125 | messages.workspacesSettingsTooltip, | 125 | messages.workspacesSettingsTooltip, |
126 | )}`} | 126 | )}`} |
127 | > | 127 | > |
@@ -176,7 +176,12 @@ class WorkspaceDrawer extends Component<IProps> { | |||
176 | <span>{intl.formatMessage(messages.addNewWorkspaceLabel)}</span> | 176 | <span>{intl.formatMessage(messages.addNewWorkspaceLabel)}</span> |
177 | </div> | 177 | </div> |
178 | </div> | 178 | </div> |
179 | <ReactTooltip place="right" type="dark" effect="solid" /> | 179 | <ReactTooltip |
180 | id="tooltip-workspaces-drawer" | ||
181 | place="right" | ||
182 | variant="dark" | ||
183 | style={{ height: 'auto', zIndex: 210 }} | ||
184 | /> | ||
180 | </div> | 185 | </div> |
181 | ); | 186 | ); |
182 | } | 187 | } |
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.tsx b/src/features/workspaces/components/WorkspaceDrawerItem.tsx index cf8c3b2ba..172b4192c 100644 --- a/src/features/workspaces/components/WorkspaceDrawerItem.tsx +++ b/src/features/workspaces/components/WorkspaceDrawerItem.tsx | |||
@@ -119,7 +119,8 @@ class WorkspaceDrawerItem extends Component<IProps> { | |||
119 | } | 119 | } |
120 | }} | 120 | }} |
121 | onKeyDown={noop} | 121 | onKeyDown={noop} |
122 | data-tip={acceleratorString( | 122 | data-tooltip-id="tooltip-workspaces-drawer" |
123 | data-tooltip-content={acceleratorString( | ||
123 | shortcutIndex, | 124 | shortcutIndex, |
124 | `${cmdOrCtrlShortcutKey(false)}+${altKey(false)}`, | 125 | `${cmdOrCtrlShortcutKey(false)}+${altKey(false)}`, |
125 | )} | 126 | )} |