separate landing page for demo by lyubov-voloshko · Pull Request #1693 · rocket-admin/rocketadmin

lyubov-voloshko · 2026-03-30T13:48:38Z

Summary by CodeRabbit

Release Notes

New Features
- Added a dedicated demo login route with a streamlined loading experience. When accessing demo mode, users now see a dedicated loading screen while their demo account is being initialized.
Refactor
- Extracted demo account login functionality to a separate component for improved code organization.
- Simplified the main login page by removing demo-mode-specific UI elements, providing a cleaner login form for all users.

coderabbitai · 2026-03-30T13:49:04Z

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 1f51a168-8d3e-4f53-9c55-9010813b31d0

📥 Commits

Reviewing files that changed from the base of the PR and between f4cfd96 and f94a88f.

📒 Files selected for processing (8)

frontend/src/app/app-routing.module.ts
frontend/src/app/app.component.ts
frontend/src/app/components/demo-login/demo-login.component.css
frontend/src/app/components/demo-login/demo-login.component.html
frontend/src/app/components/demo-login/demo-login.component.ts
frontend/src/app/components/login/login.component.css
frontend/src/app/components/login/login.component.html
frontend/src/app/components/login/login.component.ts

📝 Walkthrough

Walkthrough

This change extracts demo-account login functionality from the main AppComponent and LoginComponent into a dedicated DemoLoginComponent accessed via a new /demo route. The demo login flow—including analytics event tracking—is removed from the primary app and login components, consolidating it into a standalone component with its own template and styling.

Changes

Cohort / File(s)	Summary
Routing & App Component Refactoring `frontend/src/app/app-routing.module.ts`, `frontend/src/app/app.component.ts`	Added new lazy-loaded `/demo` route pointing to `DemoLoginComponent`. Removed `Angulartics2` import and injected dependency from `AppComponent`. Deleted `ngOnInit` navigation handler logic that triggered demo login and analytics event tracking when `mode=demo` query parameter was detected.
New Demo Login Component `frontend/src/app/components/demo-login/demo-login.component.ts`, `frontend/src/app/components/demo-login/demo-login.component.html`, `frontend/src/app/components/demo-login/demo-login.component.css`	Added new standalone component that displays a Material spinner with loading text during demo account initialization. On component init, calls `AuthService.loginToDemoAccount()`, then emits analytics events to `Angulartics2` and `PostHog` after successful login completion.
Login Component Cleanup `frontend/src/app/components/login/login.component.ts`, `frontend/src/app/components/login/login.component.html`, `frontend/src/app/components/login/login.component.css`	Removed `isDemoMode` property, `ActivatedRoute` injection, and conditional demo-loader rendering. Deleted demo-specific CSS rules. Updated Google One Tap initialization condition to remove `isDemoMode` guard, allowing it to run for all SaaS routes.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

Poem

🐰 A demo route hops into view,
No more query tricks to pursue,
Login springs forward, clean and bright,
Demo logic tucked away just right,
Refactored flow: simpler in sight! 🚀

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch demo-mode-component

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Copilot

Pull request overview

This PR introduces a dedicated /demo landing route that automatically logs a user into a demo account, and removes the previous “demo mode” behavior embedded in the login flow.

Changes:

Remove mode=demo handling and demo-loader UI from the existing login component.
Add a new DemoLoginComponent that shows a loader and triggers loginToDemoAccount().
Register a new /demo route that lazy-loads the new component.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
frontend/src/app/components/login/login.component.ts	Removes demo-mode query param handling and related imports/logic.
frontend/src/app/components/login/login.component.html	Removes conditional demo loader markup.
frontend/src/app/components/login/login.component.css	Removes demo-loader styles (moved to dedicated demo page).
frontend/src/app/components/demo-login/demo-login.component.ts	New component that triggers demo login and emits analytics events.
frontend/src/app/components/demo-login/demo-login.component.html	New demo landing UI showing a spinner + loading message.
frontend/src/app/components/demo-login/demo-login.component.css	Styles for the demo landing loader layout.
frontend/src/app/app.component.ts	Removes app-wide “mode=demo” query param auto-login behavior.
frontend/src/app/app-routing.module.ts	Adds `/demo` route to load the new demo landing component.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-03-30T13:56:03Z

frontend/src/app/app-routing.module.ts

 	},
+	{
+		path: 'demo',
+		loadComponent: () => import('./components/demo-login/demo-login.component').then((m) => m.DemoLoginComponent),


The /demo route is not protected by configurationGuard like /login. In self-hosted mode this means an unconfigured instance can still hit the demo endpoint and surface confusing errors instead of redirecting to /setup. Consider adding canActivate: [configurationGuard] (or a dedicated guard that disables demo outside SaaS/self-hosted-configured environments).

Suggested change

loadComponent: () => import('./components/demo-login/demo-login.component').then((m) => m.DemoLoginComponent),

loadComponent: () => import('./components/demo-login/demo-login.component').then((m) => m.DemoLoginComponent),

canActivate: [configurationGuard],

Copilot · 2026-03-30T13:56:03Z

frontend/src/app/components/demo-login/demo-login.component.ts

+	ngOnInit(): void {
+		this._auth.loginToDemoAccount().subscribe(() => {
+			this.angulartics2.eventTrack.next({
+				action: 'Demo account is logged in',
+			});
+			posthog.capture('Demo account is logged in');
+		});


loginToDemoAccount() emits EMPTY on error (it handles the alert internally), so this subscription will silently complete without navigating away; the page will keep showing the loading spinner indefinitely. Add an explicit error/complete handler (or finalize) to transition the UI (e.g., show a retry/back-to-login action) when the demo login fails.

Copilot · 2026-03-30T13:56:04Z

frontend/src/app/components/demo-login/demo-login.component.ts

+	ngOnInit(): void {
+		this._auth.loginToDemoAccount().subscribe(() => {
+			this.angulartics2.eventTrack.next({


A new routable component was added without any unit test. The repo has component specs for similar route-level components (e.g., page-loader.component.spec.ts), so consider adding demo-login.component.spec.ts to cover the init flow (demo login request fired + success tracking emitted).

separate landing page for demo

ca858f9

Copilot AI review requested due to automatic review settings March 30, 2026 13:48

Merge branch 'main' into demo-mode-component

f94a88f

lyubov-voloshko enabled auto-merge March 30, 2026 13:48

Copilot started reviewing on behalf of lyubov-voloshko March 30, 2026 13:49 View session

lyubov-voloshko merged commit f314fa8 into main Mar 30, 2026
13 of 15 checks passed

lyubov-voloshko deleted the demo-mode-component branch March 30, 2026 13:51

Copilot AI reviewed Mar 30, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

separate landing page for demo#1693

separate landing page for demo#1693
lyubov-voloshko merged 2 commits intomainfrom
demo-mode-component

lyubov-voloshko commented Mar 30, 2026 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Mar 30, 2026 •

edited

Loading

Review failed

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Mar 30, 2026

Uh oh!

Copilot AI Mar 30, 2026

Uh oh!

Copilot AI Mar 30, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

	loadComponent: () => import('./components/demo-login/demo-login.component').then((m) => m.DemoLoginComponent),
	loadComponent: () => import('./components/demo-login/demo-login.component').then((m) => m.DemoLoginComponent),
	canActivate: [configurationGuard],

Uh oh!

Conversation

lyubov-voloshko commented Mar 30, 2026 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Release Notes

Uh oh!

coderabbitai bot commented Mar 30, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review failed

Walkthrough

Changes

Estimated code review effort

Poem

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Mar 30, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 30, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 30, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

lyubov-voloshko commented Mar 30, 2026 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Mar 30, 2026 •

edited

Loading