@gen3/frontend 0.11.31 → 0.11.33

package/dist/esm/index.js

@@ -1,26 +1,26 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { createContext, useState, useMemo, useEffect, useRef, useCallback, useContext, createElement, forwardRef, useReducer } from 'react';
-import { useUserAuth, useCoreSelector, selectUserDetails, useGetAuthzMappingsQuery, fetchFence, isFetchError, WorkspaceStatus, useGetWorkspaceStatusQuery, useGetWorkspacePayModelsQuery, useTerminateWorkspaceMutation, selectRequestedWorkspaceStatus, selectRequestedWorkspaceStatusTimestamp, useCoreDispatch, setActiveWorkspaceStatus, RequestedWorkspaceStatus, setRequestedWorkspaceStatus, isTimeGreaterThan, useGetCSRFQuery, useLazyFetchUserDetailsQuery, selectUserAuthStatus, GEN3_REDIRECT_URL, GEN3_FENCE_API, showModal, Modals, isAuthenticated, useGetLoginProvidersQuery, hideModal, selectCurrentModal, fieldNameToTitle, isOperationWithField, extractEnumFilterValue, selectIndexedFilterByName, selectShouldShareFilters, selectSharedFilters, updateCohortFilter as updateCohortFilter$1, isOperatorWithFieldAndArrayOfOperands, isUnion, removeCohortFilter as removeCohortFilter$1, trimFirstFieldNameToTitle, selectAllCohortFiltersCollapsed, Accessibility, toggleCohortBuilderAllFilters, setShouldShareFilters, useIsUserLoggedIn, GEN3_DOMAIN, useDataLibrary, DataLibraryStoreMode, buildListItemsGroupedByDataset, extractFileDatasetsInRecords, useGetMDSQuery, selectAuthzMappingData, useGetAggMDSQuery, useAskQuestionMutation, useGetIndexAggMDSQuery, useGetTagsQuery, useGetRawDataAndTotalCountsQuery, selectIndexFilters, isJSONValue, downloadFromGuppyToBlob, downloadJSONDataFromGuppy, toggleCohortBuilderCategoryFilter, selectCohortFilterExpanded, setCohortFilterCombineMode, selectCohortFilterCombineMode, selectCohortFilters, setCohortFilter as setCohortFilter$1, clearCohortFilters as clearCohortFilters$1, handleOperation, selectAvailableCohorts, selectCurrentCohortId as selectCurrentCohortId$1, selectCurrentCohortModified, selectCurrentCohortSaved, setCohortIndexFilters, setCurrentCohortId as setCurrentCohortId$1, selectCurrentCohortName as selectCurrentCohortName$1, useGetAggsQuery, isIntersection, useGetCountsQuery, selectAllCohorts as selectAllCohorts$1, selectCurrentCohort as selectCurrentCohort$1, isIndexedFilterSetEmpty, removeCohort as removeCohort$1, updateCohortName as updateCohortName$1, createNewCohort as createNewCohort$1, duplicateCohort, setSharedFilters, usePrevious, selectHeadersWithCSRFToken, GEN3_GUPPY_API, useLaunchWorkspaceMutation, selectActiveWorkspaceStatus, isFetchBaseQueryError, setActiveWorkspace, getCurrentTimestamp, selectWorkspaceStatusFromService, selectActiveWorkspaceId, useGetWorkspaceOptionsQuery, GEN3_WORKSPACE_API, useGetExternalLoginsQuery, useSetCurrentPayModelMutation, PodStatus, PodConditionType, isWorkspaceRunningOrStopping, GEN3_API, GEN3_COMMONS_NAME, CohortStorage, createAppStore, getRemoteSupportServiceRegistry, isHttpStatusError, MissingServiceConfigurationError, useLazyGetAggsQuery, useCreateRequestMutation, buildGetAggregationQuery, processHistogramResponse, roundHistogramResponse, selectCSRFToken, useUserRequestQuery, getGen3AppId, createGen3AppWithOwnStore, useGeneralGQLQuery, createAppApiForRTKQ, useGetDictionaryQuery, useGetMetadataByIdQuery, createGen3App, CoreProvider, fetchJSONDataFromURL, HttpMethod, groupSharedFields, useGetCredentialsQuery, useRemoveCredentialMutation, useAddNewCredentialMutation, useGetProjectsDetailsQuery, useGetSubmissionsQuery, isCohortItem, isFileItem, fetchFencePresignedURL, HTTPError, getFederatedLoginStatus, queryMultipleMDSRecords, GEN3_MANIFEST_API, extractIndexFromDataLibraryCohort, isFilterSet, getNumberOfItemsInDatalist, isAdditionalDataItem, useLazyGetCrosswalkDataQuery, useLazyGetCountsQuery } from '@gen3/core';
-import { LoadingOverlay, Card, Group, Avatar, Text, Checkbox, Stack, Center, Loader, Tooltip, UnstyledButton, ThemeIcon, Box, Select, Button, Divider, Textarea, FileButton, Anchor, Modal, Grid, Table, ColorSwatch, useMantineTheme, Accordion, Switch, SegmentedControl as SegmentedControl$1, ActionIcon, Badge, TextInput, NumberInput, RangeSlider, MultiSelect, Tabs, SimpleGrid, Highlight, MantineProvider, Flex, Menu, Alert, Drawer, CopyButton, factory, useProps, getStyleObject, Paper, useCombobox, Combobox, ScrollArea, Autocomplete, Title, Transition, rem, Stepper, Spoiler, Image as Image$1, NavLink, List, createTheme, Pagination, FileInput, CloseButton } from '@mantine/core';
+import React__default, { createContext, useState, useMemo, useEffect, useRef, useCallback, useContext, createElement, forwardRef, useLayoutEffect, useReducer } from 'react';
+import { useUserAuth, useCoreSelector, selectUserDetails, useGetAuthzMappingsQuery, fetchFence, isFetchError, WorkspaceStatus, useGetWorkspaceStatusQuery, useGetWorkspacePayModelsQuery, useTerminateWorkspaceMutation, selectRequestedWorkspaceStatus, selectRequestedWorkspaceStatusTimestamp, useCoreDispatch, setActiveWorkspaceStatus, RequestedWorkspaceStatus, setRequestedWorkspaceStatus, isTimeGreaterThan as isTimeGreaterThan$1, useGetCSRFQuery, useLazyFetchUserDetailsQuery, selectUserAuthStatus, GEN3_REDIRECT_URL, GEN3_FENCE_API, showModal, Modals, isAuthenticated, useGetLoginProvidersQuery, hideModal, selectCurrentModal, fieldNameToTitle, isOperationWithField, extractEnumFilterValue, selectIndexedFilterByName, selectShouldShareFilters, selectSharedFilters, updateCohortFilter as updateCohortFilter$1, isOperatorWithFieldAndArrayOfOperands, isUnion, removeCohortFilter as removeCohortFilter$1, trimFirstFieldNameToTitle, selectAllCohortFiltersCollapsed, Accessibility, toggleCohortBuilderAllFilters, setShouldShareFilters, useIsUserLoggedIn, GEN3_DOMAIN, useDataLibrary, DataLibraryStoreMode, buildListItemsGroupedByDataset, extractFileDatasetsInRecords, useGetMDSQuery, selectAuthzMappingData, useGetAggMDSQuery, useAskQuestionMutation, useGetIndexAggMDSQuery, useGetTagsQuery, ExtractValueFromObject, useGetRawDataAndTotalCountsQuery, humanify, selectIndexFilters, isJSONValue, downloadFromGuppyToBlob, downloadJSONDataFromGuppy, toggleCohortBuilderCategoryFilter, selectCohortFilterExpanded, setCohortFilterCombineMode, selectCohortFilterCombineMode, selectCohortFilters, setCohortFilter as setCohortFilter$1, clearCohortFilters as clearCohortFilters$1, handleOperation, selectAvailableCohorts, selectCurrentCohortId as selectCurrentCohortId$1, selectCurrentCohortModified, selectCurrentCohortSaved, setCohortIndexFilters, setCurrentCohortId as setCurrentCohortId$1, selectCurrentCohortName as selectCurrentCohortName$1, useGetAggsQuery, isIntersection, useGetCountsQuery, selectAllCohorts as selectAllCohorts$1, selectCurrentCohort as selectCurrentCohort$1, isIndexedFilterSetEmpty, removeCohort as removeCohort$1, updateCohortName as updateCohortName$1, createNewCohort as createNewCohort$1, duplicateCohort, setSharedFilters, usePrevious, useGeneralGQLQuery, convertFilterSetToGqlFilter, customQueryStrForField, selectHeadersWithCSRFToken, GEN3_GUPPY_API, useLaunchWorkspaceMutation, selectActiveWorkspaceStatus, isFetchBaseQueryError, setActiveWorkspace, getCurrentTimestamp as getCurrentTimestamp$1, selectWorkspaceStatusFromService, selectActiveWorkspaceId, useGetWorkspaceOptionsQuery, GEN3_WORKSPACE_API, useGetExternalLoginsQuery, useSetCurrentPayModelMutation, PodStatus, PodConditionType, isWorkspaceRunningOrStopping, GEN3_API, GEN3_COMMONS_NAME, CohortStorage, createAppStore, getRemoteSupportServiceRegistry, isHttpStatusError, MissingServiceConfigurationError, useLazyGetAggsQuery, useCreateRequestMutation, buildGetAggregationQuery, processHistogramResponse, roundHistogramResponse, selectCSRFToken, useUserRequestQuery, getGen3AppId, createGen3AppWithOwnStore, createAppApiForRTKQ, useGetDictionaryQuery, useGetMetadataByIdQuery, createGen3App, CoreProvider, fetchJSONDataFromURL, HttpMethod, groupSharedFields, useGetCredentialsQuery, useRemoveCredentialMutation, useAddNewCredentialMutation, useGetProjectsDetailsQuery, useGetSubmissionsQuery, isCohortItem, isFileItem, fetchFencePresignedURL, HTTPError, getFederatedLoginStatus, queryMultipleMDSRecords, GEN3_MANIFEST_API, extractIndexFromDataLibraryCohort, isFilterSet, getNumberOfItemsInDatalist, isAdditionalDataItem, useLazyGetCrosswalkDataQuery, useLazyGetCountsQuery } from '@gen3/core';
+import { LoadingOverlay, Card, Group, Avatar, Text, Checkbox, Stack, Center, Loader, Tooltip, UnstyledButton, ThemeIcon, Box, Select, Button, Divider, Textarea, FileButton, Anchor, Modal, Grid, Table, ColorSwatch, useMantineTheme, Accordion, Switch, SegmentedControl as SegmentedControl$1, ActionIcon, Badge, TextInput, NumberInput, RangeSlider, MultiSelect, ScrollArea, Tabs, SimpleGrid, Highlight, MantineProvider, Flex, Menu, Alert, Drawer, CopyButton, factory, useProps, getStyleObject, Paper, useCombobox, Combobox, Autocomplete, Title, Transition, rem, Stepper, Spoiler, Image as Image$1, NavLink, List as List$1, createTheme, Pagination, FileInput, CloseButton } from '@mantine/core';
 import { useDeepCompareEffect, useDeepCompareMemo, useDeepCompareCallback } from 'use-deep-compare';
 import { useRouter } from 'next/router';
 import { usePathname } from 'next/navigation';
-import { MdLogin, MdClose, MdAddCircle, MdRemoveCircle, MdExpandLess, MdExpandMore, MdSearch, MdFlip, MdLockOutline, MdLibraryAdd, MdAdd, MdKeyboardDoubleArrowLeft, MdUndo, MdInfo, MdDownload, MdOutlineArrowBack, MdOutlineArrowForward, MdKeyboardArrowDown, MdKeyboardArrowUp, MdContentCopy, MdGroup, MdOutlineBarChart, MdOutlineSearch, MdFormatQuote, MdDelete, MdOutlineRemoveCircle } from 'react-icons/md';
+import { MdLogin, MdClose, MdAddCircle, MdRemoveCircle, MdExpandLess, MdExpandMore, MdSearch, MdFlip, MdLockOutline, MdLibraryAdd, MdAdd, MdKeyboardDoubleArrowLeft, MdUndo, MdInfo, MdDragIndicator, MdDownload, MdOutlineArrowBack, MdOutlineArrowForward, MdKeyboardArrowDown, MdKeyboardArrowUp, MdContentCopy, MdPerson, MdSave, MdGroup, MdOutlineBarChart, MdOutlineSearch, MdFormatQuote, MdDelete, MdOutlineRemoveCircle } from 'react-icons/md';
 import { getCookie, deleteCookie, setCookie } from 'cookies-next';
 import useSWR from 'swr';
 import { errors, importSPKI, jwtVerify, decodeJwt } from 'jose';
 import { notifications, showNotification, cleanNotifications, Notifications } from '@mantine/notifications';
 import tinycolor from 'tinycolor2';
-import { capitalize as capitalize$1, toString, isArray, uniqueId, reduce, includes, isPlainObject, get, omit, partial, cloneDeep, unset } from 'lodash';
+import { capitalize as capitalize$1, toString, isArray, isEqual, uniqueId, reduce, includes, isPlainObject, get, omit, partial, cloneDeep, unset } from 'lodash';
 import { twMerge } from 'tailwind-merge';
-import { BsExclamationTriangle, BsArrowsFullscreen } from 'react-icons/bs';
+import { BsExclamationTriangle, BsList, BsX, BsArrowsFullscreen } from 'react-icons/bs';
 import { IoMdInformationCircleOutline, IoMdArrowDropdown, IoMdRefresh, IoMdLogIn } from 'react-icons/io';
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { useCookies } from 'react-cookie';
 import FileSaver from 'file-saver';
-import { useClipboard, useResizeObserver, useDisclosure, useElementSize, useDidUpdate, mergeRefs, useReducedMotion, useMediaQuery, useFullscreen, useLocalStorage, useScrollIntoView, getHotkeyHandler } from '@mantine/hooks';
+import { useClipboard, useResizeObserver, useDisclosure, useElementSize, useDidUpdate, mergeRefs, useReducedMotion, useViewportSize, useMediaQuery, useFullscreen, useLocalStorage, useScrollIntoView, getHotkeyHandler } from '@mantine/hooks';
 import { defaultComposer } from 'default-composer';
 import { Icon, addCollection } from '@iconify-icon/react';
 import { init, getInstanceByDom, graphic } from 'echarts';
@@ -45,6 +45,11 @@ import MiniSearch from 'minisearch';
 import uniq from 'lodash/uniq';
 import sum from 'lodash/sum';
 import { LuCircleSlash, LuClock, LuLock, LuUnlock } from 'react-icons/lu';
+import { filesize } from 'filesize';
+import { useSensors, useSensor, PointerSensor, KeyboardSensor, DndContext, closestCenter } from '@dnd-kit/core';
+import { sortableKeyboardCoordinates, SortableContext, verticalListSortingStrategy, arrayMove, useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { restrictToVerticalAxis, restrictToWindowEdges, restrictToParentElement } from '@dnd-kit/modifiers';
 import Cookies from 'universal-cookie';
 import GraphiQL from 'graphiql';
 import fs from 'fs';
@@ -56,7 +61,6 @@ import { createSlice, nanoid, createEntityAdapter, createAsyncThunk, createSelec
 import createWebStorage from 'redux-persist/lib/storage/createWebStorage';
 import dynamic from 'next/dynamic';
 import YAML from 'yaml';
-import { filesize } from 'filesize';
 import { DragDropContext, Droppable, Draggable } from '@hello-pangea/dnd';
 import plugin from 'tailwindcss/plugin';
 import cookie from 'cookie';
@@ -530,6 +534,48 @@ const create10ColorAccessibleContrast = (pallet)=>{
  * @param {number} seconds - The time in seconds to be converted.
  * @returns {number} The equivalent time in milliseconds.
  */ const convertSecondsToMilliseconds = (seconds)=>seconds * 1000;
+// Using the built-in Date object
+const getCurrentTimestamp = ()=>{
+    return Date.now(); // Returns milliseconds since Unix epoch
+};
+// Get a readable timestamp for logging/display
+const getFormattedTimestamp = ()=>{
+    return new Date().toISOString();
+};
+// Compare two timestamps and get difference in milliseconds
+const getTimeDifferenceMs = (startTime, endTime = Date.now())=>{
+    return endTime - startTime;
+};
+// Check if time difference is greater than specified minutes
+const isTimeGreaterThan = (startTime, minutes)=>{
+    const diffMs = getTimeDifferenceMs(startTime);
+    const diffMinutes = diffMs / (1000 * 60);
+    return diffMinutes > minutes;
+};
+// Get human-readable duration
+const getReadableDuration = (milliseconds)=>{
+    const seconds = Math.floor(milliseconds / 1000);
+    const minutes = Math.floor(seconds / 60);
+    const hours = Math.floor(minutes / 60);
+    if (hours > 0) {
+        return `${hours}h ${minutes % 60}m ${seconds % 60}s`;
+    }
+    if (minutes > 0) {
+        return `${minutes}m ${seconds % 60}s`;
+    }
+    return `${seconds}s`;
+};
+// Example usage:
+const measureExecutionTime = async (func)=>{
+    const startTime = getCurrentTimestamp();
+    await func();
+    const duration = getTimeDifferenceMs(startTime);
+    return getReadableDuration(duration);
+};
+// Performance monitoring with high-resolution timestamps
+const getHighResolutionTimestamp = ()=>{
+    return performance.now(); // More precise than Date.now() for performance measurements
+};
 const MinutesToMilliseconds = (minutes)=>minutes * 60 * 1000;
 
 const convertPathsToTree = (paths)=>{
@@ -853,7 +899,7 @@ const workspaceShutdownAlertLimit = 30000; // 5 minutes: 5 * 60 * 1000 TODO Figu
         workspaceStatusData,
         requestedStatus
     ]);
-    if (requestedStatus === RequestedWorkspaceStatus.Launch && isTimeGreaterThan(requestedStatusTimestamp, 8)) {
+    if (requestedStatus === RequestedWorkspaceStatus.Launch && isTimeGreaterThan$1(requestedStatusTimestamp, 8)) {
         terminateWorkspace();
         dispatch(setRequestedWorkspaceStatus(RequestedWorkspaceStatus.Terminate));
         notifyUser('Workspace Startup', 'Workspace failed to start. Shutting down', 2);
@@ -1226,6 +1272,14 @@ const EmptyTableMessage = ({ message })=>{
     });
 };
 
+const MessagePage = ({ children })=>{
+    // place children in center of div that is 1/2 the visible height
+    return /*#__PURE__*/ jsx("div", {
+        className: "flex justify-center items-center w-full h-vh",
+        children: children
+    });
+};
+
 const LoginProviderMultipleItems = ({ provider, handleLoginSelected })=>{
     const [value, setValue] = useState(null);
     return /*#__PURE__*/ jsxs("div", {
@@ -1689,12 +1743,20 @@ const filterRedirect = (redirect)=>{
     } else {
         redirectPath = redirect ?? '/';
     }
-    return GEN3_REDIRECT_URL ? `${GEN3_REDIRECT_URL}/${redirectPath}` : redirectPath;
+    if (!GEN3_REDIRECT_URL) {
+        return redirectPath;
+    }
+    // Remove trailing slash from base URL and leading slash from path
+    const baseUrl = GEN3_REDIRECT_URL.replace(/\/+$/, '');
+    const cleanPath = redirectPath.replace(/^\/+/, '');
+    // Join with a single slash, ensuring we don't create double slashes
+    return cleanPath ? `${baseUrl}/${cleanPath}` : baseUrl;
 };
 const LoginPanel = (loginConfig)=>{
     const { image, topContent, bottomContent } = loginConfig;
     const router = useRouter();
-    const { query: { referer } } = router;
+    const { query: { referer: refererQuery, redirect: redirectQuery } } = router;
+    const referer = redirectQuery || refererQuery; // either referer or redirect query param
     const handleFenceLoginSelected = useCallback(async (loginURL)=>{
         router.push(`${appendParameterToUrl(loginURL, 'redirect', filterRedirect(referer))}`).catch((e)=>{
             showNotification({
@@ -5027,61 +5089,65 @@ const DropdownPanel = ({ index, filters, tabTitle, facetDefinitions, facetDataHo
                 onChange: onAccessChange,
                 accessLevel: accessLevel
             }) : null,
-            /*#__PURE__*/ jsxs(Stack, {
-                className: "bg-base-max py-4 px-2 h-full w-full",
-                children: [
-                    Object.keys(sharedFilters).length > 0 && /*#__PURE__*/ jsxs(Group, {
-                        gap: "xs",
-                        justify: "space-between",
-                        children: [
-                            /*#__PURE__*/ jsxs("div", {
-                                className: "flex items-center space-x-1",
-                                children: [
-                                    /*#__PURE__*/ jsx(Icon, {
-                                        icon: "gen3:share",
-                                        height: 16,
-                                        width: 16,
-                                        color: theme.colors.accent[4]
-                                    }),
-                                    /*#__PURE__*/ jsx(Text, {
-                                        size: "sm",
-                                        children: "Set the shared filters for all"
-                                    }),
-                                    /*#__PURE__*/ jsx(Tooltip, {
-                                        label: "If enabled any filter set on this tab will be applied to every tab where occurs.",
-                                        position: "top",
-                                        withArrow: true,
-                                        children: /*#__PURE__*/ jsx(Icon, {
-                                            icon: "gen3:info",
-                                            height: 12,
-                                            width: 12,
+            /*#__PURE__*/ jsx(ScrollArea, {
+                type: "auto",
+                className: "flex-1 min-h-0 w-full",
+                children: /*#__PURE__*/ jsxs(Stack, {
+                    className: "bg-base-max py-4 px-2 h-screen w-full",
+                    children: [
+                        Object.keys(sharedFilters).length > 0 && /*#__PURE__*/ jsxs(Group, {
+                            gap: "xs",
+                            justify: "space-between",
+                            children: [
+                                /*#__PURE__*/ jsxs("div", {
+                                    className: "flex items-center space-x-1",
+                                    children: [
+                                        /*#__PURE__*/ jsx(Icon, {
+                                            icon: "gen3:share",
+                                            height: 16,
+                                            width: 16,
                                             color: theme.colors.accent[4]
+                                        }),
+                                        /*#__PURE__*/ jsx(Text, {
+                                            size: "sm",
+                                            children: "Set the shared filters for all"
+                                        }),
+                                        /*#__PURE__*/ jsx(Tooltip, {
+                                            label: "If enabled any filter set on this tab will be applied to every tab where occurs.",
+                                            position: "top",
+                                            withArrow: true,
+                                            children: /*#__PURE__*/ jsx(Icon, {
+                                                icon: "gen3:info",
+                                                height: 12,
+                                                width: 12,
+                                                color: theme.colors.accent[4]
+                                            })
                                         })
-                                    })
-                                ]
-                            }),
-                            /*#__PURE__*/ jsx(Switch, {
-                                checked: shareFilters,
-                                onChange: (event)=>handleSharedFiltersChange(event.currentTarget.checked)
-                            })
-                        ]
-                    }),
-                    filters.tabs.length > 1 && /*#__PURE__*/ jsx(Select, {
-                        classNames: {
-                            options: 'border-1 border-base-dark',
-                            option: 'hover:bg-primary-lightest'
-                        },
-                        withCheckIcon: false,
-                        data: items,
-                        value: value === null ? '0' : value,
-                        onChange: setValue
-                    }),
-                    Object.keys(facetDefinitions).length > 0 ? /*#__PURE__*/ jsx(FiltersPanel, {
-                        fields: fields,
-                        dataFunctions: facetDataHooks,
-                        valueLabel: tabTitle
-                    }) : null
-                ]
+                                    ]
+                                }),
+                                /*#__PURE__*/ jsx(Switch, {
+                                    checked: shareFilters,
+                                    onChange: (event)=>handleSharedFiltersChange(event.currentTarget.checked)
+                                })
+                            ]
+                        }),
+                        filters.tabs.length > 1 && /*#__PURE__*/ jsx(Select, {
+                            classNames: {
+                                options: 'border-1 border-base-dark',
+                                option: 'hover:bg-primary-lightest'
+                            },
+                            withCheckIcon: false,
+                            data: items,
+                            value: value === null ? '0' : value,
+                            onChange: setValue
+                        }),
+                        Object.keys(facetDefinitions).length > 0 ? /*#__PURE__*/ jsx(FiltersPanel, {
+                            fields: fields,
+                            dataFunctions: facetDataHooks,
+                            valueLabel: tabTitle
+                        }) : null
+                    ]
+                })
             })
         ]
     });
@@ -5365,7 +5431,7 @@ const FacetGroup = ({ facets, children })=>{
     const availableFields = facets.map((f)=>f.field);
     useScrollToHash(availableFields, false);
     return /*#__PURE__*/ jsx("div", {
-        className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 3xl:grid-cols-5 w-content gap-4 ml-2 w-full",
+        className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 3xl:grid-cols-5 w-content gap-4 mt-6 px-2 w-full",
         "data-testid": "title-cohort-builder-facet-groups",
         children: children
     });
@@ -8167,6 +8233,7 @@ const DataLibraryActionButton = /*#__PURE__*/ forwardRef(({ label = undefined, i
 DataLibraryActionButton.displayName = 'DataLibraryActionButton';
 
 const MANIFEST_FILENAME = 'manifest.json';
+const XL_BREAKPOINT = 1280;
 
 /**
  * Determines the disabled state and the reason for disabling based on authentication status,
@@ -10491,6 +10558,52 @@ const DetailsDrawer = ({ id, title, panel, panelProps })=>{
     });
 };
 
+// TODO: refine this to make more general
+const extractProgramAndProjectNames = (path)=>{
+    // Regular expression to match the pattern /programs/{programName}/projects/{projectName}
+    const regex = /\/programs\/([^/]+)\/projects\/([^/]+)/;
+    const match = path.match(regex);
+    if (match) {
+        return {
+            programName: match[1],
+            projectName: match[2]
+        };
+    }
+    return {
+        programName: null,
+        projectName: null
+    };
+};
+const isStringToColorTable = (value)=>{
+    if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+        return false;
+    }
+    for(const key in value){
+        if (typeof key !== 'string' || typeof value[key] !== 'string') {
+            return false;
+        }
+    }
+    return true;
+};
+const ProjectAccessCellRenderer = ({ cell }, params)=>{
+    const value = cell.getValue();
+    if (typeof value !== 'string') return /*#__PURE__*/ jsx("span", {
+        children: "Bad Value"
+    });
+    const { projectName } = extractProgramAndProjectNames(value);
+    let color = 'primary.4';
+    if (params && isStringToColorTable(params?.colorTable)) {
+        if (projectName) {
+            color = ExtractValueFromObject(params.colorTable, projectName, color);
+        }
+    }
+    return /*#__PURE__*/ jsx(Badge, {
+        fullWidth: true,
+        color: color,
+        children: projectName
+    });
+};
+
 // TODO need to type this
 const RenderArrayCell = ({ cell })=>{
     const value = cell.getValue();
@@ -10535,6 +10648,11 @@ const ValueCellRenderer = ({ cell })=>{
         children: cell.getValue()
     });
 };
+const FilesizeRenderer = ({ cell })=>{
+    return /*#__PURE__*/ jsx("span", {
+        children: filesize(cell.getValue())
+    });
+};
 const ArrayCellFunctionCatalog = {
     NegativePositive: RenderArrayCellNegativePositive,
     default: RenderArrayCell
@@ -10556,6 +10674,66 @@ const RenderLinkCell = ({ cell }, ...args)=>{
         })
     });
 };
+const isRenderNextLinkCellWithIconParams = (value)=>{
+    if (typeof value !== 'object' || value === null) {
+        return false;
+    }
+    const obj = value;
+    return (obj.baseURL === undefined || typeof obj.baseURL === 'string') && (obj.icon === undefined || typeof obj.icon === 'string') && (obj.size === undefined || typeof obj.size === 'string') && (obj.linkField === undefined || typeof obj.linkField === 'string');
+};
+const RenderLinkCellWithIcon = ({ cell }, ...args)=>{
+    let baseURL = '';
+    let icon = null;
+    let size = 'sm';
+    let iconHeight = '1em';
+    let linkField = undefined;
+    let classNames = {
+        text: ''
+    };
+    const params = args[0];
+    if (isRenderNextLinkCellWithIconParams(params)) {
+        baseURL = params.baseURL ?? baseURL;
+        if (params.icon) {
+            icon = params.icon;
+        }
+        size = params.size ?? size;
+        iconHeight = params.iconHeight ?? iconHeight;
+        linkField = params.linkField ?? undefined;
+        classNames = params?.classNames ?? {
+            icon: '',
+            text: ''
+        };
+    }
+    let linkURL = `${baseURL}${cell.getValue()}`;
+    if (linkField) {
+        const value = cell.row.original[linkField];
+        if (typeof value === 'string') {
+            linkURL = `${baseURL}${value}`;
+        }
+    }
+    return /*#__PURE__*/ jsx(Link, {
+        href: linkURL,
+        target: "_blank",
+        rel: "noreferrer",
+        children: /*#__PURE__*/ jsxs("div", {
+            className: "flex items-center gap-1",
+            children: [
+                icon && /*#__PURE__*/ jsx(Icon, {
+                    height: iconHeight,
+                    icon: icon
+                }),
+                /*#__PURE__*/ jsx(Text, {
+                    fw: 700,
+                    size: size,
+                    classNames: {
+                        root: classNames?.text
+                    },
+                    children: cell.getValue()
+                })
+            ]
+        })
+    });
+};
 const RenderLinkCellUsingValueMap = ({ cell }, ...args)=>{
     let href = null;
     if (typeof args[0] === 'object' && Object.keys(args[0]).includes('valueToURL')) {
@@ -10588,7 +10766,8 @@ const RenderLinkCellUsingValueMap = ({ cell }, ...args)=>{
 };
 const LinkCellFunctionCatalog = {
     default: RenderLinkCell,
-    linkWithValueMap: RenderLinkCellUsingValueMap
+    linkWithValueMap: RenderLinkCellUsingValueMap,
+    linkWithIcon: RenderLinkCellWithIcon
 };
 let instance$2;
 const ExplorerTableCellRendererFactory = ()=>{
@@ -10601,7 +10780,13 @@ const ExplorerTableCellRendererFactory = ()=>{
 const registerExplorerDefaultCellRenderers = ()=>{
     ExplorerTableCellRendererFactory().registerRendererCatalog({
         value: {
-            default: ValueCellRenderer
+            default: ValueCellRenderer,
+            filesize: FilesizeRenderer
+        }
+    });
+    ExplorerTableCellRendererFactory().registerRendererCatalog({
+        access: {
+            projectAccess: ProjectAccessCellRenderer
         }
     });
     ExplorerTableCellRendererFactory().registerRendererCatalog({
@@ -10641,7 +10826,7 @@ const isRecordAny = (obj)=>{
     return obj !== null && typeof obj === 'object';
 };
 const createTableColumns = (tableConfig)=>{
-    return tableConfig.fields.map((field)=>{
+    const tableColumns = tableConfig.fields.map((field)=>{
         const columnDef = tableConfig?.columns?.[field];
         const cellRendererFunc = columnDef?.type ? ExplorerTableCellRendererFactory().getRenderer(columnDef?.type, columnDef?.cellRenderFunction ?? 'default') : undefined;
         const cellRendererFuncParams = columnDef?.params && isRecordAny(columnDef?.params) ? columnDef?.params : {};
@@ -10653,9 +10838,22 @@ const createTableColumns = (tableConfig)=>{
             accessorFn: columnDef?.accessorPath ? jsonPathAccessor(columnDef.accessorPath) : undefined,
             Cell: cellRendererFunc && columnDef?.params ? (cell)=>cellRendererFunc(cell, cellRendererFuncParams) : cellRendererFunc ? cellRendererFunc : undefined,
             size: columnDef?.width,
-            enableSorting: columnDef?.sortable ?? undefined
+            enableSorting: columnDef?.sortable ?? undefined,
+            visible: columnDef?.visible ?? true,
+            lockVisible: columnDef?.lockVisible ?? false
         };
-    }, []);
+    });
+    const lockedVisibility = tableConfig.fields.reduce((acc, field)=>{
+        const columnDef = tableConfig?.columns?.[field];
+        if (columnDef && columnDef?.lockVisible) {
+            acc[field] = columnDef?.visible ?? true; // assume visible by default
+        }
+        return acc;
+    }, {});
+    return {
+        tableColumns: tableColumns,
+        lockedVisibility: lockedVisibility
+    };
 };
 const createArrayTableColumns = (root, tableConfig)=>{
     return tableConfig.fields.map((field)=>{
@@ -10765,7 +10963,7 @@ const ExpandingSubtable = ({ config, data })=>{
     const [expanded, setExpanded] = useState(false);
     const [headerHeight, setHeaderHeight] = useState(0);
     const theme = useMantineTheme();
-    const expandedTableColumns = useDeepCompareMemo(()=>{
+    const { tableColumns: expandedTableColumns } = useDeepCompareMemo(()=>{
         return createTableColumns(config);
     }, [
         config
@@ -10947,6 +11145,350 @@ const QueryRowDetailsPanel = ({ id, index, tableConfig, accessibility })=>{
     });
 };
 
+function ColumnOrdering({ table, handleColumnOrderingReset, columnOrder, setColumnOrder, noColumnOrdering = [] }) {
+    const [showColumnMenu, setShowColumnMenu] = useState(false);
+    const [searchValue, setSearchValue] = useState('');
+    const [columesVisible, setColumsnVisible] = useState([]);
+    const isBackToDefaults = isEqual(table.initialState.columnOrder, columnOrder) && isEqual(table.initialState.columnVisibility, Object.fromEntries(Object.entries(table.getState().columnVisibility).filter(([, value])=>!value)));
+    const sensors = useSensors(useSensor(PointerSensor, {
+        activationConstraint: {
+            distance: 5
+        }
+    }), useSensor(KeyboardSensor, {
+        coordinateGetter: sortableKeyboardCoordinates
+    }));
+    const handleDragEnd = (event)=>{
+        const { active, over } = event;
+        if (active?.id && over?.id && active?.id !== over?.id) {
+            setColumnOrder((items)=>{
+                const oldIndex = items.indexOf(active?.id);
+                const newIndex = items.indexOf(over?.id);
+                return arrayMove(items, oldIndex, newIndex);
+            });
+        }
+    };
+    return /*#__PURE__*/ jsxs(Menu, {
+        position: "bottom-end",
+        middlewares: {
+            shift: false,
+            flip: false
+        },
+        onChange: setShowColumnMenu,
+        offset: 0,
+        zIndex: 400,
+        withinPortal: true,
+        children: [
+            /*#__PURE__*/ jsx(Tooltip, {
+                label: "Customize Columns",
+                disabled: showColumnMenu,
+                children: /*#__PURE__*/ jsx(Menu.Target, {
+                    children: /*#__PURE__*/ jsx(ActionIcon, {
+                        variant: "outline",
+                        size: "lg",
+                        "aria-label": "Customize Columns",
+                        color: "primary",
+                        "data-testid": "button-column-selector-box",
+                        className: `${showColumnMenu && 'border-2 border-primary'} hover:bg-primary hover:text-base-max`,
+                        children: !showColumnMenu ? /*#__PURE__*/ jsx(BsList, {
+                            size: "1.5rem",
+                            "aria-hidden": "true"
+                        }) : /*#__PURE__*/ jsx(BsX, {
+                            size: "2rem",
+                            "aria-hidden": "true"
+                        })
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsxs(Menu.Dropdown, {
+                className: "bg-base-max border-2 border-primary p-2 rounded-md",
+                "data-testid": "column-selector-popover-modal",
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        className: "flex justify-between items-center",
+                        children: [
+                            /*#__PURE__*/ jsx("span", {
+                                className: "font-bold text-primary-darkest tracking-normal",
+                                children: "Customize Columns"
+                            }),
+                            /*#__PURE__*/ jsx(Tooltip, {
+                                label: "Restore defaults",
+                                disabled: isBackToDefaults,
+                                zIndex: 400,
+                                children: /*#__PURE__*/ jsx("span", {
+                                    children: /*#__PURE__*/ jsx(ActionIcon, {
+                                        onClick: handleColumnOrderingReset,
+                                        className: isBackToDefaults ? 'invisible' : 'border-0',
+                                        "data-testid": "restore-default-icon",
+                                        "aria-label": "restore default column ordering",
+                                        children: /*#__PURE__*/ jsx(FaUndo, {
+                                            size: "1rem"
+                                        })
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx(Divider, {
+                        color: "base.2",
+                        className: "mt-1"
+                    }),
+                    /*#__PURE__*/ jsx(TextInput, {
+                        value: searchValue,
+                        onChange: (event)=>setSearchValue(event.currentTarget.value.trim()),
+                        placeholder: "Filter Columns",
+                        "aria-label": "Search input for columns",
+                        leftSection: /*#__PURE__*/ jsx(MdSearch, {
+                            "aria-hidden": "true"
+                        }),
+                        className: "mb-2 mt-4",
+                        "data-testid": "textbox-column-selector"
+                    }),
+                    /*#__PURE__*/ jsx(DndContext, {
+                        sensors: sensors,
+                        collisionDetection: closestCenter,
+                        onDragEnd: handleDragEnd,
+                        modifiers: [
+                            restrictToVerticalAxis,
+                            restrictToWindowEdges,
+                            restrictToParentElement
+                        ],
+                        children: /*#__PURE__*/ jsx(SortableContext, {
+                            items: table.getAllLeafColumns(),
+                            strategy: verticalListSortingStrategy,
+                            children: /*#__PURE__*/ jsx(List, {
+                                columns: table.getAllLeafColumns(),
+                                searchValue: searchValue,
+                                noColumnOrdering: noColumnOrdering
+                            })
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}
+function List({ columns, searchValue, noColumnOrdering = [] }) {
+    return /*#__PURE__*/ jsx("ul", {
+        children: columns.filter((column)=>{
+            if (!noColumnOrdering.includes(column.id)) {
+                return humanify({
+                    term: column.id
+                }).toLowerCase().includes(searchValue.toLowerCase());
+            } else {
+                return column.id;
+            }
+        }).map((column, index)=>{
+            return !noColumnOrdering.includes(column.id) ? /*#__PURE__*/ jsx(DraggableColumnItem, {
+                column: column,
+                isNotLast: index < columns.length - 1
+            }, column.id) : /*#__PURE__*/ jsx("li", {
+                className: "hide"
+            }, column.id);
+        })
+    });
+}
+function DraggableColumnItem({ column, isNotLast }) {
+    const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
+        id: column.id
+    });
+    const style = {
+        transform: CSS.Transform.toString(transform),
+        transition
+    };
+    return /*#__PURE__*/ jsx("li", {
+        ref: setNodeRef,
+        style: style,
+        ...listeners,
+        className: ` ${isNotLast ? 'mb-2' : ''}`,
+        "data-testid": `column-selector-row-${column.id}`,
+        children: /*#__PURE__*/ jsxs("div", {
+            ...attributes,
+            role: undefined,
+            className: "flex gap-2 items-center bg-nci-violet-lightest px-1 py-1.5 h-6 cursor-move",
+            children: [
+                /*#__PURE__*/ jsx(MdDragIndicator, {
+                    size: "1rem",
+                    className: "text-primary"
+                }),
+                /*#__PURE__*/ jsx(Switch, {
+                    labelPosition: "left",
+                    label: typeof column?.columnDef?.header === 'string' ? column.columnDef.header : humanify({
+                        term: column.id
+                    }),
+                    classNames: {
+                        root: 'w-full',
+                        body: 'grow flex justify-between',
+                        label: 'text-xs font-medium tracking-normal'
+                    },
+                    color: "accent",
+                    checked: column.getIsVisible(),
+                    onChange: ()=>column.toggleVisibility(),
+                    onKeyDown: (e)=>{
+                        if (e.code === 'Space') {
+                            e.preventDefault();
+                            column.toggleVisibility();
+                        }
+                    },
+                    size: "xs",
+                    "data-testid": "switch-toggle"
+                })
+            ]
+        })
+    });
+}
+
+const TitleWrapper = ({ title })=>/*#__PURE__*/ jsx("div", {
+        className: "uppercase text-lg text-left ml-0 lg:ml-auto gap-x-2",
+        children: title
+    });
+const TotalDetailWrapper = ({ detail, className = '' })=>/*#__PURE__*/ jsx("div", {
+        className: `self-center uppercase text-lg text-left ml-0 lg:ml-auto ${className}`,
+        children: detail
+    });
+const TooltipWrapper = ({ children, tooltip, searchFocused, baseZIndex })=>/*#__PURE__*/ jsx(Tooltip, {
+        multiline: true,
+        label: tooltip,
+        position: "bottom-start",
+        offset: 0,
+        opened: searchFocused,
+        zIndex: baseZIndex + 1,
+        classNames: {
+            tooltip: 'w-72 border border-base-lighter absolute bg-white p-2 text-nci-gray text-sm overflow-wrap break-all rounded-b rounded-t-none font-content'
+        },
+        children: children
+    });
+const SearchInput = ({ searchTerm, placeholder, tooltip, searchFocused, baseZIndex, onClear, onChange, onFocus, onBlur })=>{
+    const TooltipContainer = tooltip ? TooltipWrapper : React__default.Fragment;
+    return /*#__PURE__*/ jsx(TooltipContainer, {
+        tooltip: tooltip,
+        baseZIndex: baseZIndex,
+        searchFocused: searchFocused,
+        children: /*#__PURE__*/ jsx(TextInput, {
+            leftSection: /*#__PURE__*/ jsx(MdSearch, {
+                size: 24,
+                "aria-hidden": "true"
+            }),
+            "data-testid": "textbox-table-search-bar",
+            placeholder: placeholder ?? 'Search',
+            "aria-label": "Table Search Input",
+            size: "sm",
+            rightSection: searchTerm.length > 0 && /*#__PURE__*/ jsx(ActionIcon, {
+                onClick: onClear,
+                className: "border-0",
+                children: /*#__PURE__*/ jsx(MdClose, {
+                    "aria-label": "clear search"
+                })
+            }),
+            value: searchTerm,
+            onChange: onChange,
+            onFocus: onFocus,
+            onBlur: onBlur,
+            classNames: {
+                input: `border-base-lighter focus:border-2 focus:border-primary${tooltip ? ' focus:rounded-b-none' : ''}`,
+                wrapper: 'xl:w-72'
+            }
+        })
+    });
+};
+function TableHeader({ additionalControls, tableTotalDetail, tableTitle, search, showControls, handleChange, table, columnOrder, setColumnOrder, baseZIndex, customBreakpoint, noColumnOrdering }) {
+    const [searchTerm, setSearchTerm] = useState(search?.defaultSearchTerm ?? '');
+    const [searchFocused, setSearchFocused] = useState(false);
+    const inputRef = useRef(null); // updated apr 10 25 to get build to work
+    const timeoutRef = useRef(null); // updated apr 10 25 to get build to work
+    const shouldShowControls = search?.enabled || showControls;
+    const { width } = useViewportSize();
+    useEffect(()=>{
+        if (search?.defaultSearchTerm) {
+            inputRef.current?.focus();
+        }
+    }, [
+        search?.defaultSearchTerm
+    ]);
+    const handleInputChange = (e)=>{
+        const newSearchTerm = e.target.value;
+        setSearchTerm(newSearchTerm);
+        if (timeoutRef.current) clearTimeout(timeoutRef.current);
+        timeoutRef.current = setTimeout(()=>{
+            handleChange({
+                newSearch: newSearchTerm.trim()
+            });
+        }, 400);
+    };
+    const handleClearClick = ()=>{
+        setSearchTerm('');
+        if (timeoutRef.current) clearTimeout(timeoutRef.current);
+        handleChange({
+            newSearch: ''
+        });
+    };
+    const renderSearchAndControls = ()=>/*#__PURE__*/ jsxs("div", {
+            className: "flex items-center gap-2",
+            "data-testid": "table-options-menu",
+            children: [
+                search?.enabled && /*#__PURE__*/ jsx(SearchInput, {
+                    searchTerm: searchTerm,
+                    placeholder: search?.placeholder,
+                    tooltip: search?.tooltip,
+                    searchFocused: searchFocused,
+                    baseZIndex: baseZIndex,
+                    onClear: handleClearClick,
+                    onChange: handleInputChange,
+                    onFocus: ()=>setSearchFocused(true),
+                    onBlur: ()=>setSearchFocused(false)
+                }),
+                showControls && /*#__PURE__*/ jsx(ColumnOrdering, {
+                    table: table,
+                    handleColumnOrderingReset: ()=>{
+                        table.resetColumnVisibility();
+                        table.resetColumnOrder();
+                    },
+                    columnOrder: columnOrder,
+                    setColumnOrder: setColumnOrder,
+                    noColumnOrdering: noColumnOrdering
+                })
+            ]
+        });
+    const breakpoint = customBreakpoint ?? XL_BREAKPOINT;
+    let detailClass = '';
+    if (tableTitle !== undefined) {
+        if (width >= breakpoint && shouldShowControls) {
+            detailClass = 'ml-auto';
+        }
+    } else {
+        if (width >= breakpoint && additionalControls) {
+            detailClass = 'ml-auto';
+        } else {
+            detailClass = 'order-first basis-full grow-0 shrink-0 -mb-2';
+        }
+    }
+    return /*#__PURE__*/ jsxs("div", {
+        className: `flex flex-wrap gap-4 items-center mb-2 ${!additionalControls && !tableTitle ? 'justify-end' : 'justify-between'}`,
+        children: [
+            tableTitle && /*#__PURE__*/ jsx("div", {
+                className: additionalControls || shouldShowControls && width < breakpoint ? 'basis-full grow-0 shrink-0 -mb-2' : '',
+                children: /*#__PURE__*/ jsx(TitleWrapper, {
+                    title: tableTitle
+                })
+            }),
+            additionalControls && additionalControls,
+            tableTotalDetail && /*#__PURE__*/ jsx("div", {
+                className: detailClass,
+                children: /*#__PURE__*/ jsx(TotalDetailWrapper, {
+                    detail: tableTotalDetail
+                })
+            }),
+            shouldShowControls && renderSearchAndControls()
+        ]
+    });
+}
+
+// Provides the bottom X position so components can align themselves with the table
+function emptyFn() {}
+const TableXPositionContext = /*#__PURE__*/ createContext({
+    xPosition: undefined,
+    setXPosition: emptyFn
+});
+
 const DEFAULT_PAGE_LIMIT_LABEL = 'Rows per Page (Limited to 10,0000):';
 const DEFAULT_PAGE_LIMIT = 10000;
 /**
@@ -10956,11 +11498,12 @@ const DEFAULT_PAGE_LIMIT = 10000;
  * @param index - Offset to use for fetching/displaying pages of rows
  * @param tableConfig - Inherited from ExplorerPageGetServerSideProps
  * @param accessibility - set the access level for the cohort data
- */ const ExplorerTable = ({ index, tableConfig, accessibility, classNames, size = 'sm' })=>{
+ */ const ExplorerTable = ({ index, tableConfig, accessibility, classNames, size = 'sm', additionalControls, tableTotalDetail, tableTitle })=>{
     const [pagination, setPagination] = useState({
         pageIndex: 0,
-        pageSize: 10
+        pageSize: 20
     });
+    const ref = useRef(null);
     const DetailsComponent = useMemo(()=>{
         if (!tableConfig?.detailsConfig || !tableConfig?.detailsConfig?.panel || tableConfig?.detailsConfig?.mode === 'none') return null;
         return tableConfig?.detailsConfig?.panelContainer === 'drawer' ? DetailsDrawer : DetailsModal;
@@ -10968,6 +11511,7 @@ const DEFAULT_PAGE_LIMIT = 10000;
     const [sorting, setSorting] = useState([]);
     const [rowSelection, setRowSelection] = useState({});
     const [selectedRow, setSelectedRow] = useState(undefined);
+    const [columnVisibility, setColumnVisibility] = useState({});
     // const DetailsPanel = useMemo(
     //   () =>
     //     ExplorerTableDetailsPanelFactory().getRenderer(
@@ -10977,11 +11521,23 @@ const DEFAULT_PAGE_LIMIT = 10000;
     //   [tableConfig?.detailsConfig?.panel],
     // );
     const DetailsPanel = useMemo(()=>QueryRowDetailsPanel, []);
-    const tableColumns = useDeepCompareMemo(()=>{
+    const handleColumnVisibilityChange = (updater)=>{
+        const newState = typeof updater === 'function' ? updater(columnVisibility) : updater;
+        setColumnVisibility({
+            ...newState,
+            ...{
+                'mrt-row-expand': false,
+                ...lockedVisibility
+            }
+        });
+    };
+    const { tableColumns, lockedVisibility } = useDeepCompareMemo(()=>{
         return createTableColumns(tableConfig);
     }, [
         tableConfig
     ]);
+    const [columnOrder, setColumnOrder] = useState(tableColumns.map((column)=>column.id));
+    const handleSearchOrPageChange = useCallback((params)=>null, []);
     // TODO: add support for nested fields
     const fields = useMemo(()=>tableColumns.map((column)=>column.field), [
         tableColumns
@@ -11003,7 +11559,8 @@ const DEFAULT_PAGE_LIMIT = 10000;
         };
     }, []);
     const cohortFilters = useCoreSelector((state)=>selectIndexFilters(state, index));
-    const { data, isLoading, isError, isFetching } = useGetRawDataAndTotalCountsQuery({
+    const { xPosition, setXPosition } = useContext(TableXPositionContext);
+    const { data, isLoading, isError, isFetching, isSuccess } = useGetRawDataAndTotalCountsQuery({
         type: index,
         fields: fields,
         filters: cohortFilters,
@@ -11059,12 +11616,17 @@ const DEFAULT_PAGE_LIMIT = 10000;
         onSortingChange: setSorting,
         enableTopToolbar: false,
         enableExpandAll: false,
+        enableHiding: true,
+        enableColumnActions: false,
         displayColumnDefOptions: {
             'mrt-row-expand': {
                 enableHiding: true
             }
         },
+        onColumnVisibilityChange: handleColumnVisibilityChange,
         enableExpanding: !!tableConfig?.detailsConfig,
+        //enableColumnOrdering: tableConfig?.columnSorting,
+        // enableHiding: tableConfig?.columnHiding,
         getRowId: getRowId(tableConfig),
         rowCount: totalRowCount,
         icons: TableIcons,
@@ -11115,9 +11677,8 @@ const DEFAULT_PAGE_LIMIT = 10000;
             showAlertBanner: isError,
             density: 'xs',
             rowSelection: rowSelection,
-            columnVisibility: {
-                'mrt-row-expand': false
-            }
+            columnVisibility: columnVisibility,
+            columnOrder: columnOrder
         },
         mantineTableBodyRowProps: tableConfig.detailsConfig?.mode === 'click' ? ({ row })=>({
                 onClick: ()=>{
@@ -11149,6 +11710,16 @@ const DEFAULT_PAGE_LIMIT = 10000;
             } else return null;
         } : undefined
     });
+    const rowCount = table.getRowModel().rows.length;
+    useLayoutEffect(()=>{
+        if (setXPosition && xPosition === undefined && isSuccess && rowCount > 0 && ref.current) {
+            setXPosition(ref?.current?.getBoundingClientRect()?.bottom);
+        }
+    }, [
+        setXPosition,
+        xPosition,
+        rowCount
+    ]);
     return /*#__PURE__*/ jsx(React__default.Fragment, {
         children: /*#__PURE__*/ jsxs(StudyProvider, {
             children: [
@@ -11166,11 +11737,25 @@ const DEFAULT_PAGE_LIMIT = 10000;
                         accessibility
                     }
                 }),
-                /*#__PURE__*/ jsx("div", {
-                    className: "inline-block overflow-x-scroll",
-                    children: /*#__PURE__*/ jsx(MantineReactTable, {
-                        table: table
-                    })
+                /*#__PURE__*/ jsxs("div", {
+                    className: "inline-block overflow-x-scroll ",
+                    ref: ref,
+                    children: [
+                        (tableConfig?.showTableHeaderControls || tableConfig.columnSorting || tableConfig?.columnHiding) && /*#__PURE__*/ jsx(TableHeader, {
+                            table: table,
+                            columnOrder: columnOrder,
+                            setColumnOrder: setColumnOrder,
+                            handleChange: handleSearchOrPageChange,
+                            additionalControls: additionalControls,
+                            tableTitle: tableTitle,
+                            tableTotalDetail: tableTotalDetail,
+                            showControls: tableConfig?.showTableHeaderControls,
+                            noColumnOrdering: Object.keys(lockedVisibility)
+                        }),
+                        /*#__PURE__*/ jsx(MantineReactTable, {
+                            table: table
+                        })
+                    ]
                 })
             ]
         })
@@ -11382,16 +11967,19 @@ const useGuppyActionButton = ({ Modal403 = Modals.NoAccessModal, Modal400 = Moda
                 modal: Modal400,
                 message: errorMessage
             }));
+            console.error(error);
         } else if (errorMessage === 'Your token is invalid or expired. Please get a new token.') {
             dispatch(showModal({
                 modal: Modal403,
                 message: errorMessage
             }));
+            console.error(error);
         } else {
             dispatch(showModal({
                 modal: Modal400,
                 message: customErrorMessage || errorMessage
             }));
+            console.error(error);
         }
     }, [
         Modal400,
@@ -12505,6 +13093,7 @@ const JSONObjectDownloadButton = ({ getData, filename = 'data.json', icon = 'gen
         })
     });
 };
+JSONObjectDownloadButton.displayName = 'JSONObjectDownloadButton';
 
 const UploadJSONButton = ({ handleFileChange, tooltip, icon = 'gen3:upload' })=>{
     const [file, setFile] = useState(null);
@@ -13179,7 +13768,7 @@ const EmptyData = {};
         charts,
         chartsSection
     ]);
-    const { data: counts, isFetching: isCountsFetching, isSuccess: isCountSuccess, isError: isCountsError } = useGetCountsQuery({
+    const { data: counts, isFetching: isCountsFetching, isError: isCountsError } = useGetCountsQuery({
         type: index,
         filters: cohortFilters,
         accessibility: accessLevel,
@@ -13802,53 +14391,341 @@ const TabbedCohortBuilder = ({ index, tabsConfiguration })=>{
     const facetDataHooks = useDeepCompareMemo(()=>{
         return {
             // TODO: see if there a better way to do this
-            enum: EnumHookInstances,
-            exact: EnumHookInstances,
-            multiselect: EnumHookInstances,
-            range: RangeHookInstances,
-            age: RangeHookInstances,
-            year: RangeHookInstances,
-            years: RangeHookInstances,
-            days: RangeHookInstances,
-            percent: RangeHookInstances,
-            datetime: RangeHookInstances,
-            toggle: RangeHookInstances,
-            upload: EnumHookInstances
+            enum: EnumHookInstances,
+            exact: EnumHookInstances,
+            multiselect: EnumHookInstances,
+            range: RangeHookInstances,
+            age: RangeHookInstances,
+            year: RangeHookInstances,
+            years: RangeHookInstances,
+            days: RangeHookInstances,
+            percent: RangeHookInstances,
+            datetime: RangeHookInstances,
+            toggle: RangeHookInstances,
+            upload: EnumHookInstances
+        };
+    }, [
+        getEnumFacetData,
+        getRangeFacetData,
+        index
+    ]);
+    return /*#__PURE__*/ jsx(Stack, {
+        gap: "xs",
+        align: "stretch",
+        classNames: {
+            root: 'w-full'
+        },
+        children: /*#__PURE__*/ jsx(FacetTabs, {
+            activeTab: activeTab,
+            setActiveTab: setActiveTab,
+            facetDefinitions: facetDefinitions,
+            tabsConfig: tabsConfig,
+            usedFacets: cohortBuilderFilters,
+            hooks: facetDataHooks,
+            customFacetHooks: {
+                useCustomFacets,
+                useAvailableCustomFacets: (usedFacets, onlyFiltersWithValues, queryOptions)=>({
+                        data: {},
+                        isSuccess: true
+                    }),
+                useAddCustomFilter: ()=>(filter)=>{},
+                useRemoveCustomFilter: ()=>(filter)=>{}
+            },
+            getFacetLabel: ()=>'Cases',
+            cardScrollMargin: calculateStickyHeaderHeight(),
+            useFieldNameToTitle: useFieldNameToTitle
+        })
+    });
+};
+
+const useGetFacetValuesQuery = (args)=>{
+    const { data, isSuccess, isFetching, isError } = useGetAggsQuery(args);
+    return {
+        data: data ?? {},
+        isError,
+        isFetching,
+        isSuccess
+    };
+};
+const buildFileStatsdQuery = (type, fileSizeField, cohortItemIdField, fileItemIdField)=>{
+    const fileStatsQuery = `query repositoryTotals ($filter: JSON, $accessibility:Accessibility) {
+    _aggregation {
+        ${type} (accessibility: $accessibility, filter: $filter) {
+            ${customQueryStrForField(fileItemIdField, '{_totalCount }')}
+             ${customQueryStrForField(fileSizeField, ' {  histogram {sum} }')}
+                ${customQueryStrForField(cohortItemIdField, '{_cardinalityCount }')}
+        }
+    }
+}`;
+    return fileStatsQuery;
+};
+const useTotalFileSizeQuery = ({ repositoryFilters, repositoryIndex, cohortIndex, fileSizeField, cohortItemIdField, fileItemIdField, accessibility = Accessibility.ALL })=>{
+    const [totals, setTotals] = useState({
+        totalFileSize: 0,
+        totalCaseCount: 0,
+        totalFileCount: 0
+    });
+    const query = buildFileStatsdQuery(repositoryIndex, fileSizeField, cohortItemIdField, fileItemIdField);
+    const { data, isSuccess, isFetching, isError } = useGeneralGQLQuery({
+        query,
+        variables: {
+            accessibility,
+            filter: convertFilterSetToGqlFilter(repositoryFilters)
+        }
+    });
+    useDeepCompareEffect(()=>{
+        if (isSuccess) {
+            const response = data.data;
+            const totalFileSize = response?._aggregation?.[repositoryIndex]?.[fileSizeField]?.histogram?.[0]?.sum || 0;
+            const totalCaseCount = response?._aggregation?.[repositoryIndex]?.[cohortItemIdField]?._cardinalityCount || 0;
+            const totalFileCount = response?._aggregation?.[repositoryIndex]?.[fileItemIdField]?._totalCount || 0;
+            setTotals({
+                totalFileSize,
+                totalCaseCount,
+                totalFileCount
+            });
+        }
+    }, [
+        data,
+        isSuccess
+    ]);
+    return {
+        data: totals,
+        isError,
+        isFetching,
+        isSuccess
+    };
+};
+
+const Stats = ({ totalCaseCount, totalFileSize, totalFileCount, isFetching })=>/*#__PURE__*/ jsxs("div", {
+        className: "flex gap-1 text-xl items-center uppercase flex-wrap",
+        children: [
+            /*#__PURE__*/ jsxs("div", {
+                children: [
+                    "Total of",
+                    ' ',
+                    /*#__PURE__*/ jsx("strong", {
+                        children: !isFetching ? totalFileCount.toLocaleString() : '--'
+                    }),
+                    ' ',
+                    totalFileCount !== 1 ? 'Files' : 'File'
+                ]
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                children: [
+                    /*#__PURE__*/ jsx(MdPerson, {
+                        className: "ml-2 mr-1 mb-1 inline-block",
+                        "aria-hidden": "true"
+                    }),
+                    /*#__PURE__*/ jsx("strong", {
+                        className: "mr-1",
+                        children: totalCaseCount
+                    }),
+                    totalCaseCount !== 1 ? 'Cases' : 'Case'
+                ]
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                children: [
+                    /*#__PURE__*/ jsx(MdSave, {
+                        className: "ml-2 mr-1 mb-1 inline-block",
+                        "aria-hidden": "true"
+                    }),
+                    filesize(totalFileSize)
+                ]
+            })
+        ]
+    });
+
+const FileFacetPanel = ({ filters, index, tabTitle, fieldMapping })=>{
+    const repositoryFilters = useCoreSelector((state)=>selectIndexFilters(state, index));
+    const fields = useMemo(()=>getAllFieldsFromFilterConfigs(filters?.tabs ?? []), [
+        filters?.tabs
+    ]);
+    const [accessLevel, setAccessLevel] = useState(Accessibility.ALL);
+    const [facetDefinitions, setFacetDefinitions] = useState({});
+    const { data: facetData, isSuccess: isFacetsQuerySuccess, isFetching: isFacetsQueryFetching, isError: isFacetsQueryError } = useGetFacetValuesQuery({
+        type: index,
+        fields: fields,
+        filters: repositoryFilters
+    });
+    // Set the facet definitions based on the data only the first time the data is loaded
+    useDeepCompareEffect(()=>{
+        if (isFacetsQuerySuccess && Object.keys(facetDefinitions).length === 0) {
+            const configFacetDefs = filters?.tabs.reduce((acc, tab)=>{
+                return {
+                    ...tab.fieldsConfig,
+                    ...acc
+                };
+            }, {});
+            const facetDefs = classifyFacets(facetData, index, fieldMapping ?? [], configFacetDefs ?? {});
+            setFacetDefinitions(facetDefs);
+        }
+    }, [
+        isFacetsQuerySuccess,
+        facetData,
+        facetDefinitions,
+        index,
+        fieldMapping
+    ]);
+    const getEnumFacetData = useDeepCompareCallback((field)=>{
+        let filters = undefined;
+        let combineMode = 'or';
+        if (field in repositoryFilters.root) {
+            if (isIntersection(repositoryFilters.root[field])) {
+                const intersectionFilters = removeIntersectionFromEnum(repositoryFilters.root[field]);
+                if (intersectionFilters) {
+                    filters = extractEnumFilterValue(intersectionFilters);
+                    combineMode = 'and';
+                }
+            } else {
+                filters = extractEnumFilterValue(repositoryFilters.root[field]);
+            }
+        }
+        return {
+            data: processBucketData(facetData?.[field]),
+            enumFilters: filters,
+            combineMode: combineMode,
+            isSuccess: isFacetsQuerySuccess,
+            isFetching: isFacetsQueryFetching
+        };
+    }, [
+        repositoryFilters.root,
+        facetData,
+        isFacetsQuerySuccess
+    ]);
+    const facetDataHooks = useDeepCompareMemo(()=>{
+        return {
+            // TODO: see if there a better way to do this
+            enum: {
+                useGetFacetData: getEnumFacetData,
+                useUpdateFacetFilters: partial(useUpdateFilters$1, index),
+                useGetFacetFilters: partial(useGetFacetFilters$1, index),
+                useClearFilter: partial(useClearFilters$1, index),
+                useFilterExpanded: partial(useFilterExpandedState$1, index),
+                useToggleExpandFilter: partial(useToggleExpandFilter$1, index),
+                useGetCombineMode: partial(useCohortFilterCombineState, index),
+                useSetCombineMode: partial(useSetCohortFilterCombineState, index),
+                useFieldNameToTitle: useFieldNameToTitle,
+                useTotalCounts: undefined,
+                useUpdateCombineMode: ()=>null
+            }
         };
     }, [
         getEnumFacetData,
-        getRangeFacetData,
         index
     ]);
-    return /*#__PURE__*/ jsx(Stack, {
-        gap: "xs",
-        align: "stretch",
-        classNames: {
-            root: 'w-full'
+    if (isFacetsQueryError) {
+        return /*#__PURE__*/ jsx(ErrorCard, {
+            message: "Unable to fetch data from server"
+        }); // TODO: replace with configurable message
+    }
+    return /*#__PURE__*/ jsx(DropdownPanel, {
+        index: index,
+        filters: filters,
+        facetDefinitions: facetDefinitions,
+        facetDataHooks: facetDataHooks,
+        showAccessLevel: false,
+        tabTitle: tabTitle,
+        onAccessChange: setAccessLevel,
+        accessLevel: accessLevel
+    });
+};
+
+const RepositoryPanel = ({ guppyConfig, filters, table, dropdowns, buttons, loginForDownload, fileStatsConfiguration })=>{
+    useMediaQuery('(min-width: 639px)');
+    useMediaQuery('(min-width: 1373px)');
+    useMediaQuery('(min-width: 1600px)');
+    const [tableXPosition, setTableXPosition] = useState(undefined);
+    const defaultDropdowns = useMemo(()=>dropdowns ?? {}, [
+        dropdowns
+    ]);
+    const defaultButtons = useMemo(()=>buttons ?? [], [
+        buttons
+    ]);
+    const [accessLevel, setAccessLevel] = useState(Accessibility.ALL);
+    const index = guppyConfig.dataType;
+    useMemo(()=>getAllFieldsFromFilterConfigs(filters?.tabs ?? []), [
+        filters?.tabs
+    ]);
+    const repositoryFilters = useCoreSelector((state)=>selectIndexFilters(state, index));
+    const { data: fileSizeSliceData, isFetching: isFileSizeFetching } = useTotalFileSizeQuery({
+        repositoryFilters: repositoryFilters,
+        ...fileStatsConfiguration
+    });
+    if (fileStatsConfiguration) return /*#__PURE__*/ jsx(TableXPositionContext.Provider, {
+        value: {
+            xPosition: tableXPosition,
+            setXPosition: setTableXPosition
         },
-        children: /*#__PURE__*/ jsx(FacetTabs, {
-            activeTab: activeTab,
-            setActiveTab: setActiveTab,
-            facetDefinitions: facetDefinitions,
-            tabsConfig: tabsConfig,
-            usedFacets: cohortBuilderFilters,
-            hooks: facetDataHooks,
-            customFacetHooks: {
-                useCustomFacets,
-                useAvailableCustomFacets: (usedFacets, onlyFiltersWithValues, queryOptions)=>({
-                        data: {},
-                        isSuccess: true
+        children: /*#__PURE__*/ jsx("div", {
+            className: "flex flex-col mt-3 relative px-4 bg-base-lightest w-full",
+            children: /*#__PURE__*/ jsxs("div", {
+                className: "flex w-full pt-2",
+                children: [
+                    /*#__PURE__*/ jsx("div", {
+                        id: "cohort-builder-filters",
+                        className: "flex-shrink-0 md:w-1/4 lg:w-1/5",
+                        children: filters?.tabs && /*#__PURE__*/ jsx(FileFacetPanel, {
+                            index: index,
+                            filters: filters,
+                            tabTitle: "Files",
+                            fieldMapping: guppyConfig?.fieldMapping ?? []
+                        })
                     }),
-                useAddCustomFilter: ()=>(filter)=>{},
-                useRemoveCustomFilter: ()=>(filter)=>{}
-            },
-            getFacetLabel: ()=>'Cases',
-            cardScrollMargin: calculateStickyHeaderHeight(),
-            useFieldNameToTitle: useFieldNameToTitle
+                    /*#__PURE__*/ jsx("div", {
+                        id: "cohort-builder-content",
+                        className: "flex flex-col md:w-3/4 lg:w-4/5 pl-4",
+                        children: table?.enabled && /*#__PURE__*/ jsx(ExplorerTable, {
+                            index: index,
+                            tableConfig: table,
+                            accessibility: accessLevel,
+                            additionalControls: /*#__PURE__*/ jsx(DownloadsPanel, {
+                                dropdowns: defaultDropdowns,
+                                buttons: defaultButtons,
+                                loginForDownload: loginForDownload,
+                                index: index,
+                                totalCount: fileSizeSliceData.totalCaseCount ?? 0,
+                                fields: table?.fields ?? [],
+                                filter: repositoryFilters
+                            }),
+                            tableTotalDetail: /*#__PURE__*/ jsx("div", {
+                                className: "ml-auto",
+                                children: /*#__PURE__*/ jsx(Stats, {
+                                    totalFileCount: fileSizeSliceData.totalFileCount,
+                                    totalCaseCount: fileSizeSliceData.totalCaseCount,
+                                    totalFileSize: fileSizeSliceData.totalFileSize,
+                                    isFetching: isFileSizeFetching
+                                })
+                            })
+                        })
+                    })
+                ]
+            })
         })
     });
 };
 
+const validateObjectHasRequiredFields = (obj, requiredFields)=>requiredFields.every((field)=>obj[field] !== undefined);
+
+const Repository = ({ filters, guppyConfig, table, buttons, loginForDownload, dropdowns, fileStatsConfiguration })=>{
+    if (!fileStatsConfiguration || !validateObjectHasRequiredFields(fileStatsConfiguration, Object.keys(fileStatsConfiguration))) {
+        return /*#__PURE__*/ jsx(MessagePage, {
+            children: /*#__PURE__*/ jsx(ErrorCard, {
+                message: "Invalid file stats configuration"
+            })
+        });
+    }
+    return /*#__PURE__*/ jsx(RepositoryPanel, {
+        guppyConfig: guppyConfig,
+        filters: filters,
+        table: table,
+        dropdowns: dropdowns,
+        buttons: buttons,
+        loginForDownload: loginForDownload,
+        fileStatsConfiguration: fileStatsConfiguration
+    }, "Repository-Panel");
+};
+
 /**
  * Fetches graphql data from a graphql endpoint if one is specified, or guppy by default.
  * @param graphQLEndpoint - The location of the graphql endpoint.
@@ -14053,7 +14930,7 @@ const WorkspaceStatusProvider = ({ children })=>{
                 id: id,
                 status: WorkspaceStatus.Launching,
                 requestedStatus: RequestedWorkspaceStatus.Launch,
-                requestedStatusTimestamp: getCurrentTimestamp()
+                requestedStatusTimestamp: getCurrentTimestamp$1()
             }));
         };
         const toggleFullscreen = ()=>switchScreenMode();
@@ -15308,7 +16185,6 @@ var ContentSource$1 = ContentSource.getInstance();
         if (isHeaderMetadata(loadedHeaderMetadata)) {
             headerMetadata = loadedHeaderMetadata;
         } else {
-            console.log('loadedHeaderMetadata', loadedHeaderMetadata);
             console.warn('headerMetadata is not a valid HeaderMetadata object');
         }
     } catch (error) {
@@ -19159,7 +20035,7 @@ const PropertiesTable = ({ properties, required, category, subCategory, selected
                 header: 'Type',
                 size: 90,
                 Cell: ({ cell, row })=>{
-                    return /*#__PURE__*/ jsx(List, {
+                    return /*#__PURE__*/ jsx(List$1, {
                         size: "sm",
                         spacing: "xs",
                         center: true,
@@ -19170,7 +20046,7 @@ const PropertiesTable = ({ properties, required, category, subCategory, selected
                             size: "0.5rem"
                         }),
                         id: `${category}-${subCategory}-${row.original.property_id}-list`,
-                        children: cell.getValue().map((type, index)=>/*#__PURE__*/ jsx(List.Item, {
+                        children: cell.getValue().map((type, index)=>/*#__PURE__*/ jsx(List$1.Item, {
                                 children: type
                             }, `${row.original.property_id}-${type}-${index}`))
                     });
@@ -19370,6 +20246,428 @@ var CategoryPanel$1 = /*#__PURE__*/ React__default.memo(CategoryPanel, (prevProp
     return prevProps.category === nextProps.category && selectedItems.node === prevProps.category && prevProps.selectedId === nextProps.selectedId && prevProps.scrollToSelection === nextProps.scrollToSelection;
 });
 
+/**
+ * Get subgroup links from link
+ * @param {object} link - array of links
+ * @param {object} nameToNode - key (node name) value (node object) map
+ * @param {string} sourceId - source id for subgroup links
+ * This function traverse links recursively and return all nested subgroup lnks
+ */ const getSubgroupLinks = (link, nameToNode, sourceId)=>{
+    let subgroupLinks = [];
+    if (link.subgroup) {
+        link.subgroup.forEach((sgLink)=>{
+            if (sgLink.subgroup) {
+                subgroupLinks = subgroupLinks.concat(getSubgroupLinks(sgLink, nameToNode, sourceId));
+            } else {
+                subgroupLinks.push({
+                    source: nameToNode[sourceId],
+                    target: nameToNode[sgLink.target_type],
+                    exists: 1,
+                    ...sgLink
+                });
+            }
+        });
+    }
+    return subgroupLinks;
+};
+/**
+ * Given a data dictionary that defines a set of nodes
+ *    and edges, returns the nodes and edges in correct format
+ *
+ * @method createNodesAndEdges
+ * @param props: Object (normally taken from redux state) that includes dictionary
+ *    property defining the dictionary as well as other optional properties
+ *    such as counts_search and links_search (created by getCounts) with
+ *    information about the number of each type (node) and link (between
+ *    nodes with a link's source and target types) that actually
+ *    exist in the data
+ * @param createAll: Include all nodes and edges or only those that are populated in
+ *    counts_search and links_search
+ * @param nodesToHide: Array of nodes to hide from graph
+ * @returns { nodes, edges } Object containing nodes and edges
+ */ function createNodesAndEdges(props, createAll, nodesToHide = [
+    'program'
+]) {
+    const { dictionary } = props;
+    const nodes = Object.keys(dictionary).filter((key)=>!key.startsWith('_') && dictionary[key].type === 'object' && dictionary[key].category !== 'internal' && !nodesToHide.includes(key)).map((key)=>{
+        let count = 0;
+        if (props.counts_search) {
+            count = props.counts_search[`_${key}_count`];
+        }
+        return {
+            name: dictionary[key].title,
+            count,
+            ...dictionary[key]
+        };
+    }).filter((node)=>createAll);
+    const nameToNode = nodes.reduce((db, node)=>{
+        db[node.id] = node;
+        return db;
+    }, {});
+    const hideDb = nodesToHide.reduce((db, name)=>{
+        db[name] = true;
+        return db;
+    }, {});
+    const edges = nodes.filter((node)=>node.links !== undefined && node.links.length > 0).reduce((list, node)=>{
+        const newLinks = node.links.map((link)=>({
+                source: node,
+                target: nameToNode[link.target_type],
+                exists: 1,
+                ...link
+            }));
+        return list.concat(newLinks);
+    }, []).reduce((list, link)=>{
+        let result = list;
+        if (link.target) {
+            result.push(link);
+        }
+        if (link.subgroup) {
+            const sgLinks = getSubgroupLinks(link, nameToNode, link.source.id);
+            result = result.concat(sgLinks);
+        }
+        return result;
+    }, []).filter(// target type exist and is not in hide list
+    (link)=>link.target && link.target.id in nameToNode && !(link.target.id in hideDb)).map((link)=>{
+        // decorate each link with its "exists" count if available
+        //  (number of instances of link between source and target types in the data)
+        const res = link;
+        res.exists = props.links_search ? props.links_search[`${res.source.id}_${res.name}_to_${res.target.id}_link`] : 0;
+        return res;
+    }).filter(// filter out if no instances of this link exists and createAll is not specified
+    (link)=>createAll);
+    return {
+        nodes,
+        edges
+    };
+}
+/**
+ * Find the root of the given graph (no edges out)
+ * @method findRoot
+ * @param nodes
+ * @param edges
+ * @return {string} rootName or null if no root
+ */ function findRoot(nodes, edges) {
+    const couldBeRoot = edges.reduce((db, edge)=>{
+        // At some point the d3 force layout converts
+        //   edge.source and edge.target into node references ...
+        const sourceName = typeof edge.source === 'object' ? edge.source.id : edge.source;
+        if (db[sourceName]) {
+            db[sourceName] = false;
+        }
+        return db;
+    }, // initialize emptyDb - any node could be the root
+    nodes.reduce((emptyDb, node)=>{
+        const res = emptyDb;
+        res[node.id] = true;
+        return res;
+    }, {}));
+    const rootNode = nodes.find((n)=>couldBeRoot[n.id]);
+    return rootNode ? rootNode.id : null;
+}
+/**
+ * Recursive helper function for getTreeHierarchy
+ * Returns the hierarchy of the tree in the form of a map
+ * Each (key, value) consists of (node, node's descendants including the node itself)
+ * @method getTreeHierarchyHelper
+ * @param root
+ * @param name2EdgesIn
+ * @param hierarchy
+ * @return {map}
+ */ function getTreeHierarchyHelper(node, name2EdgesIn, hierarchy) {
+    const descendants = new Set();
+    descendants.add(node);
+    hierarchy.set(node, descendants);
+    name2EdgesIn[node].forEach((edge)=>{
+        const sourceName = typeof edge.source === 'object' ? edge.source.id : edge.source;
+        if (!hierarchy.get(sourceName)) {
+            hierarchy = getTreeHierarchyHelper(sourceName, name2EdgesIn, hierarchy);
+            descendants.add(sourceName);
+            hierarchy.get(sourceName).forEach((n)=>{
+                descendants.add(n);
+            });
+        }
+    });
+    hierarchy.set(node, descendants);
+    return hierarchy;
+}
+/**
+ * Returns the hierarchy of the tree in the form of a map
+ * Each (key, value) consists of (node, node's descendants including the node itself)
+ * @method getTreeHierarchy
+ * @param root
+ * @param name2EdgesIn
+ * @return {map}
+ */ function getTreeHierarchy(root, name2EdgesIn) {
+    return getTreeHierarchyHelper(root, name2EdgesIn, new Map());
+}
+/**
+ * Arrange nodes in dictionary graph breadth first, and build level database.
+ * If a node links to multiple parents, then place it under the highest parent ...
+ * Exported for testing.
+ *
+ * @param {Array} nodes
+ * @param {Array} edges
+ * @return { nodesBreadthFirst, treeLevel2Names, name2Level } where
+ *          nodesBreadthFirst is array of node names, and
+ *          treeLevel2Names is an array of arrays of node names,
+ *          and name2Level is a mapping of node name to level
+ */ function nodesBreadthFirst(nodes, edges) {
+    const result = {
+        bfOrder: [],
+        treeLevel2Names: [],
+        name2Level: {}
+    };
+    // mapping of node name to edges that point into that node
+    const name2EdgesIn = edges.reduce((db, edge)=>{
+        // At some point the d3 force layout converts edge.source
+        //   and edge.target into node references ...
+        const targetName = typeof edge.target === 'object' ? edge.target.id : edge.target;
+        if (db[targetName]) {
+            db[targetName].push(edge);
+        } else {
+            console.error(`Edge points to unknown node: ${targetName}`);
+        }
+        return db;
+    }, // initialize emptyDb - include nodes that have no incoming edges (leaves)
+    nodes.reduce((emptyDb, node)=>{
+        const res = emptyDb;
+        res[node.id] = [];
+        return res;
+    }, {}));
+    // root node has no edges coming out of it, just edges coming in
+    const root = findRoot(nodes, edges);
+    if (!root) {
+        console.log('Could not find root of given graph');
+        return result;
+    }
+    const processedNodes = new Set(); // account for nodes that link to multiple other nodes
+    let queue = [];
+    queue.push({
+        query: root,
+        level: 0
+    });
+    // just 2b safe - could be user gives us a graph without a 'project'
+    if (!name2EdgesIn[root]) {
+        name2EdgesIn[root] = [];
+    }
+    const name2ActualLvl = {};
+    const hierarchy = getTreeHierarchy(root, name2EdgesIn);
+    // Run through this once to determine the actual level of each node
+    for(let head = 0; head < queue.length; head += 1){
+        const { query, level } = queue[head]; // breadth first
+        name2ActualLvl[query] = level;
+        name2EdgesIn[query].forEach((edge)=>{
+            // At some point the d3 force layout converts edge.source
+            //   and edge.target into node references ...
+            const sourceName = typeof edge.source === 'object' ? edge.source.id : edge.source;
+            if (name2EdgesIn[sourceName]) {
+                const isAncestor = hierarchy.get(sourceName).has(query);
+                // only push node if it is not an ancestor of the current node, or else --> cycle
+                if (!isAncestor) {
+                    queue.push({
+                        query: sourceName,
+                        level: level + 1
+                    });
+                }
+            } else {
+                console.log(`Edge comes from unknown node ${sourceName}`);
+            }
+        });
+    }
+    // Reset and run for real
+    queue = [];
+    queue.push({
+        query: root,
+        level: 0
+    });
+    // queue.shift is O(n), so just keep pushing, and move the head
+    for(let head = 0; head < queue.length; head += 1){
+        const { query, level } = queue[head]; // breadth first
+        result.bfOrder.push(query);
+        processedNodes.add(query);
+        if (result.treeLevel2Names.length <= level) {
+            result.treeLevel2Names.push([]);
+        }
+        result.treeLevel2Names[level].push(query);
+        result.name2Level[query] = level;
+        name2EdgesIn[query].forEach((edge)=>{
+            // At some point the d3 force layout converts edge.source
+            //   and edge.target into node references ...
+            const sourceName = typeof edge.source === 'object' ? edge.source.id : edge.source;
+            if (name2EdgesIn[sourceName]) {
+                if (!processedNodes.has(sourceName) && name2ActualLvl[sourceName] === level + 1) {
+                    //
+                    // edge source has not yet been processed via another link from the source
+                    // to a node higher in the graph
+                    //
+                    processedNodes.add(sourceName); // don't double-queue a node
+                    queue.push({
+                        query: sourceName,
+                        level: level + 1
+                    });
+                }
+            } else {
+                console.log(`Edge comes from unknown node ${sourceName}`);
+            }
+        });
+    }
+    return result;
+}
+const placeNodesOnGraph = (treeLevel2Names, nodesById)=>{
+    let currentX = 0;
+    let currentY = 0;
+    const xSpacing = 300;
+    const ySpacing = 100;
+    const positions = [];
+    treeLevel2Names.forEach((level)=>{
+        level.forEach((id)=>{
+            positions.push({
+                id: id,
+                name: nodesById[id].name,
+                x: currentX,
+                y: currentY
+            });
+            currentY += ySpacing;
+        });
+        currentY = 0;
+        currentX += xSpacing;
+    });
+    return positions;
+};
+const linksForGraph = (edges)=>{
+    return edges.map((edge)=>{
+        return {
+            source: edge.source.id,
+            target: edge.target.id
+        };
+    });
+};
+//TODO posably get this from somewhere else
+// object of nodes by ID for easy lookup
+const getNodesById = (nodes)=>{
+    return nodes.reduce((db, node)=>{
+        db[node.id] = node;
+        return db;
+    }, {});
+};
+const formatDataForGraph = (categories)=>{
+    //TODO cash all this unchanging data
+    const { nodes, edges } = createNodesAndEdges({
+        dictionary: categories
+    }, true, []);
+    const nodeTree = nodesBreadthFirst(nodes, edges);
+    console.log('nodes edges', nodes, edges);
+    console.log('nodesBreadthFirst', nodeTree);
+    const nodesById = getNodesById(nodes);
+    const graphData = placeNodesOnGraph(nodeTree.treeLevel2Names, nodesById);
+    console.log('placeNodesOnGraph', graphData);
+    const graphLinks = linksForGraph(edges);
+    console.log('linksForGraph', graphLinks);
+    return {
+        data: graphData,
+        links: graphLinks
+    };
+};
+
+const GraphView = ({ categories, dictionary, selectedId })=>{
+    const [zoomLevel, setZoomLevel] = useState(0); // TODO Start here for zoom level
+    const dataAndLinks = formatDataForGraph(dictionary);
+    console.log('GraphView dictionary', dictionary);
+    console.log('GraphView categories', categories);
+    console.log('GraphView selectedId', selectedId);
+    const chartDefinition = useMemo(()=>{
+        return {
+            tooltip: {
+                trigger: 'item',
+                triggerOn: 'mousemove'
+            },
+            toolbox: {
+                show: true,
+                left: 'left',
+                orient: 'vertical',
+                itemSize: 30,
+                iconStyle: {
+                    borderWidth: 0,
+                    opacity: 0.8
+                },
+                emphasis: {
+                    iconStyle: {
+                        opacity: 1,
+                        color: '#3283c8'
+                    }
+                },
+                feature: {
+                    restore: {
+                        show: true,
+                        title: 'Reset',
+                        icon: 'image://data:image/gif;base64,R0lGODlhHgAeAKEAADKDyP///zKDyDKDyCH5BAEKAAIALAAAAAAeAB4AAAJChI+py+0Powm02irP3TRPfnkAJjZkuZxooq5a57Jw/AY00sY5lO+PjwKWhCKix5hBSpQRJm+2BFmKUueoCr1pt5ICADs='
+                    },
+                    myZoomIn: {
+                        show: true,
+                        title: 'Zoom In',
+                        icon: 'image://data:image/gif;base64,R0lGODlhHgAeAKEAADKDyP///zKDyDKDyCH5BAEKAAIALAAAAAAeAB4AAAJAhI+py+0PIww0yFnvq1Y37n1ZuICkYp5Iqhps+27cTNfdauc0qvcU79NpYiciyRhCepTDUcvlfDIvU0n1ic2GCgA7',
+                        onclick: (params)=>{
+                            const series = params?.option?.series;
+                            const zoom = series && series[0] ? series[0].zoom : 1;
+                            setZoomLevel((zoom || 1) + 0.1);
+                        }
+                    },
+                    myZoomOut: {
+                        show: true,
+                        title: 'Zoom Out',
+                        icon: 'image://data:image/gif;base64,R0lGODlhHgAeAKEAADKDyP///zKDyDKDyCH5BAEKAAIALAAAAAAeAB4AAAIohI+py+0Po5y02ouz3rz7PwXiSJbmqJzqmq4u2b4vSNf2jef6zvd1AQA7',
+                        onclick: (params)=>{
+                            const series = params?.option?.series;
+                            const zoom = series && series[0] ? series[0].zoom : 1;
+                            setZoomLevel((zoom || 1) - 0.1);
+                        }
+                    }
+                }
+            },
+            //https://echarts.apache.org/en/option.html#legend
+            series: {
+                type: 'graph',
+                roam: true,
+                zoom: zoomLevel,
+                label: {
+                    show: true,
+                    position: 'right',
+                    backgroundColor: 'white'
+                },
+                symbol: 'circle',
+                emphasis: {
+                    focus: 'adjacency'
+                },
+                //edgeSymbol: ['circle', 'circle'],
+                //edgeSymbolSize: [4, 4],
+                lineStyle: {
+                    opacity: 0.9,
+                    width: 2,
+                    curveness: 0,
+                    cap: 'square'
+                },
+                //https://echarts.apache.org/en/option.html#series-tree.data
+                data: dataAndLinks.data,
+                links: dataAndLinks.links,
+                top: '10%',
+                left: '5%'
+            }
+        };
+    }, [
+        dataAndLinks,
+        zoomLevel
+    ]);
+    //TODO: import real data
+    //TODO: connections between nodes
+    //TODO: ZOOM IN AND OUT AND MOVE AROUND controls? 
+    return /*#__PURE__*/ jsx("div", {
+        className: "w-full h-full min-h-[800px]",
+        children: /*#__PURE__*/ jsx(ReactECharts, {
+            option: chartDefinition
+        })
+    });
+};
+
 const Dictionary = ()=>{
     const [selectedId, setSelectedId] = useState('');
     const [view, setView] = useState('table');
@@ -19388,6 +20686,11 @@ const Dictionary = ()=>{
         scrollIntoView,
         targetRef
     ]);
+    const categoryPanelTable = Object.keys(categories).length && Object.keys(categories).map((category)=>/*#__PURE__*/ jsx(CategoryPanel$1, {
+            category: category,
+            selectedId: selectedId,
+            scrollToSelection: scrollToSelection
+        }, category));
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
             /*#__PURE__*/ jsx("div", {
@@ -19428,11 +20731,26 @@ const Dictionary = ()=>{
                 ref: scrollableRef,
                 children: /*#__PURE__*/ jsx("div", {
                     className: "h-full",
-                    children: Object.keys(categories).length && Object.keys(categories).map((category)=>/*#__PURE__*/ jsx(CategoryPanel$1, {
-                            category: category,
-                            selectedId: selectedId,
-                            scrollToSelection: scrollToSelection
-                        }, category))
+                    children: config?.showGraph ? /*#__PURE__*/ jsxs(Tabs, {
+                        value: view,
+                        keepMounted: false,
+                        className: "h-full",
+                        children: [
+                            /*#__PURE__*/ jsx(Tabs.Panel, {
+                                value: "table",
+                                children: categoryPanelTable
+                            }),
+                            /*#__PURE__*/ jsx(Tabs.Panel, {
+                                value: "graph",
+                                className: "h-full",
+                                children: /*#__PURE__*/ jsx(GraphView, {
+                                    categories: categories,
+                                    dictionary: dictionary,
+                                    selectedId: selectedId
+                                })
+                            })
+                        ]
+                    }) : categoryPanelTable
                 })
             })
         ]
@@ -19484,7 +20802,7 @@ const buildValueElements = (element)=>{
         case 'string':
             return /*#__PURE__*/ jsx("span", {});
         case 'enum':
-            return /*#__PURE__*/ jsx(List, {
+            return /*#__PURE__*/ jsx(List$1, {
                 size: "sm",
                 spacing: "xs",
                 center: true,
@@ -19495,7 +20813,7 @@ const buildValueElements = (element)=>{
                     size: "0.5rem"
                 }),
                 id: `${element.id}-enum-value-list`,
-                children: element?.enum?.map((value)=>/*#__PURE__*/ jsx(List.Item, {
+                children: element?.enum?.map((value)=>/*#__PURE__*/ jsx(List$1.Item, {
                         children: value
                     }, `value-enum-${element.id}-${value}`))
             });
@@ -20499,7 +21817,7 @@ const GetSharedFieldMapping = async (cohortBuilderConfiguration)=>{
     }
     return sharedFiltersMap;
 };
-const DefaultAccessControlConfiguration = {
+const DefaultAccessControlConfiguration$1 = {
     dataMode: GuppyDataAccessMode.REGULAR,
     tierLimit: -1,
     showAccessLevelControl: false
@@ -20527,7 +21845,7 @@ const ExplorerPageGetServerSideProps = async ()=>{
                 explorerConfig: cohortBuilderConfiguration.explorerConfig,
                 //  headerMetadata: cohortBuilderConfiguration.headerMetadata,
                 accessControl: {
-                    ...DefaultAccessControlConfiguration,
+                    ...DefaultAccessControlConfiguration$1,
                     ...cohortBuilderConfiguration.accessControl ?? {}
                 }
             }
@@ -20568,7 +21886,7 @@ const ExplorerPageGetServerSidePropsForConfigId = async (context)=>{
                 explorerConfig: cohortBuilderConfiguration.explorerConfig,
                 // headerMetadata: { ...(cohortBuilderConfiguration?.headerMetadata ? cohortBuilderConfiguration.headerMetadata : {}) },
                 accessControl: {
-                    ...DefaultAccessControlConfiguration,
+                    ...DefaultAccessControlConfiguration$1,
                     ...cohortBuilderConfiguration.accessControl ?? {}
                 }
             }
@@ -25909,7 +27227,7 @@ const TabbedCohortBuilderPage = ({ headerProps, footerProps, configuration })=>{
                     children: [
                         /*#__PURE__*/ jsx(CohortManager$1, {
                             rightPanel: /*#__PURE__*/ jsx(CountsPanel, {
-                                index: "case"
+                                index: configuration.index
                             })
                         }),
                         /*#__PURE__*/ jsx(QueryExpression, {
@@ -25918,7 +27236,7 @@ const TabbedCohortBuilderPage = ({ headerProps, footerProps, configuration })=>{
                     ]
                 }),
                 /*#__PURE__*/ jsx("div", {
-                    className: "w-full mt-60 mr-4",
+                    className: "w-full mt-80 mr-4",
                     children: /*#__PURE__*/ jsx(TabbedCohortBuilder, {
                         ...configuration
                     })
@@ -25951,6 +27269,65 @@ const TabbedCohortBuilderPageGetServerSideProps = async ()=>{
     }
 };
 
+const RepositoryPage = ({ headerProps, footerProps, configuration, headerMetadata })=>{
+    if (configuration === undefined) {
+        return /*#__PURE__*/ jsx(Center, {
+            maw: 400,
+            h: 100,
+            mx: "auto",
+            children: /*#__PURE__*/ jsx("div", {
+                children: "Repository config is not defined. Page disabled"
+            })
+        });
+    }
+    console.log('RepositoryPage', configuration);
+    return /*#__PURE__*/ jsx(NavPageLayout, {
+        headerProps,
+        footerProps,
+        headerMetadata: {
+            title: 'Gen3 Repository Page',
+            content: 'Repository Page',
+            key: 'gen3-repository-page',
+            ...headerMetadata ? headerMetadata : {},
+            ...configuration?.headerMetadata ? configuration.headerMetadata : {}
+        },
+        children: /*#__PURE__*/ jsx(Repository, {
+            ...configuration
+        })
+    });
+};
+
+const DefaultAccessControlConfiguration = {
+    dataMode: GuppyDataAccessMode.REGULAR,
+    tierLimit: -1,
+    showAccessLevelControl: false
+};
+const RepositoryPageGetServerSideProps = async ()=>{
+    try {
+        const repositoryConfiguration = await ContentSource$1.getContentDatabase().get(`${GEN3_COMMONS_NAME}/repository.json`);
+        return {
+            props: {
+                ...await getNavPageLayoutPropsFromConfig(),
+                configuration: repositoryConfiguration,
+                //  headerMetadata: cohortBuilderConfiguration.headerMetadata,
+                accessControl: {
+                    ...DefaultAccessControlConfiguration
+                }
+            }
+        };
+    } catch (err) {
+        if (err instanceof Error) {
+            console.warn('Explorer config cannot be read', err);
+        }
+        return {
+            props: {
+                ...await getNavPageLayoutPropsFromConfig(),
+                configuration: undefined
+            }
+        };
+    }
+};
+
 const TailwindConfig = (themer)=>{
     return {
         important: '#__next',
@@ -26397,5 +27774,5 @@ const staticNotebookAPI = async (req, res)=>{
     });
 };
 
-export { AISearchPageGetServerSideProps, AccessLevel, AccordionPanel, ActionBar, ActionButton, AdminAuthZPageGetServerSideProps, AiSearch, AISearchPage as AiSearchPage, AnalysisCenter, AnalysisCenterWithSections, AnalysisEditorPage, AnalysisEditorPageGetServerSideProps, AnalysisPage, AnalysisPageGetServerSideProps, AuthzPage, BAD_DATA_MESSAGE, Banner, BaseModal, Charts, CohortBuilder$1 as CohortBuilder, CohortManager$1 as CohortManager, CohortManagerAndExpression, CollapsableCharts, CollapsableSidebar, ColorThemePage, ColorThemePageGetServerSideProps, ContentSource$1 as ContentSource, CountsValue, CreateCredentialsAPIKeyModal, CrosswalkPage, CrosswalkPageGetServerSideProps, Custom404Page, DAYS_IN_YEAR, DEFAULT_MAXIMUM, DEFAULT_MINIMUM, DEFAULT_VISIBLE_ITEMS$1 as DEFAULT_VISIBLE_ITEMS, DataLibraryPage, DataLibraryPageGetServerSideProps, DictionaryPage, DictionaryPageGetServerSideProps, DiscoveryCellRendererFactory, DiscoveryProvider as DiscoveryConfigProvider, DiscoveryIndexPanel, DiscoveryPage, DiscoveryPageGetServerSideProps, DiscoveryRowRendererFactory, DropdownButton, DropdownPanel, DropdownWithIcon, EnumFacet, EnumFacetChart, ErrorCard, ExactValueFacet, ExplorerPage, ExplorerPageGetServerSideProps, ExplorerPageGetServerSidePropsForConfigId, ExplorerTableCellRendererFactory, ExplorerTableDetailsPanelFactory, FacetControlsHeader, FacetExpander, FacetSelector, FacetSortPanel, FacetTabs, FiltersPanel, FirstTimeModal, Footer, Gen3Button, Gen3ButtonReverse, Gen3Link, Gen3ModalsProvider, Gen3Provider, GqlQueryEditor$1 as GqlQueryEditor, Header$1 as Header, HoverLink, LandingPage, LandingPageGetServerSideProps, LoginButton$1 as LoginButton, LoginPage, LoginPageGetServerSideProps, LoginPanel, LoginProvidersPanel, MinutesToMilliseconds, MultiSelectValueFacet, NavPageLayout, NavigationBar, NavigationButton, NoAccessModal, NotebookLitePage, NotebookLitePageGetStaticProps, ProfilePage, ProfilePageGetServerSideProps, ProfileProvider, ProtectedContent, QueryExpression, QueryExpressionContext, QueryExpressionSection, QueryPage, QueryPageGetServerSideProps, RangeFacet, ReactECharts, ResourcesFilters, SPECIAL_CASE_FIELDS, SegmentedControl, SessionExpiredModal, SinglePageStudyDetailsPanel, StaticNotebookIFrame, StaticNotebookViewer, StudyDetailsPanel, StudyGroup, StudyGroupPanel, StudyProvider, SubmissionPage, SubmissionPageGetServerSideProps, TabbedCohortBuilder, TabbedCohortBuilderPage, TabbedCohortBuilderPageGetServerSideProps, TabbedPanel, TagCloud, TailwindConfig, TopBar, UploadJSONButton, User, Workspace, WorkspaceNoAccessPage, WorkspaceNoAccessPageServerSideProps, WorkspacePage, WorkspacePageGetServerSideProps, accessibleFieldName, addIntersectionToIncludes, addUnion, analysisApiCohortDiscovery, buildNested, capitalize, classifyFacets, compareKeysAscending, compareKeysDescending, computeRowSpan, convertMinutesToMilliseconds, convertPathsToTree, convertSecondsToMilliseconds, convertToStringArray, create10ColorAccessibleContrast, create10ColorPallet, createMantineTheme, credentialsLogin, credentialsLogout, extractObjectKey, extractRangeValues, filterAggregationsDataKeys, focusStyles, getAllFieldsFromFilterConfigs, getCurrentUnixTimestamp, getNavPageLayoutPropsFromConfig, getParamsValueAsString, getTagInfo, hasOwnProperty, isArrayOfString, isEnumFacetResponse, isHeaderMetadata, isPropertyKey, isTextTransform$1 as isTextTransform, mapFacetSortToSortType, processBucketData, processLabel$1 as processLabel, processRangeData, processRangeKeyLabel, registerCohortBuilderDefaultPreviewRenderers, registerCohortDiscoveryApp, registerCohortSimilarityApp, registerDefaultDiscoveryDataLoaders, registerDiscoveryDefaultCellRenderers, registerDiscoveryDefaultStudyPreviewRenderers, registerExplorerDefaultCellRenderers, registerMetadataSchemaApp, removeIntersectionFromEnum, removeKey$1 as removeKey, removeUnion, resourcePathFromProjectID, sessionLogout, sessionToken, staticNotebookAPI, stripTrailingSlash, toCountsString, toDisplayName, truncateString, unixTimeToString, updateFacetEnum, useClearFilters$1 as useClearFilters, useDiscoveryContext, useExtractEnumFilterValues, useExtractRangeFilterValues, useFieldNameToTitle, useGetFacetFilters$1 as useGetFacetFilters, useUpdateFilters$1 as useUpdateFilters, userHasMethodForServiceOnResource$1 as userHasMethodForServiceOnResource };
+export { AISearchPageGetServerSideProps, AccessLevel, AccordionPanel, ActionBar, ActionButton, AdminAuthZPageGetServerSideProps, AiSearch, AISearchPage as AiSearchPage, AnalysisCenter, AnalysisCenterWithSections, AnalysisEditorPage, AnalysisEditorPageGetServerSideProps, AnalysisPage, AnalysisPageGetServerSideProps, AuthzPage, BAD_DATA_MESSAGE, Banner, BaseModal, Charts, CohortBuilder$1 as CohortBuilder, CohortManager$1 as CohortManager, CohortManagerAndExpression, CollapsableCharts, CollapsableSidebar, ColorThemePage, ColorThemePageGetServerSideProps, ContentSource$1 as ContentSource, CountsValue, CreateCredentialsAPIKeyModal, CrosswalkPage, CrosswalkPageGetServerSideProps, Custom404Page, DAYS_IN_YEAR, DEFAULT_MAXIMUM, DEFAULT_MINIMUM, DEFAULT_VISIBLE_ITEMS$1 as DEFAULT_VISIBLE_ITEMS, DataLibraryPage, DataLibraryPageGetServerSideProps, DictionaryPage, DictionaryPageGetServerSideProps, DiscoveryCellRendererFactory, DiscoveryProvider as DiscoveryConfigProvider, DiscoveryIndexPanel, DiscoveryPage, DiscoveryPageGetServerSideProps, DiscoveryRowRendererFactory, DownloadButton, DropdownButton, DropdownPanel, DropdownWithIcon, EnumFacet, EnumFacetChart, ErrorCard, ExactValueFacet, ExplorerPage, ExplorerPageGetServerSideProps, ExplorerPageGetServerSidePropsForConfigId, ExplorerTableCellRendererFactory, ExplorerTableDetailsPanelFactory, FacetControlsHeader, FacetExpander, FacetSelector, FacetSortPanel, FacetTabs, FiltersPanel, FirstTimeModal, Footer, Gen3Button, Gen3ButtonReverse, Gen3Link, Gen3ModalsProvider, Gen3Provider, GqlQueryEditor$1 as GqlQueryEditor, Header$1 as Header, HoverLink, JSONObjectDownloadButton, LandingPage, LandingPageGetServerSideProps, LoginButton$1 as LoginButton, LoginPage, LoginPageGetServerSideProps, LoginPanel, LoginProvidersPanel, MinutesToMilliseconds, MultiSelectValueFacet, NavPageLayout, NavigationBar, NavigationButton, NoAccessModal, NotebookLitePage, NotebookLitePageGetStaticProps, ProfilePage, ProfilePageGetServerSideProps, ProfileProvider, ProtectedContent, QueryExpression, QueryExpressionContext, QueryExpressionSection, QueryPage, QueryPageGetServerSideProps, RangeFacet, ReactECharts, Repository, RepositoryPage, RepositoryPageGetServerSideProps, ResourcesFilters, SPECIAL_CASE_FIELDS, SegmentedControl, SessionExpiredModal, SinglePageStudyDetailsPanel, StaticNotebookIFrame, StaticNotebookViewer, StudyDetailsPanel, StudyGroup, StudyGroupPanel, StudyProvider, SubmissionPage, SubmissionPageGetServerSideProps, TabbedCohortBuilder, TabbedCohortBuilderPage, TabbedCohortBuilderPageGetServerSideProps, TabbedPanel, TableXPositionContext, TagCloud, TailwindConfig, TopBar, UploadJSONButton, User, Workspace, WorkspaceNoAccessPage, WorkspaceNoAccessPageServerSideProps, WorkspacePage, WorkspacePageGetServerSideProps, accessibleFieldName, addIntersectionToIncludes, addUnion, analysisApiCohortDiscovery, buildNested, capitalize, classifyFacets, compareKeysAscending, compareKeysDescending, computeRowSpan, convertMinutesToMilliseconds, convertPathsToTree, convertSecondsToMilliseconds, convertToStringArray, create10ColorAccessibleContrast, create10ColorPallet, createMantineTheme, credentialsLogin, credentialsLogout, extractObjectKey, extractRangeValues, filterAggregationsDataKeys, focusStyles, getAllFieldsFromFilterConfigs, getCurrentUnixTimestamp, getFormattedTimestamp, getHighResolutionTimestamp, getNavPageLayoutPropsFromConfig, getParamsValueAsString, getTagInfo, hasOwnProperty, isArrayOfString, isEnumFacetResponse, isHeaderMetadata, isPropertyKey, isTextTransform$1 as isTextTransform, isTimeGreaterThan, mapFacetSortToSortType, measureExecutionTime, processBucketData, processLabel$1 as processLabel, processRangeData, processRangeKeyLabel, registerCohortBuilderDefaultPreviewRenderers, registerCohortDiscoveryApp, registerCohortSimilarityApp, registerDefaultDiscoveryDataLoaders, registerDiscoveryDefaultCellRenderers, registerDiscoveryDefaultStudyPreviewRenderers, registerExplorerDefaultCellRenderers, registerMetadataSchemaApp, removeIntersectionFromEnum, removeKey$1 as removeKey, removeUnion, resourcePathFromProjectID, sessionLogout, sessionToken, staticNotebookAPI, stripTrailingSlash, toCountsString, toDisplayName, truncateString, unixTimeToString, updateFacetEnum, useClearFilters$1 as useClearFilters, useDiscoveryContext, useExtractEnumFilterValues, useExtractRangeFilterValues, useFieldNameToTitle, useGetFacetFilters$1 as useGetFacetFilters, useUpdateFilters$1 as useUpdateFilters, userHasMethodForServiceOnResource$1 as userHasMethodForServiceOnResource };
 //# sourceMappingURL=index.js.map