@bygd/nc-report-ui 0.1.25 → 0.1.27

package/dist/default/esm/index.js

@@ -28,6 +28,7 @@ import EditIcon from '@mui/icons-material/Edit';
 import ContentCopyIcon from '@mui/icons-material/ContentCopy';
 import DeleteIcon from '@mui/icons-material/Delete';
 import PlayArrowIcon from '@mui/icons-material/PlayArrow';
+import RestoreIcon from '@mui/icons-material/Restore';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import SaveIcon from '@mui/icons-material/Save';
 import DownloadIcon from '@mui/icons-material/Download';
@@ -1681,11 +1682,13 @@ const ReportDefinitionsList = ({
   };
   const handleConfirmDelete = async () => {
     if (!reportToDelete) return;
+    const isRevert = reportToDelete.source === "user-override";
+    const action = isRevert ? "reverted" : "deleted";
     try {
       await Api.deleteReportDefinition({
         id: reportToDelete.id
       });
-      notify.success(`Report "${reportToDelete.title}" deleted successfully!`);
+      notify.success(isRevert ? `Report "${reportToDelete.title}" reverted to system version successfully!` : `Report "${reportToDelete.title}" deleted successfully!`);
 
       // Close dialog and reset state
       setDeleteDialogOpen(false);
@@ -1694,8 +1697,8 @@ const ReportDefinitionsList = ({
       // Reload the report definitions list
       loadReportDefinitions();
     } catch (error) {
-      console.error("Error deleting report:", error);
-      notify.error("Failed to delete report: " + (error.response?.data?.message || error.message || "Unknown error"));
+      console.error(`Error ${action} report:`, error);
+      notify.error(`Failed to ${action.toLowerCase()} report: ` + (error.response?.data?.message || error.message || "Unknown error"));
       setDeleteDialogOpen(false);
       setReportToDelete(null);
     }
@@ -1714,6 +1717,11 @@ const ReportDefinitionsList = ({
     headerName: "Provider",
     flex: 1,
     minWidth: 200
+  }, {
+    field: "source",
+    headerName: "Source",
+    flex: 1,
+    minWidth: 150
   }, {
     field: "actions",
     headerName: "Actions",
@@ -1721,48 +1729,60 @@ const ReportDefinitionsList = ({
     sortable: false,
     filterable: false,
     disableColumnMenu: true,
-    renderCell: params => /*#__PURE__*/React__default.createElement(Box$1, {
-      sx: {
-        display: "flex",
-        gap: 1
-      }
-    }, /*#__PURE__*/React__default.createElement(Tooltip, {
-      title: "Run"
-    }, /*#__PURE__*/React__default.createElement(IconButton, {
-      size: "small",
-      color: "success",
-      onClick: e => handleRun(params.row.id, e)
-    }, /*#__PURE__*/React__default.createElement(PlayArrowIcon, {
-      fontSize: "small"
-    }))), /*#__PURE__*/React__default.createElement(Tooltip, {
-      title: "Edit"
-    }, /*#__PURE__*/React__default.createElement(IconButton, {
-      size: "small",
-      color: "primary",
-      onClick: e => handleEdit(params.row.id, e)
-    }, /*#__PURE__*/React__default.createElement(EditIcon, {
-      fontSize: "small"
-    }))), /*#__PURE__*/React__default.createElement(Tooltip, {
-      title: "Clone"
-    }, /*#__PURE__*/React__default.createElement(IconButton, {
-      size: "small",
-      onClick: e => handleClone(params.row.id, e)
-    }, /*#__PURE__*/React__default.createElement(ContentCopyIcon, {
-      fontSize: "small"
-    }))), /*#__PURE__*/React__default.createElement(Tooltip, {
-      title: "Delete"
-    }, /*#__PURE__*/React__default.createElement(IconButton, {
-      size: "small",
-      color: "error",
-      onClick: e => handleDelete(params.row.id, e)
-    }, /*#__PURE__*/React__default.createElement(DeleteIcon, {
-      fontSize: "small"
-    }))))
+    renderCell: params => {
+      const isUserOverride = params.row.source === "user-override";
+      return /*#__PURE__*/React__default.createElement(Box$1, {
+        sx: {
+          display: "flex",
+          gap: 1
+        }
+      }, /*#__PURE__*/React__default.createElement(Tooltip, {
+        title: "Run"
+      }, /*#__PURE__*/React__default.createElement(IconButton, {
+        size: "small",
+        color: "success",
+        onClick: e => handleRun(params.row.id, e)
+      }, /*#__PURE__*/React__default.createElement(PlayArrowIcon, {
+        fontSize: "small"
+      }))), /*#__PURE__*/React__default.createElement(Tooltip, {
+        title: "Edit"
+      }, /*#__PURE__*/React__default.createElement(IconButton, {
+        size: "small",
+        color: "primary",
+        onClick: e => handleEdit(params.row.id, e)
+      }, /*#__PURE__*/React__default.createElement(EditIcon, {
+        fontSize: "small"
+      }))), /*#__PURE__*/React__default.createElement(Tooltip, {
+        title: "Clone"
+      }, /*#__PURE__*/React__default.createElement(IconButton, {
+        size: "small",
+        onClick: e => handleClone(params.row.id, e)
+      }, /*#__PURE__*/React__default.createElement(ContentCopyIcon, {
+        fontSize: "small"
+      }))), isUserOverride ? /*#__PURE__*/React__default.createElement(Tooltip, {
+        title: "Revert to the system report"
+      }, /*#__PURE__*/React__default.createElement(IconButton, {
+        size: "small",
+        color: "warning",
+        onClick: e => handleDelete(params.row.id, e)
+      }, /*#__PURE__*/React__default.createElement(RestoreIcon, {
+        fontSize: "small"
+      }))) : /*#__PURE__*/React__default.createElement(Tooltip, {
+        title: "Delete"
+      }, /*#__PURE__*/React__default.createElement(IconButton, {
+        size: "small",
+        color: "error",
+        onClick: e => handleDelete(params.row.id, e)
+      }, /*#__PURE__*/React__default.createElement(DeleteIcon, {
+        fontSize: "small"
+      }))));
+    }
   }];
   const rows = reportDefinitions.map(def => ({
     id: def.id,
     title: def.title,
-    provider: def.provider
+    provider: def.provider,
+    source: def.source
   }));
   const handleRowClick = params => {
     onSelectReport(params.row.id);
@@ -1862,13 +1882,13 @@ const ReportDefinitionsList = ({
     }
   })), /*#__PURE__*/React__default.createElement(ConfirmDialog, {
     open: deleteDialogOpen,
-    title: "Delete Report Definition",
-    message: reportToDelete ? `Are you sure you want to delete "${reportToDelete.title}"? This action cannot be undone.` : "",
+    title: reportToDelete?.source === "user-override" ? "Revert Report Definition" : "Delete Report Definition",
+    message: reportToDelete ? reportToDelete.source === "user-override" ? `Are you sure you want to revert "${reportToDelete.title}" to the system version? Your custom changes will be lost.` : `Are you sure you want to delete "${reportToDelete.title}"? This action cannot be undone.` : "",
     onConfirm: handleConfirmDelete,
     onCancel: handleCancelDelete,
-    confirmText: "Delete",
+    confirmText: reportToDelete?.source === "user-override" ? "Revert" : "Delete",
     cancelText: "Cancel",
-    confirmColor: "error"
+    confirmColor: reportToDelete?.source === "user-override" ? "warning" : "error"
   }));
 };
 
@@ -2280,18 +2300,24 @@ const SortableChip$1 = ({
     }
   })), !isEditing ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Box$1, {
     sx: {
-      flex: 1,
       minWidth: 0
     }
+  }, /*#__PURE__*/React__default.createElement(Tooltip, {
+    title: fullLabel || displayLabel,
+    arrow: true,
+    placement: "top"
   }, /*#__PURE__*/React__default.createElement(Typography$1, {
     variant: "h6",
     sx: {
       fontWeight: hasCustomTitle ? 600 : 500,
       fontStyle: hasCustomTitle ? "italic" : "normal",
       color: "#1a1a1a",
-      fontSize: "14px"
+      fontSize: "14px",
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis"
     }
-  }, displayLabel)), /*#__PURE__*/React__default.createElement(Box$1, {
+  }, displayLabel))), /*#__PURE__*/React__default.createElement(Box$1, {
     className: "hover-icons",
     sx: {
       display: "flex",
@@ -2318,7 +2344,32 @@ const SortableChip$1 = ({
     onClick: handleSortToggle,
     "aria-label": "toggle sort order",
     color: sortOrder ? "primary" : "default"
-  }, getSortIcon())), /*#__PURE__*/React__default.createElement(IconButton, {
+  }, getSortIcon())), /*#__PURE__*/React__default.createElement(Tooltip, {
+    title: "Delete",
+    arrow: true,
+    placement: "top"
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
+    size: "small",
+    onClick: onDelete,
+    "aria-label": "delete",
+    sx: {
+      color: "#ef5350"
+    }
+  }, /*#__PURE__*/React__default.createElement(GridDeleteIcon, {
+    fontSize: "small"
+  })))), /*#__PURE__*/React__default.createElement(Box$1, {
+    sx: {
+      flex: 1
+    }
+  }), /*#__PURE__*/React__default.createElement(Box$1, {
+    className: "hover-icons",
+    sx: {
+      display: "flex",
+      gap: 0.5,
+      opacity: 0,
+      transition: "opacity 0.2s"
+    }
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
     size: "small",
     onClick: onMoveUp,
     disabled: isFirst,
@@ -2332,27 +2383,15 @@ const SortableChip$1 = ({
     "aria-label": "move down"
   }, /*#__PURE__*/React__default.createElement(ArrowDownwardIcon, {
     fontSize: "small"
-  })), /*#__PURE__*/React__default.createElement(Tooltip, {
-    title: "Delete",
-    arrow: true,
-    placement: "top"
-  }, /*#__PURE__*/React__default.createElement(IconButton, {
-    size: "small",
-    onClick: onDelete,
-    "aria-label": "delete",
-    sx: {
-      color: "#ef5350"
-    }
-  }, /*#__PURE__*/React__default.createElement(GridDeleteIcon, {
-    fontSize: "small"
-  }))))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TextField, {
+  })))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TextField, {
     inputRef: inputRef,
     value: editValue,
     onChange: e => setEditValue(e.target.value),
     onKeyDown: handleKeyDown,
     size: "small",
     sx: {
-      flex: 1
+      minWidth: '200px',
+      maxWidth: '400px'
     }
   }), /*#__PURE__*/React__default.createElement(Box$1, {
     className: "hover-icons",
@@ -2393,7 +2432,11 @@ const SortableChip$1 = ({
     "aria-label": "reset title"
   }, /*#__PURE__*/React__default.createElement(RestartAltIcon, {
     fontSize: "small"
-  })))))));
+  })))), /*#__PURE__*/React__default.createElement(Box$1, {
+    sx: {
+      flex: 1
+    }
+  }))));
 };
 const Dimensions = ({
   providersData,
@@ -2963,18 +3006,24 @@ const SortableChip = ({
     }
   })), !isEditing ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Box$1, {
     sx: {
-      flex: 1,
       minWidth: 0
     }
+  }, /*#__PURE__*/React__default.createElement(Tooltip, {
+    title: fullLabel || displayLabel,
+    arrow: true,
+    placement: "top"
   }, /*#__PURE__*/React__default.createElement(Typography$1, {
     variant: "h6",
     sx: {
       fontWeight: hasCustomTitle ? 600 : 500,
       fontStyle: hasCustomTitle ? "italic" : "normal",
       color: "#1a1a1a",
-      fontSize: "14px"
+      fontSize: "14px",
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis"
     }
-  }, displayLabel)), /*#__PURE__*/React__default.createElement(Box$1, {
+  }, displayLabel))), /*#__PURE__*/React__default.createElement(Box$1, {
     className: "hover-icons",
     sx: {
       display: "flex",
@@ -2992,7 +3041,32 @@ const SortableChip = ({
     "aria-label": "edit title"
   }, /*#__PURE__*/React__default.createElement(EditIcon, {
     fontSize: "small"
-  }))), /*#__PURE__*/React__default.createElement(IconButton, {
+  }))), /*#__PURE__*/React__default.createElement(Tooltip, {
+    title: "Delete",
+    arrow: true,
+    placement: "top"
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
+    size: "small",
+    onClick: onDelete,
+    "aria-label": "delete",
+    sx: {
+      color: "#ef5350"
+    }
+  }, /*#__PURE__*/React__default.createElement(GridDeleteIcon, {
+    fontSize: "small"
+  })))), /*#__PURE__*/React__default.createElement(Box$1, {
+    sx: {
+      flex: 1
+    }
+  }), /*#__PURE__*/React__default.createElement(Box$1, {
+    className: "hover-icons",
+    sx: {
+      display: "flex",
+      gap: 0.5,
+      opacity: 0,
+      transition: "opacity 0.2s"
+    }
+  }, /*#__PURE__*/React__default.createElement(IconButton, {
     size: "small",
     onClick: onMoveUp,
     disabled: isFirst,
@@ -3006,27 +3080,15 @@ const SortableChip = ({
     "aria-label": "move down"
   }, /*#__PURE__*/React__default.createElement(ArrowDownwardIcon, {
     fontSize: "small"
-  })), /*#__PURE__*/React__default.createElement(Tooltip, {
-    title: "Delete",
-    arrow: true,
-    placement: "top"
-  }, /*#__PURE__*/React__default.createElement(IconButton, {
-    size: "small",
-    onClick: onDelete,
-    "aria-label": "delete",
-    sx: {
-      color: "#ef5350"
-    }
-  }, /*#__PURE__*/React__default.createElement(GridDeleteIcon, {
-    fontSize: "small"
-  }))))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TextField, {
+  })))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TextField, {
     inputRef: inputRef,
     value: editValue,
     onChange: e => setEditValue(e.target.value),
     onKeyDown: handleKeyDown,
     size: "small",
     sx: {
-      flex: 1
+      minWidth: '200px',
+      maxWidth: '400px'
     }
   }), /*#__PURE__*/React__default.createElement(Box$1, {
     className: "hover-icons",
@@ -3067,7 +3129,11 @@ const SortableChip = ({
     "aria-label": "reset title"
   }, /*#__PURE__*/React__default.createElement(RestartAltIcon, {
     fontSize: "small"
-  })))))));
+  })))), /*#__PURE__*/React__default.createElement(Box$1, {
+    sx: {
+      flex: 1
+    }
+  }))));
 };
 const Metrics = ({
   providersData,
@@ -5824,6 +5890,30 @@ const ReportApp = ({
               }
             }
           }
+        },
+        MuiTooltip: {
+          styleOverrides: {
+            tooltip: {
+              fontSize: "0.875rem",
+              backgroundColor: "rgba(97, 97, 97, 0.95)",
+              maxWidth: 500
+            },
+            arrow: {
+              color: "rgba(97, 97, 97, 0.95)"
+            }
+          },
+          defaultProps: {
+            arrow: true,
+            enterDelay: 300,
+            leaveDelay: 200
+          }
+        },
+        MuiPopper: {
+          defaultProps: {
+            style: {
+              zIndex: 1500
+            }
+          }
         }
       }
     })

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bygd/nc-report-ui",
-	"version": "0.1.25",
+	"version": "0.1.27",
 	"files": [
 		"dist/*",
 		"fnet/input.yaml",
@@ -25,13 +25,14 @@
 		"@material-ui/core": "^4.12",
 		"@mui/icons-material": "^7.3",
 		"@mui/material": "^7.3",
-		"@mui/x-data-grid": "^8.19",
-		"@mui/x-date-pickers": "^8.19",
+		"@mui/x-data-grid": "^8.22",
+		"@mui/x-date-pickers": "^8.22",
 		"axios": "^1.13",
 		"dayjs": "^1.11",
 		"eventemitter3": "^5.0",
 		"numeral": "^2.0",
 		"nunjucks": "^3.2",
+		"preact": "^10",
 		"react": "^18",
 		"react-dom": "^18",
 		"react-google-charts": "^5.2",