fix(chat): add security fixes/policies and fix stucking conversations wuth huge stages (Issue #4700, #4683, #4698) (#4719)

Co-authored-by: Alexander <98586297+Alexander-Kezik@users.noreply.github.com>
Co-authored-by: Denys_Kolomiitsev <143205282+denys-kolomiitsev@users.noreply.github.com>

Author: 3 people

apps/chat/next.config.js

@@ -73,7 +73,7 @@ const nextConfig = {
   poweredByHeader: false,
   reactStrictMode: true,
   // @ts-ignore
-  basePath: process.env.APP_BASE_PATH || '',
+  basePath: process.env.NODE_ENV !== 'development' ? new BasePathResolver() : '',
 
   async redirects() {
     return [

apps/chat/src/components/Chat/MessageStage.tsx

@@ -113,7 +113,7 @@ export const MessageStage = ({ stage }: Props) => {
             isOpened ? 'border-t border-secondary p-2' : 'h-0',
           )}
         >
-          {stage.content && (
+          {isOpened && stage.content && (
             <span className="inline-block overflow-auto">
               <ChatMDComponent
                 isShowResponseLoader={false}

apps/chat/src/components/Chat/NotAllowedModel.tsx

@@ -14,8 +14,7 @@ import { UISelectors } from '@/src/store/selectors';
 import { ScrollDownButton } from '@/src/components/Common/ScrollDownButton';
 
 const ICON_SIZE = 24;
-const BUTTON_CLASS_NAME =
-  'underline underline-offset-2 hover:text-accent-primary transition-colors';
+const BUTTON_CLASS_NAME = 'underline underline-offset-2 transition-colors';
 const INTERNAL_CLICK_MARKER = '__INTERNAL_CLICK_ACTION_MARKER__';
 
 interface NotAllowedModelProps {

apps/chat/src/middleware.ts

@@ -21,13 +21,18 @@ export function middleware(request: NextRequest) {
     process.env.ALLOWED_IFRAME_SOURCES,
     shouldIgnoreFrameOptions,
   );
-
+  const allowedScriptsSrc =
+    `${process.env.ALLOWED_IFRAME_ORIGINS} ${process.env.ALLOWED_IFRAME_SOURCES}`.replace(
+      "'self'",
+      '',
+    );
   const cspHeader = `
     object-src 'none';
     base-uri 'self';
-    script-src ${process.env.ALLOWED_IFRAME_ORIGINS ?? "'self'"} ${process.env.ALLOWED_IFRAME_SOURCES ? process.env.ALLOWED_IFRAME_SOURCES.replace("'self'", '') : ''}
+    script-src 'self' ${allowedScriptsSrc}
      https://cdn.jsdelivr.net/npm/monaco-editor@0.43.0/
      'nonce-${nonce}' 'wasm-unsafe-eval' ${isDev ? "'unsafe-eval'" : ''};
+     worker-src 'self' blob:;
     ${frameDirectives}
 `;
   // Replace newline characters and spaces

apps/chat/src/utils/server/headers-helpers.ts

@@ -1,5 +1,6 @@
 export const cleanHeaderDirectives = (directives: string) =>
   directives.replace(/\s{2,}/g, ' ').trim();
+
 /**
  *
  * @param frameAncestors sources for the 'frame-ancestors' directive from the 'process.env.ALLOWED_IFRAME_ORIGINS'
@@ -14,11 +15,13 @@ export const getFrameContentSecurityPolicyDirectives = (
 ) => {
   const ancestorsDirective =
     frameAncestors && !disabled
-      ? 'frame-ancestors ' + frameAncestors
+      ? `frame-ancestors 'self' ${frameAncestors.replace("'self'", '')}`
       : "frame-ancestors 'none'";
 
   const frameSrcDirective =
-    frameSrc && !disabled ? 'frame-src ' + frameSrc : "frame-src 'none'";
+    frameSrc && !disabled
+      ? `frame-src 'self' ${frameSrc.replace("'self'", '')}`
+      : "frame-src 'none'";
 
   return `${ancestorsDirective}; ${frameSrcDirective};`;
 };