This fix addresses the issue where math formulas become corrupted or incorrectly displayed after editing the generated report in the editor. **Root Cause:** The issue occurred due to incompatibility between markdown processing in the display component and the Tiptap editor: 1. Display component used \[\] and \(\) LaTeX delimiters 2. Tiptap Mathematics extension expects $ and 70868 delimiters 3. tiptap-markdown didn't have built-in math node serialization 4. Math syntax was lost/corrupted during editor save operations **Solution Implemented:** 1. Created MathematicsWithMarkdown extension that adds markdown serialization support to Tiptap's Mathematics nodes 2. Added math delimiter normalization functions: - normalizeMathForEditor(): Converts LaTeX delimiters to $/70868 - normalizeMathForDisplay(): Standardizes all delimiters to 70868 3. Updated Markdown component to use new normalization 4. Updated ReportEditor to normalize content before loading **Changes:** - web/src/components/editor/math-serializer.ts (new) - web/src/components/editor/extensions.tsx - web/src/components/editor/index.tsx - web/src/components/deer-flow/markdown.tsx - web/src/core/utils/markdown.ts - web/tests/markdown-math-editor.test.ts (new) - web/tests/markdown-katex.test.ts **Testing:** - Added 15 comprehensive tests for math normalization round-trip - All tests passing (math editor + existing katex tests) - Verified TypeScript compilation and linting Co-authored-by: factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>
🦌 DeerFlow Web UI
Originated from Open Source, give back to Open Source.
This is the web UI for DeerFlow.
Quick Start
Prerequisites
DeerFlow- Node.js (v22.14.0+)
- pnpm (v10.6.2+) as package manager
Configuration
Create a .env file in the project root and configure the following environment variables:
NEXT_PUBLIC_API_URL: The URL of the deer-flow API.
It's always a good idea to start with the given example file, and edit the .env file with your own values:
cp .env.example .env
How to Install
DeerFlow Web UI uses pnpm as its package manager.
To install the dependencies, run:
cd web
pnpm install
How to Run in Development Mode
Note
Ensure the Python API service is running before starting the web UI.
Start the web UI development server:
cd web
pnpm dev
By default, the web UI will be available at http://localhost:3000.
You can set the NEXT_PUBLIC_API_URL environment variable if you're using a different host or location.
# .env
NEXT_PUBLIC_API_URL=http://localhost:8000/api
Docker
You can also run this project with Docker.
First, you need read the configuration below. Make sure .env file is ready.
Second, to build a Docker image of your own web server:
docker build --build-arg NEXT_PUBLIC_API_URL=YOUR_DEER-FLOW_API -t deer-flow-web .
Final, start up a docker container running the web server:
# Replace deer-flow-web-app with your preferred container name
docker run -d -t -p 3000:3000 --env-file .env --name deer-flow-web-app deer-flow-web
# stop the server
docker stop deer-flow-web-app
Docker Compose
You can also setup this project with the docker compose:
# building docker image
docker compose build
# start the server
docker compose up
License
This project is open source and available under the MIT License.
Acknowledgments
We extend our heartfelt gratitude to the open source community for their invaluable contributions. DeerFlow is built upon the foundation of these outstanding projects:
In particular, we want to express our deep appreciation for:
- Next.js for their exceptional framework
- Shadcn for their minimalistic components that powers our UI
- Zustand for their stunning state management
- Framer Motion for their amazing animation library
- React Markdown for their exceptional markdown rendering and customizability
- Last but not least, special thanks to SToneX for his great contribution for token-by-token visual effect
These outstanding projects form the backbone of DeerFlow and exemplify the transformative power of open source collaboration.