Charts component crashes with TypeError during streaming: null data passed to Recharts
メンテナーはふだん 1 日以内に返信
@ankit-thesys がすでに取り組んでいます。
2026年6月15日 から。
評価
この issue はまだ評価されていません。
説明
Bug Description
The built-in Charts component in @openuidev/react-ui throws a TypeError: Cannot read properties of null (reading 'map') during streaming rendering. The error originates from Recharts' CategoricalChartWrapper.render() when the OpenUI Renderer passes partial/incomplete data to the chart component before the full dataset has streamed in.
Steps to Reproduce
- Scaffold a new project:
npx @openuidev/cli@latest create --name test-app - Configure an LLM provider (OpenRouter with Claude Sonnet 4 in my case)
- Send a prompt that generates a chart, e.g.: "Show me a CEO dashboard with quarterly revenue data for 4 regions"
- Observe the console error during streaming
Error Stack Trace
TypeError: Cannot read properties of null (reading 'map')
at CategoricalChartWrapper.render (recharts/es6/chart/...)
at renderByOrder (recharts/es6/util/...)
at RenderNode (@openuidev/...)
at renderDeep (@openuidev/...)
at Charts component (@openuidev/react-ui/dist/genui-lib/...)
at GenUIAssistantMessage (...)
Expected Behavior
The Charts component should guard against null/undefined data during progressive streaming. A simple data ?? [] fallback before passing to Recharts would prevent this.
Actual Behavior
The chart eventually renders correctly after streaming completes, but the console error fires during the streaming phase when the chart structure arrives before its data array.
Environment
@openuidev/react-ui: latest (installed 2026-03-18)@openuidev/react-lang: latest@openuidev/react-headless: latest- Next.js 16.1.6 (Turbopack)
- React 19.2.3
- LLM: Claude Sonnet 4 via OpenRouter
- OS: Windows 11
Suggested Fix
In the Charts genui-lib component, add a null guard before passing data to Recharts:
// Before passing to <BarChart data={data}>
const safeData = data ?? [];
Additional Note
The FullScreen component also defaults logoUrl to https://crayonai.org/img/logo.png which appears to be a dead URL from the Crayon AI rebrand, causing broken image icons in the header and assistant avatar. Consider updating the default or removing it.
- 主要言語
- TypeScript
- スター
- 10k
- フォーク
- 698
- 平均マージ
- 1日 2時間
- マージ済み PR（30日）
- 138
環境構築
このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
thesysdev/openui のほかの issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 62/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
thesysdev/openui#1445 · コメント 2 件 ·
メンテナーはふだん 1 日以内に返信
-
Add dataInvention flag to PromptOptions to disable the 'generate realistic/plausible data' ruleオープン
難易度 2/5 1〜3時間 初心者へのやさしさ 76/100
thesysdev/openui#959 · コメント 2 件 ·
メンテナーはふだん 1 日以内に返信
-
難易度 5/5 1週間以上 初心者へのやさしさ 18/100
メンテナーはふだん 1 日以内に返信
thesysdev/openui の issue をすべて見る
似ている issue
-
bug module:nodes tests
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
rocketride-org/rocketride-server#3020 ·
メンテナーはふだん 2 日以内に返信
-
area: dashboard area: tests good first issue size: XS tests
難易度 1/5 1〜3時間 初心者へのやさしさ 88/100
メンテナーはふだん 1 日以内に返信
-
Read canvas commentsオープンenhancement needs-community-review
難易度 2/5 1〜3時間 初心者へのやさしさ 67/100
shaharia-lab/slackcli#501 · コメント 3 件 ·
メンテナーはふだん 1 日以内に返信
-
[Bug] Pod detail shows CPU usage ten times too high, and throws on decimal memory suffixes対応中かも @RaphaelFakhri が今日担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 84/100
メンテナーはふだん 11 日以内に返信
-
`package.json`: build tools listed as runtime dependencies, exact pins causing duplicate installsオープン
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
themesberg/flowbite-vue#471 ·