Phoenix liveview hooks update#
Update the global application locale to the retrieved locale value, but only if that locale value is actually different to the global application locale.If it cannot be found in the browser cookies, return the default locale.If it cannot be found in the parameters, check the browser cookies.
First, check the parameters for the locale.We need this LocalePlug to do the following:
Router do use PhxI18nExampleWeb, :router alias PhxI18nExampleWeb. We will not be using a database, so pass in the -no-ecto flag to make sure we do not generate any unneeded Ecto configuration:ĭefmodule PhxI18nExampleWeb.
Phoenix liveview hooks install#
Generate and install dependencies of a new Phoenix application. The software versions we will use to build out this application are: Augmenting client-server with Javascript “sprinkles”.But, with the advent of Phoenix LiveView, I wondered whether I would be able to exactly replicate the snappiness of the Elm example application with Phoenix, just for fun.Īnd so, the rest of this post will focus on porting over/re-creating the Elm application in Phoenix, evolving over four stages: Granted, changing application locale is not something a typical user would perform very often, and so, needing a page refresh for it is probably not a pain point for anyone. However, when I have previously implemented language switching for a standard Phoenix application, compared with frontend-only Elm, needing to make a request back to the server to change the application locale means that a bit more time is needed before the update is visible on screen. The blog post goes through different methods I used to get internationalisation ( i18n) working, but, in my opinion, the options in Elm as of this writing are not quite as nice as Elixir’s gettext- based API. Refresh the page, and you will see that your choice of language is remembered.If you select a different language, the language of the page content and title will change, and the list of selectable languages in the dropdown menu will update.
Click the current language again, or anywhere else on the page, and the menu closes.Click on the current language, and the menu opens, showing a list of selectable languages.The page is deployed here, and you can find the code here, but to save a click, the animated GIF above shows all of its use cases:
Phoenix liveview hooks full#
In a previous blog post, Runtime Language Switching in Elm, I re-created the Tachyons Full Screen Centered Title component documentation page in Elm, and added a language dropdown menu to change the page language.
0 kommentar(er)
