@red-hat-developer-hub/backstage-plugin-lightspeed 2.8.4 → 2.9.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 ## @red-hat-developer-hub/backstage-plugin-lightspeed
 
+## 2.9.0
+
+### Minor Changes
+
+- 824efa9: documents cannot be uploaded when a document processing is in progress
+
+### Patch Changes
+
+- @red-hat-developer-hub/backstage-plugin-lightspeed-common@2.9.0
+
+## 2.8.5
+
+### Patch Changes
+
+- 52ac724: fix(lightspeed): prevent JSS class name prefix from leaking into host application styles
+  - @red-hat-developer-hub/backstage-plugin-lightspeed-common@2.8.5
+
 ## 2.8.4
 
 ### Patch Changes

package/dist/alpha/LightspeedFAB.esm.js

@@ -1,48 +1,35 @@
 import { jsx } from 'react/jsx-runtime';
-import { StylesProvider as StylesProvider$1 } from '@material-ui/core/styles';
 import CloseIcon from '@mui/icons-material/Close';
+import Box from '@mui/material/Box';
 import Fab from '@mui/material/Fab';
 import Tooltip from '@mui/material/Tooltip';
-import { makeStyles, StylesProvider } from '@mui/styles';
 import { ChatbotDisplayMode } from '@patternfly/chatbot';
 import { LightspeedFABIcon } from '../components/LightspeedIcon.esm.js';
 import { DOCKED_CONTENT_OFFSET } from '../const.esm.js';
 import { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext.esm.js';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
-import { generateClassName, generateClassNameV4 } from '../utils/generateClassName.esm.js';
 
-const useStyles = makeStyles((theme) => ({
-  fab: {
-    opacity: "1 !important",
-    backgroundColor: `${theme?.palette?.primary?.main ?? "#1976d2"} !important`,
-    color: `${theme?.palette?.primary?.contrastText ?? "#fff"} !important`,
-    boxShadow: `${theme?.shadows?.[6] ?? "0px 3px 5px -1px rgba(0,0,0,0.2), 0px 6px 10px 0px rgba(0,0,0,0.14), 0px 1px 18px 0px rgba(0,0,0,0.12)"} !important`
-  },
-  "fab-button": {
-    bottom: `calc(${theme?.spacing?.(2) ?? "16px"} + 1.5em)`,
-    right: `calc(${theme?.spacing?.(2) ?? "16px"} + 1.5em)`,
-    alignItems: "end",
-    zIndex: 200,
-    display: "flex",
-    position: "fixed",
-    // When ApplicationDrawer is docked, match main content inset
-    "body.docked-drawer-open &": {
-      transition: "margin-right 0.3s ease",
-      marginRight: DOCKED_CONTENT_OFFSET
-    }
-  }
-}));
-const LightspeedFABInner = () => {
+const LightspeedFAB = () => {
   const { t } = useTranslation();
   const { isChatbotActive, toggleChatbot, displayMode } = useLightspeedDrawerContext();
-  const fabButton = useStyles();
   if (displayMode === ChatbotDisplayMode.embedded) {
     return null;
   }
   return /* @__PURE__ */ jsx(
-    "div",
+    Box,
     {
-      className: fabButton["fab-button"],
+      sx: (theme) => ({
+        bottom: `calc(${theme.spacing(2)} + 1.5em)`,
+        right: `calc(${theme.spacing(2)} + 1.5em)`,
+        alignItems: "end",
+        zIndex: 200,
+        display: "flex",
+        position: "fixed",
+        "body.docked-drawer-open &": {
+          transition: "margin-right 0.3s ease",
+          marginRight: DOCKED_CONTENT_OFFSET
+        }
+      }),
       id: "lightspeed-fab",
       "data-testid": "lightspeed-fab",
       children: /* @__PURE__ */ jsx(
@@ -58,8 +45,13 @@ const LightspeedFABInner = () => {
               size: "small",
               onClick: toggleChatbot,
               "aria-label": isChatbotActive ? t("tooltip.fab.close") : t("tooltip.fab.open"),
-              className: fabButton.fab,
-              sx: { borderRadius: "100% !important" },
+              sx: (theme) => ({
+                borderRadius: "100% !important",
+                opacity: "1 !important",
+                backgroundColor: `${theme.palette?.primary?.main ?? "#1976d2"} !important`,
+                color: `${theme.palette?.primary?.contrastText ?? "#fff"} !important`,
+                boxShadow: `${theme.shadows?.[6] ?? "0px 3px 5px -1px rgba(0,0,0,0.2), 0px 6px 10px 0px rgba(0,0,0,0.14), 0px 1px 18px 0px rgba(0,0,0,0.12)"} !important`
+              }),
               children: isChatbotActive ? /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx(LightspeedFABIcon, {})
             }
           )
@@ -68,7 +60,6 @@ const LightspeedFABInner = () => {
     }
   );
 };
-const LightspeedFAB = () => /* @__PURE__ */ jsx(StylesProvider, { generateClassName, children: /* @__PURE__ */ jsx(StylesProvider$1, { generateClassName: generateClassNameV4, children: /* @__PURE__ */ jsx(LightspeedFABInner, {}) }) });
 
 export { LightspeedFAB };
 //# sourceMappingURL=LightspeedFAB.esm.js.map

package/dist/alpha/LightspeedFAB.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LightspeedFAB.esm.js","sources":["../../src/alpha/LightspeedFAB.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 { StylesProvider as StylesProviderV4 } from '@material-ui/core/styles';\nimport Close from '@mui/icons-material/Close';\nimport Fab from '@mui/material/Fab';\nimport Tooltip from '@mui/material/Tooltip';\nimport { makeStyles, StylesProvider } from '@mui/styles';\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { LightspeedFABIcon } from '../components/LightspeedIcon';\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext';\nimport { useTranslation } from '../hooks/useTranslation';\nimport {\n  generateClassName,\n  generateClassNameV4,\n} from '../utils/generateClassName';\n\nconst useStyles = makeStyles(theme => ({\n  fab: {\n    opacity: '1 !important',\n    backgroundColor: `${theme?.palette?.primary?.main ?? '#1976d2'} !important`,\n    color: `${theme?.palette?.primary?.contrastText ?? '#fff'} !important`,\n    boxShadow: `${\n      theme?.shadows?.[6] ??\n      '0px 3px 5px -1px rgba(0,0,0,0.2), 0px 6px 10px 0px rgba(0,0,0,0.14), 0px 1px 18px 0px rgba(0,0,0,0.12)'\n    } !important`,\n  },\n  'fab-button': {\n    bottom: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,\n    right: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,\n    alignItems: 'end',\n    zIndex: 200,\n    display: 'flex',\n    position: 'fixed',\n\n    // When ApplicationDrawer is docked, match main content inset\n    'body.docked-drawer-open &': {\n      transition: 'margin-right 0.3s ease',\n      marginRight: DOCKED_CONTENT_OFFSET,\n    },\n  },\n}));\n\nconst LightspeedFABInner = () => {\n  const { t } = useTranslation();\n  const { isChatbotActive, toggleChatbot, displayMode } =\n    useLightspeedDrawerContext();\n  const fabButton = useStyles();\n\n  if (displayMode === ChatbotDisplayMode.embedded) {\n    return null;\n  }\n\n  return (\n    <div\n      className={fabButton['fab-button']}\n      id=\"lightspeed-fab\"\n      data-testid=\"lightspeed-fab\"\n    >\n      <Tooltip\n        title={isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')}\n        placement=\"left\"\n      >\n        <Fab\n          color=\"primary\"\n          variant=\"circular\"\n          size=\"small\"\n          onClick={toggleChatbot}\n          aria-label={\n            isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')\n          }\n          className={fabButton.fab}\n          sx={{ borderRadius: '100% !important' }}\n        >\n          {isChatbotActive ? <Close fontSize=\"small\" /> : <LightspeedFABIcon />}\n        </Fab>\n      </Tooltip>\n    </div>\n  );\n};\n\n/**\n * @alpha\n * Lightspeed Floating action button to open/close the lightspeed chatbot\n */\nexport const LightspeedFAB = () => (\n  <StylesProvider generateClassName={generateClassName}>\n    <StylesProviderV4 generateClassName={generateClassNameV4}>\n      <LightspeedFABInner />\n    </StylesProviderV4>\n  </StylesProvider>\n);\n"],"names":["Close","StylesProviderV4"],"mappings":";;;;;;;;;;;;;AAgCA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,GAAA,EAAK;AAAA,IACH,OAAA,EAAS,cAAA;AAAA,IACT,iBAAiB,CAAA,EAAG,KAAA,EAAO,OAAA,EAAS,OAAA,EAAS,QAAQ,SAAS,CAAA,WAAA,CAAA;AAAA,IAC9D,OAAO,CAAA,EAAG,KAAA,EAAO,OAAA,EAAS,OAAA,EAAS,gBAAgB,MAAM,CAAA,WAAA,CAAA;AAAA,IACzD,WAAW,CAAA,EACT,KAAA,EAAO,OAAA,GAAU,CAAC,KAClB,wGACF,CAAA,WAAA;AAAA,GACF;AAAA,EACA,YAAA,EAAc;AAAA,IACZ,QAAQ,CAAA,KAAA,EAAQ,KAAA,EAAO,OAAA,GAAU,CAAC,KAAK,MAAM,CAAA,SAAA,CAAA;AAAA,IAC7C,OAAO,CAAA,KAAA,EAAQ,KAAA,EAAO,OAAA,GAAU,CAAC,KAAK,MAAM,CAAA,SAAA,CAAA;AAAA,IAC5C,UAAA,EAAY,KAAA;AAAA,IACZ,MAAA,EAAQ,GAAA;AAAA,IACR,OAAA,EAAS,MAAA;AAAA,IACT,QAAA,EAAU,OAAA;AAAA;AAAA,IAGV,2BAAA,EAA6B;AAAA,MAC3B,UAAA,EAAY,wBAAA;AAAA,MACZ,WAAA,EAAa;AAAA;AACf;AAEJ,CAAA,CAAE,CAAA;AAEF,MAAM,qBAAqB,MAAM;AAC/B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAC7B,EAAA,MAAM,EAAE,eAAA,EAAiB,aAAA,EAAe,WAAA,KACtC,0BAAA,EAA2B;AAC7B,EAAA,MAAM,YAAY,SAAA,EAAU;AAE5B,EAAA,IAAI,WAAA,KAAgB,mBAAmB,QAAA,EAAU;AAC/C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,UAAU,YAAY,CAAA;AAAA,MACjC,EAAA,EAAG,gBAAA;AAAA,MACH,aAAA,EAAY,gBAAA;AAAA,MAEZ,QAAA,kBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,OAAO,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,UACtE,SAAA,EAAU,MAAA;AAAA,UAEV,QAAA,kBAAA,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,SAAA;AAAA,cACN,OAAA,EAAQ,UAAA;AAAA,cACR,IAAA,EAAK,OAAA;AAAA,cACL,OAAA,EAAS,aAAA;AAAA,cACT,cACE,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,cAEjE,WAAW,SAAA,CAAU,GAAA;AAAA,cACrB,EAAA,EAAI,EAAE,YAAA,EAAc,iBAAA,EAAkB;AAAA,cAErC,4CAAkB,GAAA,CAACA,SAAA,EAAA,EAAM,UAAS,OAAA,EAAQ,CAAA,uBAAM,iBAAA,EAAA,EAAkB;AAAA;AAAA;AACrE;AAAA;AACF;AAAA,GACF;AAEJ,CAAA;AAMO,MAAM,aAAA,GAAgB,sBAC3B,GAAA,CAAC,cAAA,EAAA,EAAe,iBAAA,EACd,QAAA,kBAAA,GAAA,CAACC,gBAAA,EAAA,EAAiB,iBAAA,EAAmB,mBAAA,EACnC,QAAA,kBAAA,GAAA,CAAC,kBAAA,EAAA,EAAmB,CAAA,EACtB,CAAA,EACF;;;;"}
+{"version":3,"file":"LightspeedFAB.esm.js","sources":["../../src/alpha/LightspeedFAB.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 Close from '@mui/icons-material/Close';\nimport Box from '@mui/material/Box';\nimport Fab from '@mui/material/Fab';\nimport Tooltip from '@mui/material/Tooltip';\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { LightspeedFABIcon } from '../components/LightspeedIcon';\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext';\nimport { useTranslation } from '../hooks/useTranslation';\n\n/**\n * @alpha\n * Lightspeed Floating action button to open/close the lightspeed chatbot\n */\nexport const LightspeedFAB = () => {\n  const { t } = useTranslation();\n  const { isChatbotActive, toggleChatbot, displayMode } =\n    useLightspeedDrawerContext();\n\n  if (displayMode === ChatbotDisplayMode.embedded) {\n    return null;\n  }\n\n  return (\n    <Box\n      sx={theme => ({\n        bottom: `calc(${theme.spacing(2)} + 1.5em)`,\n        right: `calc(${theme.spacing(2)} + 1.5em)`,\n        alignItems: 'end',\n        zIndex: 200,\n        display: 'flex',\n        position: 'fixed',\n        'body.docked-drawer-open &': {\n          transition: 'margin-right 0.3s ease',\n          marginRight: DOCKED_CONTENT_OFFSET,\n        },\n      })}\n      id=\"lightspeed-fab\"\n      data-testid=\"lightspeed-fab\"\n    >\n      <Tooltip\n        title={isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')}\n        placement=\"left\"\n      >\n        <Fab\n          color=\"primary\"\n          variant=\"circular\"\n          size=\"small\"\n          onClick={toggleChatbot}\n          aria-label={\n            isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')\n          }\n          sx={theme => ({\n            borderRadius: '100% !important',\n            opacity: '1 !important',\n            backgroundColor: `${theme.palette?.primary?.main ?? '#1976d2'} !important`,\n            color: `${theme.palette?.primary?.contrastText ?? '#fff'} !important`,\n            boxShadow: `${\n              theme.shadows?.[6] ??\n              '0px 3px 5px -1px rgba(0,0,0,0.2), 0px 6px 10px 0px rgba(0,0,0,0.14), 0px 1px 18px 0px rgba(0,0,0,0.12)'\n            } !important`,\n          })}\n        >\n          {isChatbotActive ? <Close fontSize=\"small\" /> : <LightspeedFABIcon />}\n        </Fab>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":["Close"],"mappings":";;;;;;;;;;;AA+BO,MAAM,gBAAgB,MAAM;AACjC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAC7B,EAAA,MAAM,EAAE,eAAA,EAAiB,aAAA,EAAe,WAAA,KACtC,0BAAA,EAA2B;AAE7B,EAAA,IAAI,WAAA,KAAgB,mBAAmB,QAAA,EAAU;AAC/C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,IAAI,CAAA,KAAA,MAAU;AAAA,QACZ,MAAA,EAAQ,CAAA,KAAA,EAAQ,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,SAAA,CAAA;AAAA,QAChC,KAAA,EAAO,CAAA,KAAA,EAAQ,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,SAAA,CAAA;AAAA,QAC/B,UAAA,EAAY,KAAA;AAAA,QACZ,MAAA,EAAQ,GAAA;AAAA,QACR,OAAA,EAAS,MAAA;AAAA,QACT,QAAA,EAAU,OAAA;AAAA,QACV,2BAAA,EAA6B;AAAA,UAC3B,UAAA,EAAY,wBAAA;AAAA,UACZ,WAAA,EAAa;AAAA;AACf,OACF,CAAA;AAAA,MACA,EAAA,EAAG,gBAAA;AAAA,MACH,aAAA,EAAY,gBAAA;AAAA,MAEZ,QAAA,kBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,OAAO,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,UACtE,SAAA,EAAU,MAAA;AAAA,UAEV,QAAA,kBAAA,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,SAAA;AAAA,cACN,OAAA,EAAQ,UAAA;AAAA,cACR,IAAA,EAAK,OAAA;AAAA,cACL,OAAA,EAAS,aAAA;AAAA,cACT,cACE,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,cAEjE,IAAI,CAAA,KAAA,MAAU;AAAA,gBACZ,YAAA,EAAc,iBAAA;AAAA,gBACd,OAAA,EAAS,cAAA;AAAA,gBACT,iBAAiB,CAAA,EAAG,KAAA,CAAM,OAAA,EAAS,OAAA,EAAS,QAAQ,SAAS,CAAA,WAAA,CAAA;AAAA,gBAC7D,OAAO,CAAA,EAAG,KAAA,CAAM,OAAA,EAAS,OAAA,EAAS,gBAAgB,MAAM,CAAA,WAAA,CAAA;AAAA,gBACxD,WAAW,CAAA,EACT,KAAA,CAAM,OAAA,GAAU,CAAC,KACjB,wGACF,CAAA,WAAA;AAAA,eACF,CAAA;AAAA,cAEC,4CAAkB,GAAA,CAACA,SAAA,EAAA,EAAM,UAAS,OAAA,EAAQ,CAAA,uBAAM,iBAAA,EAAA,EAAkB;AAAA;AAAA;AACrE;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist/alpha.d.ts

@@ -77,6 +77,7 @@ declare const lightspeedTranslationRef: _backstage_frontend_plugin_api.Translati
     readonly "notebook.view.sidebar.resize": string;
     readonly "notebook.view.documents.uploading": string;
     readonly "notebook.view.documents.maxReached": string;
+    readonly "notebook.view.documents.uploadsInProgress": string;
     readonly "notebook.upload.failed": string;
     readonly "notebook.upload.modal.title": string;
     readonly "notebook.upload.modal.dragDropTitle": string;

package/dist/components/LightSpeedChat.esm.js

@@ -571,9 +571,7 @@ const LightspeedChat = ({
     []
   );
   const createNotebookMutation = useCreateNotebook();
-  const { data: notebookDocuments = [] } = useNotebookDocuments(
-    activeNotebook?.session_id
-  );
+  const { data: notebookDocuments = [], isFetching: isDocumentsFetching } = useNotebookDocuments(activeNotebook?.session_id);
   const [conversationId, setConversationId] = useState("");
   const [requestId, setRequestId] = useState("");
   const [newChatCreated, setNewChatCreated] = useState(false);
@@ -1612,10 +1610,15 @@ const LightspeedChat = ({
                 minHeight: theme.spacing(6),
                 paddingLeft: theme.spacing(2),
                 paddingRight: theme.spacing(2),
+                "& .MuiTabs-flexContainer": {
+                  gap: theme.spacing(2)
+                },
                 '& [role="tab"]': {
                   fontWeight: 700,
                   textTransform: "none",
                   opacity: 1,
+                  padding: `${theme.spacing(1)} ${theme.spacing(2)}`,
+                  borderRadius: theme.spacing(0.5),
                   '&:not([aria-selected="true"])': {
                     color: `${theme.palette.text.primary} !important`
                   },
@@ -1770,6 +1773,7 @@ const LightspeedChat = ({
               sessionId: activeNotebook.session_id,
               notebookName: activeNotebook.name,
               documents: notebookDocuments,
+              isDocumentsFetching,
               metadata: activeNotebook.metadata,
               topicSummary: conversations.find(
                 (c) => c.conversation_id === activeNotebook.metadata?.conversation_id