From 121fa8b6f6c86d1a0eebbfca8802d25255e69f84 Mon Sep 17 00:00:00 2001 From: Sanskar Soni Date: Tue, 19 Sep 2023 10:19:21 +0530 Subject: [PATCH] Implemented: dxp-language switcher --- package-lock.json | 150 ++++++++++++++--------------------------- package.json | 2 +- src/main.ts | 5 +- src/views/Settings.vue | 24 +------ vue.config.js | 12 +++- 5 files changed, 69 insertions(+), 124 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9bc1f73b6..0b1402d09 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,7 @@ "@casl/ability": "^6.0.0", "@hotwax/app-version-info": "^1.0.0", "@hotwax/apps-theme": "^1.1.0", - "@hotwax/dxp-components": "^1.3.4", + "@hotwax/dxp-components": "file:../dxp-components", "@hotwax/oms-api": "^1.10.0", "@ionic/core": "6.7.5", "@ionic/vue": "6.7.5", @@ -59,6 +59,35 @@ "vue-cli-plugin-i18n": "^1.0.1" } }, + "../dxp-components": { + "version": "1.6.0", + "license": "Apache-2.0", + "dependencies": { + "@hotwax/oms-api": "^1.8.1", + "@ionic/core": "^6.7.5", + "@ionic/vue": "^6.7.5", + "firebase": "^10.3.1", + "luxon": "^3.3.0", + "pinia": "2.0.36", + "pinia-plugin-persistedstate": "^3.1.0", + "vue": "^3.3.4" + }, + "devDependencies": { + "@babel/types": "^7.22.11", + "@types/luxon": "^3.3.0", + "@types/node": "^20.5.7", + "@vitejs/plugin-vue": "^4.3.4", + "@vue/eslint-config-prettier": "^8.0.0", + "@vue/eslint-config-typescript": "^11.0.3", + "@vue/tsconfig": "^0.1.3", + "eslint": "^8.48.0", + "eslint-plugin-vue": "^9.17.0", + "rollup-plugin-typescript2": "^0.35.0", + "typescript": "~4.7.4", + "vite": "^4.4.9", + "vue-tsc": "^1.8.8" + } + }, "node_modules/@achrinza/node-ipc": { "version": "9.2.2", "resolved": "https://registry.npmjs.org/@achrinza/node-ipc/-/node-ipc-9.2.2.tgz", @@ -2198,16 +2227,8 @@ "integrity": "sha512-yokhlpG+eUEao19vaUtCOC5YwcYTb5sf5joGVH17mbb5B1hM4G+P4ZiGiFw2AMmZBKgu94DtHwSyjtdsf4bHug==" }, "node_modules/@hotwax/dxp-components": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.3.4.tgz", - "integrity": "sha512-uw0dmxm19lzsgcLWZ2fQBAZem0d7TkxGR0iSq1c7Bj1mkAJZXH5JbP12w0lYhtes7Q1MjhHPlWljCh6624E9XA==", - "dependencies": { - "@hotwax/oms-api": "^1.8.1", - "luxon": "^3.3.0", - "pinia": "2.0.36", - "pinia-plugin-persistedstate": "^3.1.0", - "vue": "^3.3.4" - } + "resolved": "../dxp-components", + "link": true }, "node_modules/@hotwax/oms-api": { "version": "1.10.0", @@ -25480,64 +25501,6 @@ "node": ">=0.10.0" } }, - "node_modules/pinia": { - "version": "2.0.36", - "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.0.36.tgz", - "integrity": "sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==", - "dependencies": { - "@vue/devtools-api": "^6.5.0", - "vue-demi": "*" - }, - "funding": { - "url": "https://github.com/sponsors/posva" - }, - "peerDependencies": { - "@vue/composition-api": "^1.4.0", - "typescript": ">=4.4.4", - "vue": "^2.6.14 || ^3.2.0" - }, - "peerDependenciesMeta": { - "@vue/composition-api": { - "optional": true - }, - "typescript": { - "optional": true - } - } - }, - "node_modules/pinia-plugin-persistedstate": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.0.tgz", - "integrity": "sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==", - "peerDependencies": { - "pinia": "^2.0.0" - } - }, - "node_modules/pinia/node_modules/vue-demi": { - "version": "0.14.5", - "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.5.tgz", - "integrity": "sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==", - "hasInstallScript": true, - "bin": { - "vue-demi-fix": "bin/vue-demi-fix.js", - "vue-demi-switch": "bin/vue-demi-switch.js" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/antfu" - }, - "peerDependencies": { - "@vue/composition-api": "^1.0.0-rc.1", - "vue": "^3.0.0-0 || ^2.6.0" - }, - "peerDependenciesMeta": { - "@vue/composition-api": { - "optional": true - } - } - }, "node_modules/pinkie": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz", @@ -29987,7 +29950,7 @@ "version": "4.7.4", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", - "devOptional": true, + "dev": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -34883,15 +34846,29 @@ "integrity": "sha512-yokhlpG+eUEao19vaUtCOC5YwcYTb5sf5joGVH17mbb5B1hM4G+P4ZiGiFw2AMmZBKgu94DtHwSyjtdsf4bHug==" }, "@hotwax/dxp-components": { - "version": "1.3.4", - "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.3.4.tgz", - "integrity": "sha512-uw0dmxm19lzsgcLWZ2fQBAZem0d7TkxGR0iSq1c7Bj1mkAJZXH5JbP12w0lYhtes7Q1MjhHPlWljCh6624E9XA==", + "version": "file:../dxp-components", "requires": { + "@babel/types": "^7.22.11", "@hotwax/oms-api": "^1.8.1", + "@ionic/core": "^6.7.5", + "@ionic/vue": "^6.7.5", + "@types/luxon": "^3.3.0", + "@types/node": "^20.5.7", + "@vitejs/plugin-vue": "^4.3.4", + "@vue/eslint-config-prettier": "^8.0.0", + "@vue/eslint-config-typescript": "^11.0.3", + "@vue/tsconfig": "^0.1.3", + "eslint": "^8.48.0", + "eslint-plugin-vue": "^9.17.0", + "firebase": "^10.3.1", "luxon": "^3.3.0", "pinia": "2.0.36", "pinia-plugin-persistedstate": "^3.1.0", - "vue": "^3.3.4" + "rollup-plugin-typescript2": "^0.35.0", + "typescript": "~4.7.4", + "vite": "^4.4.9", + "vue": "^3.3.4", + "vue-tsc": "^1.8.8" } }, "@hotwax/oms-api": { @@ -53294,29 +53271,6 @@ "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==", "dev": true }, - "pinia": { - "version": "2.0.36", - "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.0.36.tgz", - "integrity": "sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==", - "requires": { - "@vue/devtools-api": "^6.5.0", - "vue-demi": "*" - }, - "dependencies": { - "vue-demi": { - "version": "0.14.5", - "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.5.tgz", - "integrity": "sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==", - "requires": {} - } - } - }, - "pinia-plugin-persistedstate": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.0.tgz", - "integrity": "sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==", - "requires": {} - }, "pinkie": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz", @@ -56914,7 +56868,7 @@ "version": "4.7.4", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", - "devOptional": true + "dev": true }, "uglify-js": { "version": "3.4.10", diff --git a/package.json b/package.json index c41266a2b..7829442d7 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "@casl/ability": "^6.0.0", "@hotwax/app-version-info": "^1.0.0", "@hotwax/apps-theme": "^1.1.0", - "@hotwax/dxp-components": "^1.3.4", + "@hotwax/dxp-components": "file:../dxp-components", "@hotwax/oms-api": "^1.10.0", "@ionic/core": "6.7.5", "@ionic/vue": "6.7.5", diff --git a/src/main.ts b/src/main.ts index 40d435f8f..eda1e6adf 100644 --- a/src/main.ts +++ b/src/main.ts @@ -26,7 +26,7 @@ import '@ionic/vue/css/display.css'; import './theme/variables.css'; import "@hotwax/apps-theme"; -import i18n from './i18n' +import i18n, { translate } from './i18n' import store from './store' import permissionPlugin from '@/authorization'; import permissionRules from '@/authorization/Rules'; @@ -50,7 +50,8 @@ const app = createApp(App) login, logout, loader, - appLoginUrl: process.env.VUE_APP_LOGIN_URL as string + appLoginUrl: process.env.VUE_APP_LOGIN_URL as string, + translate }); // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters diff --git a/src/views/Settings.vue b/src/views/Settings.vue index 9faa9f047..4039adc5d 100644 --- a/src/views/Settings.vue +++ b/src/views/Settings.vue @@ -133,22 +133,7 @@ - - - - {{ $t("Language") }} - - - - {{ $t('Select your preferred language.') }} - - - {{ $t("Choose language") }} - - {{ locales[locale] }} - - - + @@ -242,7 +227,6 @@ export default defineComponent({ baseURL: process.env.VUE_APP_BASE_URL, appInfo: (process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {}) as any, appVersion: "", - locales: process.env.VUE_APP_LOCALES ? JSON.parse(process.env.VUE_APP_LOCALES) : {"en": "English"}, rerouteFulfillmentConfig: { // TODO Remove fromDate and directly store values making it loosely coupled with OMS allowDeliveryMethodUpdate: {}, @@ -263,8 +247,7 @@ export default defineComponent({ instanceUrl: 'user/getInstanceUrl', configurePicker: "user/configurePicker", showShippingOrders: 'user/showShippingOrders', - showPackingSlip: 'user/showPackingSlip', - locale: 'user/getLocale' + showPackingSlip: 'user/showPackingSlip' }) }, mounted() { @@ -319,9 +302,6 @@ export default defineComponent({ getDateTime(time: any) { return DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED); }, - setLocale(locale: string) { - this.store.dispatch('user/setLocale',locale) - }, async getAvailableShipmentMethods () { this.availableShipmentMethods = []; try { diff --git a/vue.config.js b/vue.config.js index aec5bde1e..23193823a 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,5 +1,14 @@ require("@hotwax/app-version-info") +const path = require('path'); + module.exports = { + configureWebpack: { + resolve: { + alias: { + vue: path.resolve('./node_modules/vue') + } + } + }, pluginOptions: { i18n: { locale: 'en', @@ -12,5 +21,6 @@ module.exports = { enableInSFC: true } }, - runtimeCompiler: true + runtimeCompiler: true, + transpileDependencies: ['@hotwax/dxp-components'] }