Major Updates for `documents`, `doctrines`, and `annotations`

app/components/annotation_marks_modal_form_component.rb

@@ -14,7 +14,8 @@ class AnnotationMarksModalFormComponent < BaseComponent
   end
 
   def document_title
-    [document.title, document.reference_number, document_date_or_year].reject(&:blank?).join(", ")
+    title = document.short_title || document.title
+    [title, document.reference_number, document_date_or_year].reject(&:blank?).join(", ")
   end
 
   def citing_documents_reference_numbers

app/components/annotation_marks_modal_form_component/annotation_marks_modal_form_component.html.erb

@@ -48,8 +48,8 @@
         </div>
 
         <div class="row">
-          <div class="form-floating col-sm-12 p-2">
+          <div class="col-sm-12 p-2">
-            <%= label_tag :phil_rep %>
+            <strong> <%= label_tag :annotation_marks %> </strong> 
             <%= text_field_tag :phil_rep, annotation.phil_rep, class: "form-control" %>
           </div>
         </div>

app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb

@@ -11,16 +11,18 @@
           <div class="row">
             <div class="col-sm-12 p-2">
               <strong> <%= label_tag :subjects %> </strong>
-              <%= select_tag "subject_ids[]", options_from_collection_for_select(subjects, :id, :lineage_name, doctrine.subject_ids), class: "form-select default-selectize", multiple: true, prompt: "Please select" %>
+              <%= select_tag "subject_ids[]", options_from_collection_for_select(subjects, :id, :lineage_name, doctrine.subject_ids), class: "form-select subject-ids-selectize", multiple: true, prompt: "Please select" %>
             </div>
           </div>
 
-          <div class="row">
+          <% if doctrine.new_record? %>
-            <div class="col-sm-12 p-2">
+            <div class="row">
-              <strong> <%= label_tag :doctine_content_suggestions %> </strong>
+              <div class="col-sm-12 p-2">
-              <%= select_tag :doctine_content_suggestions, options_from_collection_for_select(Doctrine.all, :content, :plain_content), class: "form-select", prompt: "Please select" %>
+                <strong> <%= label_tag :doctine_content_suggestions %> </strong>
+                <select id="doctine_content_suggestions" class="form-select"> </select>
+              </div>
             </div>
-          </div>
+          <% end %>
 
           <div class="row">
             <div class="col-sm-12 p-2">

app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb

@@ -14,16 +14,29 @@
   <div class="container-sm <%= opts[:is_subjects_index].present? ? 'm-0 ps-0' : 'ms-3' %>">
     <p class="mb-0"> <%= raw content.html_safe %> </p>
 
-    <div class="container-sm ms-5">
+    <div class="container-sm ms-3">
       <% annotations.each do |annotation| %>
-        <p class="mb-0">
+        <% if opts[:is_doctrines_index].present? %>
+          <% document_title = annotation.doctrine.document.short_title || annotation.doctrine.document.title %>
+          <% date_or_year = annotation.doctrine.document.docdate.present? ? annotation.doctrine.document.docdate.to_date.strftime("%B %d, %Y") : annotation.document.year %>
+          <span> <%= [document_title, annotation.document.reference_number, date_or_year].join(", ") %> </span>
+        <% end %>
+
+        <p class="mb-0 ms-3">
+          <% annotated_documents_title = [] %>
+          <% annotation.documents.each do |annotated_document| %>
+            <% ad_title = annotated_document.short_title || annotated_document.title %>
+            <% ad_date_or_year = annotated_document.docdate.present? ? annotated_document.docdate.strftime("%B %d, %Y") : annotated_document.year %>
+            <% annotated_documents_title << [" citing #{ad_title}", annotated_document.reference_number, ad_date_or_year].join(", ") %>
+          <% end %>
+
           <strong> <%= "#{annotation.annomarks.map { |annomark| "(#{annomark.code})" }.join(" ")}" %> </strong>
-          <%= raw [document_title(annotation), annotation.document.reference_number, date_or_year(annotation), annotation.phil_rep].reject(&:blank?).join(', ') %>
+          <%= raw [document_title(annotation), annotation.document.reference_number, date_or_year(annotation), annotation.phil_rep, annotated_documents_title].reject(&:blank?).join(', ') %>
         </p>
 
         <% if annotation.editor_notes.present? %>
-          <div class="row">
+          <div class="row ms-5">
-            <div class="col-sm-2 ms-5 p-0" style="width: 105px;">
+            <div class="col-sm-2 p-0" style="width: 105px;">
               <span> Editors Note: </span>
             </div>
             

app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb

@@ -148,9 +148,21 @@
         <% doctrine.annotations.order(rank: :asc).each do |annotation| %>
           <div class="row">
             <div class="col-sm-10">
-              <p class="pb-0">
+              <% document_title = annotation.doctrine.document.short_title || annotation.doctrine.document.title %>
+              <% date_or_year = annotation.doctrine.document.docdate.present? ? annotation.doctrine.document.docdate.to_date.strftime("%B %d, %Y") : annotation.document.year %>
+              <span> <%= [document_title, annotation.document.reference_number, date_or_year].join(", ") %> </span>
+
+              <p class="pb-0 ms-3">
                 <strong> <%= "#{annotation.annomarks.map { |annomark| "(#{annomark.code})" }.join(" ")}" %> </strong>
-                <%= raw [annotation.document.title, annotation.document.reference_number, annotation.document.docdate.strftime("%B %d, %Y"), annotation.phil_rep].reject(&:blank?).join(', ').html_safe %>
+                <% document_title = annotation.document.short_title || annotation.document.title %>
+                <% date_or_year = annotation.document.docdate.present? ? annotation.document.docdate.strftime("%B %d, %Y") : annotation.document.year %>
+                <% annotated_documents_title = [] %>
+                <% annotation.documents.each do |annotated_document| %>
+                  <% ad_title = annotated_document.short_title || annotated_document.title %>
+                  <% ad_date_or_year = annotated_document.docdate.present? ? annotated_document.docdate.strftime("%B %d, %Y") : annotated_document.year %>
+                  <% annotated_documents_title << [" citing #{ad_title}", annotated_document.reference_number, ad_date_or_year].join(", ") %>
+                <% end %>
+                <%= raw [document_title, annotation.document.reference_number, date_or_year, annotation.phil_rep, annotated_documents_title].reject(&:blank?).join(', ').html_safe %>
               </p>
             </div>
 

app/components/pagination_component.rb

@@ -1,5 +1,13 @@
 class PaginationComponent < BaseComponent
-  def initialize(data:)
+  attr_reader :data, :opts
+  def initialize(data:, opts: {})
     @data = data
+    @opts = opts
+  end
+
+  def subjects
+    return [] if opts[:subject_ids].blank?
+
+    Cdao::Subject.where(id: opts[:subject_ids].map(&:to_i))
   end
 end

app/components/pagination_component/pagination_component.html.erb

@@ -1,15 +1,31 @@
 <div class="col col-md-12">
   <header class="header bg-white b-b clearfix">
     <div class="row m-t-sm">
-      <div class="col-md-4">
+      <div class="col-md-6">
-        <h4 style="color: darkred">Search Results</h4>
+        <% if opts[:is_subject_breadcrums].present? && subjects.present? %>
-        <small style="color: darkred">
+          <ol class="breadcrumb">
-          <%= page_entries_info @data, entry_name: 'records' if @data.present? %>
+            <% subjects.each do |subject| %>
-        </small>
+              <% subject.ancestors.each do |ancestor| %>
+                <li class="breadcrumb-item d-inline-flex"> 
+                  <h4> <%= link_to ancestor.name, subject_index_path(ancestor), class: "text-decoration-none" %> </h4> 
+                </li>
+              <% end %>
+
+              <li class="breadcrumb-item d-inline-flex active"> 
+                <h4> <%= subject.name %> </h4> 
+              </li> 
+            <% end %>
+          </ol>
+        <% else %>
+          <h4 style="color: darkred">Search Results</h4>
+          <small style="color: darkred">
+            <%= page_entries_info data, entry_name: 'records' if data.present? %>
+          </small>
+        <% end %>
       </div>
-      <div class="col-md-8">
+      <div class="col-md-6 position-relative">
         <div class="text-center pagination justify-content-end">
-          <%= (paginate @data) if @data.present? %>
+          <%= (paginate data) if data.present? %>
         </div>
       </div>
     </div>

app/components/subject_accordion_component/subject_accordion_component.html.erb

@@ -5,11 +5,11 @@
         <% if sub1.children.present? %>
           <div class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#<%= ["secondLevel", sub1.id].join %>"> 
             <%= link_to sub1.name, subject_index_path(sub1.id), class: "accordion-link text-decoration-none text-dark d-block sub2 clickable-link" %>
-            <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub1.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
+            <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub1.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
           </div>
         <% else %>
           <%= link_to sub1.name, subject_index_path(sub1.id), class: "accordion-link text-decoration-none text-dark d-block sub2 clickable-link" %>
-          <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub1.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
+          <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub1.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
         <% end %>
       </div>
 
@@ -22,11 +22,11 @@
                   <% if sub1.children.present? %>
                     <div class="accordion-button collapsed" data-bs-toggle="collapse" data-bs-target="#<%= ["thirdLevel", sub2.id].join %>"> 
                       <%= link_to sub2.name, subject_index_path(sub2.id), class: "accordion-link text-decoration-none text-dark d-block sub3 clickable-link" %>
-                      <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub2.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
+                      <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub2.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
                     </div>
                   <% else %>
                     <%= link_to sub2.name, subject_index_path(sub2.id), class: "accordion-link text-decoration-none text-dark d-block sub3 clickable-link" %>
-                    <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub2.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
+                    <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub2.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
                   <% end %>
                 </div>
 
@@ -39,11 +39,11 @@
                             <% if sub3.children.present? %>
                               <div class="<%= sub3.children.present? ? 'accordion-button' : '' %> collapsed" data-bs-toggle="collapse" data-bs-target="#<%= ["fourthLevel", sub3.id].join %>"> 
                                 <%= link_to sub3.name, subject_index_path(sub3.id), class: "accordion-link text-decoration-none text-dark d-block sub4 clickable-link" %>
-                                <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub3.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
+                                <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub3.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
                               </div>
                             <% else %>
                               <%= link_to sub3.name, subject_index_path(sub3.id), class: "accordion-link text-decoration-none text-dark d-block sub4 clickable-link" %>
-                              <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub3.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
+                              <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub3.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
                             <% end %>
                           </div>
 
@@ -54,7 +54,7 @@
                                   <div class="accordion-item d-flex justify-content-between">
                                     <div> 
                                       <%= link_to sub4.name, subject_index_path(sub4.id), class: "accordion-link text-decoration-none text-dark d-block sub5 clickable-link" %>
-                                      <%= link_to "Add Sub Subject", new_subject_index_path(parent_id: sub4.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
+                                      <%= link_to "Add Sub Level", new_subject_index_path(parent_id: sub4.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
                                     </div>
                                   </div>
                                 </div>

app/controllers/doctrine/annotations_controller.rb

@@ -47,9 +47,8 @@ class Doctrine::AnnotationsController < ApplicationController
           @annotation.remove_document(annotation_document.document)
         end
 
-        @documents.each do |document|
+        @documents.each { |document| @annotation.add_document(document) } if @documents.present?
-          @annotation.add_document(document)
+
-        end
         format.html { redirect_to document_doctrine_path(@doctrine.document, @doctrine), 
                       notice: "Doctrine Annotation was successfully updated." }
       else

app/javascript/controllers/application_controller.js

@@ -5,8 +5,8 @@ import $ from 'jquery';
 require("select2/dist/css/select2")
 require("select2-bootstrap-theme/dist/select2-bootstrap")
 
-require("selectize/dist/js/selectize.min")
+require("selectize.js/dist/js/selectize.min")
-require("selectize/dist/css/selectize")
+require("selectize.js/dist/css/selectize")
 
 import Select2 from "select2"
 import Selectize from "selectize";

app/javascript/controllers/document_controller.js

@@ -36,15 +36,17 @@ export default class extends ApplicationController {
   }
 
   loadFormDocumentDetais () {
-    var document_id = "", document_title = "", document_ref_no = "", document_date_or_year = "", $modal = $("#newAnnotationModal")
+    var document_id = "", document_title = "", document_ref_no = "", document_date_or_year = "", document_phil_rep = "", $modal = $("#newAnnotationModal")
 
     document_id = this.element.dataset["documentId"]
     document_title = this.element.dataset["documentTitle"]
     document_ref_no = this.element.dataset["documentReferenceNumber"]
     document_date_or_year = this.element.dataset["documentDateOrYear"]
+    document_phil_rep = this.element.dataset["documentPhilRep"]
 
     $modal.find("#document_title").val([document_title, document_ref_no, document_date_or_year].join(", "))
     $modal.find("#document_id").val(document_id)
+    $modal.find("#phil_rep").val(document_phil_rep)
   }
 
   addCitingDocument () {
@@ -52,6 +54,8 @@ export default class extends ApplicationController {
 
     document_id = this.element.dataset["documentId"]
     document_ref_no = this.element.dataset["documentReferenceNumber"]
+    document_date = this.element.dataset["documentDate"]
+    document_title = this.element.dataset["documentTitle"]
 
     var document_ids = []
 
@@ -68,6 +72,6 @@ export default class extends ApplicationController {
 
     var doc_title = $doc_title.val()
 
-    $doc_title.val(doc_title + " citing " + document_ref_no)
+    $doc_title.val(doc_title + " citing " + [document_title, document_ref_no, document_date].join(", "))
   }
 }

app/javascript/controllers/selectize_controller.js

@@ -3,6 +3,7 @@ import ApplicationController from './application_controller'
 export default class extends ApplicationController {
   connect() {
     super.connect()
+    var $this = this
 
     var default_opts = {
       plugins: ['restore_on_backspace', 'remove_button'],
@@ -26,12 +27,40 @@ export default class extends ApplicationController {
           $doctrine_content.val("")
           $trix_content.val("")
         } else {
-          $doctrine_content.val(value)
+          $doctrine_content.val(value.text())
           $trix_content.val(value)
         }
       }
     };
 
+    var subject_ids_opts = {
+      onChange: function (value) {
+        console.log(value)
+        var selectize_options = []
+        var $selectize = $("#doctrineModal").find("#doctine_content_suggestions").selectize($.extend({ options: selectize_options }, doctrine_content_suggestions_opts))
+
+        if (value.length === 0) {
+          console.log("Here!!!")
+          $selectize[0].selectize.clearOptions();
+        } else {
+          $.get("/api/doctrines.json", { subject_ids: value }, function(data, status) {
+            if (status === "success") {
+              $.each(data, function (i, doctrine) {
+                selectize_options.push({ id: doctrine.id, value: doctrine.content, text: doctrine.plain_content })
+              })
+  
+              $selectize[0].selectize.addOption(selectize_options)
+            }
+          });
+        }
+
+        $selectize[0].selectize.refreshOptions()
+
+        console.log(selectize_options)
+      }
+    };
+
+    $(".subject-ids-selectize").selectize($.extend(subject_ids_opts, default_opts))
     $("#doctine_content_suggestions").selectize($.extend(doctrine_content_suggestions_opts, default_opts))
   }
 }

app/views/doctrines/search.html.erb

@@ -1,5 +1,5 @@
 <div class="card container-sm mt-1 p-0"> 
-  <div class="container m-2"> <%= render PaginationComponent.new(data: @doctrines) %> </div>
+  <div class="container m-2"> <%= render PaginationComponent.new(data: @doctrines, opts: { is_subject_breadcrums: true, subject_ids: params[:subject_ids] }) %> </div>
 
   <% if params[:is_index_table].to_s.eql?("true") %>
     <div class="card-body col-sm-12 tableFixHead p-0 mt-1">

app/views/document/doctrines/_document_search_results_table.html.erb

@@ -10,8 +10,9 @@
         <% title = search_result["short_title"].present? ? search_result["short_title"] : search_result["title"] %>
         <a class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#newAnnotationModal" data-controller="document" data-document-title="<%= title %>"
            data-document-id="<%= search_result["id"] %>" data-document-reference-number="<%= search_result["reference_number"] %>" 
-           data-document-date-or-year="<%= date_or_year %>" data-action="click->document#loadFormDocumentDetais"> 
+           data-document-date-or-year="<%= date_or_year %>" data-document-phil-rep="<%= search_result["phil_rep"] %>" 
-              Add Annotations 
+           data-action="click->document#loadFormDocumentDetais"> 
+              Add Annotations
         </a>
       </td>
     <% end %>
@@ -19,7 +20,9 @@
     <% if opts[:is_citing_document].present? %>
       <td> 
         <a class="btn btn-sm btn-primary" data-action="click->document#addCitingDocument" data-controller="document" data-document-id="<%= search_result["id"] %>" 
-           data-document-reference-number="<%= search_result["reference_number"] %>"> 
+           data-document-reference-number="<%= search_result["reference_number"] %>" 
+           data-document-date="<%= search_result["docdate"].present? ? search_result["docdate"].to_date.strftime("%B %d, %Y") : search_result["year"] %>"
+           data-document-title="<%= search_result["short_title"] || search_result["title"] %>"> 
               Add
         </a> 
       </td>

app/views/documents/index.html.erb

@@ -22,13 +22,7 @@
                   <div class="modal-body">
                     <div class="row">
                       <div class="col-sm-6 p-2">
-                        <strong> <%= label_tag "Phil Rep" %> </strong>
+                        <%= text_field_tag :citation_finder, params[:citation_finder], class: "form-control" %>
-                        <%= text_field_tag :phil_rep, params[:phil_rep], class: "form-control" %>
-                      </div>
-
-                      <div class="col-sm-6 p-2">
-                        <strong> <%= label_tag "SCRA" %> </strong>
-                        <%= text_field_tag :scra, params[:scra], class: "form-control" %>
                       </div>
                     </div>
 

app/views/shared/_doctrine_content_suggestions.html.erb

@@ -0,0 +1,3 @@
+<% results.each do |result| %>
+  <div class="option" data-selectable="" data-value="<%= result.content %>"> <%= result.plain_content %> </div>
+<% end %>

app/views/subject_indexes/index.html.erb

@@ -11,11 +11,11 @@
 								<% if root.children.present? %>
 									<div class="accordion-button collapsed m-0 p-0" data-bs-toggle="collapse" data-bs-target="#<%= ["rootLevel", root.id].join %>"> 
 										<%= link_to root.name, subject_index_path(root.id), class: "accordion-link text-decoration-none text-dark d-block sub1 clickable-link" %>
-										<%= link_to "Add Sub Subject", new_subject_index_path(parent_id: root.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
+										<%= link_to "Add Sub Level", new_subject_index_path(parent_id: root.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 me-5" %>
 									</div>
 								<% else %>
 									<%= link_to root.name, subject_index_path(root.id), class: "accordion-link text-decoration-none text-dark d-block sub1 clickable-link" %>
-									<%= link_to "Add Sub Subject", new_subject_index_path(parent_id: root.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
+									<%= link_to "Add Sub Level", new_subject_index_path(parent_id: root.id), class: "btn btn-sm btn-primary text-decoration-none d-block sub1 clickable-link position-absolute end-0 accordion-action-button-margin" %>
 								<% end %>
 							</div>
 

app/views/subject_indexes/show.html.erb

@@ -1,30 +1,39 @@
 <div class="card">
   <div class="card-header"> 
     <div class="row">
-      <div class="col-sm-10"> <h4> Subject Details </h4>  </div>
+      <div class="col-sm-10">
+        <% if @subject_index.is_root? %>
+          <ol class="breadcrumb"> 
+            <li class="breadcrumb-item d-inline-flex active"> 
+              <h4> <%= @subject_index.name %> </h4> 
+            </li> 
+          </ol>
+        <% else %>
+          <ol class="breadcrumb">
+            <% @subject_index.ancestors.each do |ancestor| %>
+              <li class="breadcrumb-item d-inline-flex"> 
+                <h4> <%= link_to ancestor.name, search_doctrines_path(subject_ids: [ancestor.id]) %> </h4> 
+              </li>
+            <% end %>
 
-      <div class="col-sm-2 d-flex justify-content-end">
+            <li class="breadcrumb-item d-inline-flex active"> 
+              <h4> <%= @subject_index.name %> </h4> 
+            </li> 
+          </ol>
+        <% end %>
+      </div>
+
+      <div class="col-sm-2 position-relative">
         <a class="btn btn-sm btn-secondary m-1" href="<%= edit_subject_index_path(@subject_index) %>"> Edit </a>
         <a class="btn btn-sm btn-danger m-1" href="<%= subject_index_path(@subject_index) %>" data-confirm="Are you sure to delete this record?" data-method="DELETE"> Delete </a>
       </div>
     </div>
   </div>
   <div class="card-body">
-    <table class="table table-borderless">
-      <tbody>
-        <tr>
-          <td class="text-start"> Name: </td>
-          <td class="text-start"> <strong> <%= @subject_index.name %> </strong> </td>
-          <td class="text-start"> Parent Subject: </td>
-          <td class="text-start"> <strong> <%= @subject_index.is_root? ? "N/A" : @subject_index.parent.lineage_name %> </strong> </td>
-        </tr>
-      </tbody>
-    </table>
-
     <div class="card">
       <div class="card-header">
         <div class="row">
-          <div class="col-sm-11"> <h4> Sub Subjects </h4> </div>
+          <div class="col-sm-11"> <h4> Sub Levels </h4> </div>
           <div class="col-sm-1 justify-content-end"> <a class="btn btn-sm btn-primary p-1" href="<%= new_subject_index_path(parent_id: @subject_index) %>"> Add </a> </div>
         </div>
       </div>