#set($languages = $mediaarchive.getList("locale") )
<div class="d-flex align-items-start justify-content-between mt-3 mb-1" id="languageaction_${detail.id}">
  <div class="dropdown">
    <button type="button" class="dropdown-toggle btn btn-sm btn-primary me-1" title="[[Add a Language]]">
      <i class="bi bi-plus-lg"></i>
    </button>
    <div class="dropdown-menu">
      #foreach($locale in $languages)
        #if($locale.getBoolean("enabled"))
          <a id="add-${detail.id}-${locale.id}"
            class="dropdown-item addlocale-ajax" 
            data-detailid="${detail.id}"
            data-url="$siteroot$apphome/components/xml/types/language/extralanguage.html"
            data-targetdiv="languagesextra_${detail.id}"
            data-targetappendtype="insertbefore"
            data-detailid="${detail.id}"
            data-no-toast="true"
            data-locale="#text($locale)"
            data-languagecode="$locale.id"
          >
            #text($locale)
          </a>
        #end
      #end
    </div>
  </div>

  <div class="d-flex align-items-center">
    <button type="button" class="btn btn-sm btn-primary translate-ajax" title="[[Creates Translations for Missing Languages]]">
      <i class="bi bi-translate me-1"></i> [[Translate]]
    </button>
    <span class="mx-1">[[from]]</span>
    <select id="translate-dropdown-${detail.id}"
      class="form-control form-select form-control-sm sourcelocale m-0"
      style="max-width: 120px;"
      data-detailid="${detail.id}"
      data-url="$siteroot$apphome/components/xml/types/language/extralanguage.html"
      data-targetdiv="languagesextra_${detail.id}"
      data-targetappendtype="insertbefore"
      data-detailid="${detail.id}"
      data-no-toast="true">
      #set($skip = false)
      #set($selectedfromlocale = "")
      #foreach($locale in $languages)
        #if($locale.getBoolean("enabled"))
          #set($localval = $languagemap.getText($locale.id))
          #set($selected = false)
          #if(!$skip)
            #if($addedlocale == $locale.id || ($localval && $localval != ""))
              #set($skip = true)
              #set($selected = true)
              #set($selectedfromlocale = $locale)
            #end
          #end
          <option value="$locale.id" #if($selected) selected #end>
            #text($locale)
          </option>
        #end
      #end
    </select>
    <span class="mx-1">[[to]]</span>
    <select id="translate-to-dropdown-${detail.id}"
      class="form-control form-select form-control-sm targetlocale m-0"
      style="max-width: 160px;"
      data-detailid="${detail.id}"
      data-url="$siteroot$apphome/components/xml/types/language/extralanguage.html"
      data-targetdiv="languagesextra_${detail.id}"
      data-targetappendtype="insertbefore"
      data-detailid="${detail.id}"
      data-no-toast="true">
      <option value="missing" selected>
        [[All Languages]]
      </option>
      #foreach($locale in $languages)
        #if($locale.getBoolean("enabled") && $locale.getBoolean("translatemetadata"))
          <option value="$locale.id">
            #text($locale)
          </option>
        #end
      #end
      <option value="all">
        [[Overwrite All]]
      </option>
    </select>
  </div>
</div>