WIP cell check

AI-SDC · Nov 2, 2023 · 0f41bc7 · 0f41bc7
1 parent 53e35ba
commit 0f41bc7
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 24 deletions.
diff --git a/assets/src/scripts/_file-elements.js b/assets/src/scripts/_file-elements.js
@@ -6,7 +6,7 @@ import "highlight.js/styles/github.css";
 import { highlightJsName } from "./_utils";
 
 /**
- * @param {Node} el
+ * @param {HTMLElement} el
  * @param {string} ext
  * @param {string} url
  * @param {object} outcome

diff --git a/assets/src/scripts/_output-click.js b/assets/src/scripts/_output-click.js
@@ -80,7 +80,12 @@ export default async function outputClick({ outputName, metadata }) {
     filePreviewLink.setAttribute("href", url);
 
     if (isCsv(ext)) {
-      createTableElement(filePreviewContent, ext, url, outcome);
+      createTableElement(
+        filePreviewContent,
+        ext,
+        url,
+        openOutput.value.metadata.files[0].cell_index
+      );
     } else if (isImg(ext)) {
       createImageElement(filePreviewContent, url);
     } else if (isTxt(ext)) {

diff --git a/assets/src/scripts/_table-builder.js b/assets/src/scripts/_table-builder.js
@@ -1,24 +1,20 @@
 import Papa from "papaparse";
 import { html } from "./_utils";
 
-const indexOfAll = (arr, val) =>
-  arr.reduce((acc, el, i) => (el !== val ? [...acc, i] : acc), []);
-
 /**
- *
- * @param {string} columnName
- * @param {object} columnOutcome
- * @param {string[]} headings
- * @returns
+ * @param {{ [x: string]: string[]; }} cellIndex
  */
-function highlightFailingCells(columnName, columnOutcome, headings) {
-  const rows = indexOfAll(Object.values(columnOutcome), "ok");
-  const column = headings.findIndex((val) => val === columnName);
+function highlightFailingCells(cellIndex) {
+  const tableBody = document.getElementById("csvBody");
 
-  const colData = rows.map((row) => {
-    const tableBody = document.getElementById("csvBody");
-    const tableRow = tableBody.children[row];
-    const tableCell = tableRow.children[column];
+  Object.keys(cellIndex).forEach((index) => {
+    let [x, y] = index.split(",");
+    x = parseFloat(x) + 1;
+    y = parseFloat(y) + 2;
+
+    const tableCell = tableBody.querySelector(
+      `tr:nth-child(${x}) > td:nth-child(${y})`
+    );
 
     tableCell.classList.add(
       "bg-red-50",
@@ -30,9 +26,7 @@ function highlightFailingCells(columnName, columnOutcome, headings) {
       "cursor-pointer"
     );
 
-    const tooltipContent = Object.values(columnOutcome)
-      [row].split("; ")
-      .filter((i) => i !== "")
+    const tooltipContent = cellIndex?.[index]
       .map((i) => html`<span class="block">${i}</span>`)
       .join("");
 
@@ -48,9 +42,15 @@ function highlightFailingCells(columnName, columnOutcome, headings) {
 
     return tableCell;
   });
-  return colData;
 }
 
+/**
+ *
+ * @param {object} params
+ * @param {Object.<string, string[]>} params.outcome
+ * @param {HTMLElement} params.el
+ * @param {string} params.csvString
+ */
 function tableBuilder({ csvString, el, outcome }) {
   const csvToJson = Papa.parse(csvString).data;
 
@@ -82,9 +82,7 @@ function tableBuilder({ csvString, el, outcome }) {
 
   el.innerHTML = table; // eslint-disable-line no-param-reassign
 
-  Object.keys(outcome).map((columnName) =>
-    highlightFailingCells(columnName, outcome[columnName], csvToJson[0])
-  );
+  highlightFailingCells(outcome);
 }
 
 export default tableBuilder;