style: run prettier

2023-04-26 12:09:32 +03:00 · 2023-04-26 12:09:32 +03:00 · 234f92a3fe
parent 00be5edb4c
commit 234f92a3fe
7 changed files with 103 additions and 69 deletions
--- a/tldraw/apps/tldraw-logseq/src/components/PrimaryTools/PrimaryTools.tsx
+++ b/tldraw/apps/tldraw-logseq/src/components/PrimaryTools/PrimaryTools.tsx
@ -15,16 +15,15 @@ export const PrimaryTools = observer(function PrimaryTools() {
    app.api.setColor(color)
  }, [])

-  const handleToolClick = React.useCallback(
-    (e: React.MouseEvent<HTMLButtonElement>) => {
-      const tool = e.currentTarget.dataset.tool
-      if (tool) app.selectTool(tool)
-    },
-    []
-  )
+  const handleToolClick = React.useCallback((e: React.MouseEvent<HTMLButtonElement>) => {
+    const tool = e.currentTarget.dataset.tool
+    if (tool) app.selectTool(tool)
+  }, [])

  const [activeGeomId, setActiveGeomId] = React.useState(
-    () => (Object.values(Geometry).find((geo: string) => geo === app.selectedTool.id) ?? Object.values(Geometry)[0])
+    () =>
+      Object.values(Geometry).find((geo: string) => geo === app.selectedTool.id) ??
+      Object.values(Geometry)[0]
  )

  React.useEffect(() => {
@ -33,25 +32,59 @@ export const PrimaryTools = observer(function PrimaryTools() {
    })
  }, [app.selectedTool.id])

-
  return (
    <div className="tl-primary-tools" data-html2canvas-ignore="true">
      <div className="tl-toolbar tl-tools-floating-panel">
-        <ToolButton handleClick={() =>app.selectTool("select")} tooltip="Select" id="select" icon="select-cursor" />
        <ToolButton
-         handleClick={() =>app.selectTool("move")}
+          handleClick={() => app.selectTool('select')}
+          tooltip="Select"
+          id="select"
+          icon="select-cursor"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('move')}
          tooltip="Pan"
          id="move"
          icon={app.isIn('move.panning') ? 'hand-grab' : 'hand-stop'}
        />
        <Separator.Root className="tl-toolbar-separator" orientation="horizontal" />
-        <ToolButton handleClick={() =>app.selectTool("`logseq-portal")} tooltip="Add block or page" id="logseq-portal" icon="circle-plus" />
-        <ToolButton handleClick={() =>app.selectTool("pencil")} tooltip="Draw" id="pencil" icon="ballpen" />
-        <ToolButton handleClick={() =>app.selectTool("highlighter")} tooltip="Highlight" id="highlighter" icon="highlight" />
-        <ToolButton handleClick={() =>app.selectTool("erase")} tooltip="Eraser" id="erase" icon="eraser" />
-        <ToolButton handleClick={() =>app.selectTool("line")} tooltip="Connector" id="line" icon="connector" />
-        <ToolButton handleClick={() =>app.selectTool("text")} tooltip="Text" id="text" icon="text" />
-        <GeometryTools activeGeometry={activeGeomId} setGeometry={handleToolClick}/>
+        <ToolButton
+          handleClick={() => app.selectTool('`logseq-portal')}
+          tooltip="Add block or page"
+          id="logseq-portal"
+          icon="circle-plus"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('pencil')}
+          tooltip="Draw"
+          id="pencil"
+          icon="ballpen"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('highlighter')}
+          tooltip="Highlight"
+          id="highlighter"
+          icon="highlight"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('erase')}
+          tooltip="Eraser"
+          id="erase"
+          icon="eraser"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('line')}
+          tooltip="Connector"
+          id="line"
+          icon="connector"
+        />
+        <ToolButton
+          handleClick={() => app.selectTool('text')}
+          tooltip="Text"
+          id="text"
+          icon="text"
+        />
+        <GeometryTools activeGeometry={activeGeomId} setGeometry={handleToolClick} />
        <Separator.Root
          className="tl-toolbar-separator"
          orientation="horizontal"
--- a/tldraw/apps/tldraw-logseq/src/components/ToolButton/ToolButton.tsx
+++ b/tldraw/apps/tldraw-logseq/src/components/ToolButton/ToolButton.tsx
@ -15,33 +15,36 @@ export interface ToolButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
  handleClick: (e: React.MouseEvent<HTMLButtonElement>) => void
 }

-export const ToolButton = observer(({ id, icon, tooltip, tooltipSide = "left", handleClick, ...props }: ToolButtonProps) => {
-  const app = useApp()
+export const ToolButton = observer(
+  ({ id, icon, tooltip, tooltipSide = 'left', handleClick, ...props }: ToolButtonProps) => {
+    const app = useApp()

-  // Tool must exist
-  const Tool = [...app.Tools, TLSelectTool, TLMoveTool]?.find(T => T.id === id)
+    // Tool must exist
+    const Tool = [...app.Tools, TLSelectTool, TLMoveTool]?.find(T => T.id === id)

-  const shortcuts = (Tool as any)?.['shortcut']
+    const shortcuts = (Tool as any)?.['shortcut']

-  const tooltipContent = shortcuts && tooltip ? (
-    <div className="flex">
-      {tooltip}
-      <KeyboardShortcut action={shortcuts}/>
-    </div>
-  ) : (
-    tooltip
-  )
+    const tooltipContent =
+      shortcuts && tooltip ? (
+        <div className="flex">
+          {tooltip}
+          <KeyboardShortcut action={shortcuts} />
+        </div>
+      ) : (
+        tooltip
+      )

-  return (
-    <Button
-      {...props}
-      tooltipSide={tooltipSide}
-      tooltip={tooltipContent}
-      data-tool={id}
-      data-selected={id === app.selectedTool.id}
-      onClick={handleClick}
-    >
-      {typeof icon === 'string' ? <TablerIcon name={icon} /> : icon}
-    </Button>
-  )
-})
+    return (
+      <Button
+        {...props}
+        tooltipSide={tooltipSide}
+        tooltip={tooltipContent}
+        data-tool={id}
+        data-selected={id === app.selectedTool.id}
+        onClick={handleClick}
+      >
+        {typeof icon === 'string' ? <TablerIcon name={icon} /> : icon}
+      </Button>
+    )
+  }
+)
--- a/tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx
+++ b/tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx
@ -28,7 +28,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
          onClick={app.api.zoomToFit}
        >
          Zoom to drawing
-          <KeyboardShortcut action="whiteboard/zoom-to-fit"/>
+          <KeyboardShortcut action="whiteboard/zoom-to-fit" />
        </DropdownMenuPrimitive.Item>
        <DropdownMenuPrimitive.Item
          className="tl-menu-item"
@ -37,7 +37,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
          disabled={app.selectedShapesArray.length === 0}
        >
          Zoom to fit selection
-          <KeyboardShortcut action="whiteboard/zoom-to-selection"/>
+          <KeyboardShortcut action="whiteboard/zoom-to-selection" />
        </DropdownMenuPrimitive.Item>
        <DropdownMenuPrimitive.Item
          className="tl-menu-item"
@ -45,7 +45,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
          onClick={app.api.zoomIn}
        >
          Zoom in
-          <KeyboardShortcut action="whiteboard/zoom-in"/>
+          <KeyboardShortcut action="whiteboard/zoom-in" />
        </DropdownMenuPrimitive.Item>
        <DropdownMenuPrimitive.Item
          className="tl-menu-item"
@ -53,7 +53,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
          onClick={app.api.zoomOut}
        >
          Zoom out
-          <KeyboardShortcut action="whiteboard/zoom-out"/>
+          <KeyboardShortcut action="whiteboard/zoom-out" />
        </DropdownMenuPrimitive.Item>
        <DropdownMenuPrimitive.Item
          className="tl-menu-item"
@ -61,7 +61,7 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
          onClick={app.api.resetZoom}
        >
          Reset zoom
-          <KeyboardShortcut action="whiteboard/reset-zoom"/>
+          <KeyboardShortcut action="whiteboard/reset-zoom" />
        </DropdownMenuPrimitive.Item>
      </DropdownMenuPrimitive.Content>
    </DropdownMenuPrimitive.Root>
--- a/tldraw/packages/core/src/lib/TLApi/TLApi.ts
+++ b/tldraw/packages/core/src/lib/TLApi/TLApi.ts
@ -43,7 +43,9 @@ export class TLApi<S extends TLShape = TLShape, K extends TLEventMap = TLEventMa
   *
   * @param shapes The serialized shape changes to apply.
   */
-  updateShapes = <T extends S>(...shapes: ({ id: string, type: string } & Partial<T['props']>)[]): this => {
+  updateShapes = <T extends S>(
+    ...shapes: ({ id: string; type: string } & Partial<T['props']>)[]
+  ): this => {
    this.app.updateShapes(shapes)
    return this
  }
@ -435,8 +437,7 @@ export class TLApi<S extends TLShape = TLShape, K extends TLEventMap = TLEventMa

  setCollapsed = (collapsed: boolean, shapes: S[] = this.app.allSelectedShapesArray) => {
    shapes.forEach(shape => {
-      if (shape.props.type === 'logseq-portal')
-        shape.setCollapsed(collapsed)
+      if (shape.props.type === 'logseq-portal') shape.setCollapsed(collapsed)
    })
    this.app.persist()
  }
--- a/tldraw/packages/core/src/lib/TLApp/TLApp.ts
+++ b/tldraw/packages/core/src/lib/TLApp/TLApp.ts
@ -17,13 +17,7 @@ import type {
  TLSubscriptionEventName,
 } from '../../types'
 import { AlignType, DistributeType } from '../../types'
-import {
-  BoundsUtils,
-  createNewLineBinding,
-  dedupe,
-  isNonNullable,
-  uniqueId,
-} from '../../utils'
+import { BoundsUtils, createNewLineBinding, dedupe, isNonNullable, uniqueId } from '../../utils'
 import type { TLShape, TLShapeConstructor, TLShapeModel } from '../shapes'
 import { TLApi } from '../TLApi'
 import { TLCursors } from '../TLCursors'
@ -194,14 +188,16 @@ export class TLApp<
    return this
  }

-  @action updateShapes = <T extends S>(shapes: ({ id: string, type: string } & Partial<T['props']>)[]): this => {
+  @action updateShapes = <T extends S>(
+    shapes: ({ id: string; type: string } & Partial<T['props']>)[]
+  ): this => {
    if (this.readOnly) return this

    shapes.forEach(shape => {
      const oldShape = this.getShapeById(shape.id)
      oldShape?.update(shape)
      if (shape.type !== oldShape?.type) {
-        this.api.convertShapes(shape.type , [oldShape])
+        this.api.convertShapes(shape.type, [oldShape])
      }
    })
    this.persist()
--- a/tldraw/packages/core/src/types/types.ts
+++ b/tldraw/packages/core/src/types/types.ts
@ -15,9 +15,9 @@ export enum Color {
 }

 export enum Geometry {
-    Box = 'box',
-    Ellipse = 'ellipse',
-    Polygon = 'polygon',
+  Box = 'box',
+  Ellipse = 'ellipse',
+  Polygon = 'polygon',
 }

 export enum AlignType {
--- a/tldraw/packages/core/src/utils/index.ts
+++ b/tldraw/packages/core/src/utils/index.ts
@ -80,13 +80,14 @@ export function isDarwin(): boolean {
  return /Mac|iPod|iPhone|iPad/.test(window.navigator.platform)
 }

-export function isDev():boolean {
-  return window?.logseq?.api?.get_state_from_store?.('ui/developer-mode?') || process.env.NODE_ENV === 'development'
+export function isDev(): boolean {
+  return (
+    window?.logseq?.api?.get_state_from_store?.('ui/developer-mode?') ||
+    process.env.NODE_ENV === 'development'
+  )
 }

-/**
- * Migrated from frontend.util/safari?
- */
+/** Migrated from frontend.util/safari? */
 export function isSafari(): boolean {
  const ua = window.navigator.userAgent.toLowerCase()
  return ua.includes('webkit') && !ua.includes('chrome')