From bb1d1138caad71c13f541b5753119427612c2aa0 Mon Sep 17 00:00:00 2001 From: Kristian Binau Date: Wed, 27 Sep 2023 12:53:59 +0200 Subject: [PATCH] #1 - Add Vue-i18n and implement on login page --- astro.config.mjs | 2 +- package.json | 3 +- pnpm-lock.yaml | 96 ++++++++++++++++++++++++++++++++++- public/serviceWorker.js | 2 +- src/components/FormSignIn.vue | 22 ++++---- src/lang/da.ts | 19 +++++++ src/lang/en.ts | 19 +++++++ src/pages/_app.ts | 18 +++++++ 8 files changed, 168 insertions(+), 13 deletions(-) create mode 100644 src/lang/da.ts create mode 100644 src/lang/en.ts create mode 100644 src/pages/_app.ts diff --git a/astro.config.mjs b/astro.config.mjs index 1cd9af6..e108d7e 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -29,7 +29,7 @@ export default defineConfig({ server: { port: PORT, }, - integrations: [sitemap(), tailwind(), vue()], + integrations: [sitemap(), tailwind(), vue({ appEntrypoint: '/src/pages/_app' })], adapter: adapter, vite: { server: { diff --git a/package.json b/package.json index 2125f86..2e99fd5 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,8 @@ "tailwindcss": "^3.3.3", "typescript": "^5.2.2", "vite": "^4.4.9", - "vue": "^3.3.4" + "vue": "^3.3.4", + "vue-i18n": "^9.3.0" }, "devDependencies": { "@tauri-apps/cli": "^1.4.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9462301..2f1f2be 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,4 +1,4 @@ -lockfileVersion: '6.1' +lockfileVersion: '6.0' settings: autoInstallPeers: true @@ -56,6 +56,9 @@ dependencies: vue: specifier: ^3.3.4 version: 3.3.4 + vue-i18n: + specifier: ^9.3.0 + version: 9.3.0(vue@3.3.4) devDependencies: '@tauri-apps/cli': @@ -998,6 +1001,44 @@ packages: dev: false optional: true + /@intlify/core-base@9.3.0: + resolution: {integrity: sha512-SRzn8TMnPZ6MY8OFrgouRq4DGaf01SHcJEF6FglYFYvRkgPzziEcQe+v2PD+O5lUp/rJafP4dabm1CmsVAA7rA==} + engines: {node: '>= 16'} + dependencies: + '@intlify/devtools-if': 9.3.0 + '@intlify/message-compiler': 9.3.0 + '@intlify/shared': 9.3.0 + '@intlify/vue-devtools': 9.3.0 + dev: false + + /@intlify/devtools-if@9.3.0: + resolution: {integrity: sha512-5aKZnqj0Ff4dfwBX2Oo+MheVs00CBnC0RzWK26aT2M4AF0cxdFLOJAs51/eHT01jmzrxSvfBMjdArUWHwgetfg==} + engines: {node: '>= 16'} + dependencies: + '@intlify/shared': 9.3.0 + dev: false + + /@intlify/message-compiler@9.3.0: + resolution: {integrity: sha512-D8tSJEhTCSFcCzkThjE4Sbk1tIdvzkYa1FaVIzUtZ8hKPATvokNrOiDw1i/h671m8A80l9Ywq594i/LPTB6EJA==} + engines: {node: '>= 16'} + dependencies: + '@intlify/shared': 9.3.0 + source-map-js: 1.0.2 + dev: false + + /@intlify/shared@9.3.0: + resolution: {integrity: sha512-MMGRz6zWxtz7rHtxIIdnyb8SYOIaaseN1IvUhAEs9tOW4u77RD4DFp4qgPXesp2Gxo/5QitH9kwSs0jnxGUNEw==} + engines: {node: '>= 16'} + dev: false + + /@intlify/vue-devtools@9.3.0: + resolution: {integrity: sha512-kEaxIz1VEgsz2q5RhoS+fBGTkXr/4+pxmK9mN14+speVGb82HPRntKBmz0GO18I1JisD4Z0vAva+KCTHGeAqbQ==} + engines: {node: '>= 16'} + dependencies: + '@intlify/core-base': 9.3.0 + '@intlify/shared': 9.3.0 + dev: false + /@jridgewell/gen-mapping@0.3.3: resolution: {integrity: sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==} engines: {node: '>=6.0.0'} @@ -1474,6 +1515,10 @@ packages: '@vue/shared': 3.3.4 dev: false + /@vue/devtools-api@6.5.0: + resolution: {integrity: sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==} + dev: false + /@vue/reactivity-transform@3.3.4: resolution: {integrity: sha512-MXgwjako4nu5WFLAjpBnCj/ieqcjE2aJBINUNQzkZQfzIZA4xn+0fV1tIYBJvvva3N3OvKGofRLvQIwEQPpaXw==} dependencies: @@ -1715,6 +1760,7 @@ packages: /b4a@1.6.4: resolution: {integrity: sha512-fpWrvyVHEKyeEvbKZTVOeZF3VSKKWtJxFIxX/jaVPf+cLbGUSitjb49pHLqPV2BUNNZ0LcoeEGfE/YCpyDYHIw==} + requiresBuild: true dev: false optional: true @@ -1743,6 +1789,7 @@ packages: /bl@4.1.0: resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==} + requiresBuild: true dependencies: buffer: 5.7.1 inherits: 2.0.4 @@ -1799,6 +1846,7 @@ packages: /buffer@5.7.1: resolution: {integrity: sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==} + requiresBuild: true dependencies: base64-js: 1.5.1 ieee754: 1.2.1 @@ -1885,6 +1933,7 @@ packages: /chownr@1.1.4: resolution: {integrity: sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==} + requiresBuild: true dev: false optional: true @@ -1948,10 +1997,12 @@ packages: /color-name@1.1.4: resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==} + requiresBuild: true dev: false /color-string@1.9.1: resolution: {integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==} + requiresBuild: true dependencies: color-name: 1.1.4 simple-swizzle: 0.2.2 @@ -1966,6 +2017,7 @@ packages: /color@4.2.3: resolution: {integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==} engines: {node: '>=12.5.0'} + requiresBuild: true dependencies: color-convert: 2.0.1 color-string: 1.9.1 @@ -2064,6 +2116,7 @@ packages: /decompress-response@6.0.0: resolution: {integrity: sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==} engines: {node: '>=10'} + requiresBuild: true dependencies: mimic-response: 3.1.0 dev: false @@ -2072,6 +2125,7 @@ packages: /deep-extend@0.6.0: resolution: {integrity: sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==} engines: {node: '>=4.0.0'} + requiresBuild: true dev: false optional: true @@ -2164,6 +2218,7 @@ packages: /end-of-stream@1.4.4: resolution: {integrity: sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==} + requiresBuild: true dependencies: once: 1.4.0 dev: false @@ -2291,6 +2346,7 @@ packages: /expand-template@2.0.3: resolution: {integrity: sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==} engines: {node: '>=6'} + requiresBuild: true dev: false optional: true @@ -2307,6 +2363,7 @@ packages: /fast-fifo@1.3.2: resolution: {integrity: sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==} + requiresBuild: true dev: false optional: true @@ -2390,6 +2447,7 @@ packages: /fs-constants@1.0.0: resolution: {integrity: sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==} + requiresBuild: true dev: false optional: true @@ -2448,6 +2506,7 @@ packages: /github-from-package@0.0.0: resolution: {integrity: sha512-SyHy3T1v2NUXn29OsWdxmK6RwHD+vkj3v8en8AOBZ1wBQ/hCAQ5bAQTD02kW4W9tUp/3Qh6J8r9EvntiyCmOOw==} + requiresBuild: true dev: false optional: true @@ -2672,11 +2731,13 @@ packages: /ini@1.3.8: resolution: {integrity: sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==} + requiresBuild: true dev: false optional: true /is-arrayish@0.3.2: resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==} + requiresBuild: true dev: false optional: true @@ -3341,6 +3402,7 @@ packages: /mimic-response@3.1.0: resolution: {integrity: sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==} engines: {node: '>=10'} + requiresBuild: true dev: false optional: true @@ -3357,6 +3419,7 @@ packages: /minimist@1.2.8: resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==} + requiresBuild: true dev: false optional: true @@ -3382,6 +3445,7 @@ packages: /mkdirp-classic@0.5.3: resolution: {integrity: sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==} + requiresBuild: true dev: false optional: true @@ -3428,6 +3492,7 @@ packages: /napi-build-utils@1.0.2: resolution: {integrity: sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg==} + requiresBuild: true dev: false optional: true @@ -3452,6 +3517,7 @@ packages: /node-abi@3.47.0: resolution: {integrity: sha512-2s6B2CWZM//kPgwnuI0KrYwNjfdByE25zvAaEpq9IH4zcNsarH8Ihu/UuX6XMPEogDAxkuUFeZn60pXNHAqn3A==} engines: {node: '>=10'} + requiresBuild: true dependencies: semver: 7.5.4 dev: false @@ -3459,6 +3525,7 @@ packages: /node-addon-api@6.1.0: resolution: {integrity: sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==} + requiresBuild: true dev: false optional: true @@ -3754,6 +3821,7 @@ packages: resolution: {integrity: sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==} engines: {node: '>=10'} hasBin: true + requiresBuild: true dependencies: detect-libc: 2.0.2 expand-template: 2.0.3 @@ -3878,6 +3946,7 @@ packages: /pump@3.0.0: resolution: {integrity: sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==} + requiresBuild: true dependencies: end-of-stream: 1.4.4 once: 1.4.0 @@ -3890,6 +3959,7 @@ packages: /queue-tick@1.0.1: resolution: {integrity: sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==} + requiresBuild: true dev: false optional: true @@ -3901,6 +3971,7 @@ packages: /rc@1.2.8: resolution: {integrity: sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==} hasBin: true + requiresBuild: true dependencies: deep-extend: 0.6.0 ini: 1.3.8 @@ -4229,11 +4300,13 @@ packages: /simple-concat@1.0.1: resolution: {integrity: sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==} + requiresBuild: true dev: false optional: true /simple-get@4.0.1: resolution: {integrity: sha512-brv7p5WgH0jmQJr1ZDDfKDOSeWWg+OVypG99A/5vYGPqJ6pxiaHLy8nxtFjBA7oMa01ebA9gfh1uMCFqOuXxvA==} + requiresBuild: true dependencies: decompress-response: 6.0.0 once: 1.4.0 @@ -4243,6 +4316,7 @@ packages: /simple-swizzle@0.2.2: resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==} + requiresBuild: true dependencies: is-arrayish: 0.3.2 dev: false @@ -4303,6 +4377,7 @@ packages: /streamx@2.15.1: resolution: {integrity: sha512-fQMzy2O/Q47rgwErk/eGeLu/roaFWV0jVsogDmrszM9uIw8L5OA+t+V93MgYlufNptfjmYR1tOMWhei/Eh7TQA==} + requiresBuild: true dependencies: fast-fifo: 1.3.2 queue-tick: 1.0.1 @@ -4386,6 +4461,7 @@ packages: /strip-json-comments@2.0.1: resolution: {integrity: sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==} engines: {node: '>=0.10.0'} + requiresBuild: true dev: false optional: true @@ -4466,6 +4542,7 @@ packages: /tar-fs@2.1.1: resolution: {integrity: sha512-V0r2Y9scmbDRLCNex/+hYzvp/zyYjvFbHPNgVTKfQvVrb6guiE/fxP+XblDNR011utopbkex2nM4dHNV6GDsng==} + requiresBuild: true dependencies: chownr: 1.1.4 mkdirp-classic: 0.5.3 @@ -4476,6 +4553,7 @@ packages: /tar-fs@3.0.4: resolution: {integrity: sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==} + requiresBuild: true dependencies: mkdirp-classic: 0.5.3 pump: 3.0.0 @@ -4486,6 +4564,7 @@ packages: /tar-stream@2.2.0: resolution: {integrity: sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==} engines: {node: '>=6'} + requiresBuild: true dependencies: bl: 4.1.0 end-of-stream: 1.4.4 @@ -4497,6 +4576,7 @@ packages: /tar-stream@3.1.6: resolution: {integrity: sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==} + requiresBuild: true dependencies: b4a: 1.6.4 fast-fifo: 1.3.2 @@ -4575,6 +4655,7 @@ packages: /tunnel-agent@0.6.0: resolution: {integrity: sha512-McnNiV1l8RYeY8tBgEpuodCC1mLUdbSN+CYBL7kJsJNInOP8UjDDEwdk6Mw60vdLLrr5NHKZhMAOSrR2NZuQ+w==} + requiresBuild: true dependencies: safe-buffer: 5.2.1 dev: false @@ -4959,6 +5040,19 @@ packages: resolution: {integrity: sha512-eOpPHogvorZRobNqJGhapa0JdwaxpjVvyBp0QIUMRMSf8ZAlqOdEquKuRmw9Qwu0qXtJIWqFtMkmvJjUZmMjVA==} dev: false + /vue-i18n@9.3.0(vue@3.3.4): + resolution: {integrity: sha512-+2L+ae/e4+fixhjym3lgzGCGQG8wVGlGrDHzjfdgUudheHvbVHu5i6tn6FF+buH75UFA7T5ZO2ZO7zrh6CzuaA==} + engines: {node: '>= 16'} + peerDependencies: + vue: ^3.0.0 + dependencies: + '@intlify/core-base': 9.3.0 + '@intlify/shared': 9.3.0 + '@intlify/vue-devtools': 9.3.0 + '@vue/devtools-api': 6.5.0 + vue: 3.3.4 + dev: false + /vue@3.3.4: resolution: {integrity: sha512-VTyEYn3yvIeY1Py0WaYGZsXnz3y5UnGi62GjVEqvEGPl6nxbOrCXbVOTQWBEJUqAyTUk2uJ5JLVnYJ6ZzGbrSw==} dependencies: diff --git a/public/serviceWorker.js b/public/serviceWorker.js index 98fe5cd..6067343 100644 --- a/public/serviceWorker.js +++ b/public/serviceWorker.js @@ -1,4 +1,4 @@ -const API_URL = 'http://localhost:3000/api/'; +const API_URL = 'http://localhost:3001/api/'; /** * localForage is a fast and simple storage library for JavaScript. * localForage improves the offline experience of your web app diff --git a/src/components/FormSignIn.vue b/src/components/FormSignIn.vue index 5e840ac..da25a57 100644 --- a/src/components/FormSignIn.vue +++ b/src/components/FormSignIn.vue @@ -10,39 +10,43 @@
-

Sign in to platform

+

+ {{ $t('auth.login.header') }} +

Your email{{ $t('auth.fields.email') }} Your password{{ $t('auth.fields.password') }}
Lost Password?{{ $t('auth.link.forgotPassword') }}
- Login to your account + {{ + $t('auth.login.submit') + }} {{ errorMessage }}
- Not registered? + {{ $t('auth.link.notRegistered') }} Create account{{ $t('auth.link.createAccount') }}
diff --git a/src/lang/da.ts b/src/lang/da.ts new file mode 100644 index 0000000..8ffd376 --- /dev/null +++ b/src/lang/da.ts @@ -0,0 +1,19 @@ +export default { + auth: { + fields: { + email: 'Din e-mail', + emailPlaceholder: 'navn@firma.dk', + password: 'Din adgangskode', + passwordPlaceholder: '••••••••', + }, + link: { + forgotPassword: 'Glemt dit kodeord?', + notRegistered: 'Ikke registeret?', + createAccount: 'Opret konto', + }, + login: { + header: 'Log ind på platformen', + submit: 'Log ind på din konto', + }, + }, +}; diff --git a/src/lang/en.ts b/src/lang/en.ts new file mode 100644 index 0000000..7b780b0 --- /dev/null +++ b/src/lang/en.ts @@ -0,0 +1,19 @@ +export default { + auth: { + fields: { + email: 'Your email', + emailPlaceholder: 'name@company.com', + password: 'Your password', + passwordPlaceholder: '••••••••', + }, + link: { + forgotPassword: 'Forgot password?', + notRegistered: 'Not registered?', + createAccount: 'Create account', + }, + login: { + header: 'Sign in to platform', + submit: 'Sign in to your account', + }, + }, +}; diff --git a/src/pages/_app.ts b/src/pages/_app.ts new file mode 100644 index 0000000..f994ddc --- /dev/null +++ b/src/pages/_app.ts @@ -0,0 +1,18 @@ +// Entry point for Vue +import type { App } from 'vue'; +import { createI18n } from 'vue-i18n'; + +import en from '../lang/en'; +import da from '../lang/da'; + +const i18nPlugin = createI18n({ + locale: 'en', + messages: { + en: en, + da: da, + }, +}); + +export default (app: App) => { + app.use(i18nPlugin); +};