diff options
author | Joas Schilling <213943+nickvergessen@users.noreply.github.com> | 2022-08-31 22:03:49 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-08-31 22:03:49 +0300 |
commit | db1af53f1760858562029435fb209411c4251457 (patch) | |
tree | 450e61916c35b7982babaca8354dffd93644032b | |
parent | ec558052b31f88398b654dab3498b2d33710014a (diff) | |
parent | 4dc5d0e243dc985aa1af480bdaffbda3cf883f58 (diff) |
Merge pull request #7822 from nextcloud/enh/references
Implement link previews
-rw-r--r-- | jest.config.js | 1 | ||||
-rw-r--r-- | package-lock.json | 67 | ||||
-rw-r--r-- | package.json | 2 | ||||
-rw-r--r-- | src/components/LobbyScreen.vue | 2 | ||||
-rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/Message.vue | 28 | ||||
-rw-r--r-- | src/components/Quote.vue | 2 | ||||
-rw-r--r-- | webpack.js | 2 |
7 files changed, 73 insertions, 31 deletions
diff --git a/jest.config.js b/jest.config.js index 7907ef694..9aa23e823 100644 --- a/jest.config.js +++ b/jest.config.js @@ -24,6 +24,7 @@ const ignorePatterns = [ 'vue-material-design-icons', '@juliushaertl', + '@nextcloud/vue-richtext', 'tributejs', '@nextcloud/vue', 'splitpanes', diff --git a/package-lock.json b/package-lock.json index 45cc82eed..b56eb91e7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,6 @@ "version": "15.0.0", "license": "agpl", "dependencies": { - "@juliushaertl/vue-richtext": "^0.3.3", "@nextcloud/auth": "^2.0.0", "@nextcloud/axios": "^2.0.0", "@nextcloud/browser-storage": "^0.1.1", @@ -23,6 +22,7 @@ "@nextcloud/router": "^2.0.0", "@nextcloud/vue": "^6.0.0-beta.4", "@nextcloud/vue-dashboard": "^2.0.1", + "@nextcloud/vue-richtext": "^2.0.0", "attachmediastream": "^2.1.0", "color.js": "^1.2.0", "crypto-js": "^4.1.1", @@ -2444,18 +2444,6 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, - "node_modules/@juliushaertl/vue-richtext": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@juliushaertl/vue-richtext/-/vue-richtext-0.3.3.tgz", - "integrity": "sha512-OmAtQfXY5ZkOq6CxE79RVAKTo60fS0HAX2x6MMfHUmTlZgtQQqSxlvIJUZEOo7EiJwD84OVMY0G9holV1iwgTA==", - "dependencies": { - "core-js": "^3.6.4", - "vue": "^2.6.12" - }, - "engines": { - "node": ">=10.0.0" - } - }, "node_modules/@nextcloud/auth": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@nextcloud/auth/-/auth-2.0.0.tgz", @@ -2970,6 +2958,32 @@ "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==" }, + "node_modules/@nextcloud/vue-richtext": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@nextcloud/vue-richtext/-/vue-richtext-2.0.0.tgz", + "integrity": "sha512-Z/AbweVmIB8shWZVLI0kUPrJnkCBlU5xIkkfv+RPFepLY7eZ+ttm5HRhLGqgFyXFNf4RIM7yGt/l6K35XcEX2A==", + "dependencies": { + "@nextcloud/axios": "^2.0.0", + "@nextcloud/router": "^2.0.0", + "clone": "^2.1.2", + "vue": "^2.7.8" + }, + "engines": { + "node": ">=14.0.0", + "npm": ">=7.0.0" + }, + "peerDependencies": { + "vue": "^2.7.8" + } + }, + "node_modules/@nextcloud/vue-richtext/node_modules/clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==", + "engines": { + "node": ">=0.8" + } + }, "node_modules/@nextcloud/vue/node_modules/@babel/polyfill": { "version": "7.12.1", "resolved": "https://registry.npmjs.org/@babel/polyfill/-/polyfill-7.12.1.tgz", @@ -27976,15 +27990,6 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, - "@juliushaertl/vue-richtext": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@juliushaertl/vue-richtext/-/vue-richtext-0.3.3.tgz", - "integrity": "sha512-OmAtQfXY5ZkOq6CxE79RVAKTo60fS0HAX2x6MMfHUmTlZgtQQqSxlvIJUZEOo7EiJwD84OVMY0G9holV1iwgTA==", - "requires": { - "core-js": "^3.6.4", - "vue": "^2.6.12" - } - }, "@nextcloud/auth": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@nextcloud/auth/-/auth-2.0.0.tgz", @@ -28468,6 +28473,24 @@ } } }, + "@nextcloud/vue-richtext": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@nextcloud/vue-richtext/-/vue-richtext-2.0.0.tgz", + "integrity": "sha512-Z/AbweVmIB8shWZVLI0kUPrJnkCBlU5xIkkfv+RPFepLY7eZ+ttm5HRhLGqgFyXFNf4RIM7yGt/l6K35XcEX2A==", + "requires": { + "@nextcloud/axios": "^2.0.0", + "@nextcloud/router": "^2.0.0", + "clone": "^2.1.2", + "vue": "^2.7.8" + }, + "dependencies": { + "clone": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz", + "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==" + } + } + }, "@nextcloud/webpack-vue-config": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/@nextcloud/webpack-vue-config/-/webpack-vue-config-5.3.0.tgz", diff --git a/package.json b/package.json index 7fe6ab221..9810becd2 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,6 @@ "stylelint:fix": "stylelint css/*.css css/*.scss src/**/*.scss src/**/*.vue --fix" }, "dependencies": { - "@juliushaertl/vue-richtext": "^0.3.3", "@nextcloud/auth": "^2.0.0", "@nextcloud/axios": "^2.0.0", "@nextcloud/browser-storage": "^0.1.1", @@ -31,6 +30,7 @@ "@nextcloud/router": "^2.0.0", "@nextcloud/vue": "^6.0.0-beta.4", "@nextcloud/vue-dashboard": "^2.0.1", + "@nextcloud/vue-richtext": "^2.0.0", "attachmediastream": "^2.1.0", "color.js": "^1.2.0", "crypto-js": "^4.1.1", diff --git a/src/components/LobbyScreen.vue b/src/components/LobbyScreen.vue index 7b7a9490d..ed936711d 100644 --- a/src/components/LobbyScreen.vue +++ b/src/components/LobbyScreen.vue @@ -49,7 +49,7 @@ <script> import moment from '@nextcloud/moment' -import RichText from '@juliushaertl/vue-richtext' +import RichText from '@nextcloud/vue-richtext' import SetGuestUsername from './SetGuestUsername.vue' import Lobby from './missingMaterialDesignIcons/Lobby.vue' diff --git a/src/components/MessagesList/MessagesGroup/Message/Message.vue b/src/components/MessagesList/MessagesGroup/Message/Message.vue index 1ea27ae87..9cb6b1cf9 100644 --- a/src/components/MessagesList/MessagesGroup/Message/Message.vue +++ b/src/components/MessagesList/MessagesGroup/Message/Message.vue @@ -52,11 +52,17 @@ the main body of the message as well as a quote. </div> </div> <div v-else-if="showJoinCallButton" class="message-body__main__text call-started"> - <RichText :text="message" :arguments="richParameters" :autolink="true" /> + <RichText :text="message" + :arguments="richParameters" + :autolink="true" + :reference-limit="10" /> <CallButton /> </div> <div v-else-if="showResultsButton" class="message-body__main__text system-message"> - <RichText :text="message" :arguments="richParameters" :autolink="true" /> + <RichText :text="message" + :arguments="richParameters" + :autolink="true" + :reference-limit="10" /> <!-- Displays only the "see results" button with the results modal --> <Poll :id="messageParameters.poll.id" :poll-name="messageParameters.poll.name" @@ -64,11 +70,17 @@ the main body of the message as well as a quote. :show-as-button="true" /> </div> <div v-else-if="isDeletedMessage" class="message-body__main__text deleted-message"> - <RichText :text="message" :arguments="richParameters" :autolink="true" /> + <RichText :text="message" + :arguments="richParameters" + :autolink="true" + :reference-limit="10" /> </div> <div v-else class="message-body__main__text" :class="{'system-message': isSystemMessage}"> <Quote v-if="parent" :parent-id="parent" v-bind="quote" /> - <RichText :text="message" :arguments="richParameters" :autolink="true" /> + <RichText :text="message" + :arguments="richParameters" + :autolink="true" + :reference-limit="10" /> </div> <div v-if="!isDeletedMessage" class="message-body__main__right"> <span v-tooltip.auto="messageDate" @@ -187,7 +199,7 @@ import DeckCard from './MessagePart/DeckCard.vue' import DefaultParameter from './MessagePart/DefaultParameter.vue' import FilePreview from './MessagePart/FilePreview.vue' import Mention from './MessagePart/Mention.vue' -import RichText from '@juliushaertl/vue-richtext' +import RichText from '@nextcloud/vue-richtext' import AlertCircle from 'vue-material-design-icons/AlertCircle.vue' import Check from 'vue-material-design-icons/Check.vue' import CheckAll from 'vue-material-design-icons/CheckAll.vue' @@ -811,6 +823,7 @@ export default { </script> <style lang="scss" scoped> +@import '@nextcloud/vue-richtext/dist/style.css'; @import '../../../../assets/variables'; .message:hover .normal-message-body { @@ -836,6 +849,7 @@ export default { min-width: 100%; &__text { flex: 0 1 600px; + max-width: 600px; color: var(--color-text-light); .single-emoji { font-size: 250%; @@ -866,6 +880,10 @@ export default { ::v-deep .rich-text--wrapper { white-space: pre-wrap; word-break: break-word; + + .rich-text--reference-widget { + width: calc(100% + 132px); + } } &--quote { diff --git a/src/components/Quote.vue b/src/components/Quote.vue index eb868f1a6..dd361b6e7 100644 --- a/src/components/Quote.vue +++ b/src/components/Quote.vue @@ -59,7 +59,7 @@ components. <script> import NcButton from '@nextcloud/vue/dist/Components/NcButton.js' import Close from 'vue-material-design-icons/Close.vue' -import RichText from '@juliushaertl/vue-richtext' +import RichText from '@nextcloud/vue-richtext' import FilePreview from './MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue' import DefaultParameter from './MessagesList/MessagesGroup/Message/MessagePart/DefaultParameter.vue' import { EventBus } from '../services/EventBus.js' diff --git a/webpack.js b/webpack.js index bdf24fa99..0ed882d69 100644 --- a/webpack.js +++ b/webpack.js @@ -23,7 +23,7 @@ webpackConfig.output.assetModuleFilename = '[name][ext]?v=[contenthash]' // Edit JS rule webpackRules.RULE_JS.exclude = BabelLoaderExcludeNodeModulesExcept([ - '@juliushaertl/vue-richtext', + '@nextcloud/vue-richtext', '@nextcloud/event-bus', '@nextcloud/vue-dashboard', 'ansi-regex', |