Merge pull request #1426 from laws-africa/search

search for selection in document v iew

peachjam/context_processors.py

@@ -11,9 +11,13 @@ def general(request):
         "DEBUG": settings.DEBUG,
         "APP_NAME": settings.PEACHJAM["APP_NAME"],
         "SUPPORT_EMAIL": settings.PEACHJAM["SUPPORT_EMAIL"],
-        "SENTRY_CONFIG": {
-            "dsn": settings.PEACHJAM["SENTRY_DSN_KEY"],
-            "environment": settings.PEACHJAM["SENTRY_ENVIRONMENT"],
-        },
         "PEACHJAM_SETTINGS": pj_settings(),
+        # this object will be injected into Javascript to provide configuration settings to the Javascript app
+        "PEACHJAM_JS_CONFIG": {
+            "appName": settings.PEACHJAM["APP_NAME"],
+            "sentry": {
+                "dsn": settings.PEACHJAM["SENTRY_DSN_KEY"],
+                "environment": settings.PEACHJAM["SENTRY_ENVIRONMENT"],
+            },
+        },
     }

peachjam/js/components/DocumentContent/enrichments-manager.ts

@@ -2,12 +2,14 @@ import { RelationshipEnrichments } from '../RelationshipEnrichment';
 import DocDiffsManager from '../DocDiffs';
 import PDFCitationLinks from './citation-links';
 import { GutterEnrichmentManager } from '@lawsafrica/indigo-akn/dist/enrichments';
+import SelectionSearch from './selection-search';
 
 /**
  * Class for handling the setup of all enrichments and interactions between enrichments
  */
 class EnrichmentsManager {
   private relationshipsManager: RelationshipEnrichments;
+  private selectionSearch: SelectionSearch;
   private root: HTMLElement;
   private docDiffsManager: null | DocDiffsManager;
   // eslint-disable-next-line no-undef
@@ -28,6 +30,7 @@ class EnrichmentsManager {
     // GutterEnrichmentManager by default looks for la-akoma-ntoso, and we might not be working with that
     this.gutterManager.akn = this.root.querySelector('.content');
     this.relationshipsManager = new RelationshipEnrichments(contentAndEnrichmentsElement, this.gutterManager);
+    this.selectionSearch = new SelectionSearch(this.gutterManager);
 
     this.gutter?.addEventListener('laItemChanged', (e: any) => {
       if (e.target.classList.contains('relationship-gutter-item') && e.target.active) {

peachjam/js/components/DocumentContent/selection-search.ts

@@ -0,0 +1,34 @@
+import { IRangeTarget } from '@lawsafrica/indigo-akn/dist/ranges';
+import { GutterEnrichmentManager, IGutterEnrichmentProvider } from '@lawsafrica/indigo-akn/dist/enrichments';
+import peachJam from '../../peachjam';
+import i18next from 'i18next';
+
+/**
+ * Adds a popup to search the site based on selected document text.
+ */
+export default class SelectionSearch implements IGutterEnrichmentProvider {
+  protected manager: GutterEnrichmentManager;
+
+  constructor (manager: GutterEnrichmentManager) {
+    this.manager = manager;
+    this.manager.addProvider(this);
+  }
+
+  getButton (target: IRangeTarget): HTMLButtonElement | null {
+    const btn = document.createElement('button');
+    btn.className = 'btn btn-outline-secondary';
+    btn.type = 'button';
+    btn.innerText = i18next.t('Search {{appName}}...', { appName: peachJam.config.appName });
+    return btn;
+  }
+
+  addEnrichment (target: IRangeTarget): void {
+    if (target.selectors) {
+      // get the selected text
+      const quoteSelector = target.selectors.find((x) => x.type === 'TextQuoteSelector');
+      if (quoteSelector && quoteSelector.exact) {
+        document.location = '/search/?q=' + encodeURIComponent(quoteSelector.exact);
+      }
+    }
+  }
+}

peachjam/js/locale/en/translation.json

@@ -24,13 +24,15 @@
   "Delete": "Delete",
   "Document nature": "Document nature",
   "Document type": "Document type",
+  "Edit": "Edit",
   "Enter end date": "Enter end date",
   "Enter start date": "Enter start date",
   "Expand all": "Expand all",
   "Filters": "Filters",
   "Judges": "Judges",
   "Jurisdiction": "Jurisdiction",
   "Language": "Language",
+  "Link citation": "Link citation",
   "Loading": "Loading",
   "Locality": "Locality",
   "Matter type": "Matter type",
@@ -45,6 +47,9 @@
   "Regional body": "Regional body",
   "Relevance": "Relevance",
   "Search": "Search",
+  "Search {{appName}}": {
+    "": "Search {{appName}}..."
+  },
   "Search document content": "Search document content",
   "Search documents": "Search documents",
   "Search table of contents": "Search table of contents",

peachjam/js/locale/fr/translation.json

@@ -24,13 +24,15 @@
   "Delete": "Supprimez",
   "Document nature": "Type de document",
   "Document type": "Type de document",
+  "Edit": "Edit",
   "Enter end date": "Entrez la date de fin",
   "Enter start date": "Entrez la date de début",
   "Expand all": "Développer tout",
   "Filters": "Filtres",
   "Judges": "Juges",
   "Jurisdiction": "Juridiction",
   "Language": "Langue",
+  "Link citation": "Link citation",
   "Loading": "En cours de chargement",
   "Locality": "Localité",
   "Matter type": "Type de matière",
@@ -45,6 +47,9 @@
   "Regional body": "Corps régional",
   "Relevance": "Pertinence",
   "Search": "Recherche",
+  "Search {{appName}}": {
+    "": "Search {{appName}}..."
+  },
   "Search document content": "Rechercher le contenu du document",
   "Search documents": "Rechercher des documents",
   "Search table of contents": "Rechercher la table des matières",

peachjam/js/locale/sw/translation.json

@@ -24,13 +24,15 @@
   "Delete": "Futa",
   "Document nature": "Asili ya hati",
   "Document type": "Aina ya hati",
+  "Edit": "Edit",
   "Enter end date": "Weka tarehe ya mwisho",
   "Enter start date": "Weka tarehe ya kuanza",
   "Expand all": "Panua zote",
   "Filters": "Vichujio",
   "Judges": "Majaji",
   "Jurisdiction": "Mamlaka ya kisheria",
   "Language": "Lugha",
+  "Link citation": "Link citation",
   "Loading": "Inapakia",
   "Locality": "Eneo",
   "Matter type": "Aina ya jambo",
@@ -45,6 +47,9 @@
   "Regional body": "Chombo cha kanda",
   "Relevance": "Muhimu",
   "Search": "Tafuta",
+  "Search {{appName}}": {
+    "": "Search {{appName}}..."
+  },
   "Search document content": "Tafuta yaliyomo kwenye waraka",
   "Search documents": "Tafuta nyaraka",
   "Search table of contents": "Tafuta yaliyomo",

peachjam/js/peachjam.ts

@@ -26,19 +26,45 @@ customElements.define('la-table-of-contents-controller', LaTableOfContentsContro
 customElements.define('la-table-of-contents', LaTableOfContents as any);
 customElements.define('la-toc-item', LaTocItem as any);
 
+export interface PeachJamConfig {
+  appName: string;
+  sentry: {
+    dsn: string | null;
+    environment: string | null;
+  }
+}
+
 class PeachJam {
   private components: any[];
+  public config: PeachJamConfig = {
+    appName: 'Peach Jam',
+    sentry: {
+      dsn: null,
+      environment: null
+    }
+  };
+
   constructor () {
     this.components = [];
   }
 
   setup () {
+    this.setupConfig();
+    // add the current user agent to the root HTML element for use with pocketlaw
+    document.documentElement.setAttribute('data-user-agent', navigator.userAgent.toLowerCase());
     this.setupSentry();
     this.createComponents();
     this.setupTooltips();
     this.scrollNavTabs();
   }
 
+  setupConfig () {
+    const data = document.getElementById('peachjam-config')?.innerText;
+    if (data) {
+      this.config = JSON.parse(data);
+    }
+  }
+
   createComponents () {
     document.querySelectorAll('[data-component]').forEach((el) => {
       const name: string | null = el.getAttribute('data-component');
@@ -68,14 +94,12 @@ class PeachJam {
   }
 
   setupSentry () {
-    const el = document.getElementById('sentry-config');
-    const config = el ? JSON.parse(el.innerHTML) : null;
     // @ts-ignore
-    if (config && window.Sentry) {
+    if (this.config.sentry && window.Sentry) {
       // @ts-ignore
       window.Sentry.init({
-        dsn: config.dsn,
-        environment: config.environment,
+        dsn: this.config.sentry.dsn,
+        environment: this.config.sentry.environment,
         allowUrls: [
           new RegExp(window.location.host.replace('.', '\\.') + '/static/')
         ],

peachjam/templates/peachjam/layouts/main.html

@@ -7,15 +7,9 @@
         type="text/css"/>
 {% endblock %}
 {% block head-js %}
-  <!-- Small script to add the current user agent to the root HTML element -->
-  <script type="text/javascript">
-    document.addEventListener("DOMContentLoaded", function () {
-      document.documentElement.setAttribute('data-user-agent', navigator.userAgent.toLowerCase());
-    });
-  </script>
+  {{ PEACHJAM_JS_CONFIG|json_script:"peachjam-config" }}
   {% if not DEBUG %}
     <!-- sentry -->
-    {{ SENTRY_CONFIG|json_script:"sentry-config" }}
     <script src="https://browser.sentry-cdn.com/7.51.2/bundle.min.js"
             integrity="sha384-TIc4wz4oU9UgbI5Cu7R/6jhJOszkPGImz+Ney9MXZ3MESAGeYJUOV+36KnTacIXP"
             crossorigin="anonymous"