feat: more error details for manuall query

Manual Restquery edit shows now directly the failing parser error with
a hint to the line/char failing.

Author: mbehr1

src/webview/src/components/dltRestQueryManual.js

@@ -67,10 +67,19 @@ const rqUriEncode = (rq) => {
                     JSON5.parse(commandParam);
                     const commandParamEncoded = encodeURIComponent(formatJson5(commandParam));
                     toRet += `${command}=${commandParamEncoded}`;
-                } catch {
+                } catch (e) {
                     // if its a simple string then it's ok
                     if (commandParam.includes('{') || commandParam.includes('[') || commandParam.includes('"')) {
-                        toRet += `&\n<cannot parse: \n'${command}=${commandParam}'\n as JSON5>`;
+                        // try to parse the location: .... at x:y as (line, col)
+                        const matches = /at (\d+):(\d+)$/.exec(e);
+                        if (matches) {
+                            const line = matches[1];
+                            const col = matches[2];
+                            const failLine = commandParam.split(/\r?\n/)[line - 1];
+                            toRet += `&\n<${e}:\n${failLine}\n${col > 0 ? ('-'.repeat(col - 1) + '^') : '^'}\n parsing JSON5 at \n'${command}=${commandParam}'\n>`;
+                        } else {
+                            toRet += `&\n<cannot parse: \n'${command}=${commandParam}'\n as JSON5 due to '${e}'>`;
+                        }
                         ok = false;
                     } else {
                         toRet += `${command}=${commandParam}`;
@@ -151,7 +160,7 @@ export default function DLTRestQueryManualDialog(props) {
                     error.length > 0 && <div>
                         <ErrorIcon />
                         <TextField error label="Error:" name="DLT rest query error" margin="dense" id={'description-field-rest-query-error'}
-                            InputLabelProps={{ shrink: true, }} fullWidth multiline value={error}
+                            InputLabelProps={{ shrink: true, }} fullWidth multiline value={error} InputProps={{ style: { fontFamily: 'monospace' } }} 
                         ></TextField>
                     </div>
                 }