Don't allow the users to use keyboard shortcuts to select tools in readonly mode. (#1382)
Keyboard shortcuts for selecting tools still worked in readonly mode. This now disables them - except for select, hand, and zoom tool. ### Change Type - [x] `patch` — Bug Fix ### Test Plan 1. Create a readonly room. 2. Press keyboard shortcuts for tools and make sure we don't transition to them (tools toolbar should always show either select or hand tool as active). 3. Also make sure the keyboard shortcuts still work in non readonly rooms. - [ ] Unit Tests - [ ] Webdriver tests ### Release Notes - Disable keyboard shortcut events for tools in readonly mode. We only allow the select, hand tools, and zoom tool.
This commit is contained in:
parent
9101dcfd44
commit
50bae6d4a1
2 changed files with 11 additions and 11 deletions
|
@ -51,7 +51,7 @@ export function useKeyboardShortcuts() {
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const tool of Object.values(tools)) {
|
for (const tool of Object.values(tools)) {
|
||||||
if (!tool.kbd) continue
|
if (!tool.kbd || (!tool.readonlyOk && app.isReadOnly)) continue
|
||||||
|
|
||||||
if (SKIP_KBDS.includes(tool.id)) continue
|
if (SKIP_KBDS.includes(tool.id)) continue
|
||||||
|
|
||||||
|
|
|
@ -74,7 +74,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
label: 'tool.eraser',
|
label: 'tool.eraser',
|
||||||
icon: 'tool-eraser',
|
icon: 'tool-eraser',
|
||||||
kbd: 'e',
|
kbd: 'e',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
app.setSelectedTool('eraser')
|
app.setSelectedTool('eraser')
|
||||||
trackEvent('select-tool', { source, id: 'eraser' })
|
trackEvent('select-tool', { source, id: 'eraser' })
|
||||||
|
@ -83,7 +83,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'draw',
|
id: 'draw',
|
||||||
label: 'tool.draw',
|
label: 'tool.draw',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-pencil',
|
icon: 'tool-pencil',
|
||||||
kbd: 'd,b,x',
|
kbd: 'd,b,x',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -94,7 +94,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
...[...TL_GEO_TYPES].map((id) => ({
|
...[...TL_GEO_TYPES].map((id) => ({
|
||||||
id,
|
id,
|
||||||
label: `tool.${id}` as TLTranslationKey,
|
label: `tool.${id}` as TLTranslationKey,
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
meta: {
|
meta: {
|
||||||
geo: id,
|
geo: id,
|
||||||
},
|
},
|
||||||
|
@ -114,7 +114,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'arrow',
|
id: 'arrow',
|
||||||
label: 'tool.arrow',
|
label: 'tool.arrow',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-arrow',
|
icon: 'tool-arrow',
|
||||||
kbd: 'a',
|
kbd: 'a',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -125,7 +125,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'line',
|
id: 'line',
|
||||||
label: 'tool.line',
|
label: 'tool.line',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-line',
|
icon: 'tool-line',
|
||||||
kbd: 'l',
|
kbd: 'l',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -136,7 +136,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'frame',
|
id: 'frame',
|
||||||
label: 'tool.frame',
|
label: 'tool.frame',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-frame',
|
icon: 'tool-frame',
|
||||||
kbd: 'f',
|
kbd: 'f',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -147,7 +147,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'text',
|
id: 'text',
|
||||||
label: 'tool.text',
|
label: 'tool.text',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-text',
|
icon: 'tool-text',
|
||||||
kbd: 't',
|
kbd: 't',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -158,7 +158,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'asset',
|
id: 'asset',
|
||||||
label: 'tool.asset',
|
label: 'tool.asset',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-media',
|
icon: 'tool-media',
|
||||||
kbd: '$u',
|
kbd: '$u',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -169,7 +169,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'note',
|
id: 'note',
|
||||||
label: 'tool.note',
|
label: 'tool.note',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-note',
|
icon: 'tool-note',
|
||||||
kbd: 'n',
|
kbd: 'n',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
|
@ -180,7 +180,7 @@ export function ToolsProvider({ overrides, children }: ToolsProviderProps) {
|
||||||
{
|
{
|
||||||
id: 'embed',
|
id: 'embed',
|
||||||
label: 'tool.embed',
|
label: 'tool.embed',
|
||||||
readonlyOk: true,
|
readonlyOk: false,
|
||||||
icon: 'tool-embed',
|
icon: 'tool-embed',
|
||||||
onSelect(source) {
|
onSelect(source) {
|
||||||
addDialog({ component: EmbedDialog })
|
addDialog({ component: EmbedDialog })
|
||||||
|
|
Loading…
Reference in a new issue