<% content_for :title, 'Quality Assurance' %>

<% content_for :breadcrumbs do %>
  <%= render 'breadcrumbs' %>
<% end %>

<% content_for :sidebar do %>
  <%= render partial: 'qa/sidebar', locals: 
    { 
      index_path: project_qa_issues_path(current_project),
      name: 'issues_for_review',
      records: @issues
    }
  %>
<% end %>

<div class="row p-0">
  <div class="col-12">
    <div class="content-container">
      <% cache ['issue-content', @issue] do %>
        <div class="note-text-inner"
             data-behavior="inline-threads-container"
             data-inline-threads-path="<%= inline_threads_path(format: :json, inline_thread: { commentable_type: @issue.class, commentable_id: @issue.id }) %>"
             data-inline-threads-base-path="<%= inline_threads_path %>"
             data-commentable-type="<%= @issue.class %>"
             data-commentable-id="<%= @issue.id %>">
          <h4 class="mb-4 header-underline align-items-center">
            <span class="text-truncate" title="<%= @issue.title %>"><%= @issue.title %></span>
            <%= render partial: 'shared/liquid_loading' %>
            <span class="actions">
              <span class="action">
                <%= link_to edit_project_qa_issue_path(current_project, @issue) do %>
                  <i class="fa-solid fa-pencil fa-fw"></i> Edit
                <% end %>
              </span>
              <span class="action">
                <%= link_to project_issue_revisions_path(current_project, @issue, qa: true) do %>
                  <i class="fa-solid fa-history fa-fw"></i> View History
                <% end %>
              </span>
            </span>
          </h4>
          <%= render partial: 'shared/textile_content', locals: { record: @issue, preview_path: preview_project_issue_path(current_project, @issue) } %>
          <div class="author-info">
            <span class="ms-auto">Author: <%= @issue.author || 'n/a' %></span>
          </div>
        </div>
      <% end %>
    </div>

    <div class="offcanvas offcanvas-end" tabindex="-1" data-behavior="inline-thread-panel" data-bs-backdrop="false" data-bs-scroll="true" aria-labelledby="inlineThreadPanelLabel">
      <div class="offcanvas-header">
        <h6 class="offcanvas-title">Thread</h6>
        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
      </div>
      <div class="offcanvas-body pt-0">
        <%= turbo_frame_tag 'inline_thread_content', data: { behavior: 'inline-thread-content' } %>
      </div>
    </div>

    <div class="content-container">
      <%= content_tag :div,
          spinner_tag,
          data: {
            behavior: 'fetch fetch-comments',
            path: comments_path(
              comment: {
                commentable_type: @issue.class,
                commentable_id: @issue.id
              }
            )
          }
        %>

      <%= render_view_hooks('issues/comments') %>
    </div>

    <div class="content-container">
      <%= content_tag :div,
          spinner_tag,
          data: {
            behavior: 'fetch fetch-subscriptions',
            path: subscriptions_path(
              subscription: {
                subscribable_type: @issue.class,
                subscribable_id: @issue.id
              }
            )
          }
        %>
    </div>
  </div>
</div>
