Merge branch 'develop' into release/release-8

Author: bobbykolev

src/core/apollo/generated/apollo-hooks.ts

@@ -18769,6 +18769,11 @@ export const ConfigurationDocument = gql`
       configuration {
         ...Configuration
       }
+      settings {
+        integration {
+          iframeAllowedUrls
+        }
+      }
     }
   }
   ${ConfigurationFragmentDoc}

src/core/apollo/generated/graphql-schema.ts

@@ -23172,6 +23172,10 @@ export type ConfigurationQuery = {
       apm: { __typename?: 'APM'; rumEnabled: boolean; endpoint: string };
       geo: { __typename?: 'Geo'; endpoint: string };
     };
+    settings: {
+      __typename?: 'PlatformSettings';
+      integration: { __typename?: 'PlatformIntegrationSettings'; iframeAllowedUrls: Array<string> };
+    };
   };
 };
 

src/core/apollo/graphqlLinks/httpLink.ts

@@ -50,7 +50,7 @@ export const httpLink = (graphQLEndpoint: string, enableWebSockets: boolean) =>
         uploadLink
       );
     } catch (error) {
-      logWarn(error as Error, { category: TagCategoryValues.WS });
+      logWarn(error as Error, { category: TagCategoryValues.WS, label: 'Failed to create ws link' });
     }
   }
   return uploadLink;

src/core/i18n/en/translation.en.json

@@ -877,7 +877,7 @@
       "findByUrl": {
         "title": "Subspace URL",
         "description": "Enter the URL of the Subspace you want to copy as a template.",
-        "use": "Use this space",
+        "use": "Use this Subspace",
         "spaceNotFoundError": "Space not found",
         "collaborationNotFoundError": "Collaboration not found",
         "selectAnother": "Update Collaboration from another Space"
@@ -3127,7 +3127,7 @@
       },
       "comingSoon": {
         "title": "🚀 Coming soon!",
-        "subTitle": "We're currently building the functionality to use external AI services for your Virtual Contributor. You can help us by sharing which AI service you would like to use.",
+        "subTitle": "Looking for a different AI service? Let us know!",
         "input": {
           "label": "AI Service",
           "placeholder": "E.g. the AI that xx created to xx"
@@ -3156,7 +3156,7 @@
       "title": "Choose a (Sub)Space",
       "description": "Which Space or Subspace do you want to bring to life with the Virtual Contributor? Below you'll be able to choose from all Spaces and Subspaces that you are host of.",
       "label": "(Sub)Space",
-      "noSpaces": "You need a Space to proceed with this option. To create a Virtual Contributor, please go back and follow the Written Knowledge flow."
+      "noSpaces": "You need a Space to proceed with this option. To create a Virtual Contributor without a Space, please go back and follow the Written Knowledge flow."
     },
     "chooseCommunity": {
       "title": "Hello, {{vcName}}!",

src/core/ui/forms/MarkdownInputControls/InsertEmbedCodeButton/InsertEmbedCodeButton.tsx

@@ -14,7 +14,7 @@ import DialogHeader from '@/core/ui/dialog/DialogHeader';
 import DialogWithGrid from '@/core/ui/dialog/DialogWithGrid';
 import { MARKDOWN_TEXT_LENGTH } from '@/core/ui/forms/field-length.constants';
 import { gutters } from '@/core/ui/grid/utils';
-import { ALLOWED_EMBED_URLS } from '@/core/ui/markdown/embed/allowedEmbedUrls';
+import { useConfig } from '@/domain/platform/config/useConfig';
 
 interface InsertEmbedCodeButtonProps extends IconButtonProps {
   editor: Editor | null;
@@ -34,6 +34,8 @@ export const InsertEmbedCodeButton = ({
 
   const notify = useNotification();
 
+  const { integration: { iframeAllowedUrls = [] } = {} } = useConfig();
+
   const buttonRef = useRef<HTMLButtonElement>(null);
 
   const textareaRef = useRef<HTMLTextAreaElement>(null);
@@ -98,7 +100,7 @@ export const InsertEmbedCodeButton = ({
     }
 
     const srcOrigin = new URL(embedCodeSrc).origin;
-    const isValidSource = ALLOWED_EMBED_URLS.some(vS => vS === srcOrigin);
+    const isValidSource = iframeAllowedUrls.some(vS => vS === srcOrigin);
 
     if (!isValidSource) {
       notify(t('components.wysiwyg-editor.embed.invalidOrUnsupportedEmbed'), 'error');

src/core/ui/markdown/WrapperMarkdown.tsx

@@ -6,6 +6,7 @@ import PlainText from './PlainText';
 import { MarkdownOptions, MarkdownOptionsProvider } from './MarkdownOptionsContext';
 import { Box } from '@mui/material';
 import { remarkVerifyIframe } from './embed/remarkVerifyIframe';
+import { useConfig } from '@/domain/platform/config/useConfig';
 
 const allowedNodeTypes = ['iframe'] as const;
 
@@ -21,25 +22,33 @@ export const WrapperMarkdown = ({
   caption = false,
   sx,
   ...props
-}: MarkdownProps) => (
-  <MarkdownOptionsProvider
-    card={card}
-    plain={plain}
-    multiline={multiline}
-    disableParagraphPadding={disableParagraphPadding}
-    caption={caption}
-  >
-    <Box sx={{ li: { marginY: caption ? 0 : 1 }, display: plain ? 'inline' : undefined, ...sx }}>
-      <ReactMarkdown
-        components={components}
-        remarkPlugins={[gfm, [PlainText, { enabled: plain }], remarkVerifyIframe]}
-        rehypePlugins={
-          plain ? undefined : ([rehypeRaw, { passThrough: allowedNodeTypes }] as MarkdownProps['rehypePlugins'])
-        }
-        {...props}
-      />
-    </Box>
-  </MarkdownOptionsProvider>
-);
+}: MarkdownProps) => {
+  const { integration: { iframeAllowedUrls = [] } = {} } = useConfig();
+
+  return (
+    <MarkdownOptionsProvider
+      card={card}
+      plain={plain}
+      multiline={multiline}
+      disableParagraphPadding={disableParagraphPadding}
+      caption={caption}
+    >
+      <Box sx={{ li: { marginY: caption ? 0 : 1 }, display: plain ? 'inline' : undefined, ...sx }}>
+        <ReactMarkdown
+          components={components}
+          remarkPlugins={[
+            gfm,
+            [PlainText, { enabled: plain }],
+            [remarkVerifyIframe, { allowedIFrameOrigins: iframeAllowedUrls }],
+          ]}
+          rehypePlugins={
+            plain ? undefined : ([rehypeRaw, { passThrough: allowedNodeTypes }] as MarkdownProps['rehypePlugins'])
+          }
+          {...props}
+        />
+      </Box>
+    </MarkdownOptionsProvider>
+  );
+};
 
 export default WrapperMarkdown;

src/core/ui/markdown/embed/allowedEmbedUrls.ts

@@ -1,9 +1,7 @@
-import { Pluggable } from 'unified';
+import { Plugin } from 'unified';
 import { visit } from 'unist-util-visit';
 
-import { ALLOWED_EMBED_URLS } from './allowedEmbedUrls';
-
-const isAllowedUrl = (url: string) => {
+const isAllowedUrl = (url: string, allowedIFrameOrigins: string[]) => {
   try {
     const parsedUrl = new URL(url);
 
@@ -13,18 +11,20 @@ const isAllowedUrl = (url: string) => {
 
     const srcOrigin = parsedUrl.origin;
 
-    return ALLOWED_EMBED_URLS.some(vS => vS === srcOrigin);
+    return allowedIFrameOrigins.some(vS => vS === srcOrigin);
   } catch (e) {
     console.error('Invalid iframe URL:', url, e);
 
     return false;
   }
 };
 
-export const remarkVerifyIframe: Pluggable = () => {
+export const remarkVerifyIframe: Plugin<[{ allowedIFrameOrigins?: string[] }]> = ({
+  allowedIFrameOrigins = [],
+} = {}) => {
   return tree => {
     visit(tree, 'html', (node: { value: string }) => {
-      if (node && typeof node.value === 'string') {
+      if (node && node.value) {
         const nodeValue: string = node.value;
         if (nodeValue.toLowerCase().includes('<iframe')) {
           try {
@@ -38,7 +38,7 @@ export const remarkVerifyIframe: Pluggable = () => {
             } else {
               for (let iframe of iframes) {
                 const src = iframe.getAttribute('src');
-                if (!src || !isAllowedUrl(src)) {
+                if (!src || !isAllowedUrl(src, allowedIFrameOrigins)) {
                   node.value = '';
                   return;
                 }

src/core/ui/markdown/embed/remarkVerifyIframe.ts

@@ -47,6 +47,7 @@ export interface WhiteboardDetails {
     preview?: {
       id: string;
     } & PreviewImageDimensions;
+    url?: string;
   };
   createdBy?: {
     id: string;

src/domain/collaboration/whiteboard/WhiteboardDialog/WhiteboardDialog.tsx

@@ -28,6 +28,7 @@ import useWhiteboardDefaults from './useWhiteboardDefaults';
 import Loading from '@/core/ui/loading/Loading';
 import { Identifiable } from '@/core/utils/Identifiable';
 import { lazyWithGlobalErrorHandler } from '@/core/lazyLoading/lazyWithGlobalErrorHandler';
+import { TagCategoryValues, error as logError } from '@/core/logging/sentry/log';
 
 const FILE_IMPORT_ENABLED = true;
 const SAVE_FILE_TO_DISK = true;
@@ -73,7 +74,7 @@ const useActorWhiteboardStyles = makeStyles(theme => ({
 }));
 
 export interface WhiteboardWhiteboardEntities {
-  whiteboard: Identifiable | undefined;
+  whiteboard: (Identifiable & { profile?: { url?: string } }) | undefined;
   filesManager: WhiteboardFilesManager;
   lastSavedDate: Date | undefined;
 }
@@ -165,6 +166,12 @@ const CollaborativeExcalidrawWrapper = ({
       if (isOnline) {
         setupReconnectTimeout();
       }
+      // event if it's duplicated by the httpLink and Portal handlers, let's log this closeConnection one
+      // with additional info here #7492
+      logError('WB Connection Closed', {
+        category: TagCategoryValues.WHITEBOARD,
+        label: `WB ID: ${whiteboard?.id}; URL: ${whiteboard?.profile?.url}; Online: ${isOnline}`,
+      });
     },
     onInitialize: collabApi => {
       combinedCollabApiRef.current = collabApi;

src/domain/common/whiteboard/excalidraw/CollaborativeExcalidrawWrapper.tsx

@@ -30,7 +30,14 @@ const ConfigProvider: FC<ConfigProviderProps> = ({ children, url }) => {
   const [requestConfig, loading, error] = useLoadingStateWithHandlers(
     async (url: string) => {
       const result = await queryRequest<ConfigurationQuery>(url, ConfigurationDocument);
-      setConfig(result.data.data.platform.configuration);
+      const platformConfiguration = result.data.data.platform.configuration;
+      const settings = result.data.data.platform.settings;
+      const combinedConfiguration: Configuration = {
+        ...platformConfiguration,
+        ...settings,
+      };
+
+      setConfig(combinedConfiguration);
     },
     {
       onError: err => logWarn(err, { category: TagCategoryValues.CONFIG }),

src/domain/platform/config/ConfigProvider.tsx

@@ -3,6 +3,11 @@ query configuration {
     configuration {
       ...Configuration
     }
+    settings {
+      integration {
+        iframeAllowedUrls
+      }
+    }
   }
 }
 

src/domain/platform/config/configuration.graphql

@@ -41,6 +41,9 @@ export interface Configuration {
   geo: {
     endpoint: string;
   };
+  integration: {
+    iframeAllowedUrls: string[];
+  };
 }
 
 interface AuthenticationProvider {

src/domain/platform/config/configuration.ts

@@ -17,6 +17,7 @@ export const useConfig = () => {
       authentication: context.config?.authentication,
       locations: context.config?.locations,
       features: context.config?.featureFlags,
+      integration: context.config?.integration,
       sentry: context.config?.sentry,
       apm: context.config?.apm,
       geo: context.config?.geo,