Skip to content

Commit

Permalink
fix: fix language switch and provide further documentation (#46)
Browse files Browse the repository at this point in the history
Adoc documentation has been slightly improved. 
Reference implementation for language switch has been fixed.
[Documentation](https://github.com/e-Spirit/fsxa-pwa/blob/master/docs/modules/ROOT/pages/components/FSXABaseComponent.adoc) for the language switch hase been added.
  • Loading branch information
dbarczewski authored Nov 3, 2021
1 parent 575407b commit 7f73410
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 7 deletions.
1 change: 0 additions & 1 deletion components/fsxa/AppLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,6 @@ class AppLayout extends FSXABaseAppLayout {
handleNavigationClick(item: NavigationItem) {
if (['language.de', 'language.en'].includes(item.key as string)) {
this.triggerRouteChange({
pageId: this.currentPage?.id,
locale: item.key === 'language.de' ? 'de_DE' : 'en_GB'
})
} else {
Expand Down
35 changes: 29 additions & 6 deletions docs/modules/ROOT/pages/components/FSXABaseComponent.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
== Introduction

The FSXABaseComponent is there to have a basic component to be able to implement further components.
It provides different attributes and methods, which should simplify the development significantly. These are described in this section.
It provides different attributes and methods, which should simplify the development significantly.
These are described in this section.

== Usage

Expand Down Expand Up @@ -52,19 +53,22 @@ Note: If you only want type support for your slots and not the props or events y

=== `currentPage` - string

This property returns the NavigationItem that is matching the current path. If `null` is returned, no current route could be matched to the current path.
This property returns the NavigationItem that is matching the current path.
If `null` is returned, no current route could be matched to the current path.

=== `fsxaApi` - Object

This property returns a preconfigured and ready-to-use FSXA-API instance.

=== `globalSettings` - string

This property returns the globally configured project properties. If no projectProperties are defined in your CaaS this will return `null`.
This property returns the globally configured project properties.
If no projectProperties are defined in your CaaS this will return `null`.

=== `isEditMode` - boolean

This property returns `true` if the app is delivering preview data. It will return `false` if it is released data.
This property returns `true` if the app is delivering preview data.
It will return `false` if it is released data.

=== `locale` - string

Expand Down Expand Up @@ -92,7 +96,8 @@ This method returns the stored data which was set with the given key.
getUrlByPageId(pageId: string, locale?: string | undefined): string | null
----

This method returns the corresponding route for a given `pageId`. If no page was found `null` will be returned.
This method returns the corresponding route for a given `pageId`.
If no page was found `null` will be returned.

=== `setStoredItem`

Expand All @@ -113,4 +118,22 @@ You can specify a time-to-live duration in ms, that determines how long the valu
triggerRouteChange(params: {pageId?:string, route?:string, locale?:string}): Promise<void>
----

This method will trigger a route change request. A `pageId`, `route` or `locale` can be passed in. If a corresponding page is found the route change will be triggered. Since this is only available when javascript is enabled, make sure that some kind of fallback is provided.
This method will trigger a route change request. A `pageId`, `route` or `locale` can be passed in.
If a corresponding page is found the route change will be triggered.
Since this is only available when javascript is enabled, make sure that some kind of fallback is provided.

==== `language switch`

With the `triggerRouteChange` method you can also implement a language switch.
When implementing this you have to provide a valid locale abbreviation.
Make sure that you *only* pass the locale parameter.
Otherwise, undesirable side effects may occur.


Example:
[source, javascript]
----
triggerRouteChange({locale: 'en_GB'})
----


0 comments on commit 7f73410

Please sign in to comment.