fix: update cli and fix linting errors

.gitignore

@@ -4,3 +4,6 @@ node_modules
 npm-debug.log
 dist
 docs
+/coverage
+.rete-cli
+.sonar

eslint.config.mjs

@@ -0,0 +1,14 @@
+import tseslint from 'typescript-eslint';
+import configs from 'rete-cli/configs/eslint.mjs';
+import gloals from 'globals'
+
+export default tseslint.config(
+  ...configs,
+  {
+    languageOptions: {
+      globals: {
+        ...gloals.browser
+      }
+    }
+  }
+)

package.json

@@ -27,9 +27,10 @@
     "rete-area-plugin": "^2.0.0"
   },
   "devDependencies": {
+    "globals": "^15.9.0",
     "rete": "^2.0.1",
     "rete-area-plugin": "^2.0.0",
-    "rete-cli": "^1.0.2",
+    "rete-cli": "~2.0.1",
     "rollup-plugin-sass": "1.12.17",
     "typescript": "4.8.4"
   },

src/comment.ts

@@ -17,11 +17,11 @@
 
   constructor(
     public text: string,
     public area: BaseAreaPlugin<ExpectedSchemes, any>,
     private events?: {
-      contextMenu?: null | (() => void),
-      pick?: null | (() => void),
-      translate?: null | ((dx: number, dy: number, sources?: NodeId[]) => void),
+      contextMenu?: null | (() => void)
+      pick?: null | (() => void)
+      translate?: null | ((dx: number, dy: number, sources?: NodeId[]) => void)
       drag?: null | (() => void)
     }
   ) {
@@ -41,13 +41,15 @@
       },
       {
         start: () => {
           this.prevPosition = { ...area.area.pointer }
 
-          this.events?.pick && this.events?.pick()
+          if (this.events?.pick) {
+            this.events.pick()
+          }
         },
         translate: () => {
           if (this.prevPosition) {
             const pointer = { ...area.area.pointer }
             const dx = pointer.x - this.prevPosition.x
             const dy = pointer.y - this.prevPosition.y
 
@@ -57,7 +59,9 @@
         },
         drag: () => {
           this.prevPosition = null
-          this.events?.drag && this.events?.drag()
+          if (this.events?.drag) {
+            this.events.drag()
+          }
         }
       }
     )
@@ -65,7 +69,7 @@
   }
 
   linkTo(ids: NodeId[]) {
     this.links = ids || []
   }
 
   linkedTo(nodeId: NodeId) {
@@ -76,15 +80,17 @@
     e.preventDefault()
     e.stopPropagation()
 
-    this.events?.contextMenu && this.events?.contextMenu()
+    if (this.events?.contextMenu) {
+      this.events.contextMenu()
+    }
   }
 
   translate(dx: number, dy: number, sources?: NodeId[]) {
     this.x += dx
     this.y += dy
 
     if (this.events?.translate) {
-      this.events?.translate(dx, dy, sources)
+      this.events.translate(dx, dy, sources)
     }
     this.update()
   }

src/extensions/selectable.ts

@@ -10,10 +10,10 @@
  * @param selector Selector instance
  * @param accumulating Accumulating state
  */
 export function selectable<S extends ExpectedSchemes, K>(plugin: CommentPlugin<S, K>, selector: Selector, accumulating: { active(): boolean }) {
-  // eslint-disable-next-line max-statements
+  // eslint-disable-next-line max-statements, complexity
   plugin.addPipe(context => {
-    if (!('type' in context)) return context
+    if (!context || typeof context !== 'object' || !('type' in context)) return context
 
     if (context.type === 'commentlinktranslate') {
       const { link } = context.data

src/frame-comment.ts

@@ -12,16 +12,16 @@
 
   constructor(
     text: string,
     area: BaseAreaPlugin<ExpectedSchemes, any>,
     private editor: NodeEditor<ExpectedSchemes>,
     events?: {
-      contextMenu?: (comment: FrameComment) => void,
-      pick?: (comment: FrameComment) => void,
-      translate?: (comment: FrameComment, dx: number, dy: number, sources?: NodeId[]) => void,
+      contextMenu?: (comment: FrameComment) => void
+      pick?: (comment: FrameComment) => void
+      translate?: (comment: FrameComment, dx: number, dy: number, sources?: NodeId[]) => void
     }
   ) {
     super(text, area, {
       contextMenu: () => events?.contextMenu && events.contextMenu(this),
       pick: () => events?.pick && events.pick(this),
       translate: (dx, dy, sources) => events?.translate && events.translate(this, dx, dy, sources),
       drag: () => 1
@@ -87,7 +87,7 @@
   public update() {
     super.update()
 
-    this.nested.style.width = this.width + 'px'
-    this.nested.style.height = this.height + 'px'
+    this.nested.style.width = `${this.width}px`
+    this.nested.style.height = `${this.height}px`
   }
 }

src/index.ts

@@ -63,7 +63,7 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
 
     // eslint-disable-next-line max-statements, complexity
     this.addPipe(context => {
-      if (!('type' in context)) return context
+      if (!context || typeof context !== 'object' || !('type' in context)) return context
 
       if (context.type === 'nodepicked') {
         picked.push(context.data.id)
@@ -108,12 +108,13 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
         comment.links
           .filter(linkId => !sources?.includes(linkId))
           .map(linkId => ({ linkId, view: this.area.nodeViews.get(linkId) }))
+          // eslint-disable-next-line @typescript-eslint/no-misused-promises
           .forEach(async ({ linkId, view }) => {
             if (!view) return
             // prevent an infinite loop if a node is selected and translated along with the selected comment
             if (!await this.emit({ type: 'commentlinktranslate', data: { id, link: linkId } })) return
 
-            if (!isTranslating(linkId)) translate(linkId, view.position.x + dx, view.position.y + dy)
+            if (!isTranslating(linkId)) void translate(linkId, view.position.x + dx, view.position.y + dy)
           })
       }
       if (context.type === 'nodedragged') {
@@ -126,7 +127,9 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
             const contains = comment.intersects(id)
             const links = comment.links.filter(nodeId => nodeId !== id)
 
-            comment.linkTo(contains ? [...links, id] : links)
+            comment.linkTo(contains
+              ? [...links, id]
+              : links)
           })
 
         picked = picked.filter(p => p !== id)
@@ -158,7 +161,9 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
     const comment = this.comments.get(id)
 
     if (!comment) throw new Error('comment not found')
-    const newText = this.props?.edit ? await this.props.edit(comment) : prompt('Edit comment', comment.text)
+    const newText = this.props?.edit
+      ? await this.props.edit(comment)
+      : prompt('Edit comment', comment.text)
 
     if (newText !== null) {
       comment.text = newText
@@ -177,12 +182,12 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
    */
   public addInline(text: string, [x, y]: [number, number], link?: string) {
     const comment = new InlineComment(text, this.area, {
-      contextMenu: ({ id }) => this.editComment(id),
-      pick: (data) => {
+      contextMenu: ({ id }) => void this.editComment(id),
+      pick: data => {
         this.area.area.content.reorder(comment.element, null)
-        this.emit({ type: 'commentselected', data })
+        void this.emit({ type: 'commentselected', data })
       },
-      translate: ({ id }, dx, dy, sources) => this.emit({ type: 'commenttranslated', data: { id, dx, dy, sources } })
+      translate: ({ id }, dx, dy, sources) => void this.emit({ type: 'commenttranslated', data: { id, dx, dy, sources } })
     })
 
     comment.x = x
@@ -201,12 +206,12 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
    */
   public addFrame(text: string, links: string[] = []) {
     const comment = new FrameComment(text, this.area, this.editor, {
-      contextMenu: ({ id }) => this.editComment(id),
-      pick: (data) => {
+      contextMenu: ({ id }) => void this.editComment(id),
+      pick: data => {
         this.area.area.content.reorder(comment.element, this.area.area.content.holder.firstChild)
-        this.emit({ type: 'commentselected', data })
+        void this.emit({ type: 'commentselected', data })
       },
-      translate: ({ id }, dx, dy, sources) => this.emit({ type: 'commenttranslated', data: { id, dx, dy, sources } })
+      translate: ({ id }, dx, dy, sources) => void this.emit({ type: 'commenttranslated', data: { id, dx, dy, sources } })
     })
 
     comment.linkTo(links)
@@ -220,7 +225,7 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
     this.comments.set(comment.id, comment)
 
     this.area.area.content.add(comment.element)
-    this.emit({ type: 'commentcreated', data: comment })
+    void this.emit({ type: 'commentcreated', data: comment })
   }
 
   /**
@@ -237,7 +242,7 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
     this.comments.delete(comment.id)
     comment.destroy()
 
-    this.emit({ type: 'commentremoved', data: comment })
+    void this.emit({ type: 'commentremoved', data: comment })
   }
 
   /**
@@ -264,7 +269,7 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
     if (!comment) return
 
     comment.select()
-    this.emit({ type: 'commentselected', data: comment })
+    void this.emit({ type: 'commentselected', data: comment })
   }
 
   /**
@@ -277,13 +282,15 @@ export class CommentPlugin<Schemes extends ExpectedSchemes, K = BaseArea<Schemes
     if (!comment) return
 
     comment.unselect()
-    this.emit({ type: 'commentunselected', data: comment })
+    void this.emit({ type: 'commentunselected', data: comment })
   }
 
   /**
    * Removes all comments
    */
   public clear() {
-    Array.from(this.comments.keys()).map(id => this.delete(id))
+    Array.from(this.comments.keys()).map(id => {
+      this.delete(id)
+    })
   }
 }

src/inline-comment.ts

@@ -14,15 +14,17 @@ export class InlineComment extends Comment {
     area: BaseAreaPlugin<ExpectedSchemes, any>,
     events?: {
       contextMenu?: (comment: InlineComment) => void
-      pick?: (comment: InlineComment) => void,
+      pick?: (comment: InlineComment) => void
       translate?: (comment: InlineComment, dx: number, dy: number, sources?: NodeId[]) => void
     }
   ) {
     super(text, area, {
       contextMenu: () => events?.contextMenu && events.contextMenu(this),
       pick: () => events?.pick && events.pick(this),
       translate: (dx, dy, sources) => events?.translate && events.translate(this, dx, dy, sources),
-      drag: () => this.link()
+      drag: () => {
+        this.link()
+      }
     })
 
     this.nested.className = 'inline-comment'
@@ -31,7 +33,9 @@ export class InlineComment extends Comment {
   link() {
     const intersection = this.getIntersectNode()
 
-    this.linkTo(intersection ? [intersection.id] : [])
+    this.linkTo(intersection
+      ? [intersection.id]
+      : [])
   }
 
   getIntersectNode() {

src/utils.ts

@@ -7,19 +7,19 @@ export type Rect = { left: number, top: number, right: number, bottom: number }
 
 export function intersectRect(r1: Rect, r2: Rect) {
   return !(
-    r2.left > r1.right ||
-    r2.right < r1.left ||
-    r2.top > r1.bottom ||
-    r2.bottom < r1.top
+    r2.left > r1.right
+    || r2.right < r1.left
+    || r2.top > r1.bottom
+    || r2.bottom < r1.top
   )
 }
 
 export function containsRect(r1: Rect, r2: Rect) {
   return (
-    r2.left > r1.left &&
-    r2.right < r1.right &&
-    r2.top > r1.top &&
-    r2.bottom < r1.bottom
+    r2.left > r1.left
+    && r2.right < r1.right
+    && r2.top > r1.top
+    && r2.bottom < r1.bottom
   )
 }
 
@@ -61,12 +61,12 @@ export function nodesBBox<S extends ExpectedSchemes>(editor: NodeEditor<S>, area
 }
 
 export function trackedTranslate<S extends ExpectedSchemes, T>(props: { area: BaseAreaPlugin<S, T> }): {
-  translate: (id: string, x: number, y: number) => Promise<void>,
+  translate: (id: string, x: number, y: number) => Promise<void>
   isTranslating: (id: NodeId) => boolean
 } {
   const active = new Map<NodeId, number>()
-  const increment = (id: NodeId) => active.set(id, (active.get(id) || 0) + 1)
-  const decrement = (id: NodeId) => active.set(id, (active.get(id) || 0) - 1)
+  const increment = (id: NodeId) => active.set(id, (active.get(id) ?? 0) + 1)
+  const decrement = (id: NodeId) => active.set(id, (active.get(id) ?? 0) - 1)
 
   return {
     async translate(id, x, y) {
@@ -83,7 +83,7 @@ export function trackedTranslate<S extends ExpectedSchemes, T>(props: { area: Ba
       }
     },
     isTranslating(id) {
-      return (active.get(id) || 0) > 0
+      return (active.get(id) ?? 0) > 0
     }
   }
 }

tsconfig.json

@@ -1,6 +1,4 @@
 {
-    "compilerOptions": {
-        "strict": true
-    },
+    "extends": "rete-cli/configs/tsconfig.json",
     "include": ["src"]
 }