From be8da730a22c44cbb0f20fa0727500002ea792d1 Mon Sep 17 00:00:00 2001
From: alexdbondoc17 <alexdbondoc17@gmail.com>
Date: Mon, 31 Jan 2022 07:30:36 +0000
Subject: [PATCH] Main UI enhancement

---
 .../analysis_form_component.html.erb          |  4 ++--
 ...tation_marks_modal_form_component.html.erb |  2 +-
 .../doctrine_modal_form_component.html.erb    | 23 ++++++++++---------
 .../document_doctrine_show_component.html.erb |  4 ++--
 .../document_index_table_component.html.erb   |  2 +-
 app/javascript/packs/application.js           |  6 ++---
 package.json                                  |  1 +
 yarn.lock                                     |  5 ++++
 8 files changed, 27 insertions(+), 20 deletions(-)

diff --git a/app/components/analysis_form_component/analysis_form_component.html.erb b/app/components/analysis_form_component/analysis_form_component.html.erb
index d784ef1..afbcb32 100644
--- a/app/components/analysis_form_component/analysis_form_component.html.erb
+++ b/app/components/analysis_form_component/analysis_form_component.html.erb
@@ -11,13 +11,13 @@
 
           <div class="row">
             <div class="col-sm-11 p-2">
-              <%= doctrine_form.text_area :content, class: "i-ckeditor form-control", placeholder: "Doctrine" %>
+            <trix-editor id="content" placeholder="Doctrine Content"> </trix-editor>
             </div>
           </div>
 
           <div class="row">
             <div class="col-sm-11 p-2">
-              <button type="button" class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#caseListsCollapse" aria-expanded="false" aria-controls="collapseExample"> Case Lists </button
+              <button type="button" class="btn btn-primary" data-bs-toggle="collapse" data-bs-target="#caseListsCollapse" aria-expanded="false" aria-controls="collapseExample"> Case Lists </button>
             </div>
           </div>
 
diff --git a/app/components/annotation_marks_modal_form_component/annotation_marks_modal_form_component.html.erb b/app/components/annotation_marks_modal_form_component/annotation_marks_modal_form_component.html.erb
index f5e8c7a..32f9337 100644
--- a/app/components/annotation_marks_modal_form_component/annotation_marks_modal_form_component.html.erb
+++ b/app/components/annotation_marks_modal_form_component/annotation_marks_modal_form_component.html.erb
@@ -31,7 +31,7 @@
         <div class="row">
           <div class="col-sm-12 p-2">
             <%= label_tag :editor_notes %>
-            <%= text_area_tag :editor_notes, annotation.editor_notes, class: "form-control i-ckeditor" %>
+            <trix-editor id="editor_notes" placeholder="Editor Notes"> <%= editor_notes %> </trix-editor>
           </div>
         </div>
       </div>
diff --git a/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb b/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
index 3280e47..7dd7477 100644
--- a/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
+++ b/app/components/doctrine_modal_form_component/doctrine_modal_form_component.html.erb
@@ -1,11 +1,12 @@
 <div class="modal fade" id="doctrineModal" tabindex="-1" aria-labelledby="doctrineModal" aria-hidden="true">
-  <div class="modal-dialog modal-lg modal-dialog-scrollable">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h5 class="modal-title"> <%= opts[:form_method].eql?(:post) ? "New Doctrine" : "Update Doctrine" %> </h5>
-        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-      </div>
-      <%= form_tag(opts[:form_url], method: opts[:form_method]) do %>
+  <%= form_tag(opts[:form_url], method: opts[:form_method]) do %>
+    <div class="modal-dialog modal-lg modal-dialog-scrollable">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title"> <%= opts[:form_method].eql?(:post) ? "New Doctrine" : "Update Doctrine" %> </h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+
         <div class="modal-body">
           <div class="row">
             <div class="col-sm-12 p-2">
@@ -17,7 +18,7 @@
           <div class="row">
             <div class="col-sm-12 p-2">
               <strong> <%= label_tag :content %> </strong>
-              <%= text_area_tag :content, doctrine.content, class: "i-ckeditor form-control", placeholder: "Doctrine" %>
+              <trix-editor id="content" placeholder="Doctrine Content"> <%= doctrine.content %> </trix-editor>
             </div>
           </div>
         </div>
@@ -26,7 +27,7 @@
           <button type="submit" class="btn btn-primary">Save</button>
           <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
         </div>
-      <% end %>
+      </div>
     </div>
-  </div>
-</div>
\ No newline at end of file
+  <% end %>
+</div>
diff --git a/app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb b/app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb
index 13bf732..22933d2 100644
--- a/app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb
+++ b/app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb
@@ -22,7 +22,7 @@
       <div class="row">
         <div class="col-sm-12 p-2">
           <strong> <%= label_tag :content %> </strong>
-          <%= text_area_tag :content, content, class: "i-ckeditor form-control", placeholder: "Doctrine" %>
+          <trix-editor id="content" placeholder="Doctrine Content"> <%= content %> </trix-editor>
         </div>
       </div>
     <% end %>
@@ -87,4 +87,4 @@
       </div>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/app/components/document_index_table_component/document_index_table_component.html.erb b/app/components/document_index_table_component/document_index_table_component.html.erb
index 6fc926e..d759463 100644
--- a/app/components/document_index_table_component/document_index_table_component.html.erb
+++ b/app/components/document_index_table_component/document_index_table_component.html.erb
@@ -42,7 +42,7 @@
                 <div class="row">
                   <div class="col-sm-12 p-2">
                     <%= label_tag :editor_notes %>
-                    <%= text_area_tag :editor_notes, params[:editors_note], class: "form-control i-ckeditor" %>
+                    <trix-editor id="editor_notes" placeholder="Doctrine Content"> <%= params[:editor_notes] %> </trix-editor>
                   </div>
                 </div>
               </div>
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index 1e11c0c..72edfd3 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -16,7 +16,9 @@ import "@fortawesome/fontawesome-free/js/all.min";
 import "@fortawesome/fontawesome-free/css/all.min";
 import "moment";
 import "select2";
-import "chosen-js"
+import "chosen-js";
+import 'trix/dist/trix.css';
+import 'trix/dist/trix.js';
 
 window.jQuery = $;
 window.$ = $;
@@ -46,6 +48,4 @@ $(document).ready(function () {
       window.open($href);
     }
   })
-
-  $(".i-chosen").chosen({width: "100%"});
 });
diff --git a/package.json b/package.json
index f45578b..a681ebf 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "select2": "^4.1.0-rc.0",
     "stimulus": "^3.0.1",
     "stimulus_reflex": "3.4.1",
+    "trix": "^2.0.0-alpha.0",
     "turbolinks": "^5.2.0",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.12"
diff --git a/yarn.lock b/yarn.lock
index 495005a..d08fdbb 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6592,6 +6592,11 @@ toidentifier@1.0.0:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
   integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
 
+trix@^2.0.0-alpha.0:
+  version "2.0.0-alpha.0"
+  resolved "https://registry.yarnpkg.com/trix/-/trix-2.0.0-alpha.0.tgz#dc47e935710d5c1dbcdebe252aed72b9341de247"
+  integrity sha512-JE2iiWE4rimzRv6Um87flkGAv4lsF6tin0XJ7yFFBdnFYjUVwMmLW7Z61kQyNorKU2XmhWMwiEEvqru9EcVjHQ==
+
 ts-pnp@^1.1.6:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"