Feat/chat full screen by udayarpanday · Pull Request #2929 · Chainlit/chainlit

udayarpanday · 2026-05-20T19:46:14Z

Summary by cubic

Upgrades the Copilot chat to a full‑screen and embeddable experience with auto‑open, privacy controls, agent selection, voice/STT with timer, richer markdown/visualizations, sharing/favorites, and Creator integration. Also upgrades Chainlit internals, hardens embed/auth flows (incl. URL token), and improves load time and scrolling across web and iframe.

New Features
- Auto-open widget (desktop/mobile with delay), embedded mode, and optional overlay; header adds share/favorite, dashboard sidebar, Creator button, and “View Prompt Context” modal.
- Privacy Shield: composer toggle with auto‑enable, section UI with redaction previews, and anonymize-before-send flow (uses access token).
- Composer: agent picker and refreshed commands UI; Upload dropdown incl. cloud files via @evoya/file-picker; Evoya attachments; project selector; prompt expand; STT‑first send button with timer.
- Voice: speech/realtime modes with timer; authenticated audio fetching.
- Markdown/visualizations: mermaid diagrams with source view/open‑in‑mermaid, react-vega charts (responsive), improved code blocks/whitespace/lists, and smarter copy/download incl. images.
- Tooling UI: Web Request tool card and tool‑step status summary (CoT).
- Branding/UI: Evoya watermark/logo and wider layout; new UI primitives (@radix-ui/react-tabs, item, spinner, input-group).
Bug Fixes
- Faster dashboard load; stable iframe chat height; reliable auto‑scroll with “jump to latest” and better behavior on user messages (incl. new tab auto‑open).
- Embedded auth: read access_token from URL/localStorage and use it for audio/files; widget sends token on connect; Privacy Shield uses access token.
- Hardened translation loading and popover/select portals for mobile and shadow roots; input placeholder set to “Your input…”.
- Design polish for commands, avatars, code/markdown (incl. DeepSeek think/math), lists, and welcome screen.
- Performance improvements for large inputs; agent list and “new chat” in embedded mode; image generation and share dialog fixes.

^{Written for commit 27a15a7. Summary will update on new commits. Review in cubic}

Feat/chainlit upgrade

…n on request

Feat/chainlit upgrade

Bugfix/chat popup height

Feature/multi modalitiy

cubic-dev-ai

11 issues found across 189 files

Prompt for AI agents (unresolved issues)


Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="frontend/src/components/chat/Messages/Message/Content/Tools/WebRequest.tsx">

<violation number="1" location="frontend/src/components/chat/Messages/Message/Content/Tools/WebRequest.tsx:11">
P1: Uncaught `JSON.parse` on `step.input` can crash rendering when payload is invalid JSON.</violation>
</file>

<file name="frontend/src/AppWrapper.tsx">

<violation number="1" location="frontend/src/AppWrapper.tsx:36">
P1: Translation loading fails permanently on import error, leaving the app blank forever</violation>
</file>

<file name="frontend/src/components/CopyButton.tsx">

<violation number="1" location="frontend/src/components/CopyButton.tsx:89">
P2: Programmatic anchor download may navigate away from the app for cross-origin image URLs because the `download` attribute is ignored by browsers for cross-origin resources.</violation>
</file>

<file name="frontend/src/components/chat/Messages/Message/index.tsx">

<violation number="1" location="frontend/src/components/chat/Messages/Message/index.tsx:97">
P2: Early `return null` filters for `Reinforcement`, `DocumentProcessor`, and `LangGraph` suppress entire step subtrees instead of preserving child messages like the existing `skip` branch does. If these filtered steps contain nested messages in `message.steps`, those children will never render.</violation>
</file>

<file name="frontend/src/components/chat/Messages/Message/ToolStepInfo.tsx">

<violation number="1" location="frontend/src/components/chat/Messages/Message/ToolStepInfo.tsx:108">
P2: useMemo omits the `t` translation dependency, which can leave step status text stale when the user changes language while `toolCalls` stays the same.</violation>
</file>

<file name="frontend/src/components/Elements/Audio.tsx">

<violation number="1" location="frontend/src/components/Elements/Audio.tsx:10">
P1: Stale audio remains visible when URL is removed or fetch fails because `audioSrc` state is never cleared on error or when `element.url` becomes falsy.</violation>

<violation number="2" location="frontend/src/components/Elements/Audio.tsx:12">
P1: Blob URL cleanup is misplaced inside an async nested function, so React never invokes it and object URLs leak memory on URL changes and unmount.</violation>
</file>

<file name="frontend/src/components/ui/separator.tsx">

<violation number="1" location="frontend/src/components/ui/separator.tsx:19">
P2: Shared `Separator` primitive has implicit sibling-dependent heading spacing rules that can cause cross-app layout regressions.</violation>
</file>

<file name="frontend/src/components/ui/dialog.tsx">

<violation number="1" location="frontend/src/components/ui/dialog.tsx:23">
P0: Overlay z-index z-[9999] exceeds dialog content z-50, causing overlay to render on top of and block interaction with the modal content.</violation>
</file>

<file name="frontend/src/components/chat/Messages/Message/Content/index.tsx">

<violation number="1" location="frontend/src/components/chat/Messages/Message/Content/index.tsx:44">
P2: useMemo dependency array is missing `transformOutput`, which can cause stale transformed output when privacy shield settings change.</violation>
</file>

<file name="frontend/src/App.tsx">

<violation number="1" location="frontend/src/App.tsx:52">
P2: Authentication request is executed unconditionally, including when token is null. This causes unnecessary failed API calls on every app mount.</violation>
</file>

_{Note: This PR contains a large number of files. cubic only reviews up to 100 files per PR, so some files may not have been reviewed. cubic prioritizes the most important files to review.

On a pro plan you can use ultrareview for larger PRs.

Re-trigger cubic}

cubic-dev-ai · 2026-05-20T19:50:07Z

@@ -20,7 +20,7 @@ const DialogOverlay = React.forwardRef<
  <DialogPrimitive.Overlay


P0: Overlay z-index z-[9999] exceeds dialog content z-50, causing overlay to render on top of and block interaction with the modal content.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/ui/dialog.tsx, line 23: <comment>Overlay z-index z-[9999] exceeds dialog content z-50, causing overlay to render on top of and block interaction with the modal content.</comment> <file context> @@ -20,7 +20,7 @@ const DialogOverlay = React.forwardRef< ref={ref} className={cn( - 'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', + 'fixed inset-0 z-[9999] bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', className )} </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

+  // const inputJson = JSON.parse(step.input ?? '{}');
+  const inputJson = useMemo(() => {
+    if (step.showInput === "json") {
+      const json = JSON.parse(step.input ?? '{}');


P1: Uncaught JSON.parse on step.input can crash rendering when payload is invalid JSON.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/chat/Messages/Message/Content/Tools/WebRequest.tsx, line 11: <comment>Uncaught `JSON.parse` on `step.input` can crash rendering when payload is invalid JSON.</comment> <file context> @@ -0,0 +1,42 @@ + // const inputJson = JSON.parse(step.input ?? '{}'); + const inputJson = useMemo(() => { + if (step.showInput === "json") { + const json = JSON.parse(step.input ?? '{}'); + console.log(json); + if (json.input && typeof json.input === 'string') { </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

-    handleChangeLanguage(translations.translation);
-    setTranslationLoaded(true);
-  }, [translations]);
+    loadTranslation(languageInUse);


P1: Translation loading fails permanently on import error, leaving the app blank forever

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/AppWrapper.tsx, line 36: <comment>Translation loading fails permanently on import error, leaving the app blank forever</comment> <file context> @@ -10,27 +10,31 @@ import { - handleChangeLanguage(translations.translation); - setTranslationLoaded(true); - }, [translations]); + loadTranslation(languageInUse); + }, []); </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

+  const [audioSrc, setAudioSrc] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!element.url) return;


P1: Stale audio remains visible when URL is removed or fetch fails because audioSrc state is never cleared on error or when element.url becomes falsy.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/Elements/Audio.tsx, line 10: <comment>Stale audio remains visible when URL is removed or fetch fails because `audioSrc` state is never cleared on error or when `element.url` becomes falsy.</comment> <file context> @@ -1,16 +1,47 @@ + const [audioSrc, setAudioSrc] = useState<string | null>(null); + + useEffect(() => { + if (!element.url) return; + + const fetchAudio = async () => { </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

+  useEffect(() => {
+    if (!element.url) return;
+
+    const fetchAudio = async () => {


P1: Blob URL cleanup is misplaced inside an async nested function, so React never invokes it and object URLs leak memory on URL changes and unmount.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/Elements/Audio.tsx, line 12: <comment>Blob URL cleanup is misplaced inside an async nested function, so React never invokes it and object URLs leak memory on URL changes and unmount.</comment> <file context> @@ -1,16 +1,47 @@ + useEffect(() => { + if (!element.url) return; + + const fetchAudio = async () => { + const token = localStorage.getItem('chainlit_token'); + const headers: Record<string, string> = { </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

      );
    }

+    if (isStep && message.name === 'Reinforcement') return null;


P2: Early return null filters for Reinforcement, DocumentProcessor, and LangGraph suppress entire step subtrees instead of preserving child messages like the existing skip branch does. If these filtered steps contain nested messages in message.steps, those children will never render.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/chat/Messages/Message/index.tsx, line 97: <comment>Early `return null` filters for `Reinforcement`, `DocumentProcessor`, and `LangGraph` suppress entire step subtrees instead of preserving child messages like the existing `skip` branch does. If these filtered steps contain nested messages in `message.steps`, those children will never render.</comment> <file context> @@ -68,6 +94,10 @@ const Message = memo( ); } + if (isStep && message.name === 'Reinforcement') return null; + if (isStep && message.type === 'tool' && message.name.includes('DocumentProcessor')) return null; + if (isStep && message.name === 'LangGraph' && (langGraphExclude.includes(evoyaMode ?? '') || isRunning)) return null; </file context>

Suggested change

if (isStep && message.name === 'Reinforcement') return null;

if (isStep && message.name === 'Reinforcement') {

if (!message.steps) return null;

return (

<Messages

messages={message.steps}

elements={elements}

actions={actions}

indent={indent}

isRunning={isRunning}

scorableRun={scorableRun}

/>

);

}

cubic-dev-ai · 2026-05-20T19:50:07Z

+    }
+
+    return <Translator path="chat.evoya.cot.thinking" />;
+  }, [toolCalls]);


P2: useMemo omits the t translation dependency, which can leave step status text stale when the user changes language while toolCalls stays the same.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/chat/Messages/Message/ToolStepInfo.tsx, line 108: <comment>useMemo omits the `t` translation dependency, which can leave step status text stale when the user changes language while `toolCalls` stays the same.</comment> <file context> @@ -0,0 +1,122 @@ + } + + return <Translator path="chat.evoya.cot.thinking" />; + }, [toolCalls]); + + return ( </file context>

cubic-dev-ai · 2026-05-20T19:50:07Z

      className={cn(
        'shrink-0 bg-border',
-        orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
+        orientation === 'horizontal' ? 'h-[1px] w-full has-[+h3]:mt-6 has-[+h4]:mt-6 has-[+h1]:mt-8 has-[+h2]:mt-8' : 'h-full w-[1px]',


P2: Shared Separator primitive has implicit sibling-dependent heading spacing rules that can cause cross-app layout regressions.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/ui/separator.tsx, line 19: <comment>Shared `Separator` primitive has implicit sibling-dependent heading spacing rules that can cause cross-app layout regressions.</comment> <file context> @@ -16,7 +16,7 @@ const Separator = React.forwardRef< className={cn( 'shrink-0 bg-border', - orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]', + orientation === 'horizontal' ? 'h-[1px] w-full has-[+h3]:mt-6 has-[+h4]:mt-6 has-[+h1]:mt-8 has-[+h2]:mt-8' : 'h-full w-[1px]', className )} </file context>

Suggested change

orientation === 'horizontal' ? 'h-[1px] w-full has-[+h3]:mt-6 has-[+h4]:mt-6 has-[+h1]:mt-8 has-[+h2]:mt-8' : 'h-full w-[1px]',

orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',

cubic-dev-ai · 2026-05-20T19:50:08Z

+
+    const messageTrans = useMemo<string>(() => {
+      return transformOutput(outputContent);
+    }, [message])


P2: useMemo dependency array is missing transformOutput, which can cause stale transformed output when privacy shield settings change.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/chat/Messages/Message/Content/index.tsx, line 44: <comment>useMemo dependency array is missing `transformOutput`, which can cause stale transformed output when privacy shield settings change.</comment> <file context> @@ -8,28 +9,48 @@ import Markdown from '@/components/Markdown'; + + const messageTrans = useMemo<string>(() => { + return transformOutput(outputContent); + }, [message]) + const { </file context>

Suggested change

}, [message])

}, [message, transformOutput])

cubic-dev-ai · 2026-05-20T19:50:08Z

+      searchParams.get('access_token') ||
+      localStorage.getItem('chainlit_token_iframe');
+    apiClient
+      .jwtAuth(token)


P2: Authentication request is executed unconditionally, including when token is null. This causes unnecessary failed API calls on every app mount.

Prompt for AI agents

Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/App.tsx, line 52: <comment>Authentication request is executed unconditionally, including when token is null. This causes unnecessary failed API calls on every app mount.</comment> <file context> @@ -37,6 +43,17 @@ function App() { + searchParams.get('access_token') || + localStorage.getItem('chainlit_token_iframe'); + apiClient + .jwtAuth(token) + .then((res) => setUserFromAPI()) + .catch((err) => console.log(err)); </file context>

…tial transcript handling

…project management

…tates in multiple languages

…ument is selected context

udayarpanday and others added 30 commits February 28, 2025 21:41

final commit after chainlit migration

80101e0

dashboard load time issue fix

fc285b4

Merge pull request #1 from udayarpanday/feat/chainlit-upgrade

fa72871

Feat/chainlit upgrade

updated translations,custom chat design fix, popover mobile fix, toke…

630de53

…n on request

loading, translation files, chat debug issue fix

30d83f4

Merge pull request #2 from udayarpanday/feat/chainlit-upgrade

34285b3

Feat/chainlit upgrade

WIP

f1fc85f

fixed iframe chat height

21c77ba

Merge pull request #3 from udayarpanday/bugfix/chat-popup-height

eb1516e

Bugfix/chat popup height

update initial command list

c0974c1

design updates

e18420f

design updates for prompts

b13fdf2

voice chat implementation

f916e5c

removed voice button from webiste chat

c7ddf99

updated socket data

9782c86

updated responsive design for chat prompts

76e6136

added new button to stop the speech feature

7132835

evoya creator implementation

dcc1ab9

updated commands design after feedback

0b21278

updated button icon and translations

0e220a2

updated design, input foucs on search, fixed height

8b979d7

update focus event on button trigger and responsive

a0c5cb8

Merge pull request #5 from udayarpanday/feature/multi-modalitiy

bb17253

Feature/multi modalitiy

voice chat implementation

daa00c9

removed voice button from webiste chat

815994d

updated socket data

084722b

added new button to stop the speech feature

02e4660

updated button icon and translations

9cf22de

removed unwanted files

ea770d8

creator btn in header, translations, small fixes

7ef62b8

udayarpanday requested a review from sandangel as a code owner May 20, 2026 19:46

dosubot Bot added size:XXL This PR changes 1000+ lines, ignoring generated files. enhancement New feature or request frontend Pertains to the frontend. labels May 20, 2026

cubic-dev-ai Bot reviewed May 20, 2026

View reviewed changes

udayarpanday force-pushed the feat/chat-full-screen branch from 15e827d to 036c5f6 Compare May 21, 2026 11:50

dowittwer and others added 14 commits May 21, 2026 13:53

creator fixes, creator save new file, translations, style fix

a9726af

build fix

13dd440

design fixes for agentlist in header

0dde9e4

update translation for share session

795fd69

improve session handling and share link management

4cc3037

lint fixes

e17fab6

package changes

3ffd18f

ts error on build fix

42bb4b4

added session share restriction as per the org

277624e

context model update

742dce7

feat: enhance Input component with content management methods and ini…

fa8452f

…tial transcript handling

fix: remove setting selected agent ID on default agent request

c96ea59

feat: enhance task loading management with new utility functions

1f74743

feat: integrate Projects component into MessageComposer for enhanced …

e7d3e5c

…project management

udayarpanday force-pushed the feat/chat-full-screen branch from 036c5f6 to e7d3e5c Compare May 21, 2026 13:03

udayarpanday and others added 8 commits May 21, 2026 10:43

feat: add internationalization support for project titles and empty s…

87739e9

…tates in multiple languages

fix auto approve

064570d

cleanup

4300c1a

document selection fix

0b219a6

Merge branch 'feat/chat-full-screen' into feature/evoya-file-picker

07db5e4

icon change, hide chat header actions in creator, if editor empty doc…

7244736

…ument is selected context

fix: simplify condition for rendering Projects component

d0afdc5

fix: replace FolderKanban with FolderOpen icon in Projects component

27a15a7

udayarpanday force-pushed the feat/chat-full-screen branch from 2891930 to 27a15a7 Compare May 26, 2026 14:35

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat/chat full screen#2929

Feat/chat full screen#2929
udayarpanday wants to merge 145 commits into
Chainlit:mainfrom
udayarpanday:feat/chat-full-screen

udayarpanday commented May 20, 2026 •

edited by cubic-dev-ai Bot

Loading

Uh oh!

cubic-dev-ai Bot left a comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

cubic-dev-ai Bot May 20, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		@@ -20,7 +20,7 @@ const DialogOverlay = React.forwardRef<
		<DialogPrimitive.Overlay

-    if (isStep && message.name === 'Reinforcement') return null;
+    if (isStep && message.name === 'Reinforcement') {
+      if (!message.steps) return null;
+      return (
+        <Messages
+          messages={message.steps}
+          elements={elements}
+          actions={actions}
+          indent={indent}
+          isRunning={isRunning}
+          scorableRun={scorableRun}
+        />
+      );
+    }

	orientation === 'horizontal' ? 'h-[1px] w-full has-[+h3]:mt-6 has-[+h4]:mt-6 has-[+h1]:mt-8 has-[+h2]:mt-8' : 'h-full w-[1px]',
	orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',

Conversation

udayarpanday commented May 20, 2026 • edited by cubic-dev-ai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by cubic

Uh oh!

cubic-dev-ai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

cubic-dev-ai Bot May 20, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

udayarpanday commented May 20, 2026 •

edited by cubic-dev-ai Bot

Loading