experimental linters

commit 5b31740d967bb61bfed6a2338d07e8fc6e4957b3
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Tue Jan 19 14:48:00 2021 +0100

    refactoring, disable TS checks for now

commit 6fcc5082287ba4dd5457b8ea6e6d8300efaaafb6
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Tue Jan 19 14:42:14 2021 +0100

    move everything to a new experiments structure

commit 2b5f394ad4c916f7ac364fa03d05e2f4311e9b1d
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Mon Jan 18 20:22:35 2021 +0100

    refactoring

commit 91a3747adca114fbce0972a2a2efa751e94d4ea4
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Mon Jan 18 17:48:59 2021 +0100

    refactoring

commit 4550fa70059060b6702425970ba33bcf6a0f3e66
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Mon Jan 18 17:37:43 2021 +0100

    load plugins in the example

commit a7087af14044673c587c233c44a5e767ff23b160
Author: Hans Pagel <hans.pagel@ueber.io>
Date:   Mon Jan 18 17:31:47 2021 +0100

    init new linter plugin

docs/src/demos/Experiments/Linter/extension/Linter.ts

@@ -0,0 +1,98 @@
+// @ts-nocheck
+import { Extension } from '@tiptap/core'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+import { Plugin, PluginKey, TextSelection } from 'prosemirror-state'
+
+function renderIcon(issue) {
+  const icon = document.createElement('div')
+
+  icon.className = 'lint-icon'
+  icon.title = issue.message
+  icon.issue = issue
+
+  return icon
+}
+
+function runAllLinterPlugins(doc, plugins) {
+  const decorations: [any?] = []
+
+  const results = plugins.map(LinterPlugin => {
+    return new LinterPlugin(doc).scan().getResults()
+  }).flat()
+
+  results.forEach(issue => {
+    decorations.push(Decoration.inline(issue.from, issue.to, {
+      class: 'problem',
+    }),
+    Decoration.widget(issue.from, renderIcon(issue)))
+  })
+
+  return DecorationSet.create(doc, decorations)
+}
+
+export interface LinterOptions {
+  plugins: [any],
+}
+
+export const Linter = Extension.create({
+  name: 'linter',
+
+  defaultOptions: <LinterOptions>{
+    plugins: [],
+  },
+
+  addProseMirrorPlugins() {
+    const { plugins } = this.options
+
+    return [
+      new Plugin({
+        key: new PluginKey('linter'),
+        state: {
+          init(_, { doc }) {
+            return runAllLinterPlugins(doc, plugins)
+          },
+          apply(transaction, prevState) {
+            return transaction.docChanged
+              ? runAllLinterPlugins(transaction.doc, plugins)
+              : prevState
+          },
+        },
+        props: {
+          decorations(state) {
+            return this.getState(state)
+          },
+          handleClick(view, _, event) {
+            if (/lint-icon/.test(event.target.className)) {
+              const { from, to } = event.target.issue
+
+              view.dispatch(
+                view.state.tr
+                  .setSelection(TextSelection.create(view.state.doc, from, to))
+                  .scrollIntoView(),
+              )
+
+              return true
+            }
+          },
+          handleDoubleClick(view, _, event) {
+            if (/lint-icon/.test(event.target.className)) {
+              const prob = event.target.issue
+
+              if (prob.fix) {
+                prob.fix(view)
+                view.focus()
+                return true
+              }
+            }
+          },
+        },
+      }),
+    ]
+  },
+})
+
+declare module '@tiptap/core' {
+  interface AllExtensions {
+    Linter: typeof Linter,
+  }
+}

docs/src/demos/Experiments/Linter/extension/LinterPlugin.ts

@@ -0,0 +1,23 @@
+// @ts-nocheck
+export default class LinterPlugin {
+  protected doc
+
+  private results = []
+
+  constructor(doc: any) {
+    this.doc = doc
+  }
+
+  record(message: string, from: number, to: number, fix?: null) {
+    this.results.push({
+      message,
+      from,
+      to,
+      fix,
+    })
+  }
+
+  getResults() {
+    return this.results
+  }
+}

docs/src/demos/Experiments/Linter/extension/index.ts

@@ -0,0 +1,8 @@
+import { Linter } from './Linter'
+
+export * from './Linter'
+export default Linter
+
+export { BadWords } from './plugins/BadWords'
+export { Punctuation } from './plugins/Punctuation'
+export { HeadingLevel } from './plugins/HeadingLevel'

docs/src/demos/Experiments/Linter/extension/plugins/BadWords.ts

@@ -0,0 +1,26 @@
+// @ts-nocheck
+import LinterPlugin from '../LinterPlugin'
+
+export class BadWords extends LinterPlugin {
+
+  public regex = /\b(obviously|clearly|evidently|simply)\b/ig
+
+  scan() {
+    this.doc.descendants((node: any, position: any) => {
+      if (!node.isText) {
+        return
+      }
+
+      const matches = this.regex.exec(node.text)
+
+      if (matches) {
+        this.record(
+          `Try not to say '${matches[0]}'`,
+          position + matches.index, position + matches.index + matches[0].length,
+        )
+      }
+    })
+
+    return this
+  }
+}

docs/src/demos/Experiments/Linter/extension/plugins/HeadingLevel.ts

@@ -0,0 +1,30 @@
+// @ts-nocheck
+import LinterPlugin from '../LinterPlugin'
+
+export class HeadingLevel extends LinterPlugin {
+  fixHeader(level) {
+    return function ({ state, dispatch }) {
+      dispatch(state.tr.setNodeMarkup(this.from - 1, null, { level }))
+    }
+  }
+
+  scan() {
+    let lastHeadLevel = null
+
+    this.doc.descendants((node, position) => {
+      if (node.type.name == 'heading') {
+        // Check whether heading levels fit under the current level
+        const { level } = node.attrs
+
+        if (lastHeadLevel != null && level > lastHeadLevel + 1) {
+          this.record(`Heading too small (${level} under ${lastHeadLevel})`,
+            position + 1, position + 1 + node.content.size,
+            this.fixHeader(lastHeadLevel + 1))
+        }
+        lastHeadLevel = level
+      }
+    })
+
+    return this
+  }
+}

docs/src/demos/Experiments/Linter/extension/plugins/Punctuation.ts

@@ -0,0 +1,37 @@
+// @ts-nocheck
+import LinterPlugin from '../LinterPlugin'
+
+export class Punctuation extends LinterPlugin {
+  public regex = / ([,.!?:]) ?/g
+
+  fix(replacement: any) {
+    return function ({ state, dispatch }) {
+      dispatch(
+        state.tr.replaceWith(
+          this.from, this.to,
+          state.schema.text(replacement),
+        ),
+      )
+    }
+  }
+
+  scan() {
+    this.doc.descendants((node, position) => {
+      if (!node.isText) {
+        return
+      }
+
+      const matches = this.regex.exec(node.text)
+
+      if (matches) {
+        this.record(
+          'Suspicious spacing around punctuation',
+          position + matches.index, position + matches.index + matches[0].length,
+          this.fix(`${matches[1]} `),
+        )
+      }
+    })
+
+    return this
+  }
+}