_task_modal.html.erb

<!-- Task modal -->
<div class="modal fade" id='<%= "taskModal#{task.id}" %>' data-backdrop="true" tabindex="-1" role="dialog"
  aria-labelledby="taskModalTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <!-- Header -->
      <div class="modal-header">
        <h3 class="modal-title"><%= task.title.capitalize %></h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <!-- Body -->
      <div class="modal-body">
        <!-- Body: carousel -->
        <div id='<%= "taskCarouselIndicators#{task.id}" %>' class="carousel slide" data-ride="carousel">
          <div class="carousel-inner">
            <% task.photos.each_with_index do |photo, index| %>
            <div class='carousel-item <%= index == 0 ? "active" : ""  %>'>
              <%= cl_image_tag photo.key, class: "d-block carousel-photo" %>
            </div>
            <% end %>
          </div>
          <% if task.photos.length > 1 # show controls only if there's more than 1 photo %>
          <a class="carousel-control-prev" href='<%= "#taskCarouselIndicators#{task.id}" %>' role="button"
            data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
          </a>
          <a class="carousel-control-next" href='<%= "#taskCarouselIndicators#{task.id}" %>' role="button"
            data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
          </a>
          <% end %>
        </div>
        <!-- Body: description -->
        <div class="container-fluid">
          <div class="row mt-3">
            <div class="col-lg-2">
              <div class="modal-user-container">
                <% if task.creator.avatar.attached? %>
                <%= cl_image_tag task.creator.avatar.key, class: "card-trip-user avatar-shadow" %>
                <% else %>
                <%= image_tag "avatar-placeholder.png", class: "card-trip-user avatar-shadow" %>
                <% end %>
                <h6><%=link_to(task.creator.shortname, user_path(task.creator.id))%></h6>
              </div>
            </div>
            <div class="col-lg-10 pl-4">
              <%= task.description %>
              <hr>
              <div class="modal-location">
                <p><i class="fas fa-map-pin pin-icon"></i> <%= task.location %></p>
              </div>
              <div class="modal-tags">
                <% task.tags.each do |tag| %>
                <p class="tag shadow-sm">#<%= tag.name %></p>
                <% end %>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- Footer -->
      <% unless task.creator == current_user %>
      <div class="modal-footer">
        <% if current_user %>
        <% if task.helps.find_by(user: current_user) %>
        <% unless current_page?(dashboard_path) %>
        <%= link_to "Already applied - Go to dashboard", dashboard_path, class: "btn-gradient" %>
        <% end %>
        <% else %>
        <%= button_tag "Apply to this task", class: "btn-gradient", "data-toggle": "modal", "data-target": "#helpModal#{task.id}" %>
        <% end %>
        <% else %>
        <%= link_to "Log in to apply!", new_user_session_path, class: "btn-gradient" %>
        <% end %>
      </div>
      <% end %>
    </div>
  </div>
</div>
<% unless task.creator == current_user && task.helps.find_by(user: current_user) %>
<!-- Help request modal -->
<div class="modal fade" id='<%= "helpModal#{task.id}" %>' tabindex="-1" role="dialog" aria-labelledby="Help Modal"
  aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Apply to help <%= task.creator.shortname %></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <% if current_user && current_user.stripe_account.nil? %>
      <div class="modal-body p-4 d-flex flex-wrap">
        <h6>Add a method to receive payments before applying</h6>
        <%# TODO: add more stripe_user[] fields to url, to fill out location https://stripe.com/docs/connect/oauth-reference#prefill-fields %>
        <%= link_to "https://connect.stripe.com/express/oauth/authorize?client_id=ca_HA7rfKJUEi7LbaFoN8G4kId01KVQQZ65&stripe_user[email]=#{current_user.email}&stripe_user[first_name]=#{current_user.first_name}&stripe_user[last_name]=#{current_user.last_name}&stripe_user[business_type]=individual&suggested_capabilities[]=card_payments" do %>
        <p class="stripe-connect light-blue mt-3"><span>Connect with Stripe</span></p>
        <% end %>
      </div>
      <% elsif current_user %>
      <div class="modal-body p-4">
        <%= simple_form_for [task, Help.new] do |f| %>
        <%= f.input :message, placeholder: "Write a short description of why you want to help" %>
        <%# TODO: This bid input needs to be deisgned better, and I was also having some issues with the bid appearing as 0 when it was not supposed to be %>
        <%= f.input :bid, required: true %>
        <%= f.button :submit, class: "btn-gradient float-right", value: "Send", data: { disable_with: "Sending..." } %>
        <% end %>
      </div>
      <% end %>
    </div>
  </div>
</div>
<% end %>