custom path parser to better work with normalized paths

Author: GrayHat12

src/pages/Compare.tsx

@@ -3,12 +3,13 @@ import JSONPane from "../components/JsonPane";
 import { useParams, useNavigate } from "react-router-dom";
 import { useEffect, useRef, useState } from "react";
 import { _IDBStorageItem, useAppContext } from "../context/AppContext";
-import { JSONEditor, Content, Mode, OnChangeStatus, parseJSONPath, JSONPath } from "vanilla-jsoneditor";
+import { JSONEditor, Content, Mode, OnChangeStatus, JSONPath } from "vanilla-jsoneditor";
 import Loading from "./Loading";
 import { BiSolidUpArrow, BiSolidDownArrow } from "react-icons/bi";
 import { sortObj, cleanJSON } from "jsonabc";
 import styles from "./compare.module.css";
 import { JSONDiff, Difference, difference } from "../utils";
+import { parseJSONPath } from "../utils/butils";
 import * as utils from "../utils";
 import { useWorker, WORKER_STATUS } from "../worker";
 
@@ -165,6 +166,7 @@ export default function Compare() {
     const navigate = useNavigate();
 
     useEffect(() => {
+        // (window as any).test = parseJSONPath;
         if (id === undefined) {
             navigate("/compare/new");
             return;
@@ -270,6 +272,7 @@ export default function Compare() {
 
     function highlightPath(path: JSONPath) {
         let fn = async (p: JSONPath) => {
+            // console.log('using json path', p);
             return encodeURIComponent(`/${p.map(v => v.replace('/', '~1')).join("/")}`);
         };
         let styleRules: Promise<string>[] = [];
@@ -290,11 +293,13 @@ export default function Compare() {
         }
         for (let i = 0; i < sideDiff.extra.length; i++) {
             let path = sideDiff.extra[i];
+            // console.log('using path', path);
             let _path = parseJSONPath(path.substring(2));
             tasks.push(highlightPath(_path));
         }
         for (let i = 0; i < sideDiff.missing.length; i++) {
             let path = sideDiff.missing[i];
+            // console.log('using path', path);
             let _path = parseJSONPath(path.substring(2));
             tasks.push(highlightPath(_path));
         }

src/utils/butils.ts

@@ -0,0 +1,68 @@
+import { JSONPath } from "vanilla-jsoneditor";
+
+export function isNumericString(value: string) {
+    return /^\d+$/.test(value);
+}
+
+export function parseJSONPath(path: string): JSONPath {
+    let parsed: JSONPath = [];
+    let start_index = 0;
+    let index = 0;
+    while (index < path.length) {
+        let char = path[index];
+        switch (char) {
+            case ".": {
+                if (index > start_index) {
+                    parsed.push(path.slice(start_index, index));
+                    index += 1;
+                    start_index = index;
+                } else {
+                    console.log('skipping', char);
+                    index += 1;
+                }
+            } break;
+            case "]": {
+                if (path[start_index] === '[') {
+                    let key = path.slice(start_index+1, index);
+                    if (isNumericString(key)) {
+                        parsed.push(key);
+                        index += 1;
+                        start_index = index;
+                    }
+                    else {
+                        index += 1;
+                    }
+                }
+                else {
+                    index += 1;
+                }
+            } break;
+            case '"': {
+                let start = index+1;
+                let end = path.indexOf('"', start);
+                if (path.length > end+1 && path[end+1] === '.') {
+                    parsed.push(path.slice(start, end));
+                    index = end+2;
+                    start_index = index;
+                } else if (path.length == end+1) {
+                    parsed.push(path.slice(start, end));
+                    index = end+2;
+                    start_index = index;
+                } else {
+                    index = end+1;
+                }
+            } break;
+            case '\\': {
+                index += 2;
+            } break;
+            default: {
+                index += 1;
+            } break;
+        }
+    }
+    if (start_index < path.length) {
+        parsed.push(path.slice(start_index));
+    }
+    // console.log('processing', path, 'returned', parsed, start_index);
+    return parsed;
+}