Merge pull request #48 from lexintegritastech/feature-enhancement-ui

Improve `subejcts` accordion

app/components/sidenav_component/sidenav_component.html.erb

@@ -95,8 +95,8 @@
                 </a>
               </li>
               <li class="nav-item p-2">
-                <a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#subjectsOffCanvas" 
-                   data-controller="subjects" data-accordion-for="doctrines" data-accordion-target="#subjectsAccordionBody" 
+                <a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#doctrinesOffCanvas" 
+                   data-controller="subjects" data-accordion-for="doctrines" data-accordion-target="#doctrinesAccordionBody" 
                    data-action="click->subjects#loadSubjectsAccordion">
                   <i class="fas fa-book me-2"></i> Doctrines
                 </a>
@@ -109,7 +109,6 @@
               </li>
               <li class="nav-item p-2 active-red">
                <%= link_to '<i class="fas fa-sign-out-alt"></i> Sign Out'.html_safe, destroy_user_session_path, class:" text-white nav-link" %>
- 
               </li>
             </ul>
           </form>

app/components/subject_accordion_component.rb

@@ -22,7 +22,9 @@ class SubjectAccordionComponent < BaseComponent
   end
 
   def accordion_body_id
-    ["subjectsAccordionBody", search_result["id"]].join
+    accordion_body = opts[:accordionFor].present? && opts[:accordionFor].to_s.eql?("subjects") ? "subjectsAccordionBody" : "doctrinesAccordionBody"
+
+    [accordion_body, search_result["id"]].join
   end
 
   def custom_url

app/components/subject_accordion_component/subject_accordion_component.html.erb

@@ -1,10 +1,10 @@
 <div class="accordion accordion-flash" id="<%= parent_accordion_id %>">
   <div class="accordion-item">
     <div class="accordion-header d-flex justify-content-between">
-      <% if search_result["parent_id"].present? %>
+      <% if search_result["has_children?"].present? %>
         <div class="accordion-button collapsed m-0 p-0" data-bs-toggle="collapse" data-bs-target="#<%= children_accordion_id %>" 
              data-controller="subjects" data-accordion-id="<%= children_accordion_id %>" 
-             data-accordion-for="<%= opts[:accordionFor] %>" data-subject-parent-id="<%= search_result["parent_id"] %>" 
+             data-accordion-for="<%= opts[:accordionFor] %>" data-subject-parent-id="<%= search_result["id"] %>" 
              data-accordion-target="#<%= accordion_body_id %>" data-action="click->subjects#loadSubjectsAccordion"> 
           <%= link_to search_result["name"], custom_url, class: "accordion-link text-decoration-none text-dark d-block sub#{search_result["heirarchy_level"] + 1} clickable-link" %>
         </div>

app/components/subjects_offcanvas_component/subjects_offcanvas_component.html.erb

@@ -1,9 +1,9 @@
-<div class="offcanvas offcanvas-start" data-bs-scroll="true" tabindex="-1" data-bs-backdrop="false" id="subjectsOffCanvas" data-controller="subjects">
+<div class="offcanvas offcanvas-start" data-bs-scroll="true" tabindex="-1" data-bs-backdrop="false" id="<%= opts[:element_id] %>" data-controller="subjects">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Subjects</h5>
     <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
   </div>
 
-  <div class="offcanvas-body" id="subjectsAccordionBody">
+  <div class="offcanvas-body" id="<%= opts[:accordion_body_id] %>">
   </div>
 </div>

app/controllers/concerns/subject_search.rb

@@ -11,7 +11,7 @@ module SubjectSearch
 
       with :parent_id, search_params[:parent_id].to_i if search_params[:parent_id].present?
 
-      without :parent_id if search_params[:is_root].present? && search_params[:is_root].to_s.eql?("true")
+      with :parent_id, nil if search_params[:is_root].present? && search_params[:is_root].to_s.eql?("true")
 
       without(:id).any_of(search_params[:exclude_ids]) if search_params[:exclude_ids].present?
 

app/javascript/controllers/subjects_controller.js

@@ -15,6 +15,8 @@ export default class extends ApplicationController {
       params.is_root = true
     }
 
+    console.log(opts)
+
     $.get("/api/subjects.json", params, function (search_results, status) {
       if (status === "success") {
         $this.stimulate("SubjectsReflex#render_subjects_accordion", search_results, opts)

app/views/api/subjects/index.json.jbuilder

@@ -2,4 +2,5 @@ json.array!(@subjects) do |subject|
   json.extract! subject, *%i[id name parent_id state doctrine_ids created_at updated_at]
   json.text subject.lineage_name
   json.heirarchy_level subject.ancestors.count
+  json.has_children? subject.has_children?
 end

app/views/layouts/application.html.erb

@@ -14,7 +14,8 @@
   <body class="<%= current_user.present? ? 'container-fluid h-100 w-100 p-0' : 'container-fluid h-100 w-100 p-0 sessions-body-bg' %> " data-controller="selectize">
     <%= render(SidenavComponent.new(current_user: current_user, opts: { is_nav_bar: true }))%>
 
-    <%= render(SubjectsOffcanvasComponent.new(current_user: current_user, opts: { is_render: true })) %>
+    <%= render(SubjectsOffcanvasComponent.new(current_user: current_user, opts: { is_render: true, element_id: "subjectsOffCanvas", accordion_body_id: "subjectsAccordionBody" })) %>
+    <%= render(SubjectsOffcanvasComponent.new(current_user: current_user, opts: { is_render: true, element_id: "doctrinesOffCanvas", accordion_body_id: "doctrinesAccordionBody" })) %>
 
     <div class="<%= current_user.present? ? 'row flex-nowrap h-100 w-100 p-0 ms-0' : 'row h-100 justify-content-end align-items-center' %>">
       <div class="<%= current_user.present? ? 'd-none' : 'col-sm-8 login-logo' %>">