# `PhoenixKitEcommerce.Web.Components.TranslationTabs`
[🔗](https://github.com/BeamLabEU/phoenix_kit_ecommerce/blob/v0.1.8/lib/phoenix_kit_ecommerce/web/components/translation_tabs.ex#L1)

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"
    />

# `build_translations_map`

```elixir
@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`

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

Returns the default language code.

# `get_enabled_languages`

```elixir
@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`

```elixir
@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`

```elixir
@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?`

```elixir
@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`

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`

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 `""`.

---

*Consult [api-reference.md](api-reference.md) for complete listing*