PhoenixKit.Modules.Shop.Web.Components.TranslationTabs (phoenix_kit v1.7.38)

Copy Markdown View Source

Translation tabs component for Shop module forms.

Displays language tabs for editing product/category translations. Only visible when the Languages module is enabled and has multiple languages.

Localized Fields Model

With the new localized fields approach, each translatable field stores a map of language → value directly:

%Product{
  title: %{"en" => "Planter", "ru" => "Кашпо"},
  slug: %{"en" => "planter", "ru" => "kashpo"}
}

The component provides helpers to work with this structure in forms.

Examples

<.translation_tabs
  languages={@enabled_languages}
  current_language={@current_language}
  entity={@product}
  translatable_fields={[:title, :slug, :description]}
  on_click="switch_language"
/>

Summary

Functions

Builds a translations map from entity's localized fields.

Returns the default language code.

Returns list of enabled languages for translation tabs.

Gets the value of a localized field for a specific language.

Merges translations map back into localized field attrs for changeset.

Checks if multi-language editing should be shown.

Renders translation fields for the current language.

Renders translation tabs for multi-language editing.

Functions

build_translations_map(entity, fields)

@spec build_translations_map(
  struct(),
  [atom()]
) :: map()

Builds a translations map from entity's localized fields.

Transforms from new model (field → lang → value) to UI model (lang → field → value). This allows the TranslationTabs UI to work with the new localized fields model.

Examples

iex> entity = %Product{
...>   title: %{"en" => "Planter", "ru" => "Кашпо"},
...>   slug: %{"en" => "planter", "ru" => "kashpo"}
...> }
iex> build_translations_map(entity, [:title, :slug])
%{
  "en" => %{"title" => "Planter", "slug" => "planter"},
  "ru" => %{"title" => "Кашпо", "slug" => "kashpo"}
}

get_default_language()

@spec get_default_language() :: String.t()

Returns the default language code.

get_enabled_languages()

@spec get_enabled_languages() :: [map()]

Returns list of enabled languages for translation tabs.

Returns empty list if Languages module is disabled or only one language enabled.

get_localized_value(changeset, field, language)

@spec get_localized_value(struct() | Ecto.Changeset.t(), atom(), String.t()) ::
  String.t() | nil

Gets the value of a localized field for a specific language.

Works with the new localized fields model where each field is a map.

Examples

iex> get_localized_value(%Product{title: %{"en" => "Planter", "ru" => "Кашпо"}}, :title, "en")
"Planter"

iex> get_localized_value(%Product{title: %{"en" => "Planter"}}, :title, "ru")
nil

merge_translations_to_attrs(entity, translations_map, default_values, default_lang, fields)

@spec merge_translations_to_attrs(struct(), map(), map(), String.t(), [atom()]) ::
  map()

Merges translations map back into localized field attrs for changeset.

Transforms from UI model (lang → field → value) to new model attrs.

Parameters

  • entity - The current entity (to preserve existing values)
  • translations_map - UI translations map
  • default_lang_values - Values from main form fields (for default language)
  • fields - List of translatable field atoms

Examples

iex> merge_translations_to_attrs(
...>   %Product{title: %{"en" => "Old"}, slug: %{"en" => "old"}},
...>   %{"ru" => %{"title" => "Кашпо", "slug" => "kashpo"}},
...>   %{"title" => "New Planter", "slug" => "new-planter"},
...>   "en",
...>   [:title, :slug]
...> )
%{
  title: %{"en" => "New Planter", "ru" => "Кашпо"},
  slug: %{"en" => "new-planter", "ru" => "kashpo"}
}

show_translation_tabs?()

@spec show_translation_tabs?() :: boolean()

Checks if multi-language editing should be shown.

Returns true if Languages module is enabled and has 2+ languages.

translation_fields(assigns)

Renders translation fields for the current language.

Attributes

  • language - Current language code being edited
  • translations - Current translations map from entity
  • fields - List of field configs: [%{key: :title, label: "Title", type: :text}, ...]
  • form_prefix - Form name prefix (e.g., "product")

Attributes

  • language (:string) (required)
  • translations (:map) - Defaults to %{}.
  • fields (:list) (required)
  • form_prefix (:string) (required)
  • is_default_language (:boolean) - Defaults to false.

translation_tabs(assigns)

Renders translation tabs for multi-language editing.

Attributes

  • languages - List of language maps with keys: code, name, flag
  • current_language - Currently active language code
  • translations - Current translations map from entity
  • translatable_fields - List of field atoms that should be translated
  • on_click - Event name for tab click handler
  • class - Additional CSS classes

Attributes

  • languages (:list) (required)
  • current_language (:string) (required)
  • translations (:map) - Defaults to %{}.
  • translatable_fields (:list) - Defaults to [].
  • on_click (:string) - Defaults to "switch_language".
  • class (:string) - Defaults to "".