Performance improvement: Delay rendering of interaction elements of overview items when marked as hidden

Author: silkservice

src/components/OverviewItem/OverviewItemActions.tsx

@@ -19,6 +19,13 @@ export const OverviewItemActions = ({
     hiddenInteractions = false,
     ...restProps
 }: OverviewItemActionsProps) => {
+    const [showActions, setShowActions] = React.useState(!hiddenInteractions)
+
+    React.useEffect(() => {
+        // Delay rendering of item actions when they are hidden anyways, because rendering interaction elements like context menus currently has a large performance impact.
+        setTimeout(() => setShowActions(true), 1)
+    }, [])
+
     return (
         <div
             {...restProps}
@@ -28,7 +35,7 @@ export const OverviewItemActions = ({
                 (className ? ` ${className}` : "")
             }
         >
-            {children}
+            {showActions ? children : null}
         </div>
     );
 };