### What problem does this PR solve?
Issue Number: N/A (draft for early design review)
Related PR: N/A
Problem Summary:
The earlier revisions of this draft added the React application under
`ui-next/` next to the legacy AngularJS `ui/`, so the new UI was never
produced
by a normal build. Reviewers and users had to pass `CUSTOM_UI_DIST` by
hand,
and the packaged default was still the legacy application.
This revision finishes that transition instead of maintaining two
applications:
the React application takes over the `ui/` directory, the AngularJS
application is removed, and `./build.sh --fe` produces the new UI with
no flag
and no change to `build.sh`.
### What changed in the latest revision
- `ui/` now holds the React application; the AngularJS sources are
deleted and
the `ui-next/` directory name is gone. `build_ui()` already builds
`${DORIS_HOME}/ui` and packs `${DORIS_HOME}/ui/dist` into the FE
resources, so no build script change is required. `CUSTOM_UI_DIST` still
works for callers that package a prebuilt directory.
- `@testing-library/dom` is now an explicit dev dependency. React
Testing
Library only lists it as a peer dependency and re-exports `screen`,
`fireEvent`, `waitFor` and `within` from it, while `build_ui()` installs
with
`--legacy-peer-deps`, which does not install peer dependencies. Without
the
explicit entry the production build fails to type-check every test file.
- `enable_web_ui` now defaults to `true`. It gated the UI routes and the
SPA
forward while the new UI was optional; leaving it `false` would ship a
build
whose packaged UI answers 404 on every page.
- Also in this revision: the Playground toolbar and
object-tree refinements, and restoring the resolved identity in the
cookie
authentication path so `checkAdminAuth` no longer sees a null user. The
branch is rebased on master.
### Implemented scope
- English-only login and logout. A Doris user must have global `ADMIN`
privilege to use UI Next.
- Home version information and complete frontend/backend node status
tables.
- SQL Playground with formatting, a database/table/column object tree,
and
FE-managed JDBC sessions that preserve SQL session state across
statements.
Restored browser session IDs are verified with the owning FE before the
UI
reports the connection as ready.
- System proc navigation backed by the existing `/rest/v1/system` API.
- Active Sessions backed by the existing `/rest/v1/session` API.
- Log configuration, content, and verbose logger management backed by
the
existing `/rest/v1/log` API.
- Query Profile list and raw Text details backed by the existing
current-FE
`/rest/v1/query_profile*` APIs. Only `Task Type: QUERY` entries are
shown.
- Visual Profile for structurally compatible `MergedProfile` text.
Parsing is
performed in a bounded browser Worker, ELK produces the compound
Fragment
layout, and React Flow renders the read-only DAG. Missing
`MergedProfile`
data is reported as unavailable; incompatible data reports the parse
reason
instead of relying on a hard Doris-version gate.
- FE and BE Configuration tables backed by the existing manager
configuration
APIs. Mutable rows expose an ADMIN-only editor; immutable rows remain
read-only, including against direct mutation requests.
### FE backend scope
The FE addition remains limited to behavior that cannot live safely in
the
browser:
- Login and logout reuse `/rest/v1/login` and `/rest/v1/logout`. A thin
`/rest/v1/ui/me` endpoint bootstraps the authenticated ADMIN user and
CSRF
token.
- Home, System, Sessions, Log, Query Profiles, and Configuration reuse
existing
Doris HTTP controllers rather than adding parallel read controllers.
- Web SQL retains FE-local session ownership, one persistent JDBC
connection
per active session, execution/cancellation, bounded results, idle
cleanup,
and logout cleanup. It is exposed as the UI-independent
`/rest/v1/sql-sessions` API under `org.apache.doris.httpv2.websql`.
- Web SQL accepts HTTP Basic authentication or the existing Doris login
cookie;
both require global `ADMIN`. Cookie mutations additionally require CSRF.
- The existing Configuration manager endpoints now accept the
authenticated UI
cookie, preserve ADMIN authorization, use cluster-internal
authentication for
FE/BE fan-out, encode configuration values safely, and reject immutable
FE
changes server-side.
- `enable_web_ui=true` is an immutable FE-local master switch for UI
routes,
assets, login/bootstrap, and stateful SQL endpoints. Setting it to
`false`
returns 404 for those resources without stopping port 8030 or shared FE
HTTP
APIs.
- `enable_web_sql_session`, `web_sql_session_idle_timeout_seconds`,
`web_sql_max_sessions`, and `web_sql_max_result_bytes` are mutable.
Running
Web SQL operations read their current values without an FE restart.
Numeric
session limits reject non-positive values; the result-byte limit accepts
1 through 100 MiB.
- `StatementSubmitter` and the legacy Login controller remain unchanged
from
this PR's master baseline. The legacy Log mutation adds only a cookie
CSRF
check; its existing log behavior and response remain unchanged.
The Visual Profile parser and graph are adapted from
`apache/doris-website`
PR #4043 at commit `133f948c235995a917b2e1f6d4e9d764b6d62726` under the
Apache License 2.0. The website uploader, AI analysis, hCaptcha,
polling,
storage, recovery, and Docusaurus wrapper are not included.
### FE endpoints used by the UI
Enumerated from `ui/src/api/**`, split by whether the endpoint is added
here or
reused from existing Doris controllers.
Added by this PR:
| Endpoint | Method | Purpose |
| --- | --- | --- |
| `/rest/v1/ui/me` | GET | Bootstrap after login: current ADMIN user and
CSRF token (`UiSessionController`) |
| `/rest/v1/sql-sessions` | POST | Create a Web SQL session
(`WebSqlSessionController`) |
| `/rest/v1/sql-sessions/{id}` | GET, DELETE | Inspect and close a
session |
| `/rest/v1/sql-sessions/{id}/statements` | POST | Execute exactly one
statement |
| `/rest/v1/sql-sessions/{id}/cancel` | POST | Cancel the running
statement |
| `/rest/v1/sql-sessions/{id}/reset` | POST | Reset the connection state
|
| `/rest/v1/hardware_info/fe/version` | GET | Version-only route on the
existing `HardwareInfoController`, so Home does not trigger OSHI
hardware collection |
Reused, no new controller:
| Endpoint | Method | Page | Controller |
| --- | --- | --- | --- |
| `/rest/v1/login` | POST | Login | `WebConfigurer` |
| `/rest/v1/logout` | POST | Sign out | `WebConfigurer` |
| `/rest/v1/system?path=/frontends` | GET | Cluster Overview, Frontends
| `SystemController` |
| `/rest/v1/system?path=/backends` | GET | Cluster Overview, Backends |
`SystemController` |
| `/rest/v1/system?path=...` | GET | Proc System navigation |
`SystemController` |
| `/rest/v1/session` | GET | Sessions | `SessionController` |
| `/rest/v1/log` | GET | Log configuration and contents |
`LogController` |
| `/rest/v1/log` | POST | Add or delete a verbose logger, sent as the
legacy `add_verbose` / `del_verbose` form parameters | `LogController` |
| `/rest/v1/query_profile` | GET | Query Profile list |
`QueryProfileAction` |
| `/rest/v1/query_profile/text/{queryId}` | GET | Raw profile text,
shared by the Text and Visual tabs | `QueryProfileAction` |
| `/rest/v2/manager/node/configuration_info?type={fe\|be}` | POST |
Configuration read | `NodeAction` |
| `/rest/v2/manager/node/set_config/{fe\|be}` | POST | Configuration
update, ADMIN only | `NodeAction` |
`/rest/v1/ui/**` and `/rest/v1/sql-sessions**` go through `uiRequest`,
which
requires the login cookie and sends the CSRF header on mutations.
Everything
else goes through `legacyRequest` and retains each legacy controller's
existing
authorization behavior. The PR-added `/rest/v1/ui/**` and Web SQL
endpoints
require global `ADMIN`; reused legacy endpoints are not all globally
ADMIN-only. Web SQL additionally accepts HTTP Basic.
### Behavior and impact
- The FE web port now serves the React application. The AngularJS
application
is no longer part of the repository, so a legacy build is no longer a
rollback option; reverting this change is.
- Node.js 22.12 or newer and npm are required to build FE. The
repository's
x86, gcc10 and ARM compilation images are updated to provide Node.js
22.12.0. Neither Node.js nor npm is required at runtime.
- Web SQL sessions remain behind `enable_web_sql_session`.
### Validation
- `./build.sh --fe` with no flags builds the React application and packs
it:
the resulting `doris-fe.jar` `static/` payload matches `ui/dist` file
for
file.
- `npm run lint`, `npm run typecheck`, `npm run test` and `npm run
build` in
`ui/`.
- The branch is rebased on master and merges cleanly.
### Release note
The Doris FE Web UI is replaced with a new React application. Repository
compilation images now provide Node.js 22.12.0; the ARM image uses
AlmaLinux 8
because the official Node.js 22 ARM64 binary requires a newer glibc than
CentOS 7 provides.
### Check List (For Author)
- Test
- [ ] Regression test
- [x] Unit Test
- [x] Manual test (development and packaging steps are documented in
`ui/README.md`)
- [ ] No need to test or manual test. Explain why:
- Behavior changed:
- [ ] No.
- [x] Yes. The FE web port serves the new UI, and the AngularJS UI is
removed.
- Does this need documentation?
- [x] No. Development and packaging instructions are included in
`ui/README.md`.
- [ ] Yes.
### Follow-up
- Add CI coverage for the UI directory. No workflow currently runs its
lint,
typecheck, test or build, so frontend regressions cannot fail a build.
- Split the production bundle further; Vite currently reports large ELK
and
application chunks.
---------
Co-authored-by: Ragnaroos <Ragnaroos@users.noreply.github.com>
Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
Co-authored-by: morningman <yunyou@selectdb.com>
Apache Doris Web UI
ui/ is the Doris FE Web UI. It replaces the previous AngularJS application,
which this directory no longer contains. ./build.sh --fe builds it and packs
the result into doris-fe.jar, so the standard FE build produces this UI with
no extra flags.
Prerequisites
- Node.js 22.12 or newer
- npm 10 or newer
- A local Doris FE HTTP endpoint; the development default is
http://127.0.0.1:8030
Development
npm install
npm run dev
The Vite server listens on port 5173. Relative /rest and /api requests are proxied to the local FE. Override the target only when needed:
DORIS_FE_HTTP_TARGET=http://127.0.0.1:8030 npm run dev
The development port can also be overridden without changing repository files:
npm run dev -- --port 8090
FE integration
./build.sh --fe runs npm install and npm run build in this directory and
copies ui/dist into the FE resources, so no extra step is required:
./build.sh --fe
To package a prebuilt directory instead of rebuilding here, use the existing
CUSTOM_UI_DIST escape hatch:
CUSTOM_UI_DIST="$PWD/ui/dist" ./build.sh --fe
The resulting FE serves the selected static assets from its configured
http_port, which is 8030 by default. Vite, port 5173, and port 8090 are only
development conveniences and are not required in a production deployment.
The Playground's persistent JDBC-backed SQL sessions are enabled by default. They can be disabled explicitly in FE configuration when the HTTP capability is not wanted:
enable_web_sql_session = false
Quality gates
npm run lint
npm run typecheck
npm run test
npm run build
npm run test:e2e
Playwright requires its Chromium runtime. The browser path may be isolated with PLAYWRIGHT_BROWSERS_PATH.
Implemented scope
- English-only login and logout for Doris users with global
ADMINprivilege. UI Next reuses the legacy/rest/v1/loginand/rest/v1/logoutendpoints and uses a thin/rest/v1/ui/mebootstrap endpoint for the authenticated user and CSRF token. - Home version information and complete frontend/backend node tables. The page
reuses the existing hardware-version and
/rest/v1/systemAPIs. - Playground SQL editing and formatting, a database/table/column object tree,
and FE-managed JDBC sessions that preserve SQL session state across
statements. The Web SQL API is exposed at
/rest/v1/sql-sessions; it accepts either HTTP Basic authentication or the existing Doris login cookie. Both modes require globalADMINprivilege, and cookie-authenticated mutations additionally require the CSRF token returned by/rest/v1/ui/me. - System proc navigation and active Sessions views, both backed by existing Doris HTTP APIs.
- Log configuration, content, and verbose logger management, reusing the
existing
/rest/v1/logAPI. - Query Profile list and raw Text details, reusing the legacy current-FE
/rest/v1/query_profile*APIs. The list includes only entries whose DorisTask TypeisQUERY. Text details support search navigation, exact copy, and download without transforming the Profile. - Visual Profile for structurally compatible
MergedProfiletext. The browser parses the same raw text in a bounded module Worker, lays out Fragment compound graphs with ELK, and renders a read-only React Flow canvas with slow-operator focus, search, Fragment visibility, Fit/Reset, MiniMap, and operator details. - FE and BE Configuration tables backed by the existing configuration APIs.
The page is read-only: it never writes configuration, so no configuration
mutation endpoint accepts the UI session cookie. Changing a setting goes
through
ADMIN SET FRONTEND CONFIGor the backend configuration API, which authenticate the operator directly. The FE table shows the configuration of the FE serving the page; open another FE web port to read that node's settings. Long values are truncated in the table and remain available on hover. - UI entry and the PR-added bootstrap/Web SQL endpoints require global
ADMIN. Reused legacy/rest/v1endpoints retain their existing controller authorization behavior; this UI replacement does not make every legacy HTTP endpoint globally ADMIN-only. - React, TypeScript, Vite, React Router, Ant Design, TanStack Query, CodeMirror, React Flow, ELK, Vitest, Testing Library, and Playwright infrastructure.
The Visual Profile parser and graph implementation are adapted from
apache/doris-website PR #4043 at commit
133f948c235995a917b2e1f6d4e9d764b6d62726 (Apache License 2.0). It does not
include the website uploader, AI analysis, hCaptcha, polling, recovery,
storage, or Docusaurus wrapper. Compatibility is detected from the
MergedProfile -> Fragment -> Pipeline -> Operator structure rather than the
Doris release string. A missing MergedProfile is unavailable; a present but
incompatible structure is reported as a parse failure with its reason.
Backend scope
The FE addition is intentionally concentrated on the persistent Web SQL
session lifecycle: session ownership, one JDBC connection per active session,
statement execution and cancellation, idle cleanup, and bounded results.
The endpoint lives under httpv2.websql because it is usable by any HTTP
client and is not coupled to UI Next.
Existing Doris HTTP controllers remain the preferred backend for the other UI
pages.
enable_web_ui=true controls the browser UI and its dedicated login/bootstrap
and stateful SQL endpoints without disabling the FE HTTP server or shared HTTP
APIs. enable_web_sql_session, web_sql_session_idle_timeout_seconds,
web_sql_max_sessions, and web_sql_max_result_bytes are mutable and are read
by running Web SQL operations without an FE restart.