feat(angular): reshape PaperlessUI.Angular to TourPlanner-Angular layout by ANcpLua · Pull Request #3 · ANcpLua/Paperless

ANcpLua · 2026-05-12T10:21:30Z

Summary

Replaces the empty Angular 21 scaffold with the layered core / layout / features structure used in TourPlanner-Angular. Every component uses ChangeDetectionStrategy.OnPush and standalone imports.
Adds core/api/api-client.service.ts (HTTP wrapper bound to API_BASE_URL token), core/config/api-base-url.token.ts, and a placeholder core/api/generated/ folder for the openapi-typescript output.
Adds layout/shell + layout/navbar with router-outlet wiring. Adds features/documents/pages/documents-page.component.* as the first lazy-loaded feature stub.
package.json gains generate:openapi / generate:types / generate scripts so PaperlessREST's OpenAPI doc can flow into src/app/core/api/generated/api-types.ts once the backend side lands.
proxy.conf.json routes /api to the PaperlessREST dev port (http://localhost:5057).
pnpm stays as the package manager to keep the current CI job intact; no new dependencies introduced.

Test plan

pnpm install && pnpm run build succeeds locally; emits a lazy documents-page-component chunk (683 B)
CI Build (PaperlessUI.Angular) job green
CI Build & Test (backend) unaffected (no backend changes)

Follow-ups

Wire actual /documents service + viewmodel against the generated API
Repeat for /upload and /search features (currently stubbed in the navbar but fall through ** to /documents)
Tailwind + Leaflet adoption for TourPlanner-Angular parity
React equivalent (PaperlessUI.React → qyl.dashboard layout)

Replaces the empty Angular 21 scaffold with the layered structure used in TourPlanner-Angular: src/app/ app.component.{ts,html,css,spec.ts} # root with shell app.config.ts # HttpClient + Router + API_BASE_URL app.routes.ts # lazy /documents route core/ api/api-client.service.ts # base HTTP wrapper, baseUrl from token api/generated/ # openapi-typescript output target config/api-base-url.token.ts # InjectionToken<string> layout/ shell/app-shell.component.{ts,html,css} # navbar + <router-outlet> navbar/app-navbar.component.{ts,html,css} # documents / upload / search features/ documents/pages/documents-page.component.{ts,html,css} # stub proxy.conf.json # /api -> http://localhost:5057 Every component uses ChangeDetectionStrategy.OnPush and standalone imports (no NgModules) — same conventions as TourPlanner-Angular. package.json gains generate:openapi / generate:types / generate scripts so PaperlessREST's OpenAPI doc can be flowed into src/app/core/api/generated/ once the backend side lands. pnpm stays as the package manager to keep the existing CI job intact. Build verified: ng build emits the lazy `documents-page-component` chunk (683 B) confirming the lazy-loading pattern wires through. No new deps introduced. Follow-ups: - Wire the actual /documents service + viewmodel against the generated API - Repeat for /upload and /search features - Tailwind + Leaflet adoption (TourPlanner-Angular parity) - React equivalent (PaperlessUI.React -> qyl.dashboard layout) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

coderabbitai · 2026-05-12T10:21:36Z

Important

Review skipped

Review was skipped due to path filters

⛔ Files ignored due to path filters (26)

PaperlessUI.Angular/package.json is excluded by none and included by none
PaperlessUI.Angular/proxy.conf.json is excluded by none and included by none
PaperlessUI.Angular/src/app/app.component.css is excluded by none and included by none
PaperlessUI.Angular/src/app/app.component.html is excluded by none and included by none
PaperlessUI.Angular/src/app/app.component.spec.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/app.component.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/app.config.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/app.css is excluded by none and included by none
PaperlessUI.Angular/src/app/app.html is excluded by none and included by none
PaperlessUI.Angular/src/app/app.routes.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/app.spec.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/app.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/core/api/api-client.service.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/core/api/generated/.gitkeep is excluded by !**/generated/** and included by none
PaperlessUI.Angular/src/app/core/config/api-base-url.token.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.css is excluded by none and included by none
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.html is excluded by none and included by none
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.css is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.html is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.ts is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.css is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.html is excluded by none and included by none
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.ts is excluded by none and included by none
PaperlessUI.Angular/src/index.html is excluded by none and included by none
PaperlessUI.Angular/src/main.ts is excluded by none and included by none

CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including **/dist/** will override the default block on the dist directory, by removing the pattern from both the lists.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro

Run ID: bd3305ce-ccd8-44fd-8d48-3c27e65f4ed6

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

🔍 Trigger review

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

codecov · 2026-05-12T10:24:53Z

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

Copilot

Pull request overview

This PR reshapes the Angular UI project into a layered core / layout / features structure (aligned with TourPlanner-Angular), introduces a basic app shell + navbar layout, and lays groundwork for consuming PaperlessREST via generated OpenAPI types.

Changes:

Replaced the initial Angular scaffold root component with a standalone AppComponent that renders an AppShellComponent.
Added layout (shell, navbar) and a first lazy-loaded feature stub (documents), plus router wiring and redirects.
Introduced a minimal ApiClientService + API_BASE_URL token, dev proxy config, and scripts intended to generate OpenAPI types.

Reviewed changes

Copilot reviewed 24 out of 26 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
PaperlessUI.Angular/src/main.ts	Bootstraps `AppComponent` instead of the removed scaffold `App`.
PaperlessUI.Angular/src/index.html	Updates the app title to “Paperless”.
PaperlessUI.Angular/src/app/app.component.ts	New root component rendering the app shell.
PaperlessUI.Angular/src/app/app.component.html	Hosts `<app-shell />`.
PaperlessUI.Angular/src/app/app.component.css	Root host styling for full-height layout.
PaperlessUI.Angular/src/app/app.component.spec.ts	Replaces old scaffold tests with a shell render test.
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.ts	Adds the app shell component that composes navbar + router outlet.
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.html	Shell markup with navbar and `<router-outlet />`.
PaperlessUI.Angular/src/app/layout/shell/app-shell.component.css	Shell layout styling.
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.ts	Adds a basic navbar component.
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.html	Navbar links for Documents/Upload/Search.
PaperlessUI.Angular/src/app/layout/navbar/app-navbar.component.css	Navbar styling.
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.ts	Adds a stub documents page component.
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.html	Placeholder content for the documents page.
PaperlessUI.Angular/src/app/features/documents/pages/documents-page.component.css	Minimal documents page styling.
PaperlessUI.Angular/src/app/app.routes.ts	Adds redirect + lazy route for `/documents` and fallback redirect.
PaperlessUI.Angular/src/app/app.config.ts	Provides router + HttpClient(fetch) and `API_BASE_URL`.
PaperlessUI.Angular/src/app/core/config/api-base-url.token.ts	Introduces `API_BASE_URL` injection token.
PaperlessUI.Angular/src/app/core/api/api-client.service.ts	Adds a simple HTTP wrapper using `API_BASE_URL`.
PaperlessUI.Angular/src/app/core/api/generated/.gitkeep	Placeholder file for generated OpenAPI types output directory.
PaperlessUI.Angular/proxy.conf.json	Adds dev proxy routing `/api` to `http://localhost:5057`.
PaperlessUI.Angular/package.json	Updates serve/test scripts and adds OpenAPI generation scripts.
PaperlessUI.Angular/src/app/app.ts	Removes the original scaffold `App` component.
PaperlessUI.Angular/src/app/app.spec.ts	Removes the original scaffold tests.
PaperlessUI.Angular/src/app/app.html	Removes the original scaffold template content.

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

+    "test:watch": "ng test",
+    "generate:openapi": "node -e \"const fs=require('node:fs');fs.rmSync('../PaperlessREST/openapi/paperless.json',{force:true})\" && dotnet build ../PaperlessREST/PaperlessREST.csproj -tlp:ErrorsOnly && node -e \"if(!require('node:fs').existsSync('../PaperlessREST/openapi/paperless.json')){console.error('paperless.json not generated');process.exit(1)}\"",
+    "generate:types": "openapi-typescript ../PaperlessREST/openapi/paperless.json -o src/app/core/api/generated/api-types.ts",
+    "generate": "pnpm run generate:openapi && pnpm run generate:types"


@@ -0,0 +1 @@
+openapi-typescript output target — `npm run generate:types` writes api-types.ts here once the PaperlessREST OpenAPI document is wired up.


Copilot AI review requested due to automatic review settings May 12, 2026 10:21

Copilot started reviewing on behalf of ANcpLua May 12, 2026 10:22 View session

Copilot AI reviewed May 12, 2026

View reviewed changes

ANcpLua merged commit 49c8561 into main May 12, 2026
10 checks passed

ANcpLua deleted the feat/angular-tourplanner-layout branch May 12, 2026 10:26

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(angular): reshape PaperlessUI.Angular to TourPlanner-Angular layout#3

feat(angular): reshape PaperlessUI.Angular to TourPlanner-Angular layout#3
ANcpLua merged 1 commit into
mainfrom
feat/angular-tourplanner-layout

ANcpLua commented May 12, 2026

Uh oh!

coderabbitai Bot commented May 12, 2026

Review skipped

Uh oh!

codecov Bot commented May 12, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

		@@ -0,0 +1 @@
		openapi-typescript output target — `npm run generate:types` writes api-types.ts here once the PaperlessREST OpenAPI document is wired up.

Conversation

ANcpLua commented May 12, 2026

Summary

Test plan

Follow-ups

Uh oh!

coderabbitai Bot commented May 12, 2026

Review skipped

Uh oh!

codecov Bot commented May 12, 2026

Codecov Report

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants