<% i18n_scope_profile = 'user._profile_page' %>

<header class="main-header">
  <h1><%= t('header', scope: i18n_scope_profile) %></h1>
</header>
<section id="main" class="user-settings-wrapper">
  <section id="user-avatar">
    <%= simple_form_for @user, url: j_platform.update_user_path, html: { id: 'update-avatar' } do |f| %>
      <article class='avatar-holder'>
        <%= image_tag "#{@user.avatar.url_medium}", alt: t('common.avatar_preview'), id: "avatar-preview" %>
        <%= link_to t('common.add_image'), '#', class: 'avatar-upload-link' %>
      </article>
      <%= f.input :avatar_string, as: :file, label: false, input_html: { class: 'file-upload-avatar avatar-upload', "data-fail" => t('messages.error.file_size'), "data-size" => MAX_AVATAR_FILE_SIZE, "data-invalid-file" => t('messages.error.invalid_file') } %>
    <% end %>
    <div class="max-file-size"><%= t('common.max_file_size', file_size: MAX_AVATAR_FILE_SIZE/1024) %></div>
  </section>

  <section id="user-profile">
    <header class="text-section-heading"><%= t('title', scope: i18n_scope_profile) %></header>
    <dl>
      <dt><%= t('first_name_label', scope: i18n_scope_profile) %>:</dt>
      <dd>
        <span class="name"><%= @user.first_name %></span>
        <% if current_user == @user %>
          <%= simple_form_for @user, html: { class: 'edit-text' }, remote: true, url: j_platform.update_user_path, method: :patch do |f| %>
            <%= f.input :first_name, label: false %>
          <% end %>
          <aside class="row-actions">
            <article class="edit-delete">
              <%= link_to t('common.edit'), "", class: "btn-edit-text svg-fill", title: t('edit_first_name_tooltip', scope: i18n_scope_profile) %>
            </article>
            <article class="save-cancel">
              <%= link_to t('common.save'), "", class: "btn-save-text svg-fill" %>
              <%= link_to t('common.cancel'), "", class: "btn-cancel-text svg-fill" %>
            </article>
          </aside>
        <% end %>
      </dd>
      <dt><%= t('last_name_label', scope: i18n_scope_profile) %>:</dt>
      <dd>
        <span class="name"><%= @user.last_name %></span>
        <% if current_user == @user %>
          <%= simple_form_for @user, html: { class: 'edit-text' }, remote: true, url: j_platform.update_user_path, method: :patch do |f| %>
            <%= f.input :last_name, label: false %>
          <% end %>
          <aside class="row-actions">
            <article class="edit-delete">
              <%= link_to t('common.edit'), "", class: "btn-edit-text svg-fill", title: t('edit_last_name_tooltip', scope: i18n_scope_profile) %>
            </article>
            <article class="save-cancel">
              <%= link_to t('common.save'), "", class: "btn-save-text svg-fill" %>
              <%= link_to t('common.cancel'), "", class: "btn-cancel-text svg-fill" %>
            </article>
          </aside>
        <% end %>
      </dd>
      <dt><%= t('email_label', scope: i18n_scope_profile) %>:</dt>
      <dd><%= @user.email %></dd>
      <dt><%= t('member_since_label', scope: i18n_scope_profile) %>:</dt>
      <dd><%= @user.created_at.to_date.to_s(:long_ordinal) %></dd>
      <dt><%= t('member_role_label', scope: i18n_scope_profile) %>:</dt>
      <dd><%= @user.role.humanize %></dd>
      <dt><%= t('member_status_label', scope: i18n_scope_profile) %>:</dt>
      <dd><%= @user.status.humanize %></dd>
    </dl>
  </section>

  <hr>

  <% if current_user == @user %>
    <section id="user-password">
      <header class="text-section-heading">
        <%= t('password_title', scope: i18n_scope_profile) %>
      </header>
      <%= simple_form_for @user, url: j_platform.update_user_path, method: :patch, id: "password-fields", remote: true do |f| %>
        <dl>
          <dt><%= t('current_password_label', scope: i18n_scope_profile) %></dt>
          <dd><%= f.input :current_password, label: false, placeholder: t('current_password_label', scope: i18n_scope_profile), required: true %></dd>
          <dt><%= t('new_password_label', scope: i18n_scope_profile) %></dt>
          <dd><%= f.input :password, label: false, placeholder: t('new_password_label', scope: i18n_scope_profile), required: true %></dd>
          <dt><%= t('confirm_new_password_label', scope: i18n_scope_profile) %></dt>
          <dd><%= f.input :password_confirmation, label: false, placeholder: t('confirm_new_password_label', scope: i18n_scope_profile), required: true %></dd>
          <dt></dt>
          <dd class="buttons">
            <%= f.button :submit, class: "btn-save-setting", value: t('update_password_title', scope: i18n_scope_profile) %>
          </dd>
        </dl>
      <% end %>
    </section>
  <% end %>
</section>