From eff7b71f4302329cb76d214b5b6aba1bbdc71fd8 Mon Sep 17 00:00:00 2001 From: Andrey Sobolev Date: Tue, 19 Mar 2024 11:47:07 +0700 Subject: [PATCH] UBERF-6066: Fix component manager state (#5009) --- common/config/rush/pnpm-lock.yaml | 21 ++++----- .../src/components/extensions/manager.ts | 5 ++- packages/text-editor/src/kits/default-kit.ts | 12 +---- packages/text-editor/src/kits/editor-kit.ts | 4 +- packages/text/package.json | 1 + packages/text/src/kits/server-kit.ts | 3 ++ .../extension => text/src/nodes}/codeblock.ts | 45 ++++++++++++++++++- packages/text/src/nodes/index.ts | 1 + .../src/components/CreateIssue.svelte | 3 +- 9 files changed, 65 insertions(+), 30 deletions(-) rename packages/{text-editor/src/components/extension => text/src/nodes}/codeblock.ts (66%) diff --git a/common/config/rush/pnpm-lock.yaml b/common/config/rush/pnpm-lock.yaml index 018d7ba8ee..a66d883998 100644 --- a/common/config/rush/pnpm-lock.yaml +++ b/common/config/rush/pnpm-lock.yaml @@ -1076,6 +1076,9 @@ dependencies: express: specifier: ^4.18.3 version: 4.18.3 + express-fileupload: + specifier: ^1.4.3 + version: 1.5.0 express-static-gzip: specifier: ^2.1.7 version: 2.1.7 @@ -9754,13 +9757,6 @@ packages: jest-util: 29.7.0 dev: false - /express-fileupload@1.4.3: - resolution: {integrity: sha512-vRzZo2YELm68DfR/CX8RMXgeK9BTAANxigrKACPjCXFGEzkCt/QWbqaIXP3W61uaX/hLj0CAo3/EVelpSQXkqA==} - engines: {node: '>=12.0.0'} - dependencies: - busboy: 1.6.0 - dev: false - /express-fileupload@1.5.0: resolution: {integrity: sha512-jSW3w9evqM37VWkEPkL2Ck5wUo2a8qa03MH+Ou/0ZSTpNlQFBvSLjU12k2nYcHhaMPv4JVvv6+Ac1OuLgUZb7w==} engines: {node: '>=12.0.0'} @@ -18299,7 +18295,7 @@ packages: dev: false file:projects/front.tgz(esbuild@0.20.1): - resolution: {integrity: sha512-JFdC8n6d9GwIhrZ/XYnaoTZsqNetJ7udjL85tuXg3Cayq6j2hDa1L2LXN0NcBwrt3kCzGLpnPZRVJepMjJsCAA==, tarball: file:projects/front.tgz} + resolution: {integrity: sha512-+SAlNGyDeyfdp+Y3dGdI8HgJpR1Yrxfqrvbrh0OXualjj7rwix5GUwuiW0OHA6CDTrv4ZYryoeVEZNlJVgSpNQ==, tarball: file:projects/front.tgz} id: file:projects/front.tgz name: '@rush-temp/front' version: 0.0.0 @@ -20245,7 +20241,7 @@ packages: dev: false file:projects/model-time.tgz: - resolution: {integrity: sha512-OUG+qlKFJwY/3y2wzWTvlrg/mt2OpvYAiGyq3b6LizsQF86AS6EV/LYlLZvhiyuD1fPboPF27UuAry85LiaMlw==, tarball: file:projects/model-time.tgz} + resolution: {integrity: sha512-bNDdV8UV4BigbZLLoO4HKeCU5KrBaxI9+rNVGx7K/hdQa1EVA7C5H+0PsOfTAbXDYl1W/hOJuWcApuFWn5kkAA==, tarball: file:projects/model-time.tgz} name: '@rush-temp/model-time' version: 0.0.0 dependencies: @@ -20789,7 +20785,7 @@ packages: eslint-plugin-n: 15.7.0(eslint@8.56.0) eslint-plugin-promise: 6.1.1(eslint@8.56.0) express: 4.18.3 - express-fileupload: 1.4.3 + express-fileupload: 1.5.0 jest: 29.7.0(@types/node@20.11.19)(ts-node@10.9.2) prettier: 3.2.5 prettier-plugin-svelte: 3.2.1(prettier@3.2.5)(svelte@4.2.11) @@ -23814,12 +23810,13 @@ packages: dev: false file:projects/text.tgz(@types/node@20.11.19)(esbuild@0.20.1)(ts-node@10.9.2): - resolution: {integrity: sha512-uLTGoFcGUmTSIp0MgrgLU2HBEFXFczn0iak2Qyj/Q/G1k17AKmEC4fEAD+RELpE7noZ4LtDFiFiRVS47atQKrg==, tarball: file:projects/text.tgz} + resolution: {integrity: sha512-tmB4qTcKUuy+7dmuWouLx1p0H1dBy5z7KkVQiJzXE3CFkLbdc4M1c8H10bKsnlpvEGgNe/NJ5qhljvxsFA0Jcw==, tarball: file:projects/text.tgz} id: file:projects/text.tgz name: '@rush-temp/text' version: 0.0.0 dependencies: '@tiptap/core': 2.2.3(@tiptap/pm@2.2.3) + '@tiptap/extension-code-block': 2.2.3(@tiptap/core@2.2.3)(@tiptap/pm@2.2.3) '@tiptap/extension-gapcursor': 2.2.3(@tiptap/core@2.2.3)(@tiptap/pm@2.2.3) '@tiptap/extension-heading': 2.2.3(@tiptap/core@2.2.3) '@tiptap/extension-highlight': 2.2.3(@tiptap/core@2.2.3) @@ -23945,7 +23942,7 @@ packages: dev: false file:projects/time-resources.tgz(@types/node@20.11.19)(esbuild@0.20.1)(postcss-load-config@4.0.2)(postcss@8.4.35)(ts-node@10.9.2): - resolution: {integrity: sha512-S8FOGEB3vL0jc/8WYVha5iZvzlDAzrtObjh/u3MW1plYhWP3wqPb/RiCPsgVggJpmQMGevEYW76H7bWzyN4kOA==, tarball: file:projects/time-resources.tgz} + resolution: {integrity: sha512-C9v36hBLOWZUBJai1N2uGHpY0tOKxMZeqpGYbr5MBW/EwToFHxih4nxgGdHPFGdJ/vKGChp3zRwPaZhtjaWcMQ==, tarball: file:projects/time-resources.tgz} id: file:projects/time-resources.tgz name: '@rush-temp/time-resources' version: 0.0.0 diff --git a/packages/presentation/src/components/extensions/manager.ts b/packages/presentation/src/components/extensions/manager.ts index d3df25467e..19a1240557 100644 --- a/packages/presentation/src/components/extensions/manager.ts +++ b/packages/presentation/src/components/extensions/manager.ts @@ -9,7 +9,7 @@ import { } from '@hcengineering/core' import { getResource } from '@hcengineering/platform' import { onDestroy } from 'svelte' -import { writable, type Writable } from 'svelte/store' +import { get, writable, type Writable } from 'svelte/store' import { type LiveQuery } from '../..' import presentation from '../../plugin' import { type DocCreatePhase, type DocCreateExtension } from '../../types' @@ -59,8 +59,9 @@ export class DocCreateExtensionManager { phase: DocCreatePhase ): Promise { for (const e of this._extensions) { + const state = get(this.getState(e._id)) const applyOp = await getResource(e.apply) - await applyOp?.(ops, docId, space, data, this.getState(e._id), phase) + await applyOp?.(ops, docId, space, data, state, phase) } } diff --git a/packages/text-editor/src/kits/default-kit.ts b/packages/text-editor/src/kits/default-kit.ts index 77e1d94b98..94459fd151 100644 --- a/packages/text-editor/src/kits/default-kit.ts +++ b/packages/text-editor/src/kits/default-kit.ts @@ -13,9 +13,9 @@ // limitations under the License. // +import { codeBlockOptions } from '@hcengineering/text' import { Extension } from '@tiptap/core' import { type CodeOptions } from '@tiptap/extension-code' -import { type CodeBlockOptions } from '@tiptap/extension-code-block' import type { Level } from '@tiptap/extension-heading' import Highlight from '@tiptap/extension-highlight' import Link from '@tiptap/extension-link' @@ -35,16 +35,6 @@ export const codeOptions: CodeOptions = { class: 'proseCode' } } - -export const codeBlockOptions: CodeBlockOptions = { - languageClassPrefix: 'language-', - exitOnArrowDown: true, - exitOnTripleEnter: true, - HTMLAttributes: { - class: 'proseCodeBlock' - } -} - export const DefaultKit = Extension.create({ name: 'defaultKit', diff --git a/packages/text-editor/src/kits/editor-kit.ts b/packages/text-editor/src/kits/editor-kit.ts index 6f8c4d1de7..b665aed6ad 100644 --- a/packages/text-editor/src/kits/editor-kit.ts +++ b/packages/text-editor/src/kits/editor-kit.ts @@ -21,9 +21,9 @@ import TaskItem from '@tiptap/extension-task-item' import TaskList from '@tiptap/extension-task-list' import Underline from '@tiptap/extension-underline' -import { DefaultKit, type DefaultKitOptions, codeBlockOptions } from './default-kit' +import { DefaultKit, type DefaultKitOptions } from './default-kit' -import { CodeBlockExtension } from '../components/extension/codeblock' +import { CodeBlockExtension, codeBlockOptions } from '@hcengineering/text' import { CodemarkExtension } from '../components/extension/codemark' import { NodeUuidExtension } from '../components/extension/nodeUuid' import { Table, TableCell, TableRow } from '../components/extension/table' diff --git a/packages/text/package.json b/packages/text/package.json index ea33525480..425a0d9566 100644 --- a/packages/text/package.json +++ b/packages/text/package.json @@ -50,6 +50,7 @@ "@tiptap/extension-task-item": "^2.1.12", "@tiptap/extension-task-list": "^2.1.12", "@tiptap/extension-typography": "^2.1.12", + "@tiptap/extension-code-block": "^2.1.12", "@tiptap/suggestion": "^2.1.12", "prosemirror-model": "^1.19.2", "yjs": "^13.5.52", diff --git a/packages/text/src/kits/server-kit.ts b/packages/text/src/kits/server-kit.ts index cd8d6c1f69..8b761db17a 100644 --- a/packages/text/src/kits/server-kit.ts +++ b/packages/text/src/kits/server-kit.ts @@ -28,6 +28,7 @@ import { ImageNode, ImageOptions } from '../nodes/image' import { ReferenceNode } from '../nodes/reference' import { TodoItemNode, TodoListNode } from '../nodes/todo' +import { CodeBlockExtension, codeBlockOptions } from '../nodes' import { DefaultKit, DefaultKitOptions } from './default-kit' const headingLevels: Level[] = [1, 2, 3, 4, 5, 6] @@ -70,10 +71,12 @@ export const ServerKit = Extension.create({ return [ DefaultKit.configure({ ...this.options, + codeBlock: false, heading: { levels: headingLevels } }), + CodeBlockExtension.configure(codeBlockOptions), ...tableExtensions, ...taskListExtensions, ...fileExtensions, diff --git a/packages/text-editor/src/components/extension/codeblock.ts b/packages/text/src/nodes/codeblock.ts similarity index 66% rename from packages/text-editor/src/components/extension/codeblock.ts rename to packages/text/src/nodes/codeblock.ts index 2447fb3b8e..763f5d9a7c 100644 --- a/packages/text-editor/src/components/extension/codeblock.ts +++ b/packages/text/src/nodes/codeblock.ts @@ -14,7 +14,16 @@ // import { isActive } from '@tiptap/core' -import CodeBlock from '@tiptap/extension-code-block' +import CodeBlock, { CodeBlockOptions } from '@tiptap/extension-code-block' + +export const codeBlockOptions: CodeBlockOptions = { + languageClassPrefix: 'language-', + exitOnArrowDown: true, + exitOnTripleEnter: true, + HTMLAttributes: { + class: 'proseCodeBlock' + } +} export const CodeBlockExtension = CodeBlock.extend({ addCommands () { @@ -67,5 +76,39 @@ export const CodeBlockExtension = CodeBlock.extend({ return commands.toggleNode(this.name, 'paragraph', attributes) } } + }, + addAttributes () { + return { + language: { + default: null, + parseHTML: (element) => { + const { languageClassPrefix } = this.options + let fchild = element.firstElementChild + if (fchild == null) { + for (const c of element.childNodes) { + if (c.nodeType === 1) { + // According to https://developer.mozilla.org/en-US/docs/Web/API/Node + fchild = c as Element + } + } + } + const classNames = [...Array.from(fchild?.classList ?? [])] + if (classNames.length === 0 && fchild?.className !== undefined) { + classNames.push(fchild?.className) + } + const languages = classNames + .filter((className) => className.startsWith(languageClassPrefix)) + .map((className) => className.replace(languageClassPrefix, '')) + const language = languages[0] + + if (language == null) { + return null + } + + return language + }, + rendered: false + } + } } }) diff --git a/packages/text/src/nodes/index.ts b/packages/text/src/nodes/index.ts index 43f09f43fa..a854411b8e 100644 --- a/packages/text/src/nodes/index.ts +++ b/packages/text/src/nodes/index.ts @@ -17,4 +17,5 @@ export * from './image' export * from './reference' export * from './todo' export * from './file' +export * from './codeblock' export { getDataAttribute } from './utils' diff --git a/plugins/tracker-resources/src/components/CreateIssue.svelte b/plugins/tracker-resources/src/components/CreateIssue.svelte index fed7d6a302..4fd3e4e2ae 100644 --- a/plugins/tracker-resources/src/components/CreateIssue.svelte +++ b/plugins/tracker-resources/src/components/CreateIssue.svelte @@ -13,10 +13,10 @@ // limitations under the License. -->