@spokane-folio/security-incident 1.0.28

package/src/components/incidents/helpers/hasTopLevelFormChanged.js

@@ -0,0 +1,111 @@
+
+import { isSameHtml } from './isSameHtml.js';
+import deepNormalizeForComparison from './deepNormalizeForComparison.js';
+
+// implemented to assert meaningful change for allowing save&close on EditPane
+const hasTopLevelFormChanged = (
+  current, 
+  initial, 
+  selectedCustomers = [], 
+  selectedWitnesses = [],
+  unsavedMediaArray = [],
+  customersToUpdateDeclaration = []
+) => {
+  const simpleKeys = [
+    'customerNa',
+    'incidentLocation',
+    'subLocation',
+    'dateTimeOfIncident',
+    'timeOfIncident',
+    'isApproximateTime'
+  ];
+
+  // return true if any changes to simple keys
+  for (const key of simpleKeys) {
+    if (current[key] !== initial[key]) {
+      return true;
+    }
+  };
+
+  // return true if any changes to top-level detailedDescriptionOfIncident
+  if (!isSameHtml(current.detailedDescriptionOfIncident, initial.detailedDescriptionOfIncident)) {
+    return true;
+  };
+
+  // return true if any new customers selected for saving
+  if (selectedCustomers.length > 0) {
+    return true;
+  };
+
+  // return true if any new witnesses selected for saving
+  if (selectedWitnesses.length > 0) {
+    return true;
+  };
+
+  // return true if any media is added for saving
+  if ((unsavedMediaArray || []).length > 0) {
+    return true;
+  };
+
+  if ((customersToUpdateDeclaration || []).length > 0) {
+    return true;
+  };
+
+  const getSortedIds = arr => (arr || []).map(i => i.id).sort();
+
+  // return true if relevant item is removed in UI
+  if (
+    JSON.stringify(getSortedIds(current.customers)) !== JSON.stringify(getSortedIds(initial.customers)) ||
+    JSON.stringify(getSortedIds(current.incidentTypes)) !== JSON.stringify(getSortedIds(initial.incidentTypes)) ||
+    JSON.stringify(getSortedIds(current.incidentWitnesses)) !== JSON.stringify(getSortedIds(initial.incidentWitnesses)) ||
+    JSON.stringify(getSortedIds(current.attachments)) !== JSON.stringify(getSortedIds(initial.attachments))
+  ) {
+    return true;
+  };
+
+  // handle if an attachment has been marked for removal 
+  const hasToBeRemovedMedia = (current.attachments || []).some(att => att.toBeRemoved);
+  if (hasToBeRemovedMedia) return true; 
+
+  const normalizedWitness = (wit) => {
+    const {
+      id,
+      isCustom,
+      firstName = '',
+      lastName = '',
+      role = '',
+      phone = '',
+      email = '',
+    } = wit;
+
+    return deepNormalizeForComparison({
+      id, 
+      isCustom,
+      firstName: firstName.trim(),
+      lastName: lastName.trim(),
+      ...(role.trim() && { role: role.trim() }),
+      ...(phone.trim() && { phone: phone.trim() }),
+      ...(email.trim() && { email: email.trim() }),
+    });
+  };
+
+  const initialCustomWitnesses = (initial.incidentWitnesses || []).filter(w => w.isCustom);
+  const currentCustomWitnesses = (current.incidentWitnesses || []).filter(w => w.isCustom);
+
+  // check for any modified custom witness
+  for (const initWit of initialCustomWitnesses) {
+    const currWit = currentCustomWitnesses.find(w => w.id === initWit.id);
+    if (!currWit) return true; 
+
+    const normInit = normalizedWitness(initWit);
+    const normCurr = normalizedWitness(currWit);
+
+    if (JSON.stringify(normInit) !== JSON.stringify(normCurr)) {
+      return true;
+    };
+  };
+
+  return false; // no changes
+};
+
+export default hasTopLevelFormChanged;

package/src/components/incidents/helpers/identifyCurrentTrespassDocs.js

@@ -0,0 +1,109 @@
+
+/*
+  Helper function to determine most recent trespass document for each customer.
+  Each document.id contains a customer name and date, and version as relevant (when report is updated)
+  (e.g. 
+    Initial -> 
+      "id": "smith-danielle-louise-trespass-03-26-2025"
+    Incremented on updated report ->   
+      "id": "smith-danielle-louise-trespass-03-26-2025-1"
+  ). 
+
+  Documents are grouped by customer based on the prefix before 'trespass-'. Within each customer group, the most recent document is identified based on date and increment. 
+
+  - @param {Array} docs - array containing trespass document objects
+  - @param {string} startStr - string for where to start for indexOf ('trespass-')
+  - @returns {Array} array of most current document.id for each customer
+*/
+
+// extract date and increment (version) from document.id 
+const parseDateAndIncrement = (id, startStr) => {
+  // get the part of 'id' that comes after 'trespass-'
+  const raw = id.slice(id.indexOf(startStr) + startStr.length); // e.g. '03-26-2025' or '03-26-2025-1'
+  const parts = raw.split('-'); // e.g. ['03', '26', '2025', '1']
+
+  // construct standard date string for Date comparison
+  const [month, day, year] = parts;
+  const date = `${month}/${day}/${year}`;
+
+  // if there is a fourth part, it is the increment (e.g. '1'), else it is the base document
+  let increment = 0;
+  if (parts.length > 3) {
+    const maybeInc = parseInt(parts[3], 10);
+    increment = isNaN(maybeInc) ? 0 : maybeInc;
+  };
+  return { date, increment };
+};
+
+// compare two documents to deterimine which is most recent
+const compareDocDates = (doc1, doc2, startStr) => {
+  // parse out date and increment values for both docs
+  const { date: date1, increment: inc1 } = parseDateAndIncrement(doc1.id, startStr);
+  const { date: date2, increment: inc2 } = parseDateAndIncrement(doc2.id, startStr);
+
+  const d1 = new Date(date1);
+  const d2 = new Date(date2);
+
+  // compare dates first
+  if (d1 > d2) return 1;
+  if (d1 < d2) return -1;
+
+  // if the dates are equal, use incrment to find which is most recent
+  if (inc1 > inc2) return 1;
+  if (inc1 < inc2) return -1;
+  return 0; // both are equal
+};
+
+
+// extract unique customer key form document.id, from segment before 'trespass-'
+const extractCustomerKey = (id, startStr) => {
+  const index = id.indexOf(startStr);
+  // slice everything up to the hyphen before 'trespass-'
+  return index !== -1 ? id.slice(0, index - 1) : null;
+};
+
+// reduce into object, grouped by key of customer name from document.id (e.g. key of 'halls-kerry-amanda' referencing arr of respective docuemtn objs)
+const groupDocsByCustomer = (docs, startStr) => {
+  return docs.reduce((groups, doc) => {
+    const customerKey = extractCustomerKey(doc.id, startStr);
+    if (!customerKey) return groups; // skip if no key
+
+    // if the customer hasn't been seen before, init their group
+    if (!groups[customerKey]) {
+      groups[customerKey] = [];
+    }
+    // add document obj to customer's group
+    groups[customerKey].push(doc);
+    // console.log("groups", JSON.stringify(groups, null, 2));
+    return groups;
+  }, {});
+};
+
+
+// return array of document ids that are the most recent trespass for each customer
+const identifyCurrentTrespassDocs = (docs, startStr) => {
+  // group documents by customer
+  const grouped = groupDocsByCustomer(docs, startStr);
+  const mostCurrentIds = [];
+
+  // for each group (each customer)
+  for (const customerKey in grouped) {
+    const customerDocs = grouped[customerKey];
+    // assume first document is most current initally
+    let mostCurrent = customerDocs[0];
+    
+    // compare each document to the current 'most recent' and replace if newer
+    for (let i = 1; i < customerDocs.length; i++) {
+      if (compareDocDates(customerDocs[i], mostCurrent, startStr) > 0) {
+        mostCurrent = customerDocs[i];
+      }
+    }
+    // save id of the most current doc for this customer
+    mostCurrentIds.push(mostCurrent.id);
+  };
+  // console.log("mostCurrentIds", JSON.stringify(mostCurrentIds, null, 2));
+  return mostCurrentIds;
+};
+
+// console.log(identifyCurrentTrespassDocs(attachments, "trespass-"));
+export default identifyCurrentTrespassDocs;

package/src/components/incidents/helpers/isSameHtml.js

@@ -0,0 +1,13 @@
+/*
+  compare to update only if content actually changed.
+  assists in preventing react-quill's cleanup <-> setState feedback loop
+*/
+
+export const isSameHtml = (a, b) => {
+  const normalize = (html) => {
+    const doc = new DOMParser().parseFromString(html || '', 'text/html');
+    return doc.body.textContent.trim();
+  };
+
+  return normalize(a) === normalize(b);
+};

package/src/components/incidents/helpers/isValidDateFormat.js

@@ -0,0 +1,14 @@
+  
+/* 
+  @param {string} dateString - validate for strict format of mm/dd/yyyy in DatePicker component
+  @returns: zero-padded single digits for months, days, four digit year
+  - not allowed: non-existent date number (ex: 02/33/2024), alphabet chars, extra spaces, or non-slash delimiters
+  - convert to ISO format is handled at relevant submit function
+*/  
+const isValidDateFormat = (dateString) => {
+  if(!dateString) return null; 
+  const regex = /^(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])\/(19|20)\d\d$/;
+  return regex.test(dateString)
+};
+
+export default isValidDateFormat; 

package/src/components/incidents/helpers/isValidTimeInput.js

@@ -0,0 +1,11 @@
+
+
+
+const isValidTimeInput = (timeString) => {
+  if(!timeString) return null;
+  // space character required between final number char and first alphabet char
+  const timePattern = /^(0?[1-9]|1[0-2]):[0-5][0-9]\s(AM|PM)$/i; 
+  return timePattern.test(timeString);
+}
+
+export default isValidTimeInput;

package/src/components/incidents/helpers/isValidUTCTimeFormat.js

@@ -0,0 +1,14 @@
+
+
+
+
+const isValidUTCTimeFormat = (timeString) => {
+  console.log("@isValidUTCTimeFormat - timeString:", timeString);
+  if (!timeString) return false;
+
+  // regex for "hh:mm:ss.sssZ" UTC ISO format
+  const timePattern = /^([01]\d|2[0-3]):([0-5]\d):([0-5]\d)\.\d{3}Z$/;
+  return timePattern.test(timeString);
+};
+
+export default isValidUTCTimeFormat;

package/src/components/incidents/helpers/parseMMDDYYYY.js

@@ -0,0 +1,7 @@
+
+const parseMMDDYYYY = (dateString) => {
+  const [month, day, year] = dateString.split('/').map((val) => parseInt(val, 10));
+  return new Date(year, month - 1, day); 
+};
+
+export default parseMMDDYYYY;

package/src/components/incidents/helpers/parseQueryString.js

@@ -0,0 +1,16 @@
+
+/* 
+  @param {string} queryString - parse query string from current URL
+  @returns: obj w/ key/values of query string
+*/  
+const parseQueryString = (queryString) => {
+  const query = {};
+  const pairs = (queryString[0] === '?' ? queryString.substr(1) : queryString).split('&');
+  for (const pair of pairs) {
+    const [key, value] = pair.split('=');
+    query[decodeURIComponent(key)] = decodeURIComponent(value || '');
+  }
+  return query;
+};
+
+export default parseQueryString

package/src/components/incidents/helpers/sortTrespassDocuments.js

@@ -0,0 +1,44 @@
+
+// sort trespass documents for display in UI
+
+/**
+ * parses a trespass document ID and extracts the date and increment.
+ * @param {string} id - document id in the format "name-trespass-MM-DD-YYYY-increment"
+ * @returns {{ date: Date, increment: number }}
+ */
+const parseDocId = (id) => {
+  const raw = id.slice(id.indexOf('trespass-') + 'trespass-'.length);
+  const parts = raw.split('-');
+  const [month, day, year] = parts;
+  const date = new Date(`${month}/${day}/${year}`);
+  const increment = parts.length > 3 ? parseInt(parts[3], 10) || 0 : 0;
+  return { date, increment };
+};
+
+/**
+ * sorts trespass documents so that the most recent ones (based on date & increment) are first.
+ * documents identified as 'most current' are prioritized at the top.
+ *
+ * @param {Array} documents - Array of document objects with `id` field
+ * @param {Array} mostCurrentDocIds - Array of IDs that represent the most current trespass documents
+ * @returns {Array} - Sorted document array
+ */
+export default function sortTrespassDocuments(documents, mostCurrentDocIds = []) {
+  return [...documents].sort((a, b) => {
+    const aIsCurrent = mostCurrentDocIds.includes(a.id);
+    const bIsCurrent = mostCurrentDocIds.includes(b.id);
+
+    // prioritize current documents
+    if (aIsCurrent && !bIsCurrent) return -1;
+    if (!aIsCurrent && bIsCurrent) return 1;
+
+    // then sort by date and increment
+    const { date: dateA, increment: incA } = parseDocId(a.id);
+    const { date: dateB, increment: incB } = parseDocId(b.id);
+
+    if (dateA > dateB) return -1;
+    if (dateA < dateB) return 1;
+
+    return incB - incA;
+  });
+}

package/src/components/incidents/helpers/stripHTML.js

@@ -0,0 +1,11 @@
+
+
+// helper for isFormValid, strip to validate for non-empty
+const stripHTML = (html) => {
+  const editorDocument = new DOMParser().parseFromString(html, 'text/html');
+  const textContent = editorDocument.body.textContent || '';
+  // ensure empty tags or whitespace return an empty string
+  return textContent.trim() === '' ? '' : textContent.trim();
+};
+
+export default stripHTML;

package/src/components/incidents/helpers/trespassDocUtils.js

@@ -0,0 +1,197 @@
+import Handlebars from 'handlebars';
+import { FormattedMessage } from 'react-intl';
+import { registerHandlebarsHelpers } from './handlebarsHelpers.js';
+import stripHTML from './stripHTML.js';
+import convertUTCISOToPrettyDate from './convertUTCISOToPrettyDate.js';
+import getTodayDate from './getTodayDate.js';
+import makeId from '../../../settings/helpers/makeId.js';
+import html2pdf from 'html2pdf.js';
+
+export function createTrespassDocument(
+  template, 
+  customer, 
+  incidentData, 
+  helperDeps
+) {
+  try {
+    registerHandlebarsHelpers(helperDeps);
+
+    const readyCustomer = {
+      ...customer,
+      description: stripHTML(customer.description),
+      fullName: `${customer.lastName}, ${customer.firstName}`,
+      trespass: {
+        ...customer.trespass,
+        descriptionOfOccurrence: customer.trespass.descriptionOfOccurrence, // sani at related token helper
+        witnessedBy: customer.trespass.witnessedBy.map(wit => ({
+          ...wit,
+          fullName: `${wit.lastName}, ${wit.firstName}`
+        })),
+        dateOfOccurrence: convertUTCISOToPrettyDate(customer.trespass.dateOfOccurrence),
+        endDateOfTrespass: convertUTCISOToPrettyDate(customer.trespass.endDateOfTrespass)
+      }
+    };
+
+    // console.log("readyCustomer --> ",JSON.stringify(readyCustomer, null, 2))
+    const compiled = Handlebars.compile(template);
+
+    return compiled({
+      customer: readyCustomer,
+      incident: incidentData
+    });
+  } catch (error) {
+    helperDeps.triggerDocumentError?.(
+      <FormattedMessage id="generate-trespass.error-doc-createTrespassDocument" values={{ error: error.message }} />
+    );
+    return '';
+  }
+};
+
+// Used at CreatePane
+export function generateTrespassDocuments(
+  customers, 
+  incidentData, 
+  template, 
+  helperDeps
+) {
+  try {
+    return customers
+      .filter(cust => cust.trespass?.declarationOfService) 
+      .map(cust => {
+        const html = createTrespassDocument(template, cust, incidentData, helperDeps);
+        if (!html || html.trim() === '') return null;
+        return {
+          content: html,
+          customerName: `${cust.lastName || 'Unknown'}, ${cust.firstName}`
+        };
+      })
+      .filter(Boolean); // remove any null docs
+  } catch (error) {
+    helperDeps.triggerDocumentError?.(
+      <FormattedMessage id="generate-trespass.error-doc-generateTrespassDocuments" values={{ error: error.message }} />
+    );
+    return [];
+  }
+};
+
+
+// used at EditPane
+export function generateTrespassDocumentsAtEdit(
+  customers,
+  customersToUpdateDeclaration,      // array
+  selectedCustomerIds,               // Set
+  originalDeclarationCustomerIds,    // Set
+  topLevelAffectsDeclaration,        // boolean
+  incidentData,
+  template,
+  helperDeps
+) {
+  try {
+    const allowSet = new Set(customersToUpdateDeclaration);
+
+    return customers
+      .filter(cust => {
+        const hasDoS = Boolean(cust?.trespass?.declarationOfService);
+        if (!hasDoS) return false;
+
+        const id = cust.id;
+        const originallyHad = originalDeclarationCustomerIds.has(id);
+        const newlyAdded = !originallyHad;
+
+        if (newlyAdded) return true; // always generate for newly added DoS
+        if (selectedCustomerIds.has(id)) return true; // new customer this session
+
+        if (topLevelAffectsDeclaration) {
+          // require opt-in for everyone who originally had DoS
+          return allowSet.has(id);
+        } else {
+          // per-customer-only mode: generate only for edited + opted-in
+          return allowSet.has(id); 
+        }
+      })
+      .map(cust => {
+        const html = createTrespassDocument(template, cust, incidentData, helperDeps);
+        if (!html || html.trim() === '') return null;
+        return {
+          content: html,
+          customerName: `${cust.lastName || 'Unknown'}, ${cust.firstName}`
+        };
+      })
+      .filter(Boolean);
+  } catch (error) {
+    helperDeps.triggerDocumentError?.(
+      <FormattedMessage id="generate-trespass.error-doc-generateTrespassDocuments" values={{ error: error.message }} />
+    );
+    return [];
+  };
+};
+
+export async function generatePDFAttachments(documents, triggerDocumentError) {
+  try {
+    const attachments = await Promise.all(documents.map(async (doc) => {
+      const tempParent = document.createElement('div');
+      tempParent.style.visibility = 'hidden';
+      tempParent.style.position = 'absolute';
+      tempParent.style.left = '-10000px';
+
+      const tempDiv = document.createElement('div');
+      tempDiv.innerHTML = doc.content;
+      // force layout normalization to avoid phantom height
+      tempDiv.style.whiteSpace = 'normal';
+      tempDiv.style.padding = '0';
+      tempDiv.style.margin = '0';
+      tempDiv.style.position = 'relative';
+      tempDiv.style.top = '0';
+      tempDiv.style.lineHeight = '1.5';
+      tempDiv.style.fontSize = '12pt';
+   
+      tempParent.appendChild(tempDiv);
+      document.body.appendChild(tempParent);
+
+      const style = document.createElement('style');
+      style.textContent = `
+        html, body {
+          margin: 0;
+          padding: 0;
+        }
+
+        p, h1, h2, h3, h4 {
+          orphans: 3;
+          widows: 3;
+          margin: 0 0 0.25in 0;
+        }
+      `;
+
+      tempDiv.prepend(style);
+
+      const options = {
+        margin: 0.5,
+        filename: `Trespass_Document_${doc.customerName}.pdf`,
+        html2canvas: { scale: 2 },
+        jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' },
+        pagebreak: {
+          mode: ['avoid-all', 'css', 'legacy']
+        }
+      };
+
+      const blob = await html2pdf().set(options).from(tempDiv).output('blob');
+      // console.log('PDF HTML snapshot:\n', tempDiv.innerHTML);
+
+      document.body.removeChild(tempParent);
+
+      return {
+        contentType: 'application/pdf',
+        description: `${doc.customerName} trespass ${getTodayDate()}`,
+        id: makeId(`${doc.customerName} trespass ${getTodayDate()}`),
+        file: blob
+      };
+    }));
+
+    return attachments;
+  } catch (error) {
+    triggerDocumentError?.(
+      <FormattedMessage id="generate-trespass.error-doc-generatePDFAttachments" values={{ error: error.message }} />
+    );
+    return [];
+  }
+};

package/src/components/incidents/helpers/validateTrespassDetails.js

@@ -0,0 +1,37 @@
+import isValidDateFormat from './isValidDateFormat';
+
+export const isDeclarationOfServiceEmpty = (declaration = {}) =>
+  Object.values(declaration).every(value => value === '' || value === false);
+
+export const validateDeclarationOfService = (declaration) => {
+  if (!declaration) return true;
+  const { date, placeSigned, title, signature } = declaration;
+  const fields = [date, placeSigned, title, signature];
+  const allFilled = fields.every(Boolean);
+  const allEmpty = fields.every(value => !value);
+  return allEmpty || (allFilled && isValidDateFormat(date));
+};
+
+export const validateDateFields = (data = {}) => {
+  const { endDateOfTrespass, declarationOfService } = data;
+  const dateValues = [endDateOfTrespass, declarationOfService?.date];
+  return dateValues.every(val => val === '' || isValidDateFormat(val));
+};
+
+export const hasTrespassReason = (data = {}) => {
+  const arr = data.exclusionOrTrespassBasedOn;
+  if (!Array.isArray(arr)) return false;
+  return arr.some(item => {
+    if (!item) return false;
+    if (typeof item === 'string') return item.trim() !== '';
+    if (typeof item === 'object') return typeof item.id === 'string' && item.id.trim() !== '';
+    return false;
+  });
+};
+
+export const validateTrespass = (data) => {
+  const dateFieldsValid = validateDateFields(data);
+  const declarationValid = validateDeclarationOfService(data.declarationOfService);
+  const reasonsValid = hasTrespassReason(data);
+  return dateFieldsValid && declarationValid && reasonsValid;
+};

package/src/components/incidents/usePersistedColModalLink.js

@@ -0,0 +1,70 @@
+import React, { useState, useCallback, useEffect } from 'react';
+
+export const STORAGE_KEY = 'ui-secinci-modal-link-visible-columns';
+
+export default function usePersistedColModalLink(possibleColumns) {
+  // walk through the canonical list and retain only the columns that are currently visible, in their canonical order
+  const reorderToCanonical = (columns, canonicalOrder) =>
+    canonicalOrder.filter(col => columns.includes(col));
+
+  const [visibleColumns, setVisibleColumns] = useState(() => {
+    // load from sessionStorage
+    const stored = sessionStorage.getItem(STORAGE_KEY);
+
+    try {
+      const parsed = JSON.parse(stored);
+      // keep only valid column IDs
+      const filtered = Array.isArray(parsed) && parsed.length
+        ? parsed.filter(col => possibleColumns.includes(col))
+        : possibleColumns;
+
+      // initialize with canon
+      return reorderToCanonical(filtered, possibleColumns);
+    } catch {
+      return possibleColumns;
+    }
+  });
+
+  // sync visibleColumns from sessionStorage on each mount/render
+  useEffect(() => {
+    const stored = sessionStorage.getItem(STORAGE_KEY);
+
+    try {
+      const parsed = JSON.parse(stored);
+      const filtered = Array.isArray(parsed) && parsed.length
+        ? parsed.filter(col => possibleColumns.includes(col))
+        : possibleColumns;
+
+      const canonical = reorderToCanonical(filtered, possibleColumns);
+      setVisibleColumns((current) => {
+        const joined = (arr) => arr.join('|');
+        return joined(current) === joined(canonical) ? current : canonical;
+      });
+    } catch {
+      setVisibleColumns(possibleColumns);
+    }
+  }, [possibleColumns]);
+
+  const toggleColumn = useCallback((colId) => {
+    setVisibleColumns(prev => {
+      const isRemoving = prev.includes(colId);
+      // const isLastOne = prev.length === 1;
+
+      // if (isRemoving && isLastOne) {
+      //   return prev;
+      // }
+
+      let next = isRemoving
+        ? prev.filter(c => c !== colId)
+        : [...prev, colId];
+
+      // return enforced canonical order after every toggle, regardless of toggle sequence
+      next = reorderToCanonical(next, possibleColumns);
+
+      sessionStorage.setItem(STORAGE_KEY, JSON.stringify(next));
+      return next;
+    });
+  }, [possibleColumns]);
+
+  return [visibleColumns, toggleColumn];
+}