From ebcccd5192589b56880a5c3bad2ddb6ea86a615c Mon Sep 17 00:00:00 2001 From: Felipe Morato Date: Thu, 16 Mar 2023 12:14:20 +0200 Subject: [PATCH] Update configuration to vue3 --- CHANGELOG.md | 1 + swift_browser_ui_frontend/package.json | 2 +- swift_browser_ui_frontend/pnpm-lock.yaml | 215 +++++++++++++++--- .../src/common/csc-ui-vue-directive.js | 15 ++ .../src/common/csc-ui.js | 23 -- swift_browser_ui_frontend/src/common/i18n.js | 9 + .../src/common/router.js | 14 +- swift_browser_ui_frontend/src/common/store.js | 6 +- .../src/components/CopyFolderModal.vue | 3 +- .../src/components/CreateFolderModal.vue | 3 +- .../src/components/ObjectTable.vue | 3 +- .../src/components/SearchBox.vue | 4 +- .../src/components/ShareModal.vue | 4 +- .../src/components/UploadModal.vue | 20 +- .../src/entries/badrequest.js | 82 ++----- .../src/entries/forbid.js | 82 ++----- .../src/entries/index.js | 82 ++----- .../src/entries/index_app_factory.js | 40 ++++ .../src/entries/index_oidc.js | 44 ++-- .../src/entries/login.js | 38 ++-- .../src/entries/loginpassword.js | 44 ++-- swift_browser_ui_frontend/src/entries/main.js | 54 ++--- .../src/entries/notfound.js | 82 ++----- .../src/entries/select.js | 49 ++-- .../src/entries/uidown.js | 82 ++----- .../src/entries/unauth.js | 88 ++----- .../src/pages/BrowserPage.vue | 18 +- .../src/pages/IndexOIDCPage.vue | 2 +- .../src/pages/IndexPage.vue | 4 +- .../src/pages/LoginPassword.vue | 4 +- .../src/pages/SelectPage.vue | 3 +- .../src/views/Tokens.vue | 3 +- swift_browser_ui_frontend/vite.config.js | 12 +- vetur.config.js | 12 - volar.config.js | 12 + 35 files changed, 541 insertions(+), 618 deletions(-) create mode 100644 swift_browser_ui_frontend/src/common/csc-ui-vue-directive.js delete mode 100644 swift_browser_ui_frontend/src/common/csc-ui.js create mode 100644 swift_browser_ui_frontend/src/common/i18n.js create mode 100644 swift_browser_ui_frontend/src/entries/index_app_factory.js delete mode 100644 vetur.config.js create mode 100644 volar.config.js diff --git a/CHANGELOG.md b/CHANGELOG.md index bdaba27f2..13647359e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -79,6 +79,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - (GL #944) Replace buefy notifications with c-toasts from `csc-ui` - (GL #944) Replace buefy Autocomplete component with c-autocomplete from `csc-ui` - (GH #982) Migrate from vue-cli to vite +- (GH #1034) Migrate to vue3 ### Fixed diff --git a/swift_browser_ui_frontend/package.json b/swift_browser_ui_frontend/package.json index 8921958ef..3e45899e1 100644 --- a/swift_browser_ui_frontend/package.json +++ b/swift_browser_ui_frontend/package.json @@ -14,13 +14,13 @@ "docker-build-devel": "vite build --mode development" }, "dependencies": { + "@intlify/unplugin-vue-i18n": "^0.9.2", "@mdi/js": "^7.1.96", "@vitejs/plugin-vue": "^4.0.0", "@vueuse/rxjs": "^9.13.0", "bulma": "^0.9.4", "cli-highlight": "^2.1.11", "csc-ui": "github:hannyle/csc-ui", - "csc-ui-vue-directive": "^0.0.6", "dexie": "^3.2.3", "eslint": "^8.36.0", "eslint-plugin-vue": "^9.9.0", diff --git a/swift_browser_ui_frontend/pnpm-lock.yaml b/swift_browser_ui_frontend/pnpm-lock.yaml index 0eaa85f4c..a08d4a9e2 100644 --- a/swift_browser_ui_frontend/pnpm-lock.yaml +++ b/swift_browser_ui_frontend/pnpm-lock.yaml @@ -1,6 +1,7 @@ lockfileVersion: 5.4 specifiers: + '@intlify/unplugin-vue-i18n': ^0.9.2 '@mdi/js': ^7.1.96 '@testing-library/dom': ^9.0.1 '@testing-library/jest-dom': ^5.16.5 @@ -12,7 +13,6 @@ specifiers: bulma: ^0.9.4 cli-highlight: ^2.1.11 csc-ui: github:hannyle/csc-ui - csc-ui-vue-directive: ^0.0.6 cypress: ^12.8.0 dexie: ^3.2.3 eslint: ^8.36.0 @@ -30,13 +30,13 @@ specifiers: vuex: ^4.1.0 dependencies: + '@intlify/unplugin-vue-i18n': 0.9.2_vue-i18n@9.2.2 '@mdi/js': 7.1.96 '@vitejs/plugin-vue': 4.1.0_vite@4.2.0+vue@3.2.47 '@vueuse/rxjs': 9.13.0_rxjs@7.8.0+vue@3.2.47 bulma: 0.9.4 cli-highlight: 2.1.11 csc-ui: github.com/hannyle/csc-ui/f23b1044b0eb0bead8d96192a5557ac239383b54 - csc-ui-vue-directive: 0.0.6 dexie: 3.2.3 eslint: 8.36.0 eslint-plugin-vue: 9.9.0_eslint@8.36.0 @@ -705,6 +705,28 @@ packages: resolution: {integrity: sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==} dev: false + /@intlify/bundle-utils/5.2.0_vue-i18n@9.2.2: + resolution: {integrity: sha512-rIfoNUTBoZK6IfaEeuoYMQZSuAXhPyZoy+UsdZj+V4eM632ynN1bGt5ttkpGO8xe0c+esfYslgJxBz//bdu4qg==} + engines: {node: '>= 12'} + peerDependencies: + petite-vue-i18n: '*' + vue-i18n: '*' + peerDependenciesMeta: + petite-vue-i18n: + optional: true + vue-i18n: + optional: true + dependencies: + '@intlify/message-compiler': 9.3.0-beta.16 + '@intlify/shared': 9.3.0-beta.16 + acorn: 8.8.2 + estree-walker: 2.0.2 + jsonc-eslint-parser: 1.4.1 + source-map: 0.6.1 + vue-i18n: 9.2.2_vue@3.2.47 + yaml-eslint-parser: 0.3.2 + dev: false + /@intlify/core-base/9.2.2: resolution: {integrity: sha512-JjUpQtNfn+joMbrXvpR4hTF8iJQ2sEFzzK3KIESOx+f+uwIjgw20igOyaIdhfsVVBCds8ZM64MoeNSx+PHQMkA==} engines: {node: '>= 14'} @@ -730,11 +752,57 @@ packages: source-map: 0.6.1 dev: false + /@intlify/message-compiler/9.3.0-beta.16: + resolution: {integrity: sha512-CGQI3xRcs1ET75eDQ0DUy3MRYOqTauRIIgaMoISKiF83gqRWg93FqN8lGMKcpBqaF4tI0JhsfosCaGiBL9+dnw==} + engines: {node: '>= 14'} + dependencies: + '@intlify/shared': 9.3.0-beta.16 + source-map: 0.6.1 + dev: false + /@intlify/shared/9.2.2: resolution: {integrity: sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==} engines: {node: '>= 14'} dev: false + /@intlify/shared/9.3.0-beta.16: + resolution: {integrity: sha512-kXbm4svALe3lX+EjdJxfnabOphqS4yQ1Ge/iIlR8tvUiYRCoNz3hig1M4336iY++Dfx5ytEQJPNjIcknNIuvig==} + engines: {node: '>= 14'} + dev: false + + /@intlify/unplugin-vue-i18n/0.9.2_vue-i18n@9.2.2: + resolution: {integrity: sha512-cNfa90+NVNdYJ0qqwRaEb2kGGp9zAve2xaAKCL7EzcQcvSWw42mhiOxcNkUc1QKlXnSHERMd6aT4/GUlFT1zBw==} + engines: {node: '>= 14.16'} + peerDependencies: + petite-vue-i18n: '*' + vue-i18n: '*' + vue-i18n-bridge: '*' + peerDependenciesMeta: + petite-vue-i18n: + optional: true + vue-i18n: + optional: true + vue-i18n-bridge: + optional: true + dependencies: + '@intlify/bundle-utils': 5.2.0_vue-i18n@9.2.2 + '@intlify/shared': 9.3.0-beta.16 + '@rollup/pluginutils': 5.0.2 + '@vue/compiler-sfc': 3.2.47 + debug: 4.3.4 + fast-glob: 3.2.12 + js-yaml: 4.1.0 + json5: 2.2.3 + pathe: 1.1.0 + picocolors: 1.0.0 + source-map: 0.6.1 + unplugin: 1.3.1 + vue-i18n: 9.2.2_vue@3.2.47 + transitivePeerDependencies: + - rollup + - supports-color + dev: false + /@intlify/vue-devtools/9.2.2: resolution: {integrity: sha512-+dUyqyCHWHb/UcvY1MlIpO87munedm3Gn6E9WWYdWrMuYLcoIoOEVDWSS8xSwtlPU+kA+MEQTP6Q1iI/ocusJg==} engines: {node: '>= 14'} @@ -1058,6 +1126,20 @@ packages: fastq: 1.15.0 dev: false + /@rollup/pluginutils/5.0.2: + resolution: {integrity: sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==} + engines: {node: '>=14.0.0'} + peerDependencies: + rollup: ^1.20.0||^2.0.0||^3.0.0 + peerDependenciesMeta: + rollup: + optional: true + dependencies: + '@types/estree': 1.0.0 + estree-walker: 2.0.2 + picomatch: 2.3.1 + dev: false + /@sinclair/typebox/0.25.24: resolution: {integrity: sha512-XJfwUVUKDHF5ugKwIcxEgc9k8b7HbznCp6eUfWgu710hMPNIO4aw4/zB5RogDQz8nd6gyCDpU9O/m6qYEWY6yQ==} dev: true @@ -1165,6 +1247,10 @@ packages: '@babel/types': 7.21.2 dev: true + /@types/estree/1.0.0: + resolution: {integrity: sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==} + dev: false + /@types/graceful-fs/4.1.6: resolution: {integrity: sha512-Sig0SNORX9fdW+bQuTEovKj3uHcUL6LQKbCrrqb1X7J6/ReAbhCXRAhc+SMejhLELFj2QcyuxmUooZ4bt5ReSw==} dependencies: @@ -1271,14 +1357,6 @@ packages: '@vue/compiler-core': 3.2.47 '@vue/shared': 3.2.47 - /@vue/compiler-sfc/2.7.14: - resolution: {integrity: sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==} - dependencies: - '@babel/parser': 7.21.2 - postcss: 8.4.21 - source-map: 0.6.1 - dev: false - /@vue/compiler-sfc/3.2.47: resolution: {integrity: sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==} dependencies: @@ -1380,6 +1458,14 @@ packages: resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==} dev: true + /acorn-jsx/5.3.2_acorn@7.4.1: + resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} + peerDependencies: + acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 + dependencies: + acorn: 7.4.1 + dev: false + /acorn-jsx/5.3.2_acorn@8.8.2: resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} peerDependencies: @@ -1388,6 +1474,12 @@ packages: acorn: 8.8.2 dev: false + /acorn/7.4.1: + resolution: {integrity: sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==} + engines: {node: '>=0.4.0'} + hasBin: true + dev: false + /acorn/8.8.2: resolution: {integrity: sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==} engines: {node: '>=0.4.0'} @@ -1908,12 +2000,6 @@ packages: shebang-command: 2.0.0 which: 2.0.2 - /csc-ui-vue-directive/0.0.6: - resolution: {integrity: sha512-/eIciFUTygqsdHmIvdmojtmFF4Fpsy2e2ocN5JJspRh1tHdeI6QftkviDneG4tknMEnKlf/F1qLzczgkyyB8ZQ==} - dependencies: - vue: 2.7.14 - dev: false - /css.escape/1.5.1: resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==} dev: true @@ -1927,10 +2013,6 @@ packages: /csstype/2.6.21: resolution: {integrity: sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w==} - /csstype/3.1.1: - resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==} - dev: false - /cypress/12.8.1: resolution: {integrity: sha512-lIFbKdaSYAOarNLHNFa2aPZu6YSF+8UY4VRXMxJrFUnk6RvfG0AWsZ7/qle/aIz30TNUD4aOihz2ZgS4vuQVSA==} engines: {node: ^14.0.0 || ^16.0.0 || >=18.0.0} @@ -2245,6 +2327,13 @@ packages: estraverse: 5.3.0 dev: false + /eslint-utils/2.1.0: + resolution: {integrity: sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==} + engines: {node: '>=6'} + dependencies: + eslint-visitor-keys: 1.3.0 + dev: false + /eslint-utils/3.0.0_eslint@8.36.0: resolution: {integrity: sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==} engines: {node: ^10.0.0 || ^12.0.0 || >= 14.0.0} @@ -2255,6 +2344,11 @@ packages: eslint-visitor-keys: 2.1.0 dev: false + /eslint-visitor-keys/1.3.0: + resolution: {integrity: sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==} + engines: {node: '>=4'} + dev: false + /eslint-visitor-keys/2.1.0: resolution: {integrity: sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==} engines: {node: '>=10'} @@ -2314,6 +2408,15 @@ packages: - supports-color dev: false + /espree/6.2.1: + resolution: {integrity: sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==} + engines: {node: '>=6.0.0'} + dependencies: + acorn: 7.4.1 + acorn-jsx: 5.3.2_acorn@7.4.1 + eslint-visitor-keys: 1.3.0 + dev: false + /espree/9.4.1: resolution: {integrity: sha512-XwctdmTO6SIvCzd9810yyNzIrOrqNYV9Koizx4C/mRhf9uq0o4yHoCEU/670pOxOL/MSraektvSAji79kX90Vg==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} @@ -2460,6 +2563,17 @@ packages: resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} dev: false + /fast-glob/3.2.12: + resolution: {integrity: sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==} + engines: {node: '>=8.6.0'} + dependencies: + '@nodelib/fs.stat': 2.0.5 + '@nodelib/fs.walk': 1.2.8 + glob-parent: 5.1.2 + merge2: 1.4.1 + micromatch: 4.0.5 + dev: false + /fast-json-stable-stringify/2.1.0: resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==} @@ -3623,7 +3737,17 @@ packages: resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==} engines: {node: '>=6'} hasBin: true - dev: true + + /jsonc-eslint-parser/1.4.1: + resolution: {integrity: sha512-hXBrvsR1rdjmB2kQmUjf1rEIa+TqHBGMge8pwi++C+Si1ad7EjZrJcpgwym+QGK/pqTx+K7keFAtLlVNdLRJOg==} + engines: {node: '>=8.10.0'} + dependencies: + acorn: 7.4.1 + eslint-utils: 2.1.0 + eslint-visitor-keys: 1.3.0 + espree: 6.2.1 + semver: 6.3.0 + dev: false /jsonfile/6.1.0: resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==} @@ -3779,13 +3903,17 @@ packages: resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==} dev: true + /merge2/1.4.1: + resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==} + engines: {node: '>= 8'} + dev: false + /micromatch/4.0.5: resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==} engines: {node: '>=8.6'} dependencies: braces: 3.0.2 picomatch: 2.3.1 - dev: true /mime-db/1.52.0: resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==} @@ -4026,6 +4154,10 @@ packages: /path-parse/1.0.7: resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==} + /pathe/1.1.0: + resolution: {integrity: sha512-ODbEPR0KKHqECXW1GoxdDb+AZvULmXjVPy4rt+pGo2+TnjJTIPJQSVS6N63n8T2Ip+syHhbn52OewKicV0373w==} + dev: false + /pend/1.2.0: resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==} dev: true @@ -4309,7 +4441,6 @@ packages: /semver/6.3.0: resolution: {integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==} hasBin: true - dev: true /semver/7.3.8: resolution: {integrity: sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==} @@ -4615,6 +4746,15 @@ packages: engines: {node: '>= 10.0.0'} dev: true + /unplugin/1.3.1: + resolution: {integrity: sha512-h4uUTIvFBQRxUKS2Wjys6ivoeofGhxzTe2sRWlooyjHXVttcVfV/JiavNd3d4+jty0SVV0dxGw9AkY9MwiaCEw==} + dependencies: + acorn: 8.8.2 + chokidar: 3.5.3 + webpack-sources: 3.2.3 + webpack-virtual-modules: 0.5.0 + dev: false + /untildify/4.0.0: resolution: {integrity: sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==} engines: {node: '>=8'} @@ -4752,13 +4892,6 @@ packages: vue: 3.2.47 dev: false - /vue/2.7.14: - resolution: {integrity: sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==} - dependencies: - '@vue/compiler-sfc': 2.7.14 - csstype: 3.1.1 - dev: false - /vue/3.2.47: resolution: {integrity: sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==} dependencies: @@ -4783,6 +4916,15 @@ packages: makeerror: 1.0.12 dev: true + /webpack-sources/3.2.3: + resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==} + engines: {node: '>=10.13.0'} + dev: false + + /webpack-virtual-modules/0.5.0: + resolution: {integrity: sha512-kyDivFZ7ZM0BVOUteVbDFhlRt7Ah/CSPwJdi8hBpkK7QLumUqdLtVfm/PX/hkcnrvr0i77fO5+TjZ94Pe+C9iw==} + dev: false + /which-boxed-primitive/1.0.2: resolution: {integrity: sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==} dependencies: @@ -4874,6 +5016,19 @@ packages: /yallist/4.0.0: resolution: {integrity: sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==} + /yaml-eslint-parser/0.3.2: + resolution: {integrity: sha512-32kYO6kJUuZzqte82t4M/gB6/+11WAuHiEnK7FreMo20xsCKPeFH5tDBU7iWxR7zeJpNnMXfJyXwne48D0hGrg==} + dependencies: + eslint-visitor-keys: 1.3.0 + lodash: 4.17.21 + yaml: 1.10.2 + dev: false + + /yaml/1.10.2: + resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} + engines: {node: '>= 6'} + dev: false + /yargs-parser/20.2.9: resolution: {integrity: sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==} engines: {node: '>=10'} diff --git a/swift_browser_ui_frontend/src/common/csc-ui-vue-directive.js b/swift_browser_ui_frontend/src/common/csc-ui-vue-directive.js new file mode 100644 index 000000000..5169778b1 --- /dev/null +++ b/swift_browser_ui_frontend/src/common/csc-ui-vue-directive.js @@ -0,0 +1,15 @@ +// from https://github.com/CSCfi/csc-ui-vue-directive/blob/bf642973c750b7b423aae0f64fae32300b11c6f5/src/vControl.ts +// csc-ui-vue-directive has imports for vue2, and can't be used as is +const eventHandler = (el) => (event) => { + let _a = event === null || event === void 0 ? void 0 : event.detail; + el.value = _a !== null && _a !== void 0 ? _a : null; + el.dispatchEvent(new Event("input", { bubbles: true })); +}; +export const vControl = { + mounted(el) { + el.addEventListener("changeValue", eventHandler(el)); + }, + beforeUnmount(el) { + el.removeEventListener("changeValue", eventHandler(el)); + }, +}; diff --git a/swift_browser_ui_frontend/src/common/csc-ui.js b/swift_browser_ui_frontend/src/common/csc-ui.js deleted file mode 100644 index ea504610c..000000000 --- a/swift_browser_ui_frontend/src/common/csc-ui.js +++ /dev/null @@ -1,23 +0,0 @@ -import Vue from "vue"; -const wm = new WeakMap(); - -export default { - bind(el, binding, vnode) { - const inputHandler = event => { - Vue.set(vnode.context, binding.expression, event.target.value); - }; - wm.set(el, inputHandler); - el.value = binding.value; - el.addEventListener("input", inputHandler); - el.addEventListener("changeValue", inputHandler); - }, - - componentUpdated(el, binding) { - el.value = binding.value; - }, - - unbind(el) { - const inputHandler = wm.get(el); - el.removeEventListener(el, inputHandler); - }, -}; diff --git a/swift_browser_ui_frontend/src/common/i18n.js b/swift_browser_ui_frontend/src/common/i18n.js new file mode 100644 index 000000000..fd079ddbc --- /dev/null +++ b/swift_browser_ui_frontend/src/common/i18n.js @@ -0,0 +1,9 @@ +import { createI18n } from "vue-i18n"; + +import getLangCookie from "@/common/conv"; +import translations from "@/common/lang"; + +export const i18n = createI18n({ + locale: getLangCookie(), + messages: translations, +}); diff --git a/swift_browser_ui_frontend/src/common/router.js b/swift_browser_ui_frontend/src/common/router.js index fa8fdfdc9..8e3c08ae7 100644 --- a/swift_browser_ui_frontend/src/common/router.js +++ b/swift_browser_ui_frontend/src/common/router.js @@ -1,15 +1,17 @@ -import Vue from "vue"; -import Router from "vue-router"; +import { createRouter, createWebHistory } from "vue-router"; import FoldersView from "@/views/Folders.vue"; import ObjectsView from "@/views/Objects.vue"; import SharedObjects from "@/views/SharedObjects.vue"; import TokensView from "@/views/Tokens.vue"; -Vue.use(Router); - -export default new Router({ - mode: "history", +export default createRouter({ + history: createWebHistory(), routes: [ + { + path: "/browse", + name: "AllFolders", + component: FoldersView, + }, { path: "/browse/:user/:project/tokens", name: "TokensView", diff --git a/swift_browser_ui_frontend/src/common/store.js b/swift_browser_ui_frontend/src/common/store.js index 6ffee9d61..6702390a9 100644 --- a/swift_browser_ui_frontend/src/common/store.js +++ b/swift_browser_ui_frontend/src/common/store.js @@ -1,6 +1,5 @@ // Vuex store for the variables that need to be globally available. -import Vue from "vue"; -import Vuex from "vuex"; +import { createStore } from "vuex"; import { getContainers } from "@/common/api"; import { getObjects } from "@/common/api"; @@ -14,9 +13,8 @@ import { import { initDB } from "@/common/db"; import {getSharedContainers} from "./globalFunctions"; -Vue.use(Vuex); -const store = new Vuex.Store({ +const store = createStore({ state: { db: initDB(), projects: [], diff --git a/swift_browser_ui_frontend/src/components/CopyFolderModal.vue b/swift_browser_ui_frontend/src/components/CopyFolderModal.vue index 391c6d787..79a3ae2bc 100644 --- a/swift_browser_ui_frontend/src/components/CopyFolderModal.vue +++ b/swift_browser_ui_frontend/src/components/CopyFolderModal.vue @@ -17,7 +17,8 @@ {{ $t("message.dropFiles") }} {{ $t("message.encrypt.dropMsg") }} @@ -76,19 +77,22 @@ > { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "BadRequest", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: true, - badrequest: true, - unauth: false, - forbid: false, - notfound: false, - uidown: false, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +const app = newApp( + "BadRequest", + () => { + return { + notindex: true, + badrequest: true, + unauth: false, + forbid: false, + notfound: false, + uidown: false, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/forbid.js b/swift_browser_ui_frontend/src/entries/forbid.js index 451fb3704..7340f3216 100644 --- a/swift_browser_ui_frontend/src/entries/forbid.js +++ b/swift_browser_ui_frontend/src/entries/forbid.js @@ -1,67 +1,23 @@ -import Vue from "vue"; -import App from "@/pages/IndexPage.vue"; -import VueI18n from "vue-i18n"; +import { newApp } from "@/entries/index_app_factory"; +import IndexPage from "@/pages/IndexPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; - -import cModel from "@/common/csc-ui.js"; - -import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; - -import CFooter from "@/components/CFooter.vue"; -import LanguageSelector from "@/components/CLanguageSelector.vue"; - -// Import project css import "@/css/prod.scss"; -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - -applyPolyfills().then(() => { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "ForbiddenPage", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: true, - badrequest: false, - unauth: false, - forbid: true, - notfound: false, - uidown: false, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +const app = newApp( + "ForbiddenPage", + () => { + return { + notindex: true, + badrequest: false, + unauth: false, + forbid: true, + notfound: false, + uidown: false, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/index.js b/swift_browser_ui_frontend/src/entries/index.js index 93fa3e687..6dd2afddf 100644 --- a/swift_browser_ui_frontend/src/entries/index.js +++ b/swift_browser_ui_frontend/src/entries/index.js @@ -1,67 +1,23 @@ -import Vue from "vue"; -import App from "@/pages/IndexPage.vue"; -import VueI18n from "vue-i18n"; +import { newApp } from "@/entries/index_app_factory"; +import IndexPage from "@/pages/IndexPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; - -import cModel from "@/common/csc-ui.js"; - -import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; - -import CFooter from "@/components/CFooter.vue"; -import LanguageSelector from "@/components/CLanguageSelector.vue"; - -// Import project css import "@/css/prod.scss"; -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - -applyPolyfills().then(() => { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "IndexPage", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: false, - badrequest: false, - uidown: false, - unauth: false, - forbid: false, - notfound: false, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +const app = newApp( + "IndexPage", + () => { + return { + notindex: false, + badrequest: false, + uidown: false, + unauth: false, + forbid: false, + notfound: false, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/index_app_factory.js b/swift_browser_ui_frontend/src/entries/index_app_factory.js new file mode 100644 index 000000000..ab679d28d --- /dev/null +++ b/swift_browser_ui_frontend/src/entries/index_app_factory.js @@ -0,0 +1,40 @@ +import { createApp } from "vue"; + +import { i18n } from "@/common/i18n"; + +import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; +import { vControl } from "@/common/csc-ui-vue-directive"; + +import CFooter from "@/components/CFooter.vue"; +import LanguageSelector from "@/components/CLanguageSelector.vue"; + +applyPolyfills().then(() => { + defineCustomElements(); +}); + +export function newApp(name, data, Component) { + return createApp({ + name: name, + components: { + CFooter, + LanguageSelector, + }, + data: data, + created() { + document.title = this.$t("message.program_name"); + }, + methods: { + setCookieLang: function() { + const expiryDate = new Date(); + expiryDate.setMonth(expiryDate.getMonth() + 1); + document.cookie = "OBJ_UI_LANG=" + + i18n.locale + + "; path=/; expires=" + + expiryDate.toUTCString(); + }, + }, + ...Component, + }) + .use(i18n) + .directive("csc-control", vControl); +} diff --git a/swift_browser_ui_frontend/src/entries/index_oidc.js b/swift_browser_ui_frontend/src/entries/index_oidc.js index 0c4a63bbf..b43896d75 100644 --- a/swift_browser_ui_frontend/src/entries/index_oidc.js +++ b/swift_browser_ui_frontend/src/entries/index_oidc.js @@ -1,16 +1,12 @@ +import { createApp } from "vue"; +import IndexOIDCPage from "@/pages/IndexOIDCPage.vue"; +import { i18n } from "@/common/i18n"; -import Vue from "vue"; -import App from "@/pages/IndexOIDCPage.vue"; - -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; import checkIDB from "@/common/idb_support"; -import cModel from "@/common/csc-ui.js"; import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; -import VueI18n from "vue-i18n"; +import { vControl } from "@/common/csc-ui-vue-directive"; import CFooter from "@/components/CFooter.vue"; import LanguageSelector from "@/components/CLanguageSelector.vue"; @@ -19,30 +15,20 @@ import LanguageSelector from "@/components/CLanguageSelector.vue"; import "@/css/prod.scss"; -Vue.config.ignoredElements = [/c-\w*/]; - applyPolyfills().then(() => { defineCustomElements(); }); -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue ({ - i18n, +const app = createApp({ components: { CFooter, LanguageSelector, }, - data: { - loading: false, - idb: true, + data: function() { + return { + loading: false, + idb: true, + }; }, created() { document.title = this.$t("message.program_name"); @@ -64,5 +50,11 @@ new Vue ({ + expiryDate.toUTCString(); }, }, - ...App, -}).$mount("#app"); + ...IndexOIDCPage, +}); + +app.use(i18n); +app.directive("csc-control", vControl); +app.config.compilerOptions.isCustomElement = (tag) => tag.startsWith("c-"); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/login.js b/swift_browser_ui_frontend/src/entries/login.js index d75bb0566..e90cf7583 100644 --- a/swift_browser_ui_frontend/src/entries/login.js +++ b/swift_browser_ui_frontend/src/entries/login.js @@ -1,31 +1,21 @@ -import Vue from "vue"; -import App from "@/pages/LoginPage.vue"; +import { createApp } from "vue"; +import LoginPage from "@/pages/LoginPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; +import { i18n } from "@/common/i18n"; // Import project css import "@/css/prod.scss"; -import VueI18n from "vue-i18n"; - -Vue.use(VueI18n); - - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue ({ - i18n, - data: { - formname: "Token id:", - loginformname: "Openstack account:", - idb: true, +const app = createApp({ + data: function() { + return { + formname: "Token id:", + loginformname: "Openstack account:", + idb: true, + }; }, created() { - document.title = this.$t("message.program_name"); + document.title = i18n.$t("message.program_name"); }, methods: { "displayInvalid": function () { @@ -38,5 +28,7 @@ new Vue ({ } }, }, - ...App, -}).$mount("#app"); + ...LoginPage, +}); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/loginpassword.js b/swift_browser_ui_frontend/src/entries/loginpassword.js index bca1b21e1..ffa06fd8d 100644 --- a/swift_browser_ui_frontend/src/entries/loginpassword.js +++ b/swift_browser_ui_frontend/src/entries/loginpassword.js @@ -1,48 +1,33 @@ -import Vue from "vue"; -import App from "@/pages/LoginPassword.vue"; -import VueI18n from "vue-i18n"; +import { createApp } from "vue"; +import LoginPassword from "@/pages/LoginPassword.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; +import { i18n } from "@/common/i18n"; import CFooter from "@/components/CFooter.vue"; -import cModel from "@/common/csc-ui.js"; import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; +import { vControl } from "@/common/csc-ui-vue-directive"; import LanguageSelector from "@/components/CLanguageSelector.vue"; // Import project css import "@/css/prod.scss"; -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - applyPolyfills().then(() => { defineCustomElements(); }); -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ +const app = createApp({ name: "LoginPassword", - i18n, components: { CFooter, LanguageSelector, }, - data: { - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, + data: function() { + return { + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, created() { document.title = this.$t("message.program_name"); @@ -57,5 +42,10 @@ new Vue({ + expiryDate.toUTCString(); }, }, - ...App, -}).$mount("#app"); + ...LoginPassword, +}); + +app.use(i18n); +app.directive("csc-control", vControl); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/main.js b/swift_browser_ui_frontend/src/entries/main.js index 2f6d7181d..1999c8b3d 100644 --- a/swift_browser_ui_frontend/src/entries/main.js +++ b/swift_browser_ui_frontend/src/entries/main.js @@ -1,8 +1,7 @@ // Project main imports -import Vue from "vue"; -import App from "@/pages/BrowserPage.vue"; +import { createApp } from "vue"; +import BrowserPage from "@/pages/BrowserPage.vue"; import router from "@/common/router"; -import VueI18n from "vue-i18n"; // Project Vue components import BrowserMainNavbar from "@/components/BrowserMainNavbar.vue"; @@ -15,14 +14,11 @@ import CopyFolderModal from "@/components/CopyFolderModal.vue"; import DeleteModal from "@/components/DeleteModal.vue"; // CSC UI things -import cModel from "@/common/csc-ui.js"; - import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; +import { vControl } from "@/common/csc-ui-vue-directive"; // Project JS functions -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; +import { i18n } from "@/common/i18n"; import { GET, getUser } from "@/common/api"; import { getProjects } from "@/common/api"; @@ -96,34 +92,12 @@ window.addEventListener("rejectionhandled", function (event) { event.stopPropagation(); }); -Vue.config.productionTip = false; -Vue.config.errorHandler = function (err, vm, info) { - if (DEV) console.log("Vue error: ", err, vm, info); -}; -Vue.config.warnHandler = function (msg, vm, info) { - if (DEV) console.log("Vue warning: ", msg, vm, info); -}; - -Vue.use(VueI18n); - // Configure csc-ui -Vue.config.ignoredElements = [/c-\w*/]; applyPolyfills().then(() => { defineCustomElements(); }); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - i18n, - router, - store, +const app = createApp({ components: { CFooter, BrowserMainNavbar, @@ -557,5 +531,19 @@ new Vue({ return retl; }, }, - ...App, -}).$mount("#app"); + ...BrowserPage, +}); + +app.use(i18n); +app.use(router); +app.use(store); +app.directive("csc-control", vControl); + +app.config.errorHandler = function (err, vm, info) { + if (DEV) console.log("Vue error: ", err, vm, info); +}; +app.config.warnHandler = function (msg, vm, info) { + if (DEV) console.log("Vue warning: ", msg, vm, info); +}; + +router.isReady().then(() => app.mount("#app")); diff --git a/swift_browser_ui_frontend/src/entries/notfound.js b/swift_browser_ui_frontend/src/entries/notfound.js index 639ef00ff..f85546885 100644 --- a/swift_browser_ui_frontend/src/entries/notfound.js +++ b/swift_browser_ui_frontend/src/entries/notfound.js @@ -1,67 +1,23 @@ -import Vue from "vue"; -import App from "@/pages/IndexPage.vue"; -import VueI18n from "vue-i18n"; +import { newApp } from "@/entries/index_app_factory"; +import IndexPage from "@/pages/IndexPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; - -import cModel from "@/common/csc-ui.js"; - -import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; - -import CFooter from "@/components/CFooter.vue"; -import LanguageSelector from "@/components/CLanguageSelector.vue"; - -// Import project css import "@/css/prod.scss"; -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - -applyPolyfills().then(() => { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "NotfoundPage", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: true, - badrequest: false, - unauth: false, - forbid: false, - notfound: true, - uidown: false, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +const app = newApp( + "NotfoundPage", + () => { + return { + notindex: true, + badrequest: false, + unauth: false, + forbid: false, + notfound: true, + uidown: false, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/select.js b/swift_browser_ui_frontend/src/entries/select.js index fbf5868bd..c423f0c75 100644 --- a/swift_browser_ui_frontend/src/entries/select.js +++ b/swift_browser_ui_frontend/src/entries/select.js @@ -1,32 +1,32 @@ -import Vue from "vue"; -import App from "@/pages/SelectPage.vue"; +import { createApp } from "vue"; +import SelectPage from "@/pages/SelectPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; +import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; +import { vControl } from "@/common/csc-ui-vue-directive"; + +import { i18n } from "@/common/i18n"; import { getProjects } from "@/common/api"; // Import project css import "@/css/prod.scss"; -import VueI18n from "vue-i18n"; - -Vue.use(VueI18n); - - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, +applyPolyfills().then(() => { + defineCustomElements(); }); -new Vue ({ - i18n, - data: { - formname: "Token id:", - loginformname: "Openstack account:", - idb: true, - projects: [], - langs: [{name: "In English", value: "en"}, {name: "Suomeksi", value: "fi"}], +const app = createApp({ + data: function() { + return { + formname: "Token id:", + loginformname: "Openstack account:", + idb: true, + projects: [], + langs: [ + {name: "In English", value: "en"}, + {name: "Suomeksi", value: "fi"}, + ], + }; }, created() { document.title = this.$t("message.program_name"); @@ -45,5 +45,10 @@ new Vue ({ + expiryDate.toUTCString(); }, }, - ...App, -}).$mount("#app"); + ...SelectPage, +}); + +app.use(i18n); +app.directive("csc-control", vControl); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/uidown.js b/swift_browser_ui_frontend/src/entries/uidown.js index a7ea40a7c..94b37fcd3 100644 --- a/swift_browser_ui_frontend/src/entries/uidown.js +++ b/swift_browser_ui_frontend/src/entries/uidown.js @@ -1,67 +1,23 @@ -import Vue from "vue"; -import App from "@/pages/IndexPage.vue"; -import VueI18n from "vue-i18n"; +import { newApp } from "@/entries/index_app_factory"; +import IndexPage from "@/pages/IndexPage.vue"; -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; - -import cModel from "@/common/csc-ui.js"; - -import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; -import { vControlV2 } from "csc-ui-vue-directive"; - -import CFooter from "@/components/CFooter.vue"; -import LanguageSelector from "@/components/CLanguageSelector.vue"; - -// Import project css import "@/css/prod.scss"; -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - -applyPolyfills().then(() => { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "ServiceUnavailable", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: true, - badrequest: false, - unauth: false, - forbid: false, - notfound: false, - uidown: true, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +const app = newApp( + "ServiceUnavailable", + () => { + return { + notindex: true, + badrequest: false, + unauth: false, + forbid: false, + notfound: false, + uidown: true, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/entries/unauth.js b/swift_browser_ui_frontend/src/entries/unauth.js index 02c3a1c81..693e477e2 100644 --- a/swift_browser_ui_frontend/src/entries/unauth.js +++ b/swift_browser_ui_frontend/src/entries/unauth.js @@ -1,67 +1,23 @@ -import Vue from "vue"; -import App from "@/pages/IndexPage.vue"; -import VueI18n from "vue-i18n"; - -import getLangCookie from "@/common/conv"; -import translations from "@/common/lang"; - -import cModel from "@/common/csc-ui.js"; - -import { applyPolyfills, defineCustomElements } from "csc-ui/dist/loader"; - -import CFooter from "@/components/CFooter.vue"; -import LanguageSelector from "@/components/CLanguageSelector.vue"; -import { vControlV2 } from "csc-ui-vue-directive"; - -// Import project css -import "@/css/prod.scss"; - -Vue.config.productiontip = true; - -Vue.config.ignoredElements = [/c-\w*/]; - -applyPolyfills().then(() => { - defineCustomElements(); -}); - -Vue.use(VueI18n); -Vue.directive("control", vControlV2); -Vue.directive("csc-model", cModel); - -const i18n = new VueI18n({ - locale: getLangCookie(), - messages: translations, -}); - -new Vue({ - name: "UnauthorizedPage", - i18n, - components: { - CFooter, - LanguageSelector, - }, - data: { - notindex: true, - badrequest: false, - unauth: true, - forbid: false, - notfound: false, - uidown: false, - langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], - idb: true, +import { newApp } from "@/entries/index_app_factory"; +import IndexPage from "@/pages/IndexPage.vue"; + +import "@/css/prod.scss"; + +const app = newApp( + "UnauthorizedPage", + () => { + return { + notindex: true, + badrequest: false, + unauth: true, + forbid: false, + notfound: false, + uidown: false, + langs: [{ph: "In English", value: "en"}, {ph: "Suomeksi", value: "fi"}], + idb: true, + }; }, - created() { - document.title = this.$t("message.program_name"); - }, - methods: { - setCookieLang: function() { - const expiryDate = new Date(); - expiryDate.setMonth(expiryDate.getMonth() + 1); - document.cookie = "OBJ_UI_LANG=" + - i18n.locale + - "; path=/; expires=" - + expiryDate.toUTCString(); - }, - }, - ...App, -}).$mount("#app"); + IndexPage, +); + +app.mount("#app"); diff --git a/swift_browser_ui_frontend/src/pages/BrowserPage.vue b/swift_browser_ui_frontend/src/pages/BrowserPage.vue index 181a81227..a119bbb9e 100644 --- a/swift_browser_ui_frontend/src/pages/BrowserPage.vue +++ b/swift_browser_ui_frontend/src/pages/BrowserPage.vue @@ -12,13 +12,15 @@ role="main" > @@ -28,25 +30,29 @@ @cancel-upload="currentUpload.cancelUpload()" /> diff --git a/swift_browser_ui_frontend/src/pages/IndexOIDCPage.vue b/swift_browser_ui_frontend/src/pages/IndexOIDCPage.vue index 0e88aab43..be9da7d9c 100644 --- a/swift_browser_ui_frontend/src/pages/IndexOIDCPage.vue +++ b/swift_browser_ui_frontend/src/pages/IndexOIDCPage.vue @@ -11,7 +11,7 @@
{{ $t('message.program_name') }} @@ -22,7 +22,7 @@

{{ $t('message.pwdlogin.description') }}

{ publicDir, appType: "mpa", // set the dev server as a multi-page app plugins: [ - vue(), + vue({ + template: { + compilerOptions: { + isCustomElement: (tag) => tag.startsWith("c-"), + }, + }, + }), multipagePlugin(), + VueI18nPlugin(), ], build: { outDir: path.resolve(__dirname, "dist"), diff --git a/vetur.config.js b/vetur.config.js deleted file mode 100644 index ef79ee6fb..000000000 --- a/vetur.config.js +++ /dev/null @@ -1,12 +0,0 @@ -// This file configures the VSCode Vetur extension, which adds support for Vue.js to VSCode. -module.exports = { -settings: { - "vetur.useWorkspaceDependencies": true, - "vetur.experimental.templateInterpolationService": true, -}, -projects: [ - { - root: './swift_browser_ui_frontend', - }, - ], -} diff --git a/volar.config.js b/volar.config.js new file mode 100644 index 000000000..8e0b09689 --- /dev/null +++ b/volar.config.js @@ -0,0 +1,12 @@ +// This file configures the VSCode Volar extension, which adds support for Vue.js to VSCode. +module.exports = { + settings: { + "volar.useWorkspaceDependencies": true, + "volar.experimental.templateInterpolationService": true, + }, + projects: [ + { + root: './swift_browser_ui_frontend', + }, + ], +}