add laser pointer to view mode

src/actions/actionCanvas.tsx

@@ -18,6 +18,7 @@ import {
   getDefaultAppState,
   isEraserActive,
   isHandToolActive,
+  isLaserPointerActive,
 } from "../appState";
 import { DEFAULT_CANVAS_BACKGROUND_PICKS } from "../colors";
 import { Bounds } from "../element/bounds";
@@ -439,3 +440,46 @@ export const actionToggleHandTool = register({
   },
   keyTest: (event) => event.key === KEYS.H,
 });
+
+export const actionToggleLaserPointer = register({
+  name: "toggleLaserPointerTool",
+  viewMode: true,
+  trackEvent: { category: "menu" },
+  perform(elements, appState, _, app) {
+    let activeTool: AppState["activeTool"];
+
+    if (isLaserPointerActive(appState)) {
+      activeTool = updateActiveTool(appState, {
+        ...(appState.activeTool.lastActiveTool || {
+          type: appState.viewModeEnabled ? "hand" : "selection",
+        }),
+        lastActiveToolBeforeEraser: null,
+      });
+      setCursor(
+        app.interactiveCanvas,
+        appState.viewModeEnabled ? CURSOR_TYPE.GRAB : CURSOR_TYPE.POINTER,
+      );
+    } else {
+      activeTool = updateActiveTool(appState, {
+        type: "laser",
+        lastActiveToolBeforeEraser: appState.activeTool,
+      });
+      setCursor(app.interactiveCanvas, CURSOR_TYPE.CROSSHAIR);
+    }
+
+    return {
+      appState: {
+        ...appState,
+        selectedElementIds: {},
+        selectedGroupIds: {},
+        activeEmbeddable: null,
+        activeTool,
+      },
+      commitToHistory: true,
+    };
+  },
+  checked: (appState) => appState.activeTool.type === "laser",
+  contextItemLabel: "labels.laser",
+  keyTest: (event) =>
+    event.code === CODES.K && !event[KEYS.CTRL_OR_CMD] && !event.altKey,
+});