Internationalisation / Translation

[l4b4r4b4b4]

Hey,
first, cudos for this awesome project. Setup wireguard VPN with LDAP integration and works like a charm.

Are there any intentions of including internationalization in the project? UNfortunately I do not have any prior experience in Go, but I would offer my help with German and Spanish, both of which I am a native speaker of.

Cheers
Luke

[h44z]

Hi, I am currently rewriting the frontend using Vue.js, maybe we can use something like https://vue-i18n.intlify.dev/ to handle different languages. Once the frontend is ready, I appreciate your help =)

[l4b4r4b4b4]

Well that's good news. I do have experience in using i18n. Not in Vue but I guess the concepts should be quite similar to using the library in next or react apps, taking a brief look into the docs.

I assume the source code under this branch, right?

[h44z]

nice =)

yeah the code is in the v2-spa branch. It is still far from finished though...
If you want to view the new UI (without backend interaction at the moment) you have to:

• cd [path to wg-portal]/cmd/wg-portal-spa/frontend
• npm install
• npm run dev
• visit localhost:3000

[l4b4r4b4b4]

will start trying to include i18n then :)

[l4b4r4b4b4]

so I added i18n (de/en) for menu and home page. Pull request coming 😄

[l4b4r4b4b4]

How can I assign an object to a html property in VueJS?

The following code does not work...

<input type="text" name="username" class="form-control" id="inputUsername"
  aria-describedby="usernameHelp" placeholder={{$t('login.usernameMsg')}}>

[h44z]

How can I assign an object to a html property in VueJS?

The following code does not work...

<input type="text" name="username" class="form-control" id="inputUsername"
  aria-describedby="usernameHelp" placeholder={{$t('login.usernameMsg')}}>

You have to bind attributes like so: :placeholder="$t('login.userMessage')"

<input type="text" name="username" class="form-control" id="inputUsername" aria-describedby="usernameHelp" :placeholder="$t('login.userMessage')">