@red-hat-developer-hub/backstage-plugin-lightspeed 2.1.0 → 2.2.1

package/dist/components/LightspeedChatModelsState.esm.js

@@ -0,0 +1,198 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { CircularProgress, Box, Typography, Button, Link } from '@material-ui/core';
+import { makeStyles, createStyles } from '@material-ui/core/styles';
+import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
+import OpenInNewIcon from '@mui/icons-material/OpenInNew';
+import SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';
+import { useTranslation } from '../hooks/useTranslation.esm.js';
+
+const LLAMA_STACK_CONFIGURE_DOCS_URL = "https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html/interacting_with_red_hat_developer_lightspeed_for_red_hat_developer_hub/developer-lightspeed#proc-installing-and-configuring-lightspeed_developer-lightspeed";
+const LIGHTSPEED_BACKEND_README_URL = "https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/lightspeed/plugins/lightspeed-backend/README.md";
+const useStyles = makeStyles(
+  (theme) => createStyles({
+    root: {
+      display: "flex",
+      flexDirection: "column",
+      boxSizing: "border-box",
+      width: "100%",
+      maxWidth: "100%",
+      minWidth: 0,
+      minHeight: "100%",
+      height: "100%",
+      flex: "1 1 auto",
+      alignItems: "center",
+      justifyContent: "center",
+      padding: theme.spacing(4, 2),
+      backgroundColor: theme.palette.background.default
+    },
+    panel: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      textAlign: "center",
+      width: "100%",
+      maxWidth: 440,
+      gap: theme.spacing(2)
+    },
+    emptyStateIcon: {
+      fontSize: 64,
+      color: theme.palette.text.secondary
+    },
+    errorIcon: {
+      fontSize: 64,
+      color: theme.palette.warning.main
+    },
+    description: {
+      lineHeight: 1.5,
+      color: theme.palette.text.secondary
+    },
+    actions: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      gap: theme.spacing(1.5),
+      marginTop: theme.spacing(1)
+    },
+    backendLink: {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: theme.spacing(0.5),
+      fontSize: theme.typography.body1.fontSize,
+      fontWeight: 500
+    }
+  })
+);
+const LightspeedChatModelsLoading = () => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classes.root,
+      "data-testid": "lightspeed-models-loading",
+      role: "status",
+      "aria-busy": "true",
+      "aria-label": t("common.loading"),
+      children: /* @__PURE__ */ jsx(CircularProgress, { "aria-hidden": true })
+    }
+  );
+};
+const LcoreNotConfiguredEmptyState = () => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx("div", { className: classes.root, "data-testid": "lightspeed-lcore-not-configured", children: /* @__PURE__ */ jsxs(
+    Box,
+    {
+      className: classes.panel,
+      component: "section",
+      "aria-labelledby": "lightspeed-lcore-empty-title",
+      children: [
+        /* @__PURE__ */ jsx(
+          SmartToyOutlinedIcon,
+          {
+            className: classes.emptyStateIcon,
+            "aria-hidden": true,
+            focusable: false
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            id: "lightspeed-lcore-empty-title",
+            variant: "h5",
+            component: "h2",
+            children: t("lcore.notConfigured.title")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "body1",
+            component: "p",
+            className: classes.description,
+            children: t("lcore.notConfigured.description")
+          }
+        ),
+        /* @__PURE__ */ jsxs(Box, { className: classes.actions, children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "contained",
+              color: "primary",
+              target: "_blank",
+              rel: "noopener noreferrer",
+              href: LLAMA_STACK_CONFIGURE_DOCS_URL,
+              children: [
+                t("lcore.notConfigured.developerLightspeedDocs"),
+                " \xA0",
+                " ",
+                /* @__PURE__ */ jsx(OpenInNewIcon, { fontSize: "small", "aria-hidden": true })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Link,
+            {
+              className: classes.backendLink,
+              component: "a",
+              color: "primary",
+              href: LIGHTSPEED_BACKEND_README_URL,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: [
+                t("lcore.notConfigured.backendDocs"),
+                /* @__PURE__ */ jsx(OpenInNewIcon, { fontSize: "small", "aria-hidden": true })
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  ) });
+};
+const ModelsLoadErrorEmptyState = ({
+  onRetry
+}) => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx("div", { className: classes.root, "data-testid": "lightspeed-models-load-error", children: /* @__PURE__ */ jsxs(
+    Box,
+    {
+      className: classes.panel,
+      component: "section",
+      "aria-labelledby": "lightspeed-models-error-title",
+      children: [
+        /* @__PURE__ */ jsx(
+          ErrorOutlineIcon,
+          {
+            className: classes.errorIcon,
+            "aria-hidden": true,
+            focusable: false
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            id: "lightspeed-models-error-title",
+            variant: "h5",
+            component: "h2",
+            children: t("lcore.loadError.title")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "body1",
+            component: "p",
+            className: classes.description,
+            children: t("lcore.loadError.description")
+          }
+        ),
+        /* @__PURE__ */ jsx(Box, { className: classes.actions, children: /* @__PURE__ */ jsx(Button, { variant: "contained", color: "primary", onClick: () => onRetry(), children: t("common.retry") }) })
+      ]
+    }
+  ) });
+};
+
+export { LcoreNotConfiguredEmptyState, LightspeedChatModelsLoading, ModelsLoadErrorEmptyState };
+//# sourceMappingURL=LightspeedChatModelsState.esm.js.map

package/dist/components/LightspeedChatModelsState.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightspeedChatModelsState.esm.js","sources":["../../src/components/LightspeedChatModelsState.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  Box,\n  Button,\n  CircularProgress,\n  Link,\n  Typography,\n} from '@material-ui/core';\nimport { createStyles, makeStyles } from '@material-ui/core/styles';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';\n\nimport { useTranslation } from '../hooks/useTranslation';\n\nconst LLAMA_STACK_CONFIGURE_DOCS_URL =\n  'https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html/interacting_with_red_hat_developer_lightspeed_for_red_hat_developer_hub/developer-lightspeed#proc-installing-and-configuring-lightspeed_developer-lightspeed';\nconst LIGHTSPEED_BACKEND_README_URL =\n  'https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/lightspeed/plugins/lightspeed-backend/README.md';\n\nconst useStyles = makeStyles(theme =>\n  createStyles({\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      boxSizing: 'border-box',\n      width: '100%',\n      maxWidth: '100%',\n      minWidth: 0,\n      minHeight: '100%',\n      height: '100%',\n      flex: '1 1 auto',\n      alignItems: 'center',\n      justifyContent: 'center',\n      padding: theme.spacing(4, 2),\n      backgroundColor: theme.palette.background.default,\n    },\n    panel: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      textAlign: 'center',\n      width: '100%',\n      maxWidth: 440,\n      gap: theme.spacing(2),\n    },\n    emptyStateIcon: {\n      fontSize: 64,\n      color: theme.palette.text.secondary,\n    },\n    errorIcon: {\n      fontSize: 64,\n      color: theme.palette.warning.main,\n    },\n    description: {\n      lineHeight: 1.5,\n      color: theme.palette.text.secondary,\n    },\n    actions: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      gap: theme.spacing(1.5),\n      marginTop: theme.spacing(1),\n    },\n    backendLink: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: theme.spacing(0.5),\n      fontSize: theme.typography.body1.fontSize,\n      fontWeight: 500,\n    },\n  }),\n);\n\n/**\n * Shown while the models list is loading for an authorized user.\n */\nexport const LightspeedChatModelsLoading = () => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n  return (\n    <div\n      className={classes.root}\n      data-testid=\"lightspeed-models-loading\"\n      role=\"status\"\n      aria-busy=\"true\"\n      aria-label={t('common.loading')}\n    >\n      <CircularProgress aria-hidden />\n    </div>\n  );\n};\n\n/**\n * Shown when LCORE / Llama Stack is up but no LLM models are registered.\n */\nexport const LcoreNotConfiguredEmptyState = () => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  return (\n    <div className={classes.root} data-testid=\"lightspeed-lcore-not-configured\">\n      <Box\n        className={classes.panel}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-lcore-empty-title\"\n      >\n        <SmartToyOutlinedIcon\n          className={classes.emptyStateIcon}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-lcore-empty-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.notConfigured.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          className={classes.description}\n        >\n          {t('lcore.notConfigured.description')}\n        </Typography>\n        <Box className={classes.actions}>\n          <Button\n            variant=\"contained\"\n            color=\"primary\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href={LLAMA_STACK_CONFIGURE_DOCS_URL}\n          >\n            {t('lcore.notConfigured.developerLightspeedDocs')} &nbsp;{' '}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Button>\n          <Link\n            className={classes.backendLink}\n            component=\"a\"\n            color=\"primary\"\n            href={LIGHTSPEED_BACKEND_README_URL}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            {t('lcore.notConfigured.backendDocs')}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Link>\n        </Box>\n      </Box>\n    </div>\n  );\n};\n\ntype ModelsLoadErrorEmptyStateProps = {\n  onRetry: () => void;\n};\n\n/**\n * Shown when the models API fails (distinct from “no models configured”).\n */\nexport const ModelsLoadErrorEmptyState = ({\n  onRetry,\n}: ModelsLoadErrorEmptyStateProps) => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  return (\n    <div className={classes.root} data-testid=\"lightspeed-models-load-error\">\n      <Box\n        className={classes.panel}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-models-error-title\"\n      >\n        <ErrorOutlineIcon\n          className={classes.errorIcon}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-models-error-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.loadError.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          className={classes.description}\n        >\n          {t('lcore.loadError.description')}\n        </Typography>\n        <Box className={classes.actions}>\n          <Button variant=\"contained\" color=\"primary\" onClick={() => onRetry()}>\n            {t('common.retry')}\n          </Button>\n        </Box>\n      </Box>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/LightspeedDrawerProvider.esm.js

@@ -29,7 +29,8 @@ const LightspeedDrawerProvider = ({ children }) => {
       {
         isOpen: true,
         displayMode: contextValue.displayMode,
-        onClose: closeChatbot,
+        disableFocusTrap: true,
+        onEscapePress: () => closeChatbot(),
         ouiaId: "LightspeedChatbotModal",
         "aria-labelledby": "lightspeed-chatpopup-modal",
         className: classes.chatbotModal,

package/dist/components/LightspeedDrawerProvider.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LightspeedDrawerProvider.esm.js","sources":["../../src/components/LightspeedDrawerProvider.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { PropsWithChildren } from 'react';\n\nimport { makeStyles } from '@mui/styles';\nimport { ChatbotModal } from '@patternfly/chatbot';\n\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedProviderState } from '../hooks/useLightspeedProviderState';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\nimport { LightspeedDrawerContext } from './LightspeedDrawerContext';\n\nconst useStyles = makeStyles(theme => ({\n  chatbotModal: {\n    boxShadow:\n      '0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important',\n    bottom: `calc(${theme?.spacing?.(2) ?? '16px'} + 5em)`,\n    right: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,\n    maxWidth: 'min(30rem, calc(100vw - 32px)) !important',\n    overflowX: 'hidden' as const,\n    transition: 'margin-right 0.3s ease',\n    'body.docked-drawer-open &': {\n      marginRight: DOCKED_CONTENT_OFFSET,\n    },\n  },\n}));\n\n/**\n * @public\n */\nexport const LightspeedDrawerProvider = ({ children }: PropsWithChildren) => {\n  const classes = useStyles();\n  const { contextValue, shouldRenderOverlayModal, closeChatbot } =\n    useLightspeedProviderState();\n\n  return (\n    <LightspeedDrawerContext.Provider value={contextValue}>\n      {children}\n      {shouldRenderOverlayModal && (\n        <ChatbotModal\n          isOpen\n          displayMode={contextValue.displayMode}\n          onClose={closeChatbot}\n          ouiaId=\"LightspeedChatbotModal\"\n          aria-labelledby=\"lightspeed-chatpopup-modal\"\n          className={classes.chatbotModal}\n        >\n          <LightspeedChatContainer />\n        </ChatbotModal>\n      )}\n    </LightspeedDrawerContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AA0BA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,YAAc,EAAA;AAAA,IACZ,SACE,EAAA,4HAAA;AAAA,IACF,QAAQ,CAAQ,KAAA,EAAA,KAAA,EAAO,OAAU,GAAA,CAAC,KAAK,MAAM,CAAA,OAAA,CAAA;AAAA,IAC7C,OAAO,CAAQ,KAAA,EAAA,KAAA,EAAO,OAAU,GAAA,CAAC,KAAK,MAAM,CAAA,SAAA,CAAA;AAAA,IAC5C,QAAU,EAAA,2CAAA;AAAA,IACV,SAAW,EAAA,QAAA;AAAA,IACX,UAAY,EAAA,wBAAA;AAAA,IACZ,2BAA6B,EAAA;AAAA,MAC3B,WAAa,EAAA;AAAA;AACf;AAEJ,CAAE,CAAA,CAAA;AAKK,MAAM,wBAA2B,GAAA,CAAC,EAAE,QAAA,EAAkC,KAAA;AAC3E,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAA,MAAM,EAAE,YAAA,EAAc,wBAA0B,EAAA,YAAA,KAC9C,0BAA2B,EAAA;AAE7B,EAAA,uBACG,IAAA,CAAA,uBAAA,CAAwB,QAAxB,EAAA,EAAiC,OAAO,YACtC,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,wBACC,oBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,MAAM,EAAA,IAAA;AAAA,QACN,aAAa,YAAa,CAAA,WAAA;AAAA,QAC1B,OAAS,EAAA,YAAA;AAAA,QACT,MAAO,EAAA,wBAAA;AAAA,QACP,iBAAgB,EAAA,4BAAA;AAAA,QAChB,WAAW,OAAQ,CAAA,YAAA;AAAA,QAEnB,8BAAC,uBAAwB,EAAA,EAAA;AAAA;AAAA;AAC3B,GAEJ,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"LightspeedDrawerProvider.esm.js","sources":["../../src/components/LightspeedDrawerProvider.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { PropsWithChildren } from 'react';\n\nimport { makeStyles } from '@mui/styles';\nimport { ChatbotModal } from '@patternfly/chatbot';\n\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedProviderState } from '../hooks/useLightspeedProviderState';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\nimport { LightspeedDrawerContext } from './LightspeedDrawerContext';\n\nconst useStyles = makeStyles(theme => ({\n  chatbotModal: {\n    boxShadow:\n      '0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important',\n    bottom: `calc(${theme?.spacing?.(2) ?? '16px'} + 5em)`,\n    right: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,\n    maxWidth: 'min(30rem, calc(100vw - 32px)) !important',\n    overflowX: 'hidden' as const,\n    transition: 'margin-right 0.3s ease',\n    'body.docked-drawer-open &': {\n      marginRight: DOCKED_CONTENT_OFFSET,\n    },\n  },\n}));\n\n/**\n * @public\n */\nexport const LightspeedDrawerProvider = ({ children }: PropsWithChildren) => {\n  const classes = useStyles();\n  const { contextValue, shouldRenderOverlayModal, closeChatbot } =\n    useLightspeedProviderState();\n\n  return (\n    <LightspeedDrawerContext.Provider value={contextValue}>\n      {children}\n      {shouldRenderOverlayModal && (\n        <ChatbotModal\n          isOpen\n          displayMode={contextValue.displayMode}\n          disableFocusTrap\n          onEscapePress={() => closeChatbot()}\n          ouiaId=\"LightspeedChatbotModal\"\n          aria-labelledby=\"lightspeed-chatpopup-modal\"\n          className={classes.chatbotModal}\n        >\n          <LightspeedChatContainer />\n        </ChatbotModal>\n      )}\n    </LightspeedDrawerContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AA0BA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,YAAc,EAAA;AAAA,IACZ,SACE,EAAA,4HAAA;AAAA,IACF,QAAQ,CAAQ,KAAA,EAAA,KAAA,EAAO,OAAU,GAAA,CAAC,KAAK,MAAM,CAAA,OAAA,CAAA;AAAA,IAC7C,OAAO,CAAQ,KAAA,EAAA,KAAA,EAAO,OAAU,GAAA,CAAC,KAAK,MAAM,CAAA,SAAA,CAAA;AAAA,IAC5C,QAAU,EAAA,2CAAA;AAAA,IACV,SAAW,EAAA,QAAA;AAAA,IACX,UAAY,EAAA,wBAAA;AAAA,IACZ,2BAA6B,EAAA;AAAA,MAC3B,WAAa,EAAA;AAAA;AACf;AAEJ,CAAE,CAAA,CAAA;AAKK,MAAM,wBAA2B,GAAA,CAAC,EAAE,QAAA,EAAkC,KAAA;AAC3E,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAA,MAAM,EAAE,YAAA,EAAc,wBAA0B,EAAA,YAAA,KAC9C,0BAA2B,EAAA;AAE7B,EAAA,uBACG,IAAA,CAAA,uBAAA,CAAwB,QAAxB,EAAA,EAAiC,OAAO,YACtC,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,wBACC,oBAAA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,MAAM,EAAA,IAAA;AAAA,QACN,aAAa,YAAa,CAAA,WAAA;AAAA,QAC1B,gBAAgB,EAAA,IAAA;AAAA,QAChB,aAAA,EAAe,MAAM,YAAa,EAAA;AAAA,QAClC,MAAO,EAAA,wBAAA;AAAA,QACP,iBAAgB,EAAA,4BAAA;AAAA,QAChB,WAAW,OAAQ,CAAA,YAAA;AAAA,QAEnB,8BAAC,uBAAwB,EAAA,EAAA;AAAA;AAAA;AAC3B,GAEJ,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/Router.esm.js

@@ -11,7 +11,8 @@ const Router = () => {
         path: "/conversation/:conversationId",
         element: /* @__PURE__ */ jsx(LightspeedPage, {})
       }
-    )
+    ),
+    /* @__PURE__ */ jsx(Route, { path: "/notebooks", element: /* @__PURE__ */ jsx(LightspeedPage, {}) })
   ] });
 };
 

package/dist/components/Router.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Router.esm.js","sources":["../../src/components/Router.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Route, Routes } from 'react-router-dom';\n\nimport { LightspeedPage } from './LightspeedPage';\n\n/**\n * @public\n */\nexport const Router = () => {\n  return (\n    <Routes>\n      <Route path=\"/\" element={<LightspeedPage />} />\n      <Route\n        path=\"/conversation/:conversationId\"\n        element={<LightspeedPage />}\n      />\n    </Routes>\n  );\n};\n"],"names":[],"mappings":";;;;AAuBO,MAAM,SAAS,MAAM;AAC1B,EAAA,4BACG,MACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAM,IAAK,EAAA,GAAA,EAAI,OAAS,kBAAA,GAAA,CAAC,kBAAe,CAAI,EAAA,CAAA;AAAA,oBAC7C,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,+BAAA;AAAA,QACL,OAAA,sBAAU,cAAe,EAAA,EAAA;AAAA;AAAA;AAC3B,GACF,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Router.esm.js","sources":["../../src/components/Router.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Route, Routes } from 'react-router-dom';\n\nimport { LightspeedPage } from './LightspeedPage';\n\n/**\n * @public\n */\nexport const Router = () => {\n  return (\n    <Routes>\n      <Route path=\"/\" element={<LightspeedPage />} />\n      <Route\n        path=\"/conversation/:conversationId\"\n        element={<LightspeedPage />}\n      />\n      <Route path=\"/notebooks\" element={<LightspeedPage />} />\n    </Routes>\n  );\n};\n"],"names":[],"mappings":";;;;AAuBO,MAAM,SAAS,MAAM;AAC1B,EAAA,4BACG,MACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,SAAM,IAAK,EAAA,GAAA,EAAI,OAAS,kBAAA,GAAA,CAAC,kBAAe,CAAI,EAAA,CAAA;AAAA,oBAC7C,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,+BAAA;AAAA,QACL,OAAA,sBAAU,cAAe,EAAA,EAAA;AAAA;AAAA,KAC3B;AAAA,wBACC,KAAM,EAAA,EAAA,IAAA,EAAK,cAAa,OAAS,kBAAA,GAAA,CAAC,kBAAe,CAAI,EAAA;AAAA,GACxD,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/notebooks/AddDocumentModal.esm.js

@@ -0,0 +1,170 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+import CloseIcon from '@mui/icons-material/Close';
+import Alert from '@mui/material/Alert';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import IconButton from '@mui/material/IconButton';
+import Typography from '@mui/material/Typography';
+import { MultipleFileUpload, MultipleFileUploadMain } from '@patternfly/react-core';
+import { UploadIcon } from '@patternfly/react-icons';
+import { NOTEBOOK_MAX_FILES } from '../../const.esm.js';
+import { useUploadDocument } from '../../hooks/notebooks/useUploadDocument.esm.js';
+import { useTranslation } from '../../hooks/useTranslation.esm.js';
+import { getNotebookAcceptedFileTypes, validateFiles } from '../../utils/notebook-upload-utils.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  dialogPaper: {
+    borderRadius: 24,
+    maxWidth: 578
+  },
+  dialogTitle: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    padding: "24px 24px 16px"
+  },
+  titleText: {
+    fontWeight: 500,
+    fontSize: "1.25rem",
+    lineHeight: "1.625rem",
+    letterSpacing: "-0.25px"
+  },
+  closeButton: {
+    color: theme.palette.grey[700]
+  },
+  dialogContent: {
+    padding: "0 24px 24px"
+  },
+  errorAlert: {
+    marginBottom: theme.spacing(2)
+  },
+  dropzone: {
+    "& .pf-v6-c-multiple-file-upload__main": {
+      borderColor: "var(--pf-t--global--border--color--brand--default)",
+      transition: "background-color 0.2s ease",
+      cursor: "pointer"
+    },
+    "& .pf-v6-c-multiple-file-upload__main:hover": {
+      backgroundColor: "color-mix(in srgb, var(--pf-t--global--color--brand--default) 10%, transparent)"
+    }
+  }
+}));
+const AddDocumentModal = ({
+  isOpen,
+  onClose,
+  sessionId,
+  existingDocumentNames,
+  onFilesUploading,
+  onUploadStarted,
+  onUploadFailed,
+  onDuplicatesFound
+}) => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  const uploadMutation = useUploadDocument();
+  const [validationErrors, setValidationErrors] = useState([]);
+  const handleFileDrop = (_event, files) => {
+    setValidationErrors([]);
+    const { valid, errors } = validateFiles(
+      files,
+      existingDocumentNames.length
+    );
+    if (errors.length > 0) {
+      setValidationErrors(errors);
+      return;
+    }
+    if (valid.length === 0) return;
+    const existingNamesSet = new Set(existingDocumentNames);
+    const newFiles = valid.filter((f) => !existingNamesSet.has(f.name));
+    const duplicateFiles = valid.filter((f) => existingNamesSet.has(f.name));
+    if (newFiles.length > 0) {
+      onFilesUploading?.(newFiles);
+      for (const file of newFiles) {
+        uploadMutation.mutateAsync({ sessionId, file }).then((data) => {
+          onUploadStarted?.({
+            fileName: file.name,
+            documentId: data.document_id
+          });
+        }).catch(() => {
+          onUploadFailed?.(file.name);
+        });
+      }
+    }
+    if (duplicateFiles.length > 0) {
+      onDuplicatesFound?.(duplicateFiles);
+    }
+    setValidationErrors([]);
+    onClose();
+  };
+  const handleDropRejected = (rejections) => {
+    const hasInvalidType = rejections.some(
+      (r) => r.errors.some((e) => e.code === "file-invalid-type")
+    );
+    if (hasInvalidType) {
+      setValidationErrors(["notebook.upload.error.unsupportedType"]);
+    }
+  };
+  const handleClose = () => {
+    setValidationErrors([]);
+    onClose();
+  };
+  return /* @__PURE__ */ jsxs(
+    Dialog,
+    {
+      open: isOpen,
+      onClose: handleClose,
+      "aria-labelledby": "add-document-modal-title",
+      PaperProps: {
+        className: classes.dialogPaper
+      },
+      children: [
+        /* @__PURE__ */ jsxs(DialogTitle, { className: classes.dialogTitle, children: [
+          /* @__PURE__ */ jsx(Typography, { component: "h2", className: classes.titleText, children: t("notebook.upload.modal.title") }),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              "aria-label": t("common.close"),
+              onClick: handleClose,
+              className: classes.closeButton,
+              size: "small",
+              children: /* @__PURE__ */ jsx(CloseIcon, {})
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(DialogContent, { className: classes.dialogContent, children: [
+          validationErrors.length > 0 && /* @__PURE__ */ jsx(Alert, { severity: "error", className: classes.errorAlert, children: validationErrors.map((errorKey) => {
+            const message = t(errorKey);
+            return errorKey === "notebook.upload.error.tooManyFiles" ? message.replace("{{max}}", String(NOTEBOOK_MAX_FILES)) : message;
+          }).join("\n") }),
+          /* @__PURE__ */ jsx(
+            MultipleFileUpload,
+            {
+              className: classes.dropzone,
+              dropzoneProps: {
+                accept: getNotebookAcceptedFileTypes(),
+                onDropRejected: handleDropRejected
+              },
+              onFileDrop: handleFileDrop,
+              children: /* @__PURE__ */ jsx(
+                MultipleFileUploadMain,
+                {
+                  titleIcon: /* @__PURE__ */ jsx(UploadIcon, {}),
+                  titleText: t("notebook.upload.modal.dragDropTitle"),
+                  titleTextSeparator: t("notebook.upload.modal.separator"),
+                  infoText: t("notebook.upload.modal.infoText"),
+                  browseButtonText: t("notebook.upload.modal.browseButton")
+                }
+              )
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+
+export { AddDocumentModal };
+//# sourceMappingURL=AddDocumentModal.esm.js.map

package/dist/components/notebooks/AddDocumentModal.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddDocumentModal.esm.js","sources":["../../../src/components/notebooks/AddDocumentModal.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useState } from 'react';\nimport { FileRejection } from 'react-dropzone';\n\nimport { makeStyles } from '@material-ui/core/styles';\nimport CloseIcon from '@mui/icons-material/Close';\nimport Alert from '@mui/material/Alert';\nimport Dialog from '@mui/material/Dialog';\nimport DialogContent from '@mui/material/DialogContent';\nimport DialogTitle from '@mui/material/DialogTitle';\nimport IconButton from '@mui/material/IconButton';\nimport Typography from '@mui/material/Typography';\nimport {\n  MultipleFileUpload,\n  MultipleFileUploadMain,\n} from '@patternfly/react-core';\nimport { UploadIcon } from '@patternfly/react-icons';\n\nimport { NOTEBOOK_MAX_FILES } from '../../const';\nimport { useUploadDocument } from '../../hooks/notebooks/useUploadDocument';\nimport { useTranslation } from '../../hooks/useTranslation';\nimport {\n  getNotebookAcceptedFileTypes,\n  validateFiles,\n} from '../../utils/notebook-upload-utils';\n\nconst useStyles = makeStyles(theme => ({\n  dialogPaper: {\n    borderRadius: 24,\n    maxWidth: 578,\n  },\n  dialogTitle: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    padding: '24px 24px 16px',\n  },\n  titleText: {\n    fontWeight: 500,\n    fontSize: '1.25rem',\n    lineHeight: '1.625rem',\n    letterSpacing: '-0.25px',\n  },\n  closeButton: {\n    color: theme.palette.grey[700],\n  },\n  dialogContent: {\n    padding: '0 24px 24px',\n  },\n  errorAlert: {\n    marginBottom: theme.spacing(2),\n  },\n  dropzone: {\n    '& .pf-v6-c-multiple-file-upload__main': {\n      borderColor: 'var(--pf-t--global--border--color--brand--default)',\n      transition: 'background-color 0.2s ease',\n      cursor: 'pointer',\n    },\n    '& .pf-v6-c-multiple-file-upload__main:hover': {\n      backgroundColor:\n        'color-mix(in srgb, var(--pf-t--global--color--brand--default) 10%, transparent)',\n    },\n  },\n}));\n\ntype AddDocumentModalProps = {\n  isOpen: boolean;\n  onClose: () => void;\n  sessionId: string;\n  existingDocumentNames: string[];\n  onFilesUploading?: (files: File[]) => void;\n  onUploadStarted?: (info: { fileName: string; documentId: string }) => void;\n  onUploadFailed?: (fileName: string) => void;\n  onDuplicatesFound?: (files: File[]) => void;\n};\n\nexport const AddDocumentModal = ({\n  isOpen,\n  onClose,\n  sessionId,\n  existingDocumentNames,\n  onFilesUploading,\n  onUploadStarted,\n  onUploadFailed,\n  onDuplicatesFound,\n}: AddDocumentModalProps) => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n  const uploadMutation = useUploadDocument();\n  const [validationErrors, setValidationErrors] = useState<string[]>([]);\n\n  const handleFileDrop = (_event: unknown, files: File[]) => {\n    setValidationErrors([]);\n\n    const { valid, errors } = validateFiles(\n      files,\n      existingDocumentNames.length,\n    );\n\n    if (errors.length > 0) {\n      setValidationErrors(errors);\n      return;\n    }\n\n    if (valid.length === 0) return;\n\n    const existingNamesSet = new Set(existingDocumentNames);\n    const newFiles = valid.filter(f => !existingNamesSet.has(f.name));\n    const duplicateFiles = valid.filter(f => existingNamesSet.has(f.name));\n\n    if (newFiles.length > 0) {\n      onFilesUploading?.(newFiles);\n      for (const file of newFiles) {\n        uploadMutation\n          .mutateAsync({ sessionId, file })\n          .then(data => {\n            onUploadStarted?.({\n              fileName: file.name,\n              documentId: data.document_id,\n            });\n          })\n          .catch(() => {\n            onUploadFailed?.(file.name);\n          });\n      }\n    }\n\n    if (duplicateFiles.length > 0) {\n      onDuplicatesFound?.(duplicateFiles);\n    }\n\n    setValidationErrors([]);\n    onClose();\n  };\n\n  const handleDropRejected = (rejections: FileRejection[]) => {\n    const hasInvalidType = rejections.some(r =>\n      r.errors.some(e => e.code === 'file-invalid-type'),\n    );\n    if (hasInvalidType) {\n      setValidationErrors(['notebook.upload.error.unsupportedType']);\n    }\n  };\n\n  const handleClose = () => {\n    setValidationErrors([]);\n    onClose();\n  };\n\n  return (\n    <Dialog\n      open={isOpen}\n      onClose={handleClose}\n      aria-labelledby=\"add-document-modal-title\"\n      PaperProps={{\n        className: classes.dialogPaper,\n      }}\n    >\n      <DialogTitle className={classes.dialogTitle}>\n        <Typography component=\"h2\" className={classes.titleText}>\n          {t('notebook.upload.modal.title')}\n        </Typography>\n        <IconButton\n          aria-label={t('common.close')}\n          onClick={handleClose}\n          className={classes.closeButton}\n          size=\"small\"\n        >\n          <CloseIcon />\n        </IconButton>\n      </DialogTitle>\n\n      <DialogContent className={classes.dialogContent}>\n        {validationErrors.length > 0 && (\n          <Alert severity=\"error\" className={classes.errorAlert}>\n            {validationErrors\n              .map(errorKey => {\n                const message = (t as Function)(errorKey) as string;\n                return errorKey === 'notebook.upload.error.tooManyFiles'\n                  ? message.replace('{{max}}', String(NOTEBOOK_MAX_FILES))\n                  : message;\n              })\n              .join('\\n')}\n          </Alert>\n        )}\n\n        <MultipleFileUpload\n          className={classes.dropzone}\n          dropzoneProps={{\n            accept: getNotebookAcceptedFileTypes(),\n            onDropRejected: handleDropRejected,\n          }}\n          onFileDrop={handleFileDrop}\n        >\n          <MultipleFileUploadMain\n            titleIcon={<UploadIcon />}\n            titleText={t('notebook.upload.modal.dragDropTitle')}\n            titleTextSeparator={t('notebook.upload.modal.separator')}\n            infoText={t('notebook.upload.modal.infoText')}\n            browseButtonText={t('notebook.upload.modal.browseButton')}\n          />\n        </MultipleFileUpload>\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/notebooks/DocumentSidebar.esm.js

@@ -0,0 +1,154 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { makeStyles, Typography } from '@material-ui/core';
+import { Tooltip, Button, Spinner } from '@patternfly/react-core';
+import { PlusCircleIcon } from '@patternfly/react-icons';
+import { useTranslation } from '../../hooks/useTranslation.esm.js';
+import { FileTypeIcon } from './FileTypeIcon.esm.js';
+import { SidebarCollapseIcon } from './SidebarCollapseIcon.esm.js';
+
+const useStyles = makeStyles((theme) => ({
+  sidebar: {
+    display: "flex",
+    flexDirection: "column",
+    width: "100%",
+    height: "100%",
+    padding: theme.spacing(2),
+    overflow: "hidden"
+  },
+  titleRow: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: theme.spacing(2),
+    gap: theme.spacing(1)
+  },
+  title: {
+    fontWeight: 500,
+    fontSize: "1.25rem",
+    lineHeight: "2rem",
+    letterSpacing: "-0.25px",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+    flex: 1,
+    minWidth: 0
+  },
+  collapseButton: {
+    flexShrink: 0
+  },
+  documentsRow: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between"
+  },
+  documentCount: {
+    fontWeight: 700,
+    fontSize: "1.125rem",
+    lineHeight: "2rem"
+  },
+  addButton: {
+    textTransform: "none"
+  },
+  documentsList: {
+    marginTop: theme.spacing(2),
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.spacing(0.5),
+    overflowY: "auto",
+    flex: 1
+  },
+  documentItem: {
+    display: "flex",
+    alignItems: "center",
+    gap: theme.spacing(1),
+    padding: `${theme.spacing(1)}px ${theme.spacing(0.5)}px`,
+    borderRadius: 4
+  },
+  fileIcon: {
+    flexShrink: 0,
+    color: theme.palette.grey[500],
+    fontSize: "1rem"
+  },
+  fileName: {
+    flex: 1,
+    minWidth: 0,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+    fontSize: "0.875rem",
+    lineHeight: "1.25rem"
+  },
+  spinnerContainer: {
+    flexShrink: 0
+  }
+}));
+const DocumentSidebar = ({
+  notebookName,
+  documents,
+  uploadingFileNames,
+  completedFileNames,
+  collapsed,
+  onToggleCollapse,
+  onAddDocument
+}) => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  if (collapsed) {
+    return null;
+  }
+  const uploadedNames = new Set(documents.map((d) => d.title));
+  const activePending = uploadingFileNames.filter(
+    (name) => !uploadedNames.has(name)
+  );
+  const totalCount = documents.length + activePending.length;
+  return /* @__PURE__ */ jsxs("div", { className: classes.sidebar, children: [
+    /* @__PURE__ */ jsxs("div", { className: classes.titleRow, children: [
+      /* @__PURE__ */ jsx(Typography, { className: classes.title, children: notebookName }),
+      /* @__PURE__ */ jsx(Tooltip, { content: t("notebook.view.sidebar.collapse"), position: "right", children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "plain",
+          className: classes.collapseButton,
+          onClick: onToggleCollapse,
+          "aria-label": t("notebook.view.sidebar.collapse"),
+          children: /* @__PURE__ */ jsx(SidebarCollapseIcon, {})
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: classes.documentsRow, children: [
+      /* @__PURE__ */ jsx(Typography, { className: classes.documentCount, children: t("notebook.view.documents.count", {
+        count: totalCount
+      }) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "link",
+          className: classes.addButton,
+          icon: /* @__PURE__ */ jsx(PlusCircleIcon, {}),
+          onClick: onAddDocument,
+          children: t("notebook.view.documents.add")
+        }
+      )
+    ] }),
+    (documents.length > 0 || activePending.length > 0) && /* @__PURE__ */ jsxs("div", { className: classes.documentsList, children: [
+      documents.map((doc) => /* @__PURE__ */ jsxs("div", { className: classes.documentItem, children: [
+        /* @__PURE__ */ jsx(FileTypeIcon, { fileName: doc.title }),
+        /* @__PURE__ */ jsx(Typography, { className: classes.fileName, children: doc.title })
+      ] }, doc.document_id)),
+      activePending.map((fileName) => /* @__PURE__ */ jsxs("div", { className: classes.documentItem, children: [
+        /* @__PURE__ */ jsx(FileTypeIcon, { fileName }),
+        /* @__PURE__ */ jsx(Typography, { className: classes.fileName, children: fileName }),
+        !completedFileNames?.has(fileName) && /* @__PURE__ */ jsx("div", { className: classes.spinnerContainer, children: /* @__PURE__ */ jsx(
+          Spinner,
+          {
+            size: "md",
+            "aria-label": t("notebook.view.documents.uploading")
+          }
+        ) })
+      ] }, `pending-${fileName}`))
+    ] })
+  ] });
+};
+
+export { DocumentSidebar };
+//# sourceMappingURL=DocumentSidebar.esm.js.map

package/dist/components/notebooks/DocumentSidebar.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentSidebar.esm.js","sources":["../../../src/components/notebooks/DocumentSidebar.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { makeStyles, Typography } from '@material-ui/core';\nimport { Button, Spinner, Tooltip } from '@patternfly/react-core';\nimport { PlusCircleIcon } from '@patternfly/react-icons';\n\nimport { useTranslation } from '../../hooks/useTranslation';\nimport { SessionDocument } from '../../types';\nimport { FileTypeIcon } from './FileTypeIcon';\nimport { SidebarCollapseIcon } from './SidebarCollapseIcon';\n\nconst useStyles = makeStyles(theme => ({\n  sidebar: {\n    display: 'flex',\n    flexDirection: 'column',\n    width: '100%',\n    height: '100%',\n    padding: theme.spacing(2),\n    overflow: 'hidden',\n  },\n  titleRow: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: theme.spacing(2),\n    gap: theme.spacing(1),\n  },\n  title: {\n    fontWeight: 500,\n    fontSize: '1.25rem',\n    lineHeight: '2rem',\n    letterSpacing: '-0.25px',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    flex: 1,\n    minWidth: 0,\n  },\n  collapseButton: {\n    flexShrink: 0,\n  },\n  documentsRow: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n  documentCount: {\n    fontWeight: 700,\n    fontSize: '1.125rem',\n    lineHeight: '2rem',\n  },\n  addButton: {\n    textTransform: 'none',\n  },\n  documentsList: {\n    marginTop: theme.spacing(2),\n    display: 'flex',\n    flexDirection: 'column',\n    gap: theme.spacing(0.5),\n    overflowY: 'auto',\n    flex: 1,\n  },\n  documentItem: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: theme.spacing(1),\n    padding: `${theme.spacing(1)}px ${theme.spacing(0.5)}px`,\n    borderRadius: 4,\n  },\n  fileIcon: {\n    flexShrink: 0,\n    color: theme.palette.grey[500],\n    fontSize: '1rem',\n  },\n  fileName: {\n    flex: 1,\n    minWidth: 0,\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    fontSize: '0.875rem',\n    lineHeight: '1.25rem',\n  },\n  spinnerContainer: {\n    flexShrink: 0,\n  },\n}));\n\ntype DocumentSidebarProps = {\n  notebookName: string;\n  documents: SessionDocument[];\n  uploadingFileNames: string[];\n  completedFileNames?: Set<string>;\n  collapsed: boolean;\n  onToggleCollapse: () => void;\n  onAddDocument: () => void;\n};\n\nexport const DocumentSidebar = ({\n  notebookName,\n  documents,\n  uploadingFileNames,\n  completedFileNames,\n  collapsed,\n  onToggleCollapse,\n  onAddDocument,\n}: DocumentSidebarProps) => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  if (collapsed) {\n    return null;\n  }\n\n  const uploadedNames = new Set(documents.map(d => d.title));\n  const activePending = uploadingFileNames.filter(\n    name => !uploadedNames.has(name),\n  );\n  const totalCount = documents.length + activePending.length;\n\n  return (\n    <div className={classes.sidebar}>\n      <div className={classes.titleRow}>\n        <Typography className={classes.title}>{notebookName}</Typography>\n        <Tooltip content={t('notebook.view.sidebar.collapse')} position=\"right\">\n          <Button\n            variant=\"plain\"\n            className={classes.collapseButton}\n            onClick={onToggleCollapse}\n            aria-label={t('notebook.view.sidebar.collapse')}\n          >\n            <SidebarCollapseIcon />\n          </Button>\n        </Tooltip>\n      </div>\n\n      <div className={classes.documentsRow}>\n        <Typography className={classes.documentCount}>\n          {t('notebook.view.documents.count', {\n            count: totalCount,\n          } as any)}\n        </Typography>\n        <Button\n          variant=\"link\"\n          className={classes.addButton}\n          icon={<PlusCircleIcon />}\n          onClick={onAddDocument}\n        >\n          {t('notebook.view.documents.add')}\n        </Button>\n      </div>\n\n      {(documents.length > 0 || activePending.length > 0) && (\n        <div className={classes.documentsList}>\n          {documents.map(doc => (\n            <div key={doc.document_id} className={classes.documentItem}>\n              <FileTypeIcon fileName={doc.title} />\n              <Typography className={classes.fileName}>{doc.title}</Typography>\n            </div>\n          ))}\n          {activePending.map(fileName => (\n            <div key={`pending-${fileName}`} className={classes.documentItem}>\n              <FileTypeIcon fileName={fileName} />\n              <Typography className={classes.fileName}>{fileName}</Typography>\n              {!completedFileNames?.has(fileName) && (\n                <div className={classes.spinnerContainer}>\n                  <Spinner\n                    size=\"md\"\n                    aria-label={t('notebook.view.documents.uploading')}\n                  />\n                </div>\n              )}\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}