@vuu-ui/vuu-table-extras 3.3.7 → 3.3.8

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "3.3.7",
+  "version": "3.3.8",
   "author": "heswell",
   "main": "./src/index.js",
   "license": "Apache-2.0",
@@ -11,19 +11,19 @@
     "lezer-generate:column": "lezer-generator --output ./src/column-expression-input/column-language-parser/generated/column-parser.js ./src/column-expression-input/column-language-parser/grammar/column.grammar"
   },
   "devDependencies": {
-    "@vuu-ui/vuu-filter-types": "3.3.7",
-    "@vuu-ui/vuu-protocol-types": "3.3.7"
+    "@vuu-ui/vuu-filter-types": "3.3.8",
+    "@vuu-ui/vuu-protocol-types": "3.3.8"
   },
   "dependencies": {
-    "@vuu-ui/vuu-codemirror": "3.3.7",
-    "@vuu-ui/vuu-data-editing": "3.3.7",
-    "@vuu-ui/vuu-data-react": "3.3.7",
-    "@vuu-ui/vuu-data-types": "3.3.7",
-    "@vuu-ui/vuu-table-types": "3.3.7",
-    "@vuu-ui/vuu-popups": "3.3.7",
-    "@vuu-ui/vuu-table": "3.3.7",
-    "@vuu-ui/vuu-utils": "3.3.7",
-    "@vuu-ui/vuu-ui-controls": "3.3.7",
+    "@vuu-ui/vuu-codemirror": "3.3.8",
+    "@vuu-ui/vuu-data-editing": "3.3.8",
+    "@vuu-ui/vuu-data-react": "3.3.8",
+    "@vuu-ui/vuu-data-types": "3.3.8",
+    "@vuu-ui/vuu-table-types": "3.3.8",
+    "@vuu-ui/vuu-popups": "3.3.8",
+    "@vuu-ui/vuu-table": "3.3.8",
+    "@vuu-ui/vuu-utils": "3.3.8",
+    "@vuu-ui/vuu-ui-controls": "3.3.8",
     "@lezer/lr": "1.4.2",
     "@salt-ds/core": "1.54.1",
     "@salt-ds/lab": "1.0.0-alpha.83",

package/src/csv-upload/CsvUpload.js

@@ -7,7 +7,7 @@ import { useCsvUpload } from "./useCsvUpload.js";
 import CsvUpload from "./CsvUpload.css";
 const classBase = "vuuCsvUpload";
 const CsvUpload_CsvUpload = (props)=>{
-    const { children, dialogTitle = "Import CSV", embedded = false, onCancel, onClose, open } = props;
+    const { children, dialogTitle = "Import CSV", embedded = false, onCancel, onClose, open, renderError } = props;
     const isControlledOpen = void 0 !== open;
     const [internalOpen, setInternalOpen] = useState(open ?? true);
     const dialogOpen = isControlledOpen ? open : internalOpen;
@@ -17,7 +17,7 @@ const CsvUpload_CsvUpload = (props)=>{
         css: CsvUpload,
         window: targetWindow
     });
-    const { canImport, cancelImport, isProcessingFile, isImporting, importData, onDrop, onTriggerChange, schema, validation } = useCsvUpload(props);
+    const { canImport, cancelImport, isProcessingFile, isImporting, importData, onDrop, onTriggerChange, schema, validation, error } = useCsvUpload(props);
     const handleCancel = useCallback(async ()=>{
         await cancelImport();
         if (!isControlledOpen) setInternalOpen(false);
@@ -40,7 +40,7 @@ const CsvUpload_CsvUpload = (props)=>{
                 className: `${classBase}-dropZone`,
                 disabled: void 0 === schema || isProcessingFile || isImporting,
                 onDrop: onDrop,
-                status: validation && validation.errors.length > 0 ? "error" : void 0,
+                status: validation && validation.errors.length > 0 || error ? "error" : void 0,
                 children: [
                     /*#__PURE__*/ jsx(FileDropZoneIcon, {}),
                     validation && validation.errors.length > 0 ? /*#__PURE__*/ jsxs(Fragment, {
@@ -53,7 +53,7 @@ const CsvUpload_CsvUpload = (props)=>{
                                 children: validation.errors.filter((e)=>e.column in validation.errorMap.fileErrors).map((error, i)=>/*#__PURE__*/ jsx("li", {
                                         className: `${classBase}-errorItem`,
                                         children: error.message
-                                    }, i))
+                                    }, `${error.column}-${error.message}-${i}`))
                             }),
                             /*#__PURE__*/ jsx("div", {
                                 children: "Please rectify and reupload"
@@ -69,6 +69,19 @@ const CsvUpload_CsvUpload = (props)=>{
                     })
                 ]
             }),
+            error && (renderError ? renderError(error) : /*#__PURE__*/ jsxs("div", {
+                className: `${classBase}-errors`,
+                children: [
+                    /*#__PURE__*/ jsx("div", {
+                        children: /*#__PURE__*/ jsx("strong", {
+                            children: "Import Error:"
+                        })
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        children: error.errors.importError?.message || error.errors.schemaError?.message || error.errors.validationError?.message || "An unexpected error occurred during import."
+                    })
+                ]
+            })),
             children
         ]
     });

package/src/csv-upload/useCsvUpload.js

@@ -12,6 +12,13 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
     const [isProcessingFile, setIsProcessingFile] = useState(false);
     const [isImporting, setIsImporting] = useState(false);
     const [fetchedImportSchema, setFetchedImportSchema] = useState();
+    const [error, setError] = useState();
+    const handleError = useCallback((errResult)=>{
+        setError(errResult);
+        onError?.(errResult);
+    }, [
+        onError
+    ]);
     useEffect(()=>{
         if (importSchema || void 0 === importTable) return void setFetchedImportSchema(void 0);
         let cancelled = false;
@@ -195,21 +202,23 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
     ]);
     const cancelImport = useCallback(async ()=>{
         operationIdRef.current++;
-        try {
-            await processingPromiseRef.current;
-        } catch  {}
+        processingPromiseRef.current = void 0;
+        setIsProcessingFile(false);
+        setIsImporting(false);
+        handleError(void 0);
         await closePendingEditSession(false);
     }, [
-        closePendingEditSession
+        closePendingEditSession,
+        handleError
     ]);
     const processFile = useCallback(async (file, operationId)=>{
         setValidation(void 0);
-        onError?.(void 0);
+        handleError(void 0);
         await closePendingEditSession(false);
         if (operationId !== operationIdRef.current) return;
         if (!isSessionTable(dataSource.table) && ("initialising" === dataSource.status || "unsubscribed" === dataSource.status)) {
             const errorMessage = `CsvUpload requires dataSource to be subscribed before uploading (current status: "${dataSource.status}").`;
-            onError?.({
+            handleError({
                 errors: {
                     validationError: createUploadError("validation", errorMessage)
                 }
@@ -223,7 +232,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         const parsedCsv = parseCsv(fileContents, parseOptions);
         if (parsedCsv.error && hasFileParseErrors(parsedCsv.error)) {
             setValidation(void 0);
-            onError?.({
+            handleError({
                 errors: {
                     validationError: createUploadError("validation", `Validation failed: ${parsedCsv.error.message}`, parsedCsv.error)
                 }
@@ -235,7 +244,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         });
         if (Object.keys(schemaValidation.errorMap.fileErrors).length > 0) {
             setValidation(schemaValidation);
-            onError?.({
+            handleError({
                 errors: {
                     schemaError: createUploadError("schema", "CSV validation failed.", parsedCsv.error, {
                         errorMap: schemaValidation.errorMap,
@@ -248,24 +257,28 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         }
         const mergedValidation = mergeValidationWithParseErrors(schemaValidation, parsedCsv.error);
         setValidation(mergedValidation);
-        if (mergedValidation.rows.length > 0) {
+        if (mergedValidation.rows.length > 0) try {
             await beginEditSession();
             if (operationId !== operationIdRef.current) return;
-            try {
-                const rowsAdded = await addAllRows(mergedValidation, operationId);
-                if (!rowsAdded) return;
-            } catch (error) {
-                await endEditSessionAndNotify(false, "failed");
-                setValidation(void 0);
-                onError?.({
-                    errors: {
-                        importError: createUploadError("import", `RPC import failed: ${toErrorMessage(error)}`)
-                    }
-                });
+            const rowsAdded = await addAllRows(mergedValidation, operationId);
+            if (!rowsAdded) return;
+        } catch (error) {
+            if (void 0 !== sessionDataSourceRef.current) await endEditSessionAndNotify(false, "failed");
+            else try {
+                await editSession.end(false);
+            } catch (err) {
+                console.error("[useCsvUpload] failed to end clean session", err);
             }
+            setValidation(void 0);
+            handleError({
+                errors: {
+                    importError: createUploadError("import", `RPC import failed: ${toErrorMessage(error)}`)
+                }
+            });
         }
     }, [
-        onError,
+        handleError,
+        editSession,
         addAllRows,
         maxRows,
         parseOptions,
@@ -297,13 +310,13 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
                     validationError: createUploadError("validation", errorMessage, parseError)
                 }
             };
-            onError?.(errors);
+            handleError(errors);
         } finally{
             if (processingPromiseRef.current === processingPromise) processingPromiseRef.current = void 0;
             setIsProcessingFile(false);
         }
     }, [
-        onError,
+        handleError,
         onProcessingStarted,
         processFile,
         setActiveSessionDataSource
@@ -326,7 +339,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
     const importData = useCallback(async ()=>{
         if (!canImport || void 0 === validation) return false;
         setIsImporting(true);
-        onError?.(void 0);
+        handleError(void 0);
         try {
             const fallbackTableData = {
                 columns: validation.columns,
@@ -357,7 +370,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
                     importError: createUploadError("import", errorMessage)
                 }
             };
-            onError?.(errors);
+            handleError(errors);
             return false;
         } finally{
             setIsImporting(false);
@@ -366,7 +379,7 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         canImport,
         editSession,
         endEditSessionAndNotify,
-        onError,
+        handleError,
         onImported,
         onPreview,
         importMode,
@@ -382,7 +395,8 @@ const useCsvUpload = ({ dataSource, importMode = "direct", importSchema, importT
         onTriggerChange,
         sessionTable,
         schema,
-        validation
+        validation,
+        error
     };
 };
 export { useCsvUpload };

package/types/csv-upload/CsvUpload.d.ts

@@ -60,5 +60,9 @@ export interface CsvUploadProps {
     parseOptions?: CsvParseOptions;
     importMode?: "direct" | "preview";
     rowDefaults?: RowDefaultDataItemValues;
+    /**
+     * Custom renderer for the error panel.
+     */
+    renderError?: (error: CsvUploadErrorResult) => ReactNode;
 }
 export declare const CsvUpload: (props: CsvUploadProps) => import("react/jsx-runtime").JSX.Element;

package/types/csv-upload/useCsvUpload.d.ts

@@ -37,5 +37,6 @@ export type UseCsvUploadReturn = {
     sessionTable: CsvUploadSessionTable | undefined;
     schema: TableSchema | undefined;
     validation: CsvValidationResult | undefined;
+    error: CsvUploadErrorResult | undefined;
 };
 export declare const useCsvUpload: ({ dataSource, importMode, importSchema, importTable, onImportSessionEnded, onImportSessionStarted, onError, onImported, onPreview, onProcessingStarted, maxRows, parseOptions, rowDefaults, }: CsvUploadHookProps) => UseCsvUploadReturn;