Explore bulk actions (#15307)

* use id instead of index for object details and scrolling

* long press package and hook

* fix long press in review

* search action group

* multi select in explore

* add bulk deletion to backend api

* clean up

* mimic behavior of review

* don't open dialog on left click when mutli selecting

* context menu on container ref

* revert long press code

* clean up

web/src/hooks/use-press.ts

@@ -0,0 +1,54 @@
+// https://gist.github.com/cpojer/641bf305e6185006ea453e7631b80f95
+
+import { useCallback, useState } from "react";
+import {
+  LongPressCallbackMeta,
+  LongPressReactEvents,
+  useLongPress,
+} from "use-long-press";
+
+export default function usePress(
+  options: Omit<Parameters<typeof useLongPress>[1], "onCancel" | "onStart"> & {
+    onLongPress: NonNullable<Parameters<typeof useLongPress>[0]>;
+    onPress: (event: LongPressReactEvents<Element>) => void;
+  },
+) {
+  const { onLongPress, onPress, ...actualOptions } = options;
+  const [hasLongPress, setHasLongPress] = useState(false);
+
+  const onCancel = useCallback(() => {
+    if (hasLongPress) {
+      setHasLongPress(false);
+    }
+  }, [hasLongPress]);
+
+  const bind = useLongPress(
+    useCallback(
+      (
+        event: LongPressReactEvents<Element>,
+        meta: LongPressCallbackMeta<unknown>,
+      ) => {
+        setHasLongPress(true);
+        onLongPress(event, meta);
+      },
+      [onLongPress],
+    ),
+    {
+      ...actualOptions,
+      onCancel,
+      onStart: onCancel,
+    },
+  );
+
+  return useCallback(
+    () => ({
+      ...bind(),
+      onClick: (event: LongPressReactEvents<HTMLDivElement>) => {
+        if (!hasLongPress) {
+          onPress(event);
+        }
+      },
+    }),
+    [bind, hasLongPress, onPress],
+  );
+}