feat: language switcher #230
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| const data = await changeLanguage((option.target as HTMLSelectElement).value); | ||
|
|
||
| if (data.redirectUrl) { | ||
| window.location.replace(replaceToDevStorefront(data.redirectUrl)); |
There was a problem hiding this comment.
I believe it should, as it should cause re-render without the need of loading all the assets. I'm fine with this if it's quick enough though :)
Wanted to test that, but I've found that there is some bug.
- I went to preview: https://frontends-demo-git-feat-gh-222-shopware-frontends.vercel.app/
- Switched language to "Polish"
- I landed on page https://demo-frontends.shopware.store/pl-PL
templates/vue-demo-store/app.vue
Outdated
| const { locale } = useI18n(); | ||
| const { availableLocales } = useI18n(); |
There was a problem hiding this comment.
| const { locale } = useI18n(); | |
| const { availableLocales } = useI18n(); | |
| const { locale, availableLocales } = useI18n(); |
| vueI18n: { | ||
| fallbackLocale: "en-GB", | ||
| }, | ||
| strategy: "prefix_except_default", |
There was a problem hiding this comment.
needed explanation in vue-demo-store/README.md why's that and what configuration in the backend should look like to have it working smoothly 📝
| @@ -156,7 +157,7 @@ onBeforeMount(async () => { | |||
| <NuxtLink | |||
| class="justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-brand-primary hover:bg-brand-dark focus:outline-none focus:ring-2 focus:ring-brand-primary mt-auto" | |||
| data-testid="my-account-change-default-billing-address-button" | |||
| to="/account/address" | |||
| :to="localePath(`/account/address`)" | |||
There was a problem hiding this comment.
also in the docs wee need to mention that our translation mechanism bases on locale path.
maybe globally in few words + linking to the nuxt module that we are using
| getAvailableLanguages(): Promise<EntityResult<"language", Language>>; | ||
| changeLanguage(languageId: string): Promise<ContextTokenResponse>; | ||
| getLanguageCodeFromId(languageId: string): string; | ||
| getLanguageIdFromCode(languageCode: string): string; | ||
| replaceToDevStorefront(url: string): string; | ||
| languages: Ref<Language[]>; | ||
| currentLanguage: Ref<string>; | ||
| currentPrefix: Ref<string>; |
There was a problem hiding this comment.
please add jsDocs for all exposed methods following #91
| const data = await changeLanguage((option.target as HTMLSelectElement).value); | ||
|
|
||
| if (data.redirectUrl) { | ||
| window.location.replace(replaceToDevStorefront(data.redirectUrl)); |
There was a problem hiding this comment.
I would also add that data.redirectUrl contains only the domain (with or without prefix/suffix etc). but being on specific pretty url like /Summer-T-Shirt for polish store may have a path like /Wakacyjny-T-Shirt. The redirect for always a main page isn't enough here and we need to combine domain + current path (translated if exists) when switching the language. Sounds like a bigger task for separate issue, right?
Description
closes #222
Type of change
Screenshots (if applicable)
Additional context