lujanfernaud/prevy

<div class="container-fluid bg-light">
  <div class="container pb-4">

    <% if @group || @event %>
      <div class="mb-2">
        <%= render partial: "application/breadcrumbs" %>
      </div>
    <% else %>
      <div class="mt-4 pt-1"></div>
    <% end %>

    <% cache [@user, @user == current_user, @group, @event] do %>

      <div class="box box-user-profile mb-2 p-4 text-center">

        <div class="row mb-2">
          <div class="col-md-12">

            <!-- Edit Profile Link -->
            <% if @user == current_user %>
              <div class="edit-profile-link mb-3">
                <%= link_to "(Edit profile)", edit_user_path(@user) %>
              </div>
            <% end %>

            <!-- User Name -->
            <h2 class="mb-4 d-inline-block">
              <%= @user.name %>
            </h2>

            <!-- User Avatar -->
            <div class="user-profile-image-container">
              <div class="intrinsic-ratio-container intrinsic-ratio-container--square">
                <%= image_tag gravatar_image_url(@user.email),
                  class: "lazyload blur-up
                    intrinsic-ratio-image user-avatar",
                  alt: @user.name %>
              </div>
            </div>
          </div>
        </div>

        <!-- User Group Points -->
        <% if @group && authorized?(current_user, @group) %>
          <div class="row group-points">
            <div class="col-md-12 mt-4">
              <h3 class="h4 profile-heading mb-2 pb-1">Group Points</h3>

              <div class="d-flex flex-row justify-content-center mt-3">
                <div class="user-profile__points user-points
                  user-points--profile lead mb-0">
                  <%= @user.group_points_amount(@group) %>
                </div>
              </div>
            </div>
          </div>
        <% end %>

        <!-- User Location -->
        <% if @user.location && !@user.location.empty? %>
          <div class="row">
            <div class="col-md-12 mt-4">
              <h3 class="h4 profile-heading">Location</h3>
              <p class="mb-0">
                <%= @user.location %>
              </p>
            </div>
          </div>
        <% end %>

        <!-- User Bio  -->
        <% if @user.bio && !@user.bio.empty? %>
          <div class="row">
            <div class="col-md-12 mt-4">
              <h3 class="h4 profile-heading">Bio</h3>
              <p class="mb-0">
                <%= @user.bio %>
              </p>
            </div>
          </div>
        <% end %>

      </div>

    <% end %>

  </div>
</div>