From 810cff60129705d298814113de43374f05022f48 Mon Sep 17 00:00:00 2001 From: NGPixel Date: Mon, 4 Sep 2023 21:30:46 +0000 Subject: [PATCH] feat: add mdc parsing --- server/locales/en.json | 1 + server/package-lock.json | 38 +++++++++++++++++++++++ server/package.json | 1 + server/renderers/markdown.mjs | 2 ++ ux/package-lock.json | 39 +++++++++++++++++++++++- ux/package.json | 1 + ux/src/components/FileManager.vue | 15 ++++++++- ux/src/components/PageActionsCol.vue | 4 +-- ux/src/components/RerenderPageDialog.vue | 11 ++++++- ux/src/css/app.scss | 2 +- ux/src/renderers/markdown.js | 2 ++ 11 files changed, 110 insertions(+), 6 deletions(-) diff --git a/server/locales/en.json b/server/locales/en.json index 15f47cf38d..2bdaa87c6b 100644 --- a/server/locales/en.json +++ b/server/locales/en.json @@ -1230,6 +1230,7 @@ "common.actions.properties": "Properties", "common.actions.refresh": "Refresh", "common.actions.rename": "Rename", + "common.actions.rerender": "Rerender", "common.actions.returnToTop": "Return to top", "common.actions.save": "Save", "common.actions.saveAndClose": "Save and Close", diff --git a/server/package-lock.json b/server/package-lock.json index fa19cd4843..d447753ac5 100644 --- a/server/package-lock.json +++ b/server/package-lock.json @@ -80,6 +80,7 @@ "markdown-it-footnote": "3.0.3", "markdown-it-imsize": "2.0.1", "markdown-it-mark": "3.0.1", + "markdown-it-mdc": "0.1.3", "markdown-it-multimd-table": "4.2.2", "markdown-it-sub": "1.0.0", "markdown-it-sup": "1.0.0", @@ -1189,11 +1190,33 @@ "@types/node": "*" } }, + "node_modules/@types/linkify-it": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-3.0.3.tgz", + "integrity": "sha512-pTjcqY9E4nOI55Wgpz7eiI8+LzdYnw3qxXCfHyBDdPbYvbyLgWLJGh8EdPvqawwMK1Uo1794AUkkR38Fr0g+2g==", + "peer": true + }, "node_modules/@types/long": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/@types/long/-/long-4.0.2.tgz", "integrity": "sha512-MqTGEo5bj5t157U6fA/BiDynNkn0YknVdh48CMPkTSpFTVmvao5UQmm7uEF6xBEo7qIMAlY/JSleYaE6VOdpaA==" }, + "node_modules/@types/markdown-it": { + "version": "13.0.1", + "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-13.0.1.tgz", + "integrity": "sha512-SUEb8Frsxs3D5Gg9xek6i6EG6XQ5s+O+ZdQzIPESZVZw3Pv3CPQfjCJBI+RgqZd1IBeu18S0Rn600qpPnEK37w==", + "peer": true, + "dependencies": { + "@types/linkify-it": "*", + "@types/mdurl": "*" + } + }, + "node_modules/@types/mdurl": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-1.0.2.tgz", + "integrity": "sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==", + "peer": true + }, "node_modules/@types/mime": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.1.tgz", @@ -5855,6 +5878,21 @@ "resolved": "https://registry.npmjs.org/markdown-it-mark/-/markdown-it-mark-3.0.1.tgz", "integrity": "sha512-HyxjAu6BRsdt6Xcv6TKVQnkz/E70TdGXEFHRYBGLncRE9lBFwDNLVtFojKxjJWgJ+5XxUwLaHXy+2sGBbDn+4A==" }, + "node_modules/markdown-it-mdc": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/markdown-it-mdc/-/markdown-it-mdc-0.1.3.tgz", + "integrity": "sha512-HHpN0KiRG96C/FhipO6/fAN/v0FgrM96AZLPiywQHuDIT/9GZN82xviuQPnR+u8rz0j66LVxlCkT2d0be0qgWw==", + "dependencies": { + "js-yaml": "^4.1.0" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "@types/markdown-it": "^13.0.1", + "markdown-it": "^13.0.1" + } + }, "node_modules/markdown-it-multimd-table": { "version": "4.2.2", "resolved": "https://registry.npmjs.org/markdown-it-multimd-table/-/markdown-it-multimd-table-4.2.2.tgz", diff --git a/server/package.json b/server/package.json index 449d7acf7b..db731576df 100644 --- a/server/package.json +++ b/server/package.json @@ -105,6 +105,7 @@ "markdown-it-footnote": "3.0.3", "markdown-it-imsize": "2.0.1", "markdown-it-mark": "3.0.1", + "markdown-it-mdc": "0.1.3", "markdown-it-multimd-table": "4.2.2", "markdown-it-sub": "1.0.0", "markdown-it-sup": "1.0.0", diff --git a/server/renderers/markdown.mjs b/server/renderers/markdown.mjs index c01ecdf051..72bb030f40 100644 --- a/server/renderers/markdown.mjs +++ b/server/renderers/markdown.mjs @@ -10,6 +10,7 @@ import mdSub from 'markdown-it-sub' import mdMark from 'markdown-it-mark' import mdMultiTable from 'markdown-it-multimd-table' import mdFootnote from 'markdown-it-footnote' +import mdMdc from 'markdown-it-mdc' import katex from 'katex' import mdImsize from './modules/markdown-it-imsize.mjs' import mdUnderline from './modules/markdown-it-underline.mjs' @@ -71,6 +72,7 @@ export async function render (input, config) { .use(mdMark) .use(mdFootnote) .use(mdImsize) + .use(mdMdc) if (config.underline) { md.use(mdUnderline) diff --git a/ux/package-lock.json b/ux/package-lock.json index 9b63f30d30..e68b29a212 100644 --- a/ux/package-lock.json +++ b/ux/package-lock.json @@ -64,6 +64,7 @@ "markdown-it-footnote": "3.0.3", "markdown-it-imsize": "2.0.1", "markdown-it-mark": "3.0.1", + "markdown-it-mdc": "0.1.3", "markdown-it-multimd-table": "4.2.2", "markdown-it-sub": "1.0.0", "markdown-it-sup": "1.0.0", @@ -1434,12 +1435,34 @@ "dev": true, "license": "MIT" }, + "node_modules/@types/linkify-it": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-3.0.3.tgz", + "integrity": "sha512-pTjcqY9E4nOI55Wgpz7eiI8+LzdYnw3qxXCfHyBDdPbYvbyLgWLJGh8EdPvqawwMK1Uo1794AUkkR38Fr0g+2g==", + "peer": true + }, "node_modules/@types/lodash": { "version": "4.14.195", "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.195.tgz", "integrity": "sha512-Hwx9EUgdwf2GLarOjQp5ZH8ZmblzcbTBC2wtQWNKARBSxM9ezRIAUpeDTgoQRAFB0+8CNWXVA9+MaSOzOF3nPg==", "dev": true }, + "node_modules/@types/markdown-it": { + "version": "13.0.1", + "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-13.0.1.tgz", + "integrity": "sha512-SUEb8Frsxs3D5Gg9xek6i6EG6XQ5s+O+ZdQzIPESZVZw3Pv3CPQfjCJBI+RgqZd1IBeu18S0Rn600qpPnEK37w==", + "peer": true, + "dependencies": { + "@types/linkify-it": "*", + "@types/mdurl": "*" + } + }, + "node_modules/@types/mdurl": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-1.0.2.tgz", + "integrity": "sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==", + "peer": true + }, "node_modules/@types/mime": { "version": "1.3.2", "dev": true, @@ -4911,7 +4934,6 @@ }, "node_modules/js-yaml": { "version": "4.1.0", - "dev": true, "license": "MIT", "dependencies": { "argparse": "^2.0.1" @@ -5328,6 +5350,21 @@ "resolved": "https://registry.npmjs.org/markdown-it-mark/-/markdown-it-mark-3.0.1.tgz", "integrity": "sha512-HyxjAu6BRsdt6Xcv6TKVQnkz/E70TdGXEFHRYBGLncRE9lBFwDNLVtFojKxjJWgJ+5XxUwLaHXy+2sGBbDn+4A==" }, + "node_modules/markdown-it-mdc": { + "version": "0.1.3", + "resolved": "https://registry.npmjs.org/markdown-it-mdc/-/markdown-it-mdc-0.1.3.tgz", + "integrity": "sha512-HHpN0KiRG96C/FhipO6/fAN/v0FgrM96AZLPiywQHuDIT/9GZN82xviuQPnR+u8rz0j66LVxlCkT2d0be0qgWw==", + "dependencies": { + "js-yaml": "^4.1.0" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "@types/markdown-it": "^13.0.1", + "markdown-it": "^13.0.1" + } + }, "node_modules/markdown-it-multimd-table": { "version": "4.2.2", "resolved": "https://registry.npmjs.org/markdown-it-multimd-table/-/markdown-it-multimd-table-4.2.2.tgz", diff --git a/ux/package.json b/ux/package.json index 3b3cc17fd5..9a54b2d804 100644 --- a/ux/package.json +++ b/ux/package.json @@ -69,6 +69,7 @@ "markdown-it-footnote": "3.0.3", "markdown-it-imsize": "2.0.1", "markdown-it-mark": "3.0.1", + "markdown-it-mdc": "0.1.3", "markdown-it-multimd-table": "4.2.2", "markdown-it-sub": "1.0.0", "markdown-it-sup": "1.0.0", diff --git a/ux/src/components/FileManager.vue b/ux/src/components/FileManager.vue index 86a385693f..bcf2915c68 100644 --- a/ux/src/components/FileManager.vue +++ b/ux/src/components/FileManager.vue @@ -247,7 +247,7 @@ q-layout.fileman(view='hHh lpR lFr', container) q-item-section.fileman-filelist-side(side, v-if='item.side') .text-caption {{item.side}} //- RIGHT-CLICK MENU - q-menu( + q-menu.translucent-menu( touch-position context-menu auto-close @@ -264,6 +264,10 @@ q-layout.fileman(view='hHh lpR lFr', container) q-item-section(side) q-icon(name='las la-edit', color='orange') q-item-section {{ t(`common.actions.edit`) }} + q-item(clickable, v-if='item.type === `page`', @click='rerenderPage(item)') + q-item-section(side) + q-icon(name='las la-magic', color='orange') + q-item-section {{ t(`common.actions.rerender`) }} q-item(clickable, v-if='item.type !== `folder`', @click='openItem(item)') q-item-section(side) q-icon(name='las la-eye', color='primary') @@ -786,6 +790,15 @@ function reloadFolder (folderId) { // PAGE METHODS // -------------------------------------- +function rerenderPage (item) { + $q.dialog({ + component: defineAsyncComponent(() => import('src/components/RerenderPageDialog.vue')), + componentProps: { + id: item.id + } + }) +} + function delPage (pageId, pageName) { $q.dialog({ component: defineAsyncComponent(() => import('src/components/PageDeleteDialog.vue')), diff --git a/ux/src/components/PageActionsCol.vue b/ux/src/components/PageActionsCol.vue index 651ebfa56b..a99c4510b6 100644 --- a/ux/src/components/PageActionsCol.vue +++ b/ux/src/components/PageActionsCol.vue @@ -95,7 +95,7 @@ transition-show='jump-left' ) q-list(padding, style='min-width: 225px;') - q-item(clickable, v-if='userStore.can(`manage:pages`)') + q-item(clickable, disabled, v-if='userStore.can(`manage:pages`)') q-item-section.items-center(avatar) q-icon(color='deep-orange-9', name='las la-atom', size='sm') q-item-section @@ -105,7 +105,7 @@ q-icon(color='deep-orange-9', name='las la-magic', size='sm') q-item-section q-item-label Rerender Page - q-item(clickable) + q-item(clickable, disabled) q-item-section.items-center(avatar) q-icon(color='deep-orange-9', name='las la-sun', size='sm') q-item-section diff --git a/ux/src/components/RerenderPageDialog.vue b/ux/src/components/RerenderPageDialog.vue index 10116fcd41..e5b4fcda40 100644 --- a/ux/src/components/RerenderPageDialog.vue +++ b/ux/src/components/RerenderPageDialog.vue @@ -12,6 +12,15 @@ import { useDialogPluginComponent, useQuasar } from 'quasar' import { computed, onMounted, reactive } from 'vue' import { usePageStore } from 'src/stores/page' +// PROPS + +const props = defineProps({ + id: { + type: String, + required: true + } +}) + // EMITS defineEmits([ @@ -52,7 +61,7 @@ async function rerenderPage () { } `, variables: { - id: pageStore.id + id: props.id } }) if (resp?.data?.rerenderPage?.operation?.succeeded) { diff --git a/ux/src/css/app.scss b/ux/src/css/app.scss index b175e480c9..abbd1ed969 100644 --- a/ux/src/css/app.scss +++ b/ux/src/css/app.scss @@ -222,7 +222,7 @@ body::-webkit-scrollbar-thumb { .translucent-menu { @at-root .body--light & { - background-color: rgba(255,255,255,.9); + background-color: rgba(255,255,255,.8); } @at-root .body--dark & { background-color: rgba($dark,.7); diff --git a/ux/src/renderers/markdown.js b/ux/src/renderers/markdown.js index 6f6021fb07..c87783fd47 100644 --- a/ux/src/renderers/markdown.js +++ b/ux/src/renderers/markdown.js @@ -10,6 +10,7 @@ import mdSub from 'markdown-it-sub' import mdMark from 'markdown-it-mark' import mdMultiTable from 'markdown-it-multimd-table' import mdFootnote from 'markdown-it-footnote' +import mdMdc from 'markdown-it-mdc' import katex from 'katex' import mdUnderline from './modules/markdown-it-underline' import mdImsize from './modules/markdown-it-imsize' @@ -72,6 +73,7 @@ export class MarkdownRenderer { .use(mdMark) .use(mdFootnote) .use(mdImsize) + .use(mdMdc) if (config.underline) { this.md.use(mdUnderline)