feat: Auth library & project foundation setup

[ElbekDeveloper]

Summary

• Configure Angular 21 app shell with lazy-loaded routing (/login, /chat, wildcard → /login)
• Wire functional HTTP interceptor attaching withCredentials: true to API-bound requests with XSRF protection
• Register HttpClient, ReactiveFormsModule, and the auth interceptor at application root
• Create SCSS design tokens (src/styles/tokens.scss) with dark-theme palette, accessible via @use 'tokens' in any component stylesheet
• Add Angular environment files with CI/CD-friendly production placeholder (__API_URL__)

Test plan

• npm start → navigate to /login, /chat, /unknown — all routes load without console errors; /unknown redirects to /login
• ng build --configuration production — zero errors, zero budget warnings; fileReplacements swaps env files
• DevTools Network tab: trigger HttpClient GET to http://localhost:3000/api/* — confirm credentials: include in request headers
• Add @use 'tokens'; .test { color: tokens.$color-text-primary; } to any component SCSS, run ng build — zero errors

Closes #2

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features

  • Initialized Angular project infrastructure with dev tooling (linting, formatting, testing).
  • Established spec-driven development workflow framework with templated documentation and task orchestration.
  • Completed specification for authentication & project foundation feature with implementation tasks, acceptance criteria, and design contracts.

• Chores

  • Configured code quality standards, editor settings, and project governance guidelines.

[coderabbitai]

Caution

Review failed

Pull request was closed or merged during review

📝 Walkthrough

Walkthrough

This pull request establishes a complete Angular 21 authentication project foundation with a Spec Kit workflow management system. It includes Angular application setup with lazy-loaded routing, HTTP credential interceptors, SCSS design tokens, and comprehensive infrastructure for specification-driven development including Git automation, skill orchestration, extension hooks, and lifecycle templates spanning specification, planning, task generation, and implementation phases.

Changes

Cohort / File(s)	Summary
Angular Application Core src/app/app.ts, src/app/app.html, src/app/app.routes.ts, src/app/app.config.ts, src/main.ts, src/index.html	Root component, routing configuration, application bootstrap, HTTP/forms/router provisioning in appConfig, and lazy-loaded routes for /login and /chat with wildcard fallback.
Authentication & HTTP src/app/shared/interceptors/auth.interceptor.ts, src/environments/environment.ts, src/environments/environment.prod.ts, src/environments/environment.types.ts	Functional HTTP interceptor conditionally forwarding credentials to environment.apiUrl, typed environment configuration with API URL and placeholder support for production.
Feature Components src/app/features/auth/login.component.ts, src/app/features/chat/chat.component.ts	Placeholder standalone components for login and chat routes with document title management.
Styles & Design Tokens src/styles/tokens.scss, src/styles.scss	SCSS design token variables (colors, spacing, typography, borders) and global stylesheet.
TypeScript & Tooling Configuration tsconfig.json, tsconfig.app.json, tsconfig.spec.json, angular.json, package.json, eslint.config.js, .editorconfig, .prettierrc, .prettierignore, .gitignore, .vscode/...	Build, test, linting, formatting, and IDE configuration for Angular 21 strict TypeScript, ESLint, Prettier, and VS Code debugging/tasks.
Angular Testing src/app/app.spec.ts	Unit test scaffold for root component using TestBed.
Documentation README.md, CLAUDE.md	Developer quickstart and AI model context reference.
Spec Kit: Skill Definitions .claude/skills/speckit-{specify,plan,tasks,implement,clarify,checklist,analyze,constitution,taskstoissues}/SKILL.md	User-invocable workflow skills defining end-to-end specification-driven development: specification generation, planning, task derivation, checklist creation, requirement analysis, constitution governance, and issue synchronization.
Spec Kit: Git Extension .specify/extensions/git/{extension.yml,git-config.yml,README.md,commands/*,scripts/{bash,powershell}/*}	Complete Git branching workflow with repository initialization, feature branch creation, branch validation, remote detection, and auto-commit hooks at each SDD lifecycle stage.
Spec Kit: Templates & Workflows .specify/templates/{spec,plan,tasks,checklist,constitution}-template.md, .specify/workflows/speckit/workflow.yml, .specify/workflows/workflow-registry.json	Markdown templates standardizing specification, planning, task, and checklist formats; orchestrated workflow defining specification→plan→tasks→implement sequence with approval gates.
Spec Kit: Runtime & Configuration .specify/scripts/powershell/{common.ps1,check-prerequisites.ps1,create-new-feature.ps1,setup-plan.ps1}, .claude/settings.local.json, .claude/CLAUDE.md	PowerShell helpers for feature path resolution, template composition, prerequisite validation; Claude command allowlisting; TypeScript/Angular coding standards.
Specification Documents (001-auth-setup) specs/001-auth-setup/{spec.md,plan.md,tasks.md,research.md,quickstart.md,data-model.md,checklists/requirements.md,contracts/{http.md,routes.md,tokens.md}}	Complete feature documentation including user stories, functional requirements, measurable success criteria, implementation tasks, technical contracts, data models, and design research.
Project Configuration .specify/{feature.json,init-options.json,integration.json,integrations/*.manifest.json,extensions/.registry}, .specify/memory/constitution.md	Feature registry, initialization options, Claude/Speckit integration manifests, Git extension registry, and project governance constitution.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~65 minutes

The PR introduces substantial, heterogeneous infrastructure spanning Angular application setup, Spec Kit workflow orchestration, PowerShell/Bash scripting, and multi-component extension systems. While individual skill definitions follow consistent patterns, review demands understanding of: (1) workflow sequencing and hook coordination across specification→implementation phases, (2) template composition and environment resolution logic in PowerShell helpers, (3) Git extension integration points and branch naming schemes, (4) Angular configuration correctness for strict typing and dependency injection, and (5) interconnections between the constitution governance model and downstream specifications. The large file count, mixed file types, and cross-system dependencies elevate review complexity.

Poem

🐰 A spec-kit warren springs to life,
with routes and tokens, no more strife,
Git branches numbered, clean and bright,
from spec through tasks, all done just right,
Auth secured with credentials true—
Angular 21 sees us through! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title 'feat: Auth library & project foundation setup' clearly and concisely summarizes the main change: establishing Angular app configuration, HTTP interception, SCSS tokens, and environment setup as a foundation for authentication features.
Linked Issues check	✅ Passed	All coding requirements from issue #2 are met: Angular 21 app shell with lazy-loaded routes [#2], functional HTTP interceptor with credentials & XSRF [#2], root-level HttpClient/ReactiveFormsModule/interceptor registration [#2], SCSS design tokens via @use 'tokens' [#2], and environment files with production placeholder [#2] per spec.md.
Out of Scope Changes check	✅ Passed	All changes are directly aligned with issue #2 requirements: Spec Kit infrastructure files organize feature workflow; VS Code/editor configs standardize dev tooling; build configs (angular.json, tsconfig, eslint, prettier) enable the Angular 21 foundation; and implementation files match the spec.md contract.
Docstring Coverage	✅ Passed	Docstring coverage is 85.71% which is sufficient. The required threshold is 80.00%.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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 001-auth-setup

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Review rate limit: 0/1 reviews remaining, refill in 60 minutes.}

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