@gen3/frontend 0.10.84 → 0.10.85

package/dist/dts/features/Analysis/types.js

@@ -1,2 +1,21 @@
-export {};
+export var isAnalysisCenterWithSectionsConfiguration = function (value) {
+    if (!value || typeof value !== 'object') {
+        return false;
+    }
+    var candidate = value;
+    // Check that sections exists and is an array
+    if (!Array.isArray(candidate.sections)) {
+        return false;
+    }
+    for (var _i = 0, _a = candidate.sections; _i < _a.length; _i++) {
+        var section = _a[_i];
+        if (!section ||
+            typeof section !== 'object' ||
+            typeof section.label !== 'string' ||
+            !Array.isArray(section.tools)) {
+            return false;
+        }
+    }
+    return true;
+};
 //# sourceMappingURL=types.js.map

package/dist/dts/features/Analysis/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/features/Analysis/types.ts"],"names":[],"mappings":""}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/features/Analysis/types.ts"],"names":[],"mappings":"AAgCA,MAAM,CAAC,IAAM,yCAAyC,GAAG,UACvD,KAAc;IAEd,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QACxC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAM,SAAS,GAAG,KAAgC,CAAC;IAEnD,6CAA6C;IAC7C,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,EAAE,CAAC;QACvC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,KAAsB,UAAkB,EAAlB,KAAA,SAAS,CAAC,QAAQ,EAAlB,cAAkB,EAAlB,IAAkB,EAAE,CAAC;QAAtC,IAAM,OAAO,SAAA;QAChB,IACE,CAAC,OAAO;YACR,OAAO,OAAO,KAAK,QAAQ;YAC3B,OAAQ,OAAiC,CAAC,KAAK,KAAK,QAAQ;YAC5D,CAAC,KAAK,CAAC,OAAO,CAAE,OAAiC,CAAC,KAAK,CAAC,EACxD,CAAC;YACD,OAAO,KAAK,CAAC;QACf,CAAC;IACH,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC"}

package/dist/dts/pages/Analysis/Analysis.d.ts

@@ -1,4 +1,4 @@
 import { AnalysisPageLayoutProps } from './types';
-declare const AnalysisPage: ({ headerProps, footerProps, tools, }: AnalysisPageLayoutProps) => JSX.Element;
+declare const AnalysisPage: ({ headerProps, footerProps, tools, sections, classNames, }: AnalysisPageLayoutProps) => JSX.Element;
 export default AnalysisPage;
 //# sourceMappingURL=Analysis.d.ts.map

package/dist/dts/pages/Analysis/Analysis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Analysis.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/Analysis.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAElD,QAAA,MAAM,YAAY,GAAI,sCAInB,uBAAuB,KAAG,GAAG,CAAC,OAahC,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"Analysis.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/Analysis.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAGlD,QAAA,MAAM,YAAY,GAAI,4DAMnB,uBAAuB,KAAG,GAAG,CAAC,OAwBhC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/dts/pages/Analysis/Analysis.js

@@ -1,13 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Center } from '@mantine/core';
 import { NavPageLayout } from '../../features/Navigation';
 import AnalysisPanel from '../../features/Analysis/AnalysisPanel';
+import AnalysisCenterWithSections from '../../features/Analysis/AnalysisCenterWithSections';
+import { ErrorCard } from '../../components/MessageCards';
 var AnalysisPage = function (_a) {
-    var headerProps = _a.headerProps, footerProps = _a.footerProps, tools = _a.tools;
-    return (_jsx(NavPageLayout, { headerProps: headerProps, footerProps: footerProps, headerData: {
+    var headerProps = _a.headerProps, footerProps = _a.footerProps, tools = _a.tools, sections = _a.sections, classNames = _a.classNames;
+    return (_jsxs(NavPageLayout, { headerProps: headerProps, footerProps: footerProps, headerData: {
             title: 'Gen3 Analysis Center',
             content: 'Analysis Center',
             key: 'gen3-analysis-center',
-        }, children: _jsx(AnalysisPanel, { tools: tools }) }));
+        }, children: [!tools && !sections && (_jsx(Center, { className: "mt-20", children: _jsx(ErrorCard, { message: "No tools or sections found" }) })), tools && _jsx(AnalysisPanel, { tools: tools }), sections && (_jsx(AnalysisCenterWithSections, { sections: sections, classNames: classNames }))] }));
 };
 export default AnalysisPage;
 //# sourceMappingURL=Analysis.js.map

package/dist/dts/pages/Analysis/Analysis.js.map

@@ -1 +1 @@
-{"version":3,"file":"Analysis.js","sourceRoot":"","sources":["../../../../src/pages/Analysis/Analysis.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAGlE,IAAM,YAAY,GAAG,UAAC,EAII;QAHxB,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,KAAK,WAAA;IAEL,OAAO,CACL,KAAC,aAAa,IACN,WAAW,aAAA,EAAE,WAAW,aAAA,EAC9B,UAAU,EAAE;YACV,KAAK,EAAE,sBAAsB;YAC7B,OAAO,EAAE,iBAAiB;YAC1B,GAAG,EAAE,sBAAsB;SAC5B,YAED,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,GAAI,GACjB,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"Analysis.js","sourceRoot":"","sources":["../../../../src/pages/Analysis/Analysis.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAClE,OAAO,0BAA0B,MAAM,oDAAoD,CAAC;AAE5F,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAE1D,IAAM,YAAY,GAAG,UAAC,EAMI;QALxB,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,UAAU,gBAAA;IAEV,OAAO,CACL,MAAC,aAAa,IACN,WAAW,aAAA,EAAE,WAAW,aAAA,EAC9B,UAAU,EAAE;YACV,KAAK,EAAE,sBAAsB;YAC7B,OAAO,EAAE,iBAAiB;YAC1B,GAAG,EAAE,sBAAsB;SAC5B,aAEA,CAAC,KAAK,IAAI,CAAC,QAAQ,IAAI,CACtB,KAAC,MAAM,IAAC,SAAS,EAAC,OAAO,YACvB,KAAC,SAAS,IAAC,OAAO,EAAC,4BAA4B,GAAG,GAC3C,CACV,EACA,KAAK,IAAI,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,GAAI,EACxC,QAAQ,IAAI,CACX,KAAC,0BAA0B,IACzB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,GACtB,CACH,IACa,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/dts/pages/Analysis/data.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/data.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,MAAM,CAAC;AAE1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAKlD,eAAO,MAAM,8BAA8B,EAAE,kBAAkB,CAC7D,uBAAuB,CAsBxB,CAAC"}
+{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/data.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,MAAM,CAAC;AAE1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAQlD,eAAO,MAAM,8BAA8B,EAAE,kBAAkB,CAC7D,uBAAuB,CAuBxB,CAAC"}

package/dist/dts/pages/Analysis/data.js

@@ -65,11 +65,11 @@ export var AnalysisPageGetServerSideProps = function () { return __awaiter(void
                     _c)];
             case 3:
                 err_1 = _e.sent();
-                console.error(err_1);
+                console.warn(err_1);
                 _d = {};
                 _b = [{}];
                 return [4 /*yield*/, getNavPageLayoutPropsFromConfig()];
-            case 4: return [2 /*return*/, (_d.props = __assign.apply(void 0, [__assign.apply(void 0, _b.concat([(_e.sent())])), { tools: [] }]),
+            case 4: return [2 /*return*/, (_d.props = __assign.apply(void 0, _b.concat([(_e.sent())])),
                     _d)];
             case 5: return [2 /*return*/];
         }

package/dist/dts/pages/Analysis/data.js.map

@@ -1 +1 @@
-{"version":3,"file":"data.js","sourceRoot":"","sources":["../../../../src/pages/Analysis/data.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,+BAA+B,EAAE,MAAM,8BAA8B,CAAC;AAG/E,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE/C,MAAM,CAAC,IAAM,8BAA8B,GAEvC;;;;;;;gBAEoD,qBAAM,aAAa,CAAC,GAAG,CACzE,iBAAU,iBAAiB,wBAAqB,CACjD,EAAA;;gBAFK,cAAc,GAAgC,SAEnD;;;gBAIO,qBAAM,+BAA+B,EAAE,EAAA;oBAF/C,uBACE,QAAK,6DACA,CAAC,SAAuC,CAAC,KACzC,cAAc,EAClB;yBACD;;;gBAEF,OAAO,CAAC,KAAK,CAAC,KAAG,CAAC,CAAC;;;gBAGX,qBAAM,+BAA+B,EAAE,EAAA;oBAF/C,uBACE,QAAK,6DACA,CAAC,SAAuC,CAAC,OAC5C,KAAK,EAAE,EAAE,IACV;yBACD;;;;KAEL,CAAC"}
+{"version":3,"file":"data.js","sourceRoot":"","sources":["../../../../src/pages/Analysis/data.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,+BAA+B,EAAE,MAAM,8BAA8B,CAAC;AAM/E,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAE/C,MAAM,CAAC,IAAM,8BAA8B,GAEvC;;;;;;;gBAI8C,qBAAM,aAAa,CAAC,GAAG,CACnE,iBAAU,iBAAiB,wBAAqB,CACjD,EAAA;;gBAJK,cAAc,GAE0B,SAE7C;;;gBAIO,qBAAM,+BAA+B,EAAE,EAAA;oBAF/C,uBACE,QAAK,6DACA,CAAC,SAAuC,CAAC,KACzC,cAAc,EAClB;yBACD;;;gBAEF,OAAO,CAAC,IAAI,CAAC,KAAG,CAAC,CAAC;;;gBAGV,qBAAM,+BAA+B,EAAE,EAAA;oBAF/C,uBACE,QAAK,qCACA,CAAC,SAAuC,CAAC,GAC7C;yBACD;;;;KAEL,CAAC"}

package/dist/dts/pages/Analysis/types.d.ts

@@ -1,6 +1,8 @@
 import { NavPageLayoutProps } from '../../features/Navigation';
-import { type AnalysisToolConfig } from '../../features/Analysis/types';
+import { type AnalysisToolConfiguration, type AnalysisCenterSection } from '../../features/Analysis/types';
 export interface AnalysisPageLayoutProps extends NavPageLayoutProps {
-    tools: Array<AnalysisToolConfig>;
+    tools?: Array<AnalysisToolConfiguration>;
+    sections?: Array<AnalysisCenterSection>;
+    classNames?: Record<string, string>;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/dts/pages/Analysis/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAExE,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,KAAK,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC;CAClC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/pages/Analysis/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EACL,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAC3B,MAAM,+BAA+B,CAAC;AAEvC,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,KAAK,CAAC,EAAE,KAAK,CAAC,yBAAyB,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,qBAAqB,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACrC"}

package/dist/esm/index.js

@@ -11934,18 +11934,35 @@ const Workspace = ({ config })=>{
 
 const TextDescription = ({ description })=>{
     const [extend, setExtend] = useState(false);
+    const textRef = useRef(null);
+    const [isClamped, setClamped] = useState(false);
+    useEffect(()=>{
+        // Function that should be called on window resize
+        function handleResize() {
+            if (textRef && textRef.current) {
+                setClamped(textRef.current.scrollHeight > textRef.current.clientHeight);
+            }
+        }
+        // Add event listener to window resize
+        window.addEventListener('resize', handleResize);
+        // Remove event listener on cleanup
+        return ()=>window.removeEventListener('resize', handleResize);
+    }, []); // Empty array ensures that it would only run on mount
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
             !extend ? /*#__PURE__*/ jsx(Text, {
+                ref: textRef,
+                size: "sm",
                 lineClamp: 4,
                 children: description
             }) : /*#__PURE__*/ jsx(Text, {
+                size: "sm",
                 children: description
             }),
-            /*#__PURE__*/ jsx("button", {
+            isClamped && /*#__PURE__*/ jsx("button", {
                 onClick: ()=>setExtend((extend)=>!extend),
                 children: /*#__PURE__*/ jsxs("div", {
-                    className: "flex text-xs font-semibold text-gray-400",
+                    className: "flex text-xs font-semibold text-base-contrast-light",
                     children: [
                         !extend ? 'Extend Text' : 'Collapse Text',
                         ' ',
@@ -11960,6 +11977,90 @@ const TextDescription = ({ description })=>{
     });
 };
 
+const AnalysisCard = ({ title, description, type, icon, image, hasDemo, loginRequired, href })=>{
+    return /*#__PURE__*/ jsx(Stack, {
+        children: /*#__PURE__*/ jsxs("div", {
+            className: "rounded-sm bg-base-max",
+            children: [
+                /*#__PURE__*/ jsx("div", {
+                    className: "p-0 rounded-sm",
+                    children: /*#__PURE__*/ jsx(Image$1, {
+                        component: Image,
+                        src: `${image}`,
+                        alt: `${title} image`,
+                        height: 1000,
+                        width: 1000,
+                        radius: "md"
+                    })
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: "flex -mt-5 relative z-10",
+                    children: [
+                        /*#__PURE__*/ jsx("div", {
+                            className: "p-0.5 rounded-sm bg-base-lightest ml-5 border-2 border-base",
+                            children: /*#__PURE__*/ jsx(Image$1, {
+                                component: Image,
+                                src: `${icon}`,
+                                alt: `${title} logo`,
+                                width: 40,
+                                height: 40,
+                                radius: "lg"
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            className: "relative mb-0 ml-2",
+                            children: /*#__PURE__*/ jsx("span", {
+                                className: "absolute bottom-0 left-0 text-xs text-gray-700 w-max",
+                                children: type === 'application' ? 'Application' : 'Jupyter Notebook'
+                            })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: "flex flex-col mt-2 ml-2",
+                    children: [
+                        /*#__PURE__*/ jsx("div", {
+                            className: "text-sm font-black h-6",
+                            children: title
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            className: "text-xs text-gray-400 h-6",
+                            children: loginRequired ? 'Login Required' : ' '
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            className: "text-sm p-2 h-fit",
+                            children: /*#__PURE__*/ jsx(TextDescription, {
+                                description: description
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            className: "flex mb-4 rounded-b-md",
+                            children: /*#__PURE__*/ jsxs("div", {
+                                className: "m-auto",
+                                children: [
+                                    /*#__PURE__*/ jsx(NavLink, {
+                                        component: Link,
+                                        href: href ?? '_blank',
+                                        classNames: {
+                                            root: 'bg-accent text-accent-contrast hover:bg-accent-darker p-2 rounded-sm',
+                                            label: 'text-sm font-semibold'
+                                        },
+                                        label: `Run ${type === 'application' ? 'App' : 'Notebook'}`
+                                    }),
+                                    hasDemo && /*#__PURE__*/ jsx("button", {
+                                        className: "ml-2 p-1.5 rounded-sm text-sm font-semibold",
+                                        children: "Demo"
+                                    })
+                                ]
+                            })
+                        })
+                    ]
+                })
+            ]
+        })
+    }, title);
+};
+
 const AnalysisCenter = ({ tools, showFilterAndSort = false })=>{
     const [cards, setCards] = useState({
         type: '',
@@ -12029,91 +12130,158 @@ const AnalysisCenter = ({ tools, showFilterAndSort = false })=>{
                 children: /*#__PURE__*/ jsx("div", {
                     className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 p-1 mx-4 overflow-y-scroll",
                     children: tools.map(({ title, description, type, icon, image, hasDemo, loginRequired, href }, key)=>{
-                        return /*#__PURE__*/ jsx(Stack, {
-                            children: /*#__PURE__*/ jsxs("div", {
-                                className: "rounded-sm bg-base-max",
+                        return /*#__PURE__*/ jsx(AnalysisCard, {
+                            title,
+                            description,
+                            type,
+                            icon,
+                            image,
+                            hasDemo,
+                            loginRequired,
+                            href,
+                            cardType: 'regular'
+                        }, title);
+                    })
+                })
+            })
+        ]
+    });
+};
+
+const AnalysisCardCompact = ({ title, description, type = 'application', icon, hasDemo = false, loginRequired = false, href, count, countUnits })=>{
+    return /*#__PURE__*/ jsxs(Stack, {
+        gap: "xs",
+        classNames: {
+            root: 'rounded-lg border-3 border-contrast bg-base-max h-full'
+        },
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "rounded-t-lg bg-secondary border-b-4 border-accent-warm h-12"
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "flex relative -mt-10 z-10 p-2 max-w-90",
+                children: /*#__PURE__*/ jsx("div", {
+                    className: "relative rounded-lg bg-base-lightest ml-5 border-4 border-base-light mx-2 w-1/4 aspect-square",
+                    children: /*#__PURE__*/ jsx(Image$1, {
+                        component: Image,
+                        src: `${icon}`,
+                        alt: `${title} logo`,
+                        fill: true,
+                        fit: "cover",
+                        radius: "lg"
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "flex flex-col ml-2 px-4 pb-2 h-full justify-between",
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        className: "flex flex-col",
+                        children: [
+                            /*#__PURE__*/ jsx(Text, {
+                                fw: "bold",
+                                classNames: {
+                                    root: 'font-header sm:text-xl lg:text-2xl'
+                                },
+                                children: title
+                            }),
+                            /*#__PURE__*/ jsxs(Text, {
+                                size: "md",
+                                fw: "semibold",
+                                c: "base-contrast.5",
                                 children: [
-                                    /*#__PURE__*/ jsx("div", {
-                                        className: "p-0 rounded-sm",
-                                        children: /*#__PURE__*/ jsx(Image$1, {
-                                            component: Image,
-                                            src: `${image}`,
-                                            alt: `${title} image`,
-                                            height: 1000,
-                                            width: 1000,
-                                            radius: "md"
-                                        })
-                                    }),
-                                    /*#__PURE__*/ jsxs("div", {
-                                        className: "flex -mt-5 relative z-10",
-                                        children: [
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "p-0.5 rounded-sm bg-base-lightest ml-5 border-2 border-base",
-                                                children: /*#__PURE__*/ jsx(Image$1, {
-                                                    component: Image,
-                                                    src: `${icon}`,
-                                                    alt: `${title} logo`,
-                                                    width: 40,
-                                                    height: 40,
-                                                    radius: "lg"
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "relative mb-0 ml-2",
-                                                children: /*#__PURE__*/ jsx("span", {
-                                                    className: "absolute bottom-0 left-0 text-xs text-gray-700 w-max",
-                                                    children: type === 'application' ? 'Application' : 'Jupyter Notebook'
-                                                })
-                                            })
-                                        ]
-                                    }),
-                                    /*#__PURE__*/ jsxs("div", {
-                                        className: "flex flex-col mt-2 ml-2",
-                                        children: [
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "text-sm font-black h-6",
-                                                children: title
-                                            }),
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "text-xs text-gray-400 h-6",
-                                                children: loginRequired ? 'Login Required' : ' '
-                                            }),
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "text-sm p-2 h-fit",
-                                                children: /*#__PURE__*/ jsx(TextDescription, {
-                                                    description: description
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "flex mb-4 rounded-b-md",
-                                                children: /*#__PURE__*/ jsxs("div", {
-                                                    className: "m-auto",
-                                                    children: [
-                                                        /*#__PURE__*/ jsx(NavLink, {
-                                                            component: Link,
-                                                            href: href ?? '_blank',
-                                                            classNames: {
-                                                                root: 'bg-accent text-accent-contrast hover:bg-accent-darker p-2 rounded-sm',
-                                                                label: 'text-sm font-semibold'
-                                                            },
-                                                            label: `Run ${type === 'application' ? 'App' : 'Notebook'}`
-                                                        }),
-                                                        hasDemo && /*#__PURE__*/ jsx("button", {
-                                                            className: "ml-2 p-1.5 rounded-sm text-sm font-semibold",
-                                                            children: "Demo"
-                                                        })
-                                                    ]
-                                                })
-                                            })
-                                        ]
-                                    })
+                                    count?.toLocaleString(),
+                                    " ",
+                                    countUnits
                                 ]
+                            }),
+                            /*#__PURE__*/ jsx("div", {
+                                className: "py-2 min-h-24 h-full",
+                                children: /*#__PURE__*/ jsx(TextDescription, {
+                                    description: description
+                                })
                             })
-                        }, key);
+                        ]
+                    }),
+                    /*#__PURE__*/ jsxs(Group, {
+                        className: "mb-4",
+                        children: [
+                            /*#__PURE__*/ jsxs(Button, {
+                                color: "primary.4",
+                                children: [
+                                    "Run ",
+                                    type === 'application' ? 'App' : 'Notebook'
+                                ]
+                            }),
+                            hasDemo && /*#__PURE__*/ jsx(Button, {
+                                variant: "outline",
+                                color: "primary.4",
+                                children: "Demo"
+                            })
+                        ]
                     })
-                })
+                ]
             })
         ]
+    }, title);
+};
+
+/**
+ * AnalysisPanelWithSections component.
+ *
+ * This React functional component renders a panel that organizes tools into sections. Each section
+ * includes a title, a divider, and a grid of tool cards. The component supports customizable styling
+ * for global and section-specific classNames.
+ *
+ * @type {React.FC<AnalysisCenterWithSectionsConfiguration>}
+ *
+ * @param {Object} props - The component properties.
+ * @param {Array} props.sections - The array of sections to display in the panel. Each section includes
+ * a label, an optional classNames object for custom styling, and an array of tools.
+ * @param {Object} [props.classNames] - An optional object of global classNames used for styling
+ * components within the panel. These can be overridden on a per-section basis.
+ *
+ * @returns {ReactElement} A React element that renders the analysis panel with sections.
+ */ const AnalysisCenterWithSections = ({ sections, classNames })=>{
+    const rootClassNamesDefaults = {
+        title: 'font-header font-bold text-2xl uppercase',
+        divider: 'text-accent w-[100px] border-accent mb-4'
+    };
+    const mergedGlobalClassnames = mergeDefaultTailwindClassnames(rootClassNamesDefaults, classNames ?? {});
+    const sectionPanels = useMemo(()=>sections.map((section)=>{
+            const sectionClassnames = mergeDefaultTailwindClassnames(mergedGlobalClassnames, section.classNames ?? {});
+            return /*#__PURE__*/ jsxs(Stack, {
+                gap: "xs",
+                children: [
+                    /*#__PURE__*/ jsx(Text, {
+                        classNames: {
+                            root: sectionClassnames['title']
+                        },
+                        children: section.label
+                    }),
+                    /*#__PURE__*/ jsx(Divider, {
+                        size: "lg",
+                        classNames: {
+                            root: sectionClassnames['divider']
+                        }
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        className: "grid sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-4 items-stretch",
+                        children: section.tools.map((tool)=>{
+                            return /*#__PURE__*/ jsx("div", {
+                                children: /*#__PURE__*/ jsx(AnalysisCardCompact, {
+                                    ...tool
+                                })
+                            }, tool.title);
+                        })
+                    })
+                ]
+            }, section.label);
+        }), [
+        sections
+    ]);
+    return /*#__PURE__*/ jsx(Stack, {
+        children: sectionPanels
     });
 };
 
@@ -17639,8 +17807,8 @@ const AnalysisPanel = ({ tools })=>{
     });
 };
 
-const AnalysisPage = ({ headerProps, footerProps, tools })=>{
-    return /*#__PURE__*/ jsx(NavPageLayout, {
+const AnalysisPage = ({ headerProps, footerProps, tools, sections, classNames })=>{
+    return /*#__PURE__*/ jsxs(NavPageLayout, {
         headerProps,
         footerProps,
         headerData: {
@@ -17648,9 +17816,21 @@ const AnalysisPage = ({ headerProps, footerProps, tools })=>{
             content: 'Analysis Center',
             key: 'gen3-analysis-center'
         },
-        children: /*#__PURE__*/ jsx(AnalysisPanel, {
-            tools: tools
-        })
+        children: [
+            !tools && !sections && /*#__PURE__*/ jsx(Center, {
+                className: "mt-20",
+                children: /*#__PURE__*/ jsx(ErrorCard, {
+                    message: "No tools or sections found"
+                })
+            }),
+            tools && /*#__PURE__*/ jsx(AnalysisPanel, {
+                tools: tools
+            }),
+            sections && /*#__PURE__*/ jsx(AnalysisCenterWithSections, {
+                sections: sections,
+                classNames: classNames
+            })
+        ]
     });
 };
 
@@ -17664,11 +17844,10 @@ const AnalysisPageGetServerSideProps = async ()=>{
             }
         };
     } catch (err) {
-        console.error(err);
+        console.warn(err);
         return {
             props: {
-                ...await getNavPageLayoutPropsFromConfig(),
-                tools: []
+                ...await getNavPageLayoutPropsFromConfig()
             }
         };
     }
@@ -20830,5 +21009,5 @@ async function credentialsLogout(req, res) {
     res.redirect(307, '/');
 }
 
-export { AISearchPageGetServerSideProps, ActionButton, AdminAuthZPageGetServerSideProps, AiSearch, AISearchPage as AiSearchPage, AnalysisCenter, AnalysisEditorPage, AnalysisEditorPageGetServerSideProps, AnalysisPage, AnalysisPageGetServerSideProps, AuthzPage, BaseModal, Charts, CohortBuilder, CollapsableSidebar, ColorThemePage, ColorThemePageGetServerSideProps, ContentSource, CreateCredentialsAPIKeyModal, CrosswalkPage, CrosswalkPageGetServerSideProps, Custom404Page, DataLibraryPage, DataLibraryPageGetServerSideProps, DictionaryPage, DictionaryPageGetServerSideProps, DiscoveryCellRendererFactory, DiscoveryProvider as DiscoveryConfigProvider, DiscoveryIndexPanel, DiscoveryPage, DiscoveryPageGetServerSideProps, DiscoveryRowRendererFactory, DropdownButton, EnumFacetChart, ErrorCard, ExplorerPage, ExplorerPageGetServerSideProps, ExplorerPageGetServerSidePropsForConfigId, ExplorerTableCellRendererFactory, ExplorerTableDetailsPanelFactory, FirstTimeModal, Footer, Gen3Button, Gen3ButtonReverse, Gen3Link, Gen3ModalsProvider, Gen3Provider, GqlQueryEditor$1 as GqlQueryEditor, Header, HoverLink, LandingPage, LandingPageGetStaticProps, LoginButton$1 as LoginButton, LoginPage, LoginPageGetServerSideProps, LoginPanel, LoginProvidersPanel, MinutesToMilliseconds, NavPageLayout, NavigationBar, NavigationButton, NoAccessModal, NotebookLitePage, NotebookLitePageGetStaticProps, ProfilePage, ProfilePageGetServerSideProps, ProfileProvider, ProtectedContent, QueryPage, QueryPageGetServerSideProps, ReactECharts, ResourcesFilters, SPECIAL_CASE_FIELDS, SessionExpiredModal, StudyGroup, SubmissionPage, SubmissionPageGetServerSideProps, TagCloud, TailwindConfig, TopBar, UploadJSONButton, User, Workspace, WorkspaceNoAccessPage, WorkspaceNoAccessPageServerSideProps, WorkspacePage, WorkspacePageGetServerSideProps, capitalize, computeRowSpan, convertMinutesToMilliseconds, convertSecondsToMilliseconds, create10ColorAccessibleContrast, create10ColorPallet, createMantineTheme, credentialsLogin, credentialsLogout, extractObjectKey, focusStyles, getCurrentUnixTimestamp, getNavPageLayoutPropsFromConfig, getParamsValueAsString, getTagInfo, hasOwnProperty, isArrayOfString, isPropertyKey, isTextTransform$1 as isTextTransform, processLabel$1 as processLabel, processRangeKeyLabel, registerCohortBuilderDefaultPreviewRenderers, registerCohortDiscoveryApp, registerCohortSimilarityApp, registerDefaultDiscoveryDataLoaders, registerDiscoveryDefaultCellRenderers, registerDiscoveryDefaultStudyPreviewRenderers, registerExplorerDefaultCellRenderers, registerMetadataSchemaApp, removeKey$1 as removeKey, resourcePathFromProjectID, sessionLogout, sessionToken, stripTrailingSlash, toDisplayName, truncateString, unixTimeToString, useDiscoveryContext, userHasMethodForServiceOnResource$1 as userHasMethodForServiceOnResource };
+export { AISearchPageGetServerSideProps, ActionButton, AdminAuthZPageGetServerSideProps, AiSearch, AISearchPage as AiSearchPage, AnalysisCenter, AnalysisCenterWithSections, AnalysisEditorPage, AnalysisEditorPageGetServerSideProps, AnalysisPage, AnalysisPageGetServerSideProps, AuthzPage, BaseModal, Charts, CohortBuilder, CollapsableSidebar, ColorThemePage, ColorThemePageGetServerSideProps, ContentSource, CreateCredentialsAPIKeyModal, CrosswalkPage, CrosswalkPageGetServerSideProps, Custom404Page, DataLibraryPage, DataLibraryPageGetServerSideProps, DictionaryPage, DictionaryPageGetServerSideProps, DiscoveryCellRendererFactory, DiscoveryProvider as DiscoveryConfigProvider, DiscoveryIndexPanel, DiscoveryPage, DiscoveryPageGetServerSideProps, DiscoveryRowRendererFactory, DropdownButton, EnumFacetChart, ErrorCard, ExplorerPage, ExplorerPageGetServerSideProps, ExplorerPageGetServerSidePropsForConfigId, ExplorerTableCellRendererFactory, ExplorerTableDetailsPanelFactory, FirstTimeModal, Footer, Gen3Button, Gen3ButtonReverse, Gen3Link, Gen3ModalsProvider, Gen3Provider, GqlQueryEditor$1 as GqlQueryEditor, Header, HoverLink, LandingPage, LandingPageGetStaticProps, LoginButton$1 as LoginButton, LoginPage, LoginPageGetServerSideProps, LoginPanel, LoginProvidersPanel, MinutesToMilliseconds, NavPageLayout, NavigationBar, NavigationButton, NoAccessModal, NotebookLitePage, NotebookLitePageGetStaticProps, ProfilePage, ProfilePageGetServerSideProps, ProfileProvider, ProtectedContent, QueryPage, QueryPageGetServerSideProps, ReactECharts, ResourcesFilters, SPECIAL_CASE_FIELDS, SessionExpiredModal, StudyGroup, SubmissionPage, SubmissionPageGetServerSideProps, TagCloud, TailwindConfig, TopBar, UploadJSONButton, User, Workspace, WorkspaceNoAccessPage, WorkspaceNoAccessPageServerSideProps, WorkspacePage, WorkspacePageGetServerSideProps, capitalize, computeRowSpan, convertMinutesToMilliseconds, convertSecondsToMilliseconds, create10ColorAccessibleContrast, create10ColorPallet, createMantineTheme, credentialsLogin, credentialsLogout, extractObjectKey, focusStyles, getCurrentUnixTimestamp, getNavPageLayoutPropsFromConfig, getParamsValueAsString, getTagInfo, hasOwnProperty, isArrayOfString, isPropertyKey, isTextTransform$1 as isTextTransform, processLabel$1 as processLabel, processRangeKeyLabel, registerCohortBuilderDefaultPreviewRenderers, registerCohortDiscoveryApp, registerCohortSimilarityApp, registerDefaultDiscoveryDataLoaders, registerDiscoveryDefaultCellRenderers, registerDiscoveryDefaultStudyPreviewRenderers, registerExplorerDefaultCellRenderers, registerMetadataSchemaApp, removeKey$1 as removeKey, resourcePathFromProjectID, sessionLogout, sessionToken, stripTrailingSlash, toDisplayName, truncateString, unixTimeToString, useDiscoveryContext, userHasMethodForServiceOnResource$1 as userHasMethodForServiceOnResource };
 //# sourceMappingURL=index.js.map