Merge pull request #4611 from voxel51/dashboard-edit

Dashboard edit
voxel51 · Aug 2, 2024 · 4f076cc · 4f076cc
2 parents d839ac6 + 4b9d233
commit 4f076cc
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 13 deletions.
diff --git a/app/packages/core/src/plugins/SchemaIO/components/DashboardView.tsx b/app/packages/core/src/plugins/SchemaIO/components/DashboardView.tsx
@@ -19,6 +19,7 @@ import { Button } from ".";
 import { getPath, getProps } from "../utils";
 import { ObjectSchemaType, ViewPropsType } from "../utils/types";
 import DynamicIO from "./DynamicIO";
+import { Edit } from "@mui/icons-material";
 
 const AddItemCTA = ({ onAdd }) => {
   return (
@@ -69,13 +70,25 @@ export default function DashboardView(props: ViewPropsType) {
   const propertiesAsArray = [];
   const allow_addition = schema.view.allow_addition;
   const allow_deletion = schema.view.allow_deletion;
+  const allow_edit = schema.view.allow_edit;
 
   for (const property in properties) {
     propertiesAsArray.push({ id: property, ...properties[property] });
   }
   const panelId = usePanelId();
   const triggerPanelEvent = usePanelEvent();
 
+  const onEditItem = useCallback(
+    ({ id, path }) => {
+      if (schema.view.on_edit_item) {
+        triggerPanelEvent(panelId, {
+          operator: schema.view.on_edit_item,
+          params: { id, path },
+        });
+      }
+    },
+    [panelId, props, schema.view.on_edit_item, triggerPanelEvent]
+  );
   const onCloseItem = useCallback(
     ({ id, path }) => {
       if (schema.view.on_remove_item) {
@@ -185,19 +198,34 @@ export default function DashboardView(props: ViewPropsType) {
             >
               <DragHandle className="drag-handle">
                 <Typography>{property.title || id}</Typography>
-                {allow_deletion && (
-                  <IconButton
-                    size="small"
-                    onMouseDown={(e) => e.stopPropagation()}
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      onCloseItem({ id, path: getPath(path, id) });
-                    }}
-                    sx={{ color: theme.text.secondary }}
-                  >
-                    <CloseIcon />
-                  </IconButton>
-                )}
+                <Box>
+                  {allow_edit && (
+                    <IconButton
+                      size="small"
+                      onMouseDown={(e) => e.stopPropagation()}
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        onEditItem({ id, path: getPath(path, id) });
+                      }}
+                      sx={{ color: theme.text.secondary }}
+                    >
+                      <Edit />
+                    </IconButton>
+                  )}
+                  {allow_deletion && (
+                    <IconButton
+                      size="small"
+                      onMouseDown={(e) => e.stopPropagation()}
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        onCloseItem({ id, path: getPath(path, id) });
+                      }}
+                      sx={{ color: theme.text.secondary }}
+                    >
+                      <CloseIcon />
+                    </IconButton>
+                  )}
+                </Box>
               </DragHandle>
               <Box sx={{ height: "calc(100% - 35px)", overflow: "auto" }}>
                 <DynamicIO

diff --git a/fiftyone/operators/types.py b/fiftyone/operators/types.py
@@ -2099,18 +2099,24 @@ class DashboardView(View):
         on_layout_change (None): event triggered when the layout changes
         on_add_item (None): event triggered when an item is added
         on_remove_item (None): event triggered when an item is closed
+        on_edit_item (None): event triggered when an item is edited
+        allow_addition (True): whether to allow adding items
+        allow_deletion (True): whether to allow deleting items
+        allow_edit (True): whether to allow editing items
     """
 
     def __init__(self, **kwargs):
         super().__init__(**kwargs)
         self.allow_addition = kwargs.get("allow_addition", True)
         self.allow_deletion = kwargs.get("allow_deletion", True)
+        self.allow_edit = kwargs.get("allow_edit", True)
 
     def to_json(self):
         return {
             **super().to_json(),
             "allow_addition": self.allow_addition,
             "allow_deletion": self.allow_deletion,
+            "allow_edit": self.allow_edit,
         }