synapse-react-client 4.0.29 → 4.0.31

package/dist/components/EntityFinder/EntityFinder.js

@@ -2,81 +2,81 @@ import e from "../../synapse-client/index.js";
 import { getEntityTypeFromHeader as t } from "../../utils/functions/EntityTypeUtils.js";
 import { parseSynId as n } from "../../utils/functions/RegularExpressions.js";
 import { SynapseErrorBoundary as r } from "../error/ErrorBanner.js";
-import { useSynapseContext as i } from "../../utils/context/SynapseContext.js";
-import { VersionSelectionType as ee } from "./VersionSelectionType.js";
-import { useEntitySelection as te } from "./useEntitySelection.js";
-import { Breadcrumbs as ne } from "./Breadcrumbs.js";
-import { EntityDetailsList as a, EntityDetailsListDataConfigurationType as o } from "./details/EntityDetailsList.js";
-import { EntityTreeNodeType as s } from "./tree/VirtualizedTree.js";
-import { EntityTree as c } from "./tree/EntityTree.js";
-import re, { useCallback as l, useEffect as u, useMemo as d, useState as f } from "react";
-import { Box as ie, Chip as p, IconButton as ae, InputAdornment as m, Stack as oe, Tab as h, Tabs as se, TextField as ce } from "@mui/material";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { EntityType as v } from "@sage-bionetworks/synapse-client";
-import { useErrorHandler as le } from "react-error-boundary";
-import ue from "@mui/icons-material/Search";
-import { Map as de } from "immutable";
+import { useSynapseContext as ee } from "../../utils/context/SynapseContext.js";
+import { Breadcrumbs as te } from "./Breadcrumbs.js";
+import { VersionSelectionType as ne } from "./VersionSelectionType.js";
+import { EntityDetailsList as i, EntityDetailsListDataConfigurationType as a } from "./details/EntityDetailsList.js";
+import { EntityTreeNodeType as o } from "./tree/VirtualizedTree.js";
+import { EntityTree as s } from "./tree/EntityTree.js";
+import { useEntitySelection as re } from "./useEntitySelection.js";
+import ie, { useCallback as c, useEffect as l, useMemo as u, useState as d } from "react";
+import { Box as ae, Chip as oe, IconButton as se, InputAdornment as f, Stack as p, Tab as m, Tabs as ce, TextField as le } from "@mui/material";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { EntityType as _ } from "@sage-bionetworks/synapse-client";
+import { useErrorHandler as ue } from "react-error-boundary";
+import de from "@mui/icons-material/Search";
 import fe from "@mui/icons-material/Clear";
-import { ReflexContainer as pe, ReflexElement as y, ReflexSplitter as me } from "react-reflex";
+import { Map as pe } from "immutable";
+import { ReflexContainer as me, ReflexElement as v, ReflexSplitter as he } from "react-reflex";
 import "react-reflex/styles.css";
 //#region src/components/EntityFinder/EntityFinder.tsx
-var he = Object.values(v), b = Object.values(v), x = [v.project, v.folder], ge = (e) => Object.values(v).filter((t) => !e.includes(t)).map((e) => ({
+var ge = Object.values(_), y = Object.values(_), b = [_.project, _.folder], _e = (e) => Object.values(_).filter((t) => !e.includes(t)).map((e) => ({
 	key: "node_type",
 	value: e.toString(),
 	not: !0
 }));
-function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMultiple: w, onSelectedChange: T, versionSelection: E = ee.TRACKED, selectableTypes: D = he, visibleTypesInList: O = b, visibleTypesInTree: k = x, treeOnly: A = !1, initialSelected: j }) {
-	let { accessToken: M } = i(), [N, P] = re.useState(0), [F, I] = f(!1), [L, R] = f(""), [z, B] = f(), [_e, V] = f({ items: [] }), [H, U] = f([]), [ve, ye] = f({ type: o.PROMPT }), be = d(() => [...k, ...D], [k, D]), xe = d(() => [...O, ...D], [O, D]), [W, G] = f(C), K = le(), Se = l((e) => {
-		V({ items: e });
-	}, [V]), { selectedEntities: q, toggleSelection: J, setSelection: Y, setInitialVersion: X } = te(w);
-	u(() => {
-		if (j) {
-			let e = de();
+function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMultiple: C, onSelectedChange: w, versionSelection: T = ne.TRACKED, selectableTypes: E = ge, visibleTypesInList: D = y, visibleTypesInTree: O = b, treeOnly: k = !1, initialSelected: A }) {
+	let { accessToken: j } = ee(), [M, N] = ie.useState(0), [P, F] = d(!1), [I, L] = d(""), [R, z] = d(), [ve, B] = d({ items: [] }), [V, H] = d([]), [ye, be] = d({ type: a.PROMPT }), xe = u(() => [...O, ...E], [O, E]), Se = u(() => [...D, ...E], [D, E]), [U, W] = d(S), G = ue(), Ce = c((e) => {
+		B({ items: e });
+	}, [B]), { selectedEntities: K, toggleSelection: q, setSelection: J, setInitialVersion: Y } = re(C);
+	l(() => {
+		if (A) {
+			let e = pe();
 			e = e.withMutations((e) => {
-				j.forEach((t) => {
+				A.forEach((t) => {
 					e.set(t.targetId, t);
 				});
-			}), Y(e);
+			}), J(e);
 		}
-	}, [j, Y]);
-	let [Ce, we] = f(q), Z = l((e) => q.has(e.id), [q]), Q = l((e) => {
+	}, [A, J]);
+	let [X, we] = d(K), Z = c((e) => K.has(e.id), [K]), Q = c((e) => {
 		let n = t(e);
-		return D.includes(n);
-	}, [D]);
-	u(() => {
-		T(Array.from(q.values()));
-	}, [q, T]), u(() => {
-		if (z?.length === 1) {
-			let t = n(z[0]);
-			t && e.getEntityHeaders([t], M).then((e) => {
-				U(e.results);
-			}).catch((e) => K(e));
-		} else U([]);
+		return E.includes(n);
+	}, [E]);
+	l(() => {
+		w(Array.from(K.values()));
+	}, [K, w]), l(() => {
+		if (R?.length === 1) {
+			let t = n(R[0]);
+			t && e.getEntityHeaders([t], j).then((e) => {
+				H(e.results);
+			}).catch((e) => G(e));
+		} else H([]);
 	}, [
-		M,
-		z,
-		K
+		j,
+		R,
+		G
 	]);
 	let Te = (e, t) => {
-		we(q), P(t);
-	}, Ee = F ? "MainPanelSearch" : A ? "MainPanelSinglePane" : "MainPanelDualPane", $ = {
-		configuration: ve,
-		versionSelection: E,
-		selected: q,
+		we(K), N(t);
+	}, Ee = P ? "MainPanelSearch" : k ? "MainPanelSinglePane" : "MainPanelDualPane", $ = {
+		configuration: ye,
+		versionSelection: T,
+		selected: K,
 		isIdSelected: Z,
 		isSelectable: Q,
-		visibleTypes: xe,
-		selectableTypes: D,
-		selectColumnType: w ? "checkbox" : "none",
-		toggleSelection: J,
-		setInitialVersion: X,
-		enableSelectAll: w,
-		setCurrentContainer: G
+		visibleTypes: Se,
+		selectableTypes: E,
+		selectColumnType: C ? "checkbox" : "none",
+		toggleSelection: q,
+		setInitialVersion: Y,
+		enableSelectAll: C,
+		setCurrentContainer: W
 	};
-	return /* @__PURE__ */ g(r, { children: /* @__PURE__ */ _("div", {
+	return /* @__PURE__ */ h(r, { children: /* @__PURE__ */ g("div", {
 		className: "EntityFinder",
 		children: [
-			/* @__PURE__ */ _(ie, {
+			/* @__PURE__ */ g(ae, {
 				sx: {
 					display: "flex",
 					justifyContent: "space-between",
@@ -88,24 +88,24 @@ function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMu
 						md: "nowrap"
 					}
 				},
-				children: [/* @__PURE__ */ _(se, {
-					value: N,
+				children: [/* @__PURE__ */ g(ce, {
+					value: M,
 					onChange: Te,
 					sx: { flex: "none" },
-					children: [/* @__PURE__ */ g(h, {
+					children: [/* @__PURE__ */ h(m, {
 						value: 0,
 						label: "Browse"
-					}), /* @__PURE__ */ g(h, {
+					}), /* @__PURE__ */ h(m, {
 						value: 1,
-						label: /* @__PURE__ */ _(oe, {
+						label: /* @__PURE__ */ g(p, {
 							direction: "row",
 							sx: {
 								gap: .5,
 								alignItems: "center"
 							},
-							children: [/* @__PURE__ */ g("span", { children: "Selected" }), /* @__PURE__ */ g(p, {
+							children: [/* @__PURE__ */ h("span", { children: "Selected" }), /* @__PURE__ */ h(oe, {
 								size: "small",
-								label: q.size.toLocaleString(),
+								label: K.size.toLocaleString(),
 								sx: {
 									backgroundColor: "tertiary.500",
 									color: "grey.900",
@@ -114,17 +114,17 @@ function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMu
 							})]
 						})
 					})]
-				}), /* @__PURE__ */ g(ce, {
+				}), /* @__PURE__ */ h(le, {
 					size: "small",
 					placeholder: "Search by name, wiki content, or SynID",
-					value: L,
+					value: I,
 					onChange: (e) => {
-						R(e.target.value);
+						L(e.target.value);
 					},
 					onKeyDown: (e) => {
 						if (e.key === "Enter") {
 							let t = e.target.value.trim();
-							I(!!t), t && (B(t.split(/\s+/)), P(0));
+							F(!!t), t && (z(t.split(/\s+/)), N(0));
 						}
 					},
 					sx: {
@@ -135,109 +135,109 @@ function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMu
 						flex: "1 1 350px"
 					},
 					slotProps: { input: {
-						startAdornment: /* @__PURE__ */ g(m, {
+						startAdornment: /* @__PURE__ */ h(f, {
 							position: "start",
-							children: /* @__PURE__ */ g(ue, {})
+							children: /* @__PURE__ */ h(de, {})
 						}),
-						endAdornment: z ? /* @__PURE__ */ g(m, {
+						endAdornment: R ? /* @__PURE__ */ h(f, {
 							position: "end",
-							children: /* @__PURE__ */ g(ae, {
+							children: /* @__PURE__ */ h(se, {
 								size: "small",
 								onClick: () => {
-									R(""), B(void 0), I(!1);
+									L(""), z(void 0), F(!1);
 								},
 								"aria-label": "Clear Search",
-								disabled: !L && !F,
-								children: /* @__PURE__ */ g(fe, {})
+								disabled: !I && !P,
+								children: /* @__PURE__ */ h(fe, {})
 							})
 						}) : void 0
 					} }
 				})]
 			}),
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ g("div", {
 				role: "tabpanel",
 				className: `EntityFinder__MainPanel ${Ee}`,
-				style: { display: N === 0 ? "block" : "none" },
-				children: [F && /* @__PURE__ */ g(a, {
-					configuration: H && H.length > 0 ? {
-						type: o.HEADER_LIST,
-						headerList: H
+				style: { display: M === 0 ? "block" : "none" },
+				children: [P && /* @__PURE__ */ h(i, {
+					configuration: V && V.length > 0 ? {
+						type: a.HEADER_LIST,
+						headerList: V
 					} : {
-						type: o.ENTITY_SEARCH,
+						type: a.ENTITY_SEARCH,
 						query: {
-							queryTerm: z,
-							booleanQuery: ge(D)
+							queryTerm: R,
+							booleanQuery: _e(E)
 						}
 					},
-					versionSelection: E,
-					selectColumnType: w ? "checkbox" : "none",
-					selected: q,
+					versionSelection: T,
+					selectColumnType: C ? "checkbox" : "none",
+					selected: K,
 					isIdSelected: Z,
 					isSelectable: Q,
-					visibleTypes: D,
-					selectableTypes: D,
-					toggleSelection: J,
-					setInitialVersion: X,
-					enableSelectAll: w,
+					visibleTypes: E,
+					selectableTypes: E,
+					toggleSelection: q,
+					setInitialVersion: Y,
+					enableSelectAll: C,
 					setCurrentContainer: void 0
-				}), /* @__PURE__ */ g("div", {
-					style: F ? { display: "none" } : {},
-					children: A ? /* @__PURE__ */ g("div", { children: /* @__PURE__ */ g(r, { children: /* @__PURE__ */ g(c, {
-						toggleSelection: J,
+				}), /* @__PURE__ */ h("div", {
+					style: P ? { display: "none" } : {},
+					children: k ? /* @__PURE__ */ h("div", { children: /* @__PURE__ */ h(r, { children: /* @__PURE__ */ h(s, {
+						toggleSelection: q,
 						showDropdown: !0,
-						visibleTypes: be,
-						initialScope: v,
-						selectedEntities: q,
-						projectId: S,
-						initialContainer: C,
-						currentContainer: W,
-						setCurrentContainer: G,
+						visibleTypes: xe,
+						initialScope: _,
+						selectedEntities: K,
+						projectId: x,
+						initialContainer: S,
+						currentContainer: U,
+						setCurrentContainer: W,
 						showScopeAsRootNode: !1,
-						treeNodeType: s.SINGLE_PANE,
-						selectableTypes: D
-					}) }) }) : /* @__PURE__ */ g("div", {
+						treeNodeType: o.SINGLE_PANE,
+						selectableTypes: E
+					}) }) }) : /* @__PURE__ */ h("div", {
 						className: "EntityFinderReflexContainer",
-						children: /* @__PURE__ */ _(pe, {
+						children: /* @__PURE__ */ g(me, {
 							orientation: "vertical",
 							windowResizeAware: !0,
 							children: [
-								/* @__PURE__ */ g(y, {
+								/* @__PURE__ */ h(v, {
 									className: "TreeViewReflexElement",
 									flex: .24,
-									children: /* @__PURE__ */ g(r, { children: /* @__PURE__ */ g(c, {
-										selectedEntities: q,
-										setDetailsViewConfiguration: ye,
+									children: /* @__PURE__ */ h(r, { children: /* @__PURE__ */ h(s, {
+										selectedEntities: K,
+										setDetailsViewConfiguration: be,
 										showDropdown: !0,
-										visibleTypes: k,
-										initialScope: v,
-										projectId: S,
-										initialContainer: C,
-										currentContainer: W,
-										setCurrentContainer: G,
-										treeNodeType: s.DUAL_PANE,
-										setBreadcrumbItems: Se,
-										selectableTypes: k
+										visibleTypes: O,
+										initialScope: _,
+										projectId: x,
+										initialContainer: S,
+										currentContainer: U,
+										setCurrentContainer: W,
+										treeNodeType: o.DUAL_PANE,
+										setBreadcrumbItems: Ce,
+										selectableTypes: O
 									}) })
 								}),
-								/* @__PURE__ */ g(me, {}),
-								/* @__PURE__ */ g(y, {
+								/* @__PURE__ */ h(he, {}),
+								/* @__PURE__ */ h(v, {
 									className: "DetailsViewReflexElement",
-									children: /* @__PURE__ */ _(r, { children: [/* @__PURE__ */ g(a, { ...$ }), /* @__PURE__ */ g(ne, { ..._e })] })
+									children: /* @__PURE__ */ g(r, { children: [/* @__PURE__ */ h(i, { ...$ }), /* @__PURE__ */ h(te, { ...ve })] })
 								})
 							]
 						})
 					})
 				})]
 			}),
-			/* @__PURE__ */ g("div", {
+			/* @__PURE__ */ h("div", {
 				role: "tabpanel",
 				className: "MainPanelSelected",
-				style: { display: N === 1 ? "block" : "none" },
-				children: /* @__PURE__ */ g(a, {
+				style: { display: M === 1 ? "block" : "none" },
+				children: /* @__PURE__ */ h(i, {
 					...$,
 					configuration: {
-						type: o.REFERENCE_LIST,
-						referenceList: Array.from(Ce.values())
+						type: a.REFERENCE_LIST,
+						referenceList: Array.from(X.values())
 					}
 				})
 			})
@@ -245,6 +245,6 @@ function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMu
 	}) });
 }
 //#endregion
-export { S as EntityFinder, S as default };
+export { x as EntityFinder, x as default };
 
 //# sourceMappingURL=EntityFinder.js.map

package/dist/components/EntityFinder/EntityFinder.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityFinder.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinder.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { getEntityTypeFromHeader } from '@/utils/functions/EntityTypeUtils'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\nimport ClearIcon from '@mui/icons-material/Clear'\nimport SearchIcon from '@mui/icons-material/Search'\nimport {\n  Box,\n  Chip,\n  IconButton,\n  InputAdornment,\n  Stack,\n  Tab,\n  Tabs,\n  TextField,\n} from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { KeyValue, Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { ReflexContainer, ReflexElement, ReflexSplitter } from 'react-reflex'\nimport 'react-reflex/styles.css'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { BreadcrumbItem, Breadcrumbs, BreadcrumbsProps } from './Breadcrumbs'\nimport {\n  EntityDetailsList,\n  EntityDetailsListDataConfiguration,\n  EntityDetailsListDataConfigurationType,\n  EntityDetailsListProps,\n} from './details/EntityDetailsList'\nimport { EntityFinderHeader } from './EntityFinderHeader'\nimport { EntityTree, EntityTreeContainer, FinderScope } from './tree/EntityTree'\nimport { EntityTreeNodeType } from './tree/VirtualizedTree'\nimport { useEntitySelection } from './useEntitySelection'\nimport { VersionSelectionType } from './VersionSelectionType'\n\nconst DEFAULT_SELECTABLE_TYPES = Object.values(EntityType)\nconst TABLE_DEFAULT_VISIBLE_TYPES = Object.values(EntityType)\nconst TREE_DEFAULT_VISIBLE_TYPES = [EntityType.project, EntityType.folder]\n\nconst searchForOnlyTypesBooleanQuery = (\n  entityTypes: EntityType[],\n): KeyValue[] => {\n  // Boolean query terms will be combined with AND, and there's no way to OR.\n  // So we will negate searching for all omitted types.\n  const allTypes = Object.values(EntityType)\n  const typesToOmit = allTypes.filter(type => !entityTypes.includes(type))\n  return typesToOmit.map(type => ({\n    key: 'node_type',\n    value: type.toString(),\n    not: true,\n  }))\n}\n\nexport type EntityFinderProps = {\n  /** Whether it is possible to select multiple entities */\n  selectMultiple: boolean\n  /** Callback invoked when the selection changes */\n  onSelectedChange: (selected: Reference[]) => void\n  /** The initial appearance of the entity finder. Possible values include \"Current Project\", \"All Projects\", \"Projects Created By Me\", \"My Favorites\" */\n  initialScope: FinderScope\n  /** The SynID of the 'Current Project'. If this is not a defined, then the scope cannot be \"Current Project\" */\n  projectId?: string\n  /** The SynID of the entity that should open by default. If this is a Syn ID, then it must be in the project specified in `projectId` */\n  initialContainer: string | 'root' | null\n  /** Determines if versions are selectable, and if so, how they should be shown. Default is \"TRACKED\" */\n  versionSelection?: VersionSelectionType\n  /** The entity types to show in the details view (right pane). Any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInList?: EntityType[]\n  /** The entity types that may be selected. Types in `visibleTypesInList` that are not in `selectableTypes` will appear as disabled options. Only the types in `selectableTypes` will appear in search */\n  selectableTypes?: EntityType[]\n  /** The types to show in the tree used to navigate. If `treeOnly` is true, any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInTree?: EntityType[]\n  /** Whether to show only the tree. If `true`, the tree will be used to make selections */\n  treeOnly?: boolean\n  /** If provided, the initial selection will be set to this list of references. The selection will be reset to this value if this object changes, so it should be memoized. */\n  initialSelected?: Reference[]\n}\n\nenum EntityFinderTab {\n  BROWSE,\n  SELECTED,\n}\n\nexport function EntityFinder({\n  initialScope,\n  projectId,\n  initialContainer = null,\n  selectMultiple,\n  onSelectedChange,\n  versionSelection = VersionSelectionType.TRACKED,\n  selectableTypes = DEFAULT_SELECTABLE_TYPES,\n  visibleTypesInList = TABLE_DEFAULT_VISIBLE_TYPES,\n  visibleTypesInTree = TREE_DEFAULT_VISIBLE_TYPES,\n  treeOnly = false,\n  initialSelected,\n}: EntityFinderProps): React.ReactNode {\n  const { accessToken } = useSynapseContext()\n  const [currentTab, setCurrentTab] = React.useState(EntityFinderTab.BROWSE)\n\n  const [searchActive, setSearchActive] = useState(false)\n  // The raw value of the search input box:\n  const [searchInput, setSearchInput] = useState<string>('')\n  // The \"parsed\" search terms, which are only calculated when Enter is pressed:\n  const [searchTerms, setSearchTerms] = useState<string[]>()\n  const [breadcrumbsProps, setBreadcrumbsProps] = useState<BreadcrumbsProps>({\n    items: [],\n  })\n  const [searchByIdResults, setSearchByIdResults] = useState<\n    EntityFinderHeader[]\n  >([])\n  const [configFromTreeView, setConfigFromTreeView] =\n    useState<EntityDetailsListDataConfiguration>({\n      type: EntityDetailsListDataConfigurationType.PROMPT,\n    })\n\n  // If a type is selectable, it should be visible in the tree/list (depending on treeOnly)\n  const selectableAndVisibleTypesInTree = useMemo(\n    () => [...visibleTypesInTree, ...selectableTypes],\n    [visibleTypesInTree, selectableTypes],\n  )\n  const selectableAndVisibleTypesInList = useMemo(\n    () => [...visibleTypesInList, ...selectableTypes],\n    [visibleTypesInList, selectableTypes],\n  )\n\n  // For dual-pane, this state variable indicates which container is selected in the tree view and should be shown in the table view\n  const [currentContainer, setCurrentContainer] =\n    useState<EntityTreeContainer>(initialContainer)\n\n  const handleError = useErrorHandler()\n\n  const setBreadcrumbs = useCallback(\n    (items: BreadcrumbItem[]) => {\n      setBreadcrumbsProps({\n        items,\n      })\n    },\n    [setBreadcrumbsProps],\n  )\n\n  const { selectedEntities, toggleSelection, setSelection, setInitialVersion } =\n    useEntitySelection(selectMultiple)\n\n  useEffect(() => {\n    if (initialSelected) {\n      let map = Map<string, Reference>()\n      map = map.withMutations(mutableMap => {\n        initialSelected.forEach(reference => {\n          mutableMap.set(reference.targetId, reference)\n        })\n      })\n\n      setSelection(map)\n    }\n  }, [initialSelected, setSelection])\n\n  // A snapshot of the selectedEntities used to populate the selection list, allowing deselection of entities without removing them from the list.\n  const [selectedEntitiesSnapshot, setSelectedEntitiesSnapshot] =\n    useState(selectedEntities)\n\n  const isIdSelected = useCallback(\n    (entity: EntityFinderHeader) => {\n      return selectedEntities.has(entity.id)\n    },\n    [selectedEntities],\n  )\n\n  const isSelectable = useCallback(\n    (entity: EntityFinderHeader) => {\n      const type = getEntityTypeFromHeader(entity)\n      return selectableTypes.includes(type)\n    },\n    [selectableTypes],\n  )\n\n  useEffect(() => {\n    // When it changes, convert the map of selected items to a list of references and invoke the callback\n    onSelectedChange(Array.from(selectedEntities.values()))\n  }, [selectedEntities, onSelectedChange])\n\n  useEffect(() => {\n    if (searchTerms?.length === 1) {\n      const searchTermReference = parseSynId(searchTerms[0])\n      if (searchTermReference) {\n        SynapseClient.getEntityHeaders([searchTermReference], accessToken)\n          .then(response => {\n            setSearchByIdResults(response.results)\n          })\n          .catch(e => handleError(e))\n      }\n    } else {\n      setSearchByIdResults([])\n    }\n  }, [accessToken, searchTerms, handleError])\n\n  const handleTabChange = (\n    _event: React.SyntheticEvent,\n    newValue: EntityFinderTab,\n  ) => {\n    setSelectedEntitiesSnapshot(selectedEntities)\n    setCurrentTab(newValue)\n  }\n\n  const mainPanelClass = searchActive\n    ? 'MainPanelSearch'\n    : treeOnly\n      ? 'MainPanelSinglePane'\n      : 'MainPanelDualPane'\n\n  const entityDetailsListProps: EntityDetailsListProps = {\n    configuration: configFromTreeView,\n    versionSelection: versionSelection,\n    selected: selectedEntities,\n    isIdSelected: isIdSelected,\n    isSelectable: isSelectable,\n    visibleTypes: selectableAndVisibleTypesInList,\n    selectableTypes: selectableTypes,\n    selectColumnType: selectMultiple ? 'checkbox' : 'none',\n    toggleSelection: toggleSelection,\n    setInitialVersion: setInitialVersion,\n    enableSelectAll: selectMultiple,\n    setCurrentContainer: setCurrentContainer,\n  }\n\n  return (\n    <SynapseErrorBoundary>\n      <div className=\"EntityFinder\">\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            mb: 2.5,\n            rowGap: 2,\n            columnGap: 4,\n            flexWrap: { xs: 'wrap', md: 'nowrap' },\n          }}\n        >\n          <Tabs\n            value={currentTab}\n            onChange={handleTabChange}\n            sx={{ flex: 'none' }}\n          >\n            <Tab value={EntityFinderTab.BROWSE} label={'Browse'}></Tab>\n            <Tab\n              value={EntityFinderTab.SELECTED}\n              label={\n                <Stack\n                  direction={'row'}\n                  sx={{\n                    gap: 0.5,\n                    alignItems: 'center',\n                  }}\n                >\n                  <span>Selected</span>\n                  <Chip\n                    size={'small'}\n                    label={selectedEntities.size.toLocaleString()}\n                    sx={{\n                      backgroundColor: 'tertiary.500',\n                      color: 'grey.900',\n                      height: '21px',\n                    }}\n                  ></Chip>\n                </Stack>\n              }\n            ></Tab>\n          </Tabs>\n          <TextField\n            size={'small'}\n            placeholder=\"Search by name, wiki content, or SynID\"\n            value={searchInput}\n            onChange={event => {\n              setSearchInput(event.target.value)\n            }}\n            onKeyDown={(event: any) => {\n              if (event.key === 'Enter') {\n                const trimmedInput = event.target.value.trim()\n                setSearchActive(!!trimmedInput)\n                if (trimmedInput) {\n                  setSearchTerms(trimmedInput.split(/\\s+/))\n                  setCurrentTab(EntityFinderTab.BROWSE)\n                }\n              }\n            }}\n            sx={{\n              maxWidth: { xs: '100%', md: '350px' },\n              flex: '1 1 350px',\n            }}\n            slotProps={{\n              input: {\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <SearchIcon />\n                  </InputAdornment>\n                ),\n                endAdornment: searchTerms ? (\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size={'small'}\n                      onClick={() => {\n                        setSearchInput('')\n                        setSearchTerms(undefined)\n                        setSearchActive(false)\n                      }}\n                      aria-label=\"Clear Search\"\n                      disabled={!searchInput && !searchActive}\n                    >\n                      <ClearIcon />\n                    </IconButton>\n                  </InputAdornment>\n                ) : undefined,\n              },\n            }}\n          />\n        </Box>\n        <div\n          role={'tabpanel'}\n          className={`EntityFinder__MainPanel ${mainPanelClass}`}\n          style={{\n            display: currentTab === EntityFinderTab.BROWSE ? 'block' : 'none',\n          }}\n        >\n          {/* We have a separate Details component for search in order to preserve state in the other component between searches */}\n          {searchActive && (\n            <EntityDetailsList\n              configuration={\n                searchByIdResults && searchByIdResults.length > 0\n                  ? {\n                      type: EntityDetailsListDataConfigurationType.HEADER_LIST,\n                      headerList: searchByIdResults,\n                    }\n                  : {\n                      type: EntityDetailsListDataConfigurationType.ENTITY_SEARCH,\n                      query: {\n                        queryTerm: searchTerms,\n                        booleanQuery:\n                          searchForOnlyTypesBooleanQuery(selectableTypes),\n                      },\n                    }\n              }\n              versionSelection={versionSelection}\n              selectColumnType={selectMultiple ? 'checkbox' : 'none'}\n              selected={selectedEntities}\n              isIdSelected={isIdSelected}\n              isSelectable={isSelectable}\n              visibleTypes={selectableTypes}\n              selectableTypes={selectableTypes}\n              toggleSelection={toggleSelection}\n              setInitialVersion={setInitialVersion}\n              enableSelectAll={selectMultiple}\n              // Intentionally do not pass \"setCurrentContainer\" -- search does not use the tree so it has nothing to update\n              setCurrentContainer={undefined}\n            />\n          )}\n          {\n            <div style={searchActive ? { display: 'none' } : {}}>\n              {treeOnly ? (\n                <div>\n                  <SynapseErrorBoundary>\n                    <EntityTree\n                      toggleSelection={toggleSelection}\n                      showDropdown={true}\n                      visibleTypes={selectableAndVisibleTypesInTree}\n                      initialScope={initialScope}\n                      selectedEntities={selectedEntities}\n                      projectId={projectId}\n                      initialContainer={initialContainer}\n                      currentContainer={currentContainer}\n                      setCurrentContainer={setCurrentContainer}\n                      showScopeAsRootNode={false}\n                      treeNodeType={EntityTreeNodeType.SINGLE_PANE}\n                      selectableTypes={selectableTypes}\n                    />\n                  </SynapseErrorBoundary>\n                </div>\n              ) : (\n                <div className=\"EntityFinderReflexContainer\">\n                  <ReflexContainer orientation=\"vertical\" windowResizeAware>\n                    <ReflexElement\n                      className=\"TreeViewReflexElement\"\n                      flex={0.24}\n                    >\n                      <SynapseErrorBoundary>\n                        <EntityTree\n                          selectedEntities={selectedEntities}\n                          setDetailsViewConfiguration={setConfigFromTreeView}\n                          showDropdown={true}\n                          visibleTypes={visibleTypesInTree}\n                          initialScope={initialScope}\n                          projectId={projectId}\n                          initialContainer={initialContainer}\n                          currentContainer={currentContainer}\n                          setCurrentContainer={setCurrentContainer}\n                          treeNodeType={EntityTreeNodeType.DUAL_PANE}\n                          setBreadcrumbItems={setBreadcrumbs}\n                          selectableTypes={visibleTypesInTree}\n                        />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                    <ReflexSplitter></ReflexSplitter>\n                    <ReflexElement className=\"DetailsViewReflexElement\">\n                      <SynapseErrorBoundary>\n                        <EntityDetailsList {...entityDetailsListProps} />\n                        <Breadcrumbs {...breadcrumbsProps} />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                  </ReflexContainer>\n                </div>\n              )}\n            </div>\n          }\n        </div>\n        <div\n          role={'tabpanel'}\n          className={'MainPanelSelected'}\n          style={{\n            display: currentTab === EntityFinderTab.SELECTED ? 'block' : 'none',\n          }}\n        >\n          <EntityDetailsList\n            {...entityDetailsListProps}\n            configuration={{\n              type: EntityDetailsListDataConfigurationType.REFERENCE_LIST,\n              referenceList: Array.from(selectedEntitiesSnapshot.values()),\n            }}\n          />\n        </div>\n      </div>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default EntityFinder\n"],"mappings":"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"}
+{"version":3,"file":"EntityFinder.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinder.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { getEntityTypeFromHeader } from '@/utils/functions/EntityTypeUtils'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\nimport ClearIcon from '@mui/icons-material/Clear'\nimport SearchIcon from '@mui/icons-material/Search'\nimport {\n  Box,\n  Chip,\n  IconButton,\n  InputAdornment,\n  Stack,\n  Tab,\n  Tabs,\n  TextField,\n} from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { KeyValue, Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { ReflexContainer, ReflexElement, ReflexSplitter } from 'react-reflex'\nimport 'react-reflex/styles.css'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { BreadcrumbItem, Breadcrumbs, BreadcrumbsProps } from './Breadcrumbs'\nimport {\n  EntityDetailsList,\n  EntityDetailsListDataConfiguration,\n  EntityDetailsListDataConfigurationType,\n  EntityDetailsListProps,\n} from './details/EntityDetailsList'\nimport { EntityFinderHeader } from './EntityFinderHeader'\nimport { EntityTree, EntityTreeContainer, FinderScope } from './tree/EntityTree'\nimport { EntityTreeNodeType } from './tree/VirtualizedTree'\nimport { useEntitySelection } from './useEntitySelection'\nimport { VersionSelectionType } from './VersionSelectionType'\n\nconst DEFAULT_SELECTABLE_TYPES = Object.values(EntityType)\nconst TABLE_DEFAULT_VISIBLE_TYPES = Object.values(EntityType)\nconst TREE_DEFAULT_VISIBLE_TYPES = [EntityType.project, EntityType.folder]\n\nconst searchForOnlyTypesBooleanQuery = (\n  entityTypes: EntityType[],\n): KeyValue[] => {\n  // Boolean query terms will be combined with AND, and there's no way to OR.\n  // So we will negate searching for all omitted types.\n  const allTypes = Object.values(EntityType)\n  const typesToOmit = allTypes.filter(type => !entityTypes.includes(type))\n  return typesToOmit.map(type => ({\n    key: 'node_type',\n    value: type.toString(),\n    not: true,\n  }))\n}\n\nexport type EntityFinderProps = {\n  /** Whether it is possible to select multiple entities */\n  selectMultiple: boolean\n  /** Callback invoked when the selection changes */\n  onSelectedChange: (selected: Reference[]) => void\n  /** The initial appearance of the entity finder. Possible values include \"Current Project\", \"All Projects\", \"Projects Created By Me\", \"My Favorites\" */\n  initialScope: FinderScope\n  /** The SynID of the 'Current Project'. If this is not a defined, then the scope cannot be \"Current Project\" */\n  projectId?: string\n  /** The SynID of the entity that should open by default. If this is a Syn ID, then it must be in the project specified in `projectId` */\n  initialContainer: string | 'root' | null\n  /** Determines if versions are selectable, and if so, how they should be shown. Default is \"TRACKED\" */\n  versionSelection?: VersionSelectionType\n  /** The entity types to show in the details view (right pane). Any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInList?: EntityType[]\n  /** The entity types that may be selected. Types in `visibleTypesInList` that are not in `selectableTypes` will appear as disabled options. Only the types in `selectableTypes` will appear in search */\n  selectableTypes?: EntityType[]\n  /** The types to show in the tree used to navigate. If `treeOnly` is true, any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInTree?: EntityType[]\n  /** Whether to show only the tree. If `true`, the tree will be used to make selections */\n  treeOnly?: boolean\n  /** If provided, the initial selection will be set to this list of references. The selection will be reset to this value if this object changes, so it should be memoized. */\n  initialSelected?: Reference[]\n}\n\nenum EntityFinderTab {\n  BROWSE,\n  SELECTED,\n}\n\nexport function EntityFinder({\n  initialScope,\n  projectId,\n  initialContainer = null,\n  selectMultiple,\n  onSelectedChange,\n  versionSelection = VersionSelectionType.TRACKED,\n  selectableTypes = DEFAULT_SELECTABLE_TYPES,\n  visibleTypesInList = TABLE_DEFAULT_VISIBLE_TYPES,\n  visibleTypesInTree = TREE_DEFAULT_VISIBLE_TYPES,\n  treeOnly = false,\n  initialSelected,\n}: EntityFinderProps): React.ReactNode {\n  const { accessToken } = useSynapseContext()\n  const [currentTab, setCurrentTab] = React.useState(EntityFinderTab.BROWSE)\n\n  const [searchActive, setSearchActive] = useState(false)\n  // The raw value of the search input box:\n  const [searchInput, setSearchInput] = useState<string>('')\n  // The \"parsed\" search terms, which are only calculated when Enter is pressed:\n  const [searchTerms, setSearchTerms] = useState<string[]>()\n  const [breadcrumbsProps, setBreadcrumbsProps] = useState<BreadcrumbsProps>({\n    items: [],\n  })\n  const [searchByIdResults, setSearchByIdResults] = useState<\n    EntityFinderHeader[]\n  >([])\n  const [configFromTreeView, setConfigFromTreeView] =\n    useState<EntityDetailsListDataConfiguration>({\n      type: EntityDetailsListDataConfigurationType.PROMPT,\n    })\n\n  // If a type is selectable, it should be visible in the tree/list (depending on treeOnly)\n  const selectableAndVisibleTypesInTree = useMemo(\n    () => [...visibleTypesInTree, ...selectableTypes],\n    [visibleTypesInTree, selectableTypes],\n  )\n  const selectableAndVisibleTypesInList = useMemo(\n    () => [...visibleTypesInList, ...selectableTypes],\n    [visibleTypesInList, selectableTypes],\n  )\n\n  // For dual-pane, this state variable indicates which container is selected in the tree view and should be shown in the table view\n  const [currentContainer, setCurrentContainer] =\n    useState<EntityTreeContainer>(initialContainer)\n\n  const handleError = useErrorHandler()\n\n  const setBreadcrumbs = useCallback(\n    (items: BreadcrumbItem[]) => {\n      setBreadcrumbsProps({\n        items,\n      })\n    },\n    [setBreadcrumbsProps],\n  )\n\n  const { selectedEntities, toggleSelection, setSelection, setInitialVersion } =\n    useEntitySelection(selectMultiple)\n\n  useEffect(() => {\n    if (initialSelected) {\n      let map = Map<string, Reference>()\n      map = map.withMutations(mutableMap => {\n        initialSelected.forEach(reference => {\n          mutableMap.set(reference.targetId, reference)\n        })\n      })\n\n      setSelection(map)\n    }\n  }, [initialSelected, setSelection])\n\n  // A snapshot of the selectedEntities used to populate the selection list, allowing deselection of entities without removing them from the list.\n  const [selectedEntitiesSnapshot, setSelectedEntitiesSnapshot] =\n    useState(selectedEntities)\n\n  const isIdSelected = useCallback(\n    (entity: EntityFinderHeader) => {\n      return selectedEntities.has(entity.id)\n    },\n    [selectedEntities],\n  )\n\n  const isSelectable = useCallback(\n    (entity: EntityFinderHeader) => {\n      const type = getEntityTypeFromHeader(entity)\n      return selectableTypes.includes(type)\n    },\n    [selectableTypes],\n  )\n\n  useEffect(() => {\n    // When it changes, convert the map of selected items to a list of references and invoke the callback\n    onSelectedChange(Array.from(selectedEntities.values()))\n  }, [selectedEntities, onSelectedChange])\n\n  useEffect(() => {\n    if (searchTerms?.length === 1) {\n      const searchTermReference = parseSynId(searchTerms[0])\n      if (searchTermReference) {\n        SynapseClient.getEntityHeaders([searchTermReference], accessToken)\n          .then(response => {\n            setSearchByIdResults(response.results)\n          })\n          .catch(e => handleError(e))\n      }\n    } else {\n      setSearchByIdResults([])\n    }\n  }, [accessToken, searchTerms, handleError])\n\n  const handleTabChange = (\n    _event: React.SyntheticEvent,\n    newValue: EntityFinderTab,\n  ) => {\n    setSelectedEntitiesSnapshot(selectedEntities)\n    setCurrentTab(newValue)\n  }\n\n  const mainPanelClass = searchActive\n    ? 'MainPanelSearch'\n    : treeOnly\n      ? 'MainPanelSinglePane'\n      : 'MainPanelDualPane'\n\n  const entityDetailsListProps: EntityDetailsListProps = {\n    configuration: configFromTreeView,\n    versionSelection: versionSelection,\n    selected: selectedEntities,\n    isIdSelected: isIdSelected,\n    isSelectable: isSelectable,\n    visibleTypes: selectableAndVisibleTypesInList,\n    selectableTypes: selectableTypes,\n    selectColumnType: selectMultiple ? 'checkbox' : 'none',\n    toggleSelection: toggleSelection,\n    setInitialVersion: setInitialVersion,\n    enableSelectAll: selectMultiple,\n    setCurrentContainer: setCurrentContainer,\n  }\n\n  return (\n    <SynapseErrorBoundary>\n      <div className=\"EntityFinder\">\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            mb: 2.5,\n            rowGap: 2,\n            columnGap: 4,\n            flexWrap: { xs: 'wrap', md: 'nowrap' },\n          }}\n        >\n          <Tabs\n            value={currentTab}\n            onChange={handleTabChange}\n            sx={{ flex: 'none' }}\n          >\n            <Tab value={EntityFinderTab.BROWSE} label={'Browse'}></Tab>\n            <Tab\n              value={EntityFinderTab.SELECTED}\n              label={\n                <Stack\n                  direction={'row'}\n                  sx={{\n                    gap: 0.5,\n                    alignItems: 'center',\n                  }}\n                >\n                  <span>Selected</span>\n                  <Chip\n                    size={'small'}\n                    label={selectedEntities.size.toLocaleString()}\n                    sx={{\n                      backgroundColor: 'tertiary.500',\n                      color: 'grey.900',\n                      height: '21px',\n                    }}\n                  ></Chip>\n                </Stack>\n              }\n            ></Tab>\n          </Tabs>\n          <TextField\n            size={'small'}\n            placeholder=\"Search by name, wiki content, or SynID\"\n            value={searchInput}\n            onChange={event => {\n              setSearchInput(event.target.value)\n            }}\n            onKeyDown={(event: any) => {\n              if (event.key === 'Enter') {\n                const trimmedInput = event.target.value.trim()\n                setSearchActive(!!trimmedInput)\n                if (trimmedInput) {\n                  setSearchTerms(trimmedInput.split(/\\s+/))\n                  setCurrentTab(EntityFinderTab.BROWSE)\n                }\n              }\n            }}\n            sx={{\n              maxWidth: { xs: '100%', md: '350px' },\n              flex: '1 1 350px',\n            }}\n            slotProps={{\n              input: {\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <SearchIcon />\n                  </InputAdornment>\n                ),\n                endAdornment: searchTerms ? (\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size={'small'}\n                      onClick={() => {\n                        setSearchInput('')\n                        setSearchTerms(undefined)\n                        setSearchActive(false)\n                      }}\n                      aria-label=\"Clear Search\"\n                      disabled={!searchInput && !searchActive}\n                    >\n                      <ClearIcon />\n                    </IconButton>\n                  </InputAdornment>\n                ) : undefined,\n              },\n            }}\n          />\n        </Box>\n        <div\n          role={'tabpanel'}\n          className={`EntityFinder__MainPanel ${mainPanelClass}`}\n          style={{\n            display: currentTab === EntityFinderTab.BROWSE ? 'block' : 'none',\n          }}\n        >\n          {/* We have a separate Details component for search in order to preserve state in the other component between searches */}\n          {searchActive && (\n            <EntityDetailsList\n              configuration={\n                searchByIdResults && searchByIdResults.length > 0\n                  ? {\n                      type: EntityDetailsListDataConfigurationType.HEADER_LIST,\n                      headerList: searchByIdResults,\n                    }\n                  : {\n                      type: EntityDetailsListDataConfigurationType.ENTITY_SEARCH,\n                      query: {\n                        queryTerm: searchTerms,\n                        booleanQuery:\n                          searchForOnlyTypesBooleanQuery(selectableTypes),\n                      },\n                    }\n              }\n              versionSelection={versionSelection}\n              selectColumnType={selectMultiple ? 'checkbox' : 'none'}\n              selected={selectedEntities}\n              isIdSelected={isIdSelected}\n              isSelectable={isSelectable}\n              visibleTypes={selectableTypes}\n              selectableTypes={selectableTypes}\n              toggleSelection={toggleSelection}\n              setInitialVersion={setInitialVersion}\n              enableSelectAll={selectMultiple}\n              // Intentionally do not pass \"setCurrentContainer\" -- search does not use the tree so it has nothing to update\n              setCurrentContainer={undefined}\n            />\n          )}\n          {\n            <div style={searchActive ? { display: 'none' } : {}}>\n              {treeOnly ? (\n                <div>\n                  <SynapseErrorBoundary>\n                    <EntityTree\n                      toggleSelection={toggleSelection}\n                      showDropdown={true}\n                      visibleTypes={selectableAndVisibleTypesInTree}\n                      initialScope={initialScope}\n                      selectedEntities={selectedEntities}\n                      projectId={projectId}\n                      initialContainer={initialContainer}\n                      currentContainer={currentContainer}\n                      setCurrentContainer={setCurrentContainer}\n                      showScopeAsRootNode={false}\n                      treeNodeType={EntityTreeNodeType.SINGLE_PANE}\n                      selectableTypes={selectableTypes}\n                    />\n                  </SynapseErrorBoundary>\n                </div>\n              ) : (\n                <div className=\"EntityFinderReflexContainer\">\n                  <ReflexContainer orientation=\"vertical\" windowResizeAware>\n                    <ReflexElement\n                      className=\"TreeViewReflexElement\"\n                      flex={0.24}\n                    >\n                      <SynapseErrorBoundary>\n                        <EntityTree\n                          selectedEntities={selectedEntities}\n                          setDetailsViewConfiguration={setConfigFromTreeView}\n                          showDropdown={true}\n                          visibleTypes={visibleTypesInTree}\n                          initialScope={initialScope}\n                          projectId={projectId}\n                          initialContainer={initialContainer}\n                          currentContainer={currentContainer}\n                          setCurrentContainer={setCurrentContainer}\n                          treeNodeType={EntityTreeNodeType.DUAL_PANE}\n                          setBreadcrumbItems={setBreadcrumbs}\n                          selectableTypes={visibleTypesInTree}\n                        />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                    <ReflexSplitter></ReflexSplitter>\n                    <ReflexElement className=\"DetailsViewReflexElement\">\n                      <SynapseErrorBoundary>\n                        <EntityDetailsList {...entityDetailsListProps} />\n                        <Breadcrumbs {...breadcrumbsProps} />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                  </ReflexContainer>\n                </div>\n              )}\n            </div>\n          }\n        </div>\n        <div\n          role={'tabpanel'}\n          className={'MainPanelSelected'}\n          style={{\n            display: currentTab === EntityFinderTab.SELECTED ? 'block' : 'none',\n          }}\n        >\n          <EntityDetailsList\n            {...entityDetailsListProps}\n            configuration={{\n              type: EntityDetailsListDataConfigurationType.REFERENCE_LIST,\n              referenceList: Array.from(selectedEntitiesSnapshot.values()),\n            }}\n          />\n        </div>\n      </div>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default EntityFinder\n"],"mappings":"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"}