fix: yarn 3 on ux project

.devcontainer/devcontainer.json

@@ -46,7 +46,7 @@
 
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	// This can be used to network with other containers or with the host.
-	"forwardPorts": [3000, 5432, 8000],
+	"forwardPorts": [3000, 3001, 5432, 8000],
 
   "portsAttributes": {
     "3000": {
@@ -67,7 +67,7 @@
 	"postCreateCommand": "/docker-init.sh",
 
 	// Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-	// "remoteUser": "node",
+	"remoteUser": "node",
 	"features": {
     "common": {
       "installZsh": true,

.gitignore

@@ -14,7 +14,7 @@ npm/node_modules
 .npm
 .node_repl_history
 npm-debug.log*
-.yarn
+/.yarn
 
 # Generated assets
 /assets

client/client-app.js

@@ -5,11 +5,9 @@ import VueRouter from 'vue-router'
 import VueClipboards from 'vue-clipboards'
 import { ApolloClient } from 'apollo-client'
 import { BatchHttpLink } from 'apollo-link-batch-http'
-import { ApolloLink, split } from 'apollo-link'
-import { WebSocketLink } from 'apollo-link-ws'
+import { ApolloLink } from 'apollo-link'
 import { ErrorLink } from 'apollo-link-error'
 import { InMemoryCache } from 'apollo-cache-inmemory'
-import { getMainDefinition } from 'apollo-utilities'
 import VueApollo from 'vue-apollo'
 import Vuetify from 'vuetify/lib'
 import Velocity from 'velocity-animate'
@@ -50,7 +48,6 @@ store.commit('user/REFRESH_AUTH')
 // ====================================
 
 const graphQLEndpoint = window.location.protocol + '//' + window.location.host + '/graphql'
-const graphQLWSEndpoint = ((window.location.protocol === 'https:') ? 'wss:' : 'ws:') + '//' + window.location.host + '/graphql-subscriptions'
 
 const graphQLLink = ApolloLink.from([
   new ErrorLink(({ graphQLErrors, networkError }) => {
@@ -110,19 +107,8 @@ const graphQLLink = ApolloLink.from([
   })
 ])
 
-const graphQLWSLink = new WebSocketLink({
-  uri: graphQLWSEndpoint,
-  options: {
-    reconnect: true,
-    lazy: true
-  }
-})
-
 window.graphQL = new ApolloClient({
-  link: split(({ query }) => {
-    const { kind, operation } = getMainDefinition(query)
-    return kind === 'OperationDefinition' && operation === 'subscription'
-  }, graphQLWSLink, graphQLLink),
+  link: graphQLLink,
   cache: new InMemoryCache(),
   connectToDevTools: (process.env.node_env === 'development')
 })
@@ -148,30 +134,30 @@ Vue.prototype.Velocity = Velocity
 // Register Vue Components
 // ====================================
 
-Vue.component('admin', () => import(/* webpackChunkName: "admin" */ './components/admin.vue'))
-Vue.component('comments', () => import(/* webpackChunkName: "comments" */ './components/comments.vue'))
-Vue.component('editor', () => import(/* webpackPrefetch: -100, webpackChunkName: "editor" */ './components/editor.vue'))
-Vue.component('history', () => import(/* webpackChunkName: "history" */ './components/history.vue'))
-Vue.component('loader', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/loader.vue'))
-Vue.component('login', () => import(/* webpackPrefetch: true, webpackChunkName: "login" */ './components/login.vue'))
-Vue.component('nav-header', () => import(/* webpackMode: "eager" */ './components/common/nav-header.vue'))
-Vue.component('new-page', () => import(/* webpackChunkName: "new-page" */ './components/new-page.vue'))
-Vue.component('notify', () => import(/* webpackMode: "eager" */ './components/common/notify.vue'))
-Vue.component('not-found', () => import(/* webpackChunkName: "not-found" */ './components/not-found.vue'))
-Vue.component('page-selector', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/page-selector.vue'))
-Vue.component('page-source', () => import(/* webpackChunkName: "source" */ './components/source.vue'))
-Vue.component('profile', () => import(/* webpackChunkName: "profile" */ './components/profile.vue'))
-Vue.component('register', () => import(/* webpackChunkName: "register" */ './components/register.vue'))
-Vue.component('search-results', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/search-results.vue'))
-Vue.component('social-sharing', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/social-sharing.vue'))
-Vue.component('tags', () => import(/* webpackChunkName: "tags" */ './components/tags.vue'))
-Vue.component('unauthorized', () => import(/* webpackChunkName: "unauthorized" */ './components/unauthorized.vue'))
-Vue.component('v-card-chin', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/v-card-chin.vue'))
-Vue.component('v-card-info', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/v-card-info.vue'))
-Vue.component('welcome', () => import(/* webpackChunkName: "welcome" */ './components/welcome.vue'))
-
-Vue.component('nav-footer', () => import(/* webpackChunkName: "theme" */ './themes/' + siteConfig.theme + '/components/nav-footer.vue'))
-Vue.component('page', () => import(/* webpackChunkName: "theme" */ './themes/' + siteConfig.theme + '/components/page.vue'))
+Vue.component('Admin', () => import(/* webpackChunkName: "admin" */ './components/admin.vue'))
+Vue.component('Comments', () => import(/* webpackChunkName: "comments" */ './components/comments.vue'))
+Vue.component('Editor', () => import(/* webpackPrefetch: -100, webpackChunkName: "editor" */ './components/editor.vue'))
+Vue.component('History', () => import(/* webpackChunkName: "history" */ './components/history.vue'))
+Vue.component('Loader', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/loader.vue'))
+Vue.component('Login', () => import(/* webpackPrefetch: true, webpackChunkName: "login" */ './components/login.vue'))
+Vue.component('NavHeader', () => import(/* webpackMode: "eager" */ './components/common/nav-header.vue'))
+Vue.component('NewPage', () => import(/* webpackChunkName: "new-page" */ './components/new-page.vue'))
+Vue.component('Notify', () => import(/* webpackMode: "eager" */ './components/common/notify.vue'))
+Vue.component('NotFound', () => import(/* webpackChunkName: "not-found" */ './components/not-found.vue'))
+Vue.component('PageSelector', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/page-selector.vue'))
+Vue.component('PageSource', () => import(/* webpackChunkName: "source" */ './components/source.vue'))
+Vue.component('Profile', () => import(/* webpackChunkName: "profile" */ './components/profile.vue'))
+Vue.component('Register', () => import(/* webpackChunkName: "register" */ './components/register.vue'))
+Vue.component('SearchResults', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/search-results.vue'))
+Vue.component('SocialSharing', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/social-sharing.vue'))
+Vue.component('Tags', () => import(/* webpackChunkName: "tags" */ './components/tags.vue'))
+Vue.component('Unauthorized', () => import(/* webpackChunkName: "unauthorized" */ './components/unauthorized.vue'))
+Vue.component('VCardChin', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/v-card-chin.vue'))
+Vue.component('VCardInfo', () => import(/* webpackPrefetch: true, webpackChunkName: "ui-extra" */ './components/common/v-card-info.vue'))
+Vue.component('Welcome', () => import(/* webpackChunkName: "welcome" */ './components/welcome.vue'))
+
+Vue.component('NavFooter', () => import(/* webpackChunkName: "theme" */ './themes/' + siteConfig.theme + '/components/nav-footer.vue'))
+Vue.component('Page', () => import(/* webpackChunkName: "theme" */ './themes/' + siteConfig.theme + '/components/page.vue'))
 
 let bootstrap = () => {
   // ====================================

package.json

@@ -8,7 +8,8 @@
   "scripts": {
     "start": "node server",
     "dev": "nodemon server",
-    "dev-legacy": "node dev",
+    "legacy:dev": "node dev",
+    "legacy:build": "webpack --profile --config dev/webpack/webpack.prod.js",
     "test": "eslint --format codeframe --ext .js,.vue . && pug-lint server/views && jest",
     "cypress:open": "cypress open"
   },

ux/.gitignore

@@ -27,3 +27,12 @@ yarn-error.log*
 *.ntvs*
 *.njsproj
 *.sln
+
+# Yarn
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions

ux/.yarnrc.yml

+defaultSemverRangePrefix: ''
+
+enableTelemetry: false
+
+nodeLinker: node-modules
+
+packageExtensions:
+  '@quasar/vite-plugin@*':
+    dependencies:
+      'quasar': '*'
+  'rollup-plugin-visualizer@*':
+    dependencies:
+      'rollup': '*'
+  'v-network-graph@*':
+    dependencies:
+      'd3-force': '*'
+  'autoprefixer@*':
+    dependencies:
+      'postcss': '*'
+  '@intlify/vite-plugin-vue-i18n@*':
+    dependencies:
+      'vite': '*'
+
+plugins:
+  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
+    spec: "@yarnpkg/plugin-interactive-tools"
+
+supportedArchitectures:
+  cpu:
+    - x64
+    - arm64
+  os:
+    - darwin
+    - linux
+    - win32
+
+yarnPath: .yarn/releases/yarn-3.2.0.cjs

ux/package.json

@@ -11,29 +11,29 @@
     "lint": "eslint --ext .js,.vue ./"
   },
   "dependencies": {
-    "@apollo/client": "3.5.10",
-    "@codemirror/autocomplete": "0.19.15",
-    "@codemirror/basic-setup": "0.19.3",
+    "@apollo/client": "3.6.1",
+    "@codemirror/autocomplete": "0.20.0",
+    "@codemirror/basic-setup": "0.20.0",
     "@codemirror/closebrackets": "0.19.2",
-    "@codemirror/commands": "0.19.8",
+    "@codemirror/commands": "0.20.0",
     "@codemirror/comment": "0.19.1",
-    "@codemirror/fold": "0.19.3",
+    "@codemirror/fold": "0.19.4",
     "@codemirror/gutter": "0.19.9",
     "@codemirror/highlight": "0.19.8",
     "@codemirror/history": "0.19.2",
-    "@codemirror/lang-css": "0.19.3",
-    "@codemirror/lang-html": "0.19.4",
-    "@codemirror/lang-javascript": "0.19.7",
-    "@codemirror/lang-json": "0.19.2",
-    "@codemirror/lang-markdown": "0.19.6",
+    "@codemirror/lang-css": "0.20.0",
+    "@codemirror/lang-html": "0.20.0",
+    "@codemirror/lang-javascript": "0.20.0",
+    "@codemirror/lang-json": "0.20.0",
+    "@codemirror/lang-markdown": "0.20.0",
     "@codemirror/matchbrackets": "0.19.4",
-    "@codemirror/search": "0.19.10",
-    "@codemirror/state": "0.19.9",
+    "@codemirror/search": "0.20.1",
+    "@codemirror/state": "0.20.0",
     "@codemirror/tooltip": "0.19.16",
-    "@codemirror/view": "0.19.48",
-    "@lezer/common": "0.15.12",
-    "@quasar/extras": "1.13.5",
-    "@tiptap/core": "2.0.0-beta.174",
+    "@codemirror/view": "0.20.3",
+    "@lezer/common": "0.16.0",
+    "@quasar/extras": "1.13.6",
+    "@tiptap/core": "2.0.0-beta.175",
     "@tiptap/extension-code-block": "2.0.0-beta.37",
     "@tiptap/extension-code-block-lowlight": "2.0.0-beta.68",
     "@tiptap/extension-color": "2.0.0-beta.9",
@@ -44,37 +44,37 @@
     "@tiptap/extension-highlight": "2.0.0-beta.33",
     "@tiptap/extension-history": "2.0.0-beta.21",
     "@tiptap/extension-image": "2.0.0-beta.27",
-    "@tiptap/extension-mention": "2.0.0-beta.95",
+    "@tiptap/extension-mention": "2.0.0-beta.96",
     "@tiptap/extension-placeholder": "2.0.0-beta.48",
     "@tiptap/extension-table": "2.0.0-beta.48",
     "@tiptap/extension-table-cell": "2.0.0-beta.20",
     "@tiptap/extension-table-header": "2.0.0-beta.22",
     "@tiptap/extension-table-row": "2.0.0-beta.19",
-    "@tiptap/extension-task-item": "2.0.0-beta.31",
+    "@tiptap/extension-task-item": "2.0.0-beta.32",
     "@tiptap/extension-task-list": "2.0.0-beta.26",
     "@tiptap/extension-text-align": "2.0.0-beta.29",
     "@tiptap/extension-text-style": "2.0.0-beta.23",
     "@tiptap/extension-typography": "2.0.0-beta.20",
-    "@tiptap/starter-kit": "2.0.0-beta.183",
-    "@tiptap/vue-3": "2.0.0-beta.90",
+    "@tiptap/starter-kit": "2.0.0-beta.184",
+    "@tiptap/vue-3": "2.0.0-beta.91",
     "@vue/apollo-option": "4.0.0-alpha.16",
     "apollo-upload-client": "17.0.0",
-    "browser-fs-access": "0.26.1",
+    "browser-fs-access": "0.29.4",
     "clipboard": "2.0.10",
     "filesize": "8.0.7",
     "filesize-parser": "1.5.0",
-    "graphql": "16.3.0",
+    "graphql": "16.4.0",
     "graphql-tag": "2.12.6",
     "js-cookie": "3.0.1",
     "jwt-decode": "3.1.2",
     "lodash": "4.17.21",
-    "luxon": "2.3.1",
+    "luxon": "2.3.2",
     "pinia": "2.0.13",
     "pug": "3.0.2",
     "quasar": "2.6.6",
     "tippy.js": "6.3.7",
     "uuid": "8.3.2",
-    "v-network-graph": "0.5.9",
+    "v-network-graph": "0.5.13",
     "vue": "3.2.31",
     "vue-i18n": "9.1.9",
     "vue-router": "4.0.14",
@@ -84,19 +84,20 @@
   "devDependencies": {
     "@intlify/vite-plugin-vue-i18n": "3.4.0",
     "@quasar/app-vite": "1.0.0-beta.14",
-    "@types/lodash": "4.14.181",
-    "autoprefixer": "10.4.4",
-    "eslint": "8.13.0",
-    "eslint-config-standard": "17.0.0-1",
+    "@types/lodash": "4.14.182",
+    "autoprefixer": "10.4.5",
+    "eslint": "8.14.0",
+    "eslint-config-standard": "17.0.0",
     "eslint-plugin-import": "2.26.0",
-    "eslint-plugin-n": "15.1.0",
+    "eslint-plugin-n": "15.2.0",
     "eslint-plugin-promise": "6.0.0",
-    "eslint-plugin-vue": "8.6.0"
+    "eslint-plugin-vue": "8.7.1"
   },
   "engines": {
     "node": "^18 || ^16",
     "npm": ">= 6.13.4",
     "yarn": ">= 1.21.1"
   },
-  "eslint.packageManager": "yarn"
+  "eslint.packageManager": "yarn",
+  "packageManager": "yarn@3.2.0"
 }

ux/quasar.config.js

@@ -94,6 +94,7 @@ module.exports = configure(function (/* ctx */) {
     devServer: {
       // https: true
       open: false, // opens browser window automatically
+      port: 3001,
       proxy: {
         '/_graphql': 'http://localhost:3000/graphql'
       }