ahmido
2d552c7ae8
Some checks failed
Main Confidence / confidence (push) Failing after 42s
## Summary - establish the initial Astro website foundation for `apps/website` with explicit TypeScript, Tailwind CSS v4, and reusable layout/content primitives - ship the v0 public route set for home, product, solutions, security & trust, integrations, contact, legal, privacy, and terms - add SEO/discovery basics, Playwright browser smoke coverage, and the full Spec 213 planning bundle under `specs/213-website-foundation-v0` - extend ignore rules for website test artifacts and refresh Copilot agent context for the new website stack ## Validation - `corepack pnpm build:website` - `cd apps/website && corepack pnpm exec playwright test` ## Notes - branch: `213-website-foundation-v0` - commit: `020d416d0d8af4d16a981ff4f4f6d90153b9c603` Co-authored-by: Ahmed Darrazi <ahmed.darrazi@live.de> Reviewed-on: #249
202 lines
13 KiB
Markdown
202 lines
13 KiB
Markdown
# Tasks: Initial Website Foundation & v0 Product Site
|
|
|
|
**Input**: Design documents from `/specs/213-website-foundation-v0/`
|
|
**Prerequisites**: `plan.md`, `spec.md`, `research.md`, `data-model.md`, `quickstart.md`, `contracts/public-site.openapi.yaml`
|
|
|
|
**Tests**: Browser smoke coverage is required for this runtime-changing website feature, together with the root website build proof.
|
|
|
|
## Test Governance Checklist
|
|
|
|
- [X] Lane assignment is named and is the narrowest sufficient proof for the changed behavior.
|
|
- [X] New or changed tests stay in the smallest honest family, and the browser addition remains explicit.
|
|
- [X] Shared helpers and context defaults stay cheap by default; no backend, auth, or fixture-heavy setup is introduced.
|
|
- [X] Planned validation commands cover the website change without pulling in unrelated platform lane cost.
|
|
- [X] Any runtime-cost or escalation note stays documented in this feature rather than being deferred implicitly.
|
|
|
|
## Phase 1: Setup (Shared Infrastructure)
|
|
|
|
**Purpose**: Establish the minimal website tooling and config baseline required before reusable UI work begins.
|
|
|
|
- [X] T001 Add explicit website TypeScript configuration in `apps/website/tsconfig.json`
|
|
- [X] T002 [P] Add Tailwind CSS v4 and Playwright dev dependencies plus website test scripts in `apps/website/package.json`
|
|
- [X] T003 [P] Update Astro aliases and website-safe build configuration in `apps/website/astro.config.mjs`
|
|
|
|
---
|
|
|
|
## Phase 2: Foundational (Blocking Prerequisites)
|
|
|
|
**Purpose**: Create the shared shell, primitives, tokens, metadata, and smoke-test harness that every page depends on.
|
|
|
|
**⚠️ CRITICAL**: No user story work should begin until this phase is complete.
|
|
|
|
- [X] T004 Configure Tailwind v4 theme tokens and base website styles in `apps/website/src/styles/global.css` and `apps/website/src/styles/tokens.css`
|
|
- [X] T005 [P] Create shared site metadata, navigation, and footer configuration in `apps/website/src/lib/site.ts` and `apps/website/src/types/site.ts`
|
|
- [X] T006 [P] Add the browser smoke-test harness in `apps/website/playwright.config.ts` and `apps/website/tests/smoke/smoke-helpers.ts`
|
|
- [X] T007 Build the base document and page shell wrappers in `apps/website/src/layouts/BaseLayout.astro` and `apps/website/src/components/layout/PageShell.astro`
|
|
- [X] T008 [P] Build global navigation and footer components in `apps/website/src/components/layout/Navbar.astro` and `apps/website/src/components/layout/Footer.astro`
|
|
- [X] T009 [P] Implement layout primitives in `apps/website/src/components/primitives/Container.astro`, `apps/website/src/components/primitives/Section.astro`, `apps/website/src/components/primitives/SectionHeader.astro`, `apps/website/src/components/primitives/Stack.astro`, `apps/website/src/components/primitives/Cluster.astro`, and `apps/website/src/components/primitives/Grid.astro`
|
|
- [X] T010 [P] Implement shared UI primitives in `apps/website/src/components/primitives/Button.astro`, `apps/website/src/components/primitives/Badge.astro`, `apps/website/src/components/primitives/Card.astro`, `apps/website/src/components/primitives/Input.astro`, and `apps/website/src/components/primitives/Textarea.astro`
|
|
- [X] T011 Build reusable section scaffolds in `apps/website/src/components/sections/PageHero.astro`, `apps/website/src/components/sections/CTASection.astro`, `apps/website/src/components/sections/FeatureGrid.astro`, `apps/website/src/components/sections/TrustGrid.astro`, and `apps/website/src/components/sections/LogoStrip.astro`
|
|
|
|
**Checkpoint**: Foundation ready. User-story page work can now begin.
|
|
|
|
---
|
|
|
|
## Phase 3: User Story 1 - Understand the Product Quickly (Priority: P1) 🎯 MVP
|
|
|
|
**Goal**: Deliver the first credible public explanation of TenantAtlas through Home and Product.
|
|
|
|
**Independent Test**: Visit Home and Product, verify both routes render from the shared shell, and confirm the smoke suite proves product-category clarity and next-step CTA reachability without platform coupling.
|
|
|
|
### Tests for User Story 1
|
|
|
|
> **NOTE**: Write this test first and confirm it fails before implementing the story.
|
|
|
|
- [X] T012 [P] [US1] Write failing smoke coverage for Home and Product in `apps/website/tests/smoke/home-product.spec.ts`
|
|
|
|
### Implementation for User Story 1
|
|
|
|
- [X] T013 [P] [US1] Create Home and Product content modules in `apps/website/src/content/pages/home.ts` and `apps/website/src/content/pages/product.ts`
|
|
- [X] T014 [P] [US1] Create product-explanation content primitives in `apps/website/src/components/content/Eyebrow.astro`, `apps/website/src/components/content/Headline.astro`, `apps/website/src/components/content/Lead.astro`, and `apps/website/src/components/content/FeatureItem.astro`
|
|
- [X] T015 [P] [US1] Create supporting proof blocks in `apps/website/src/components/content/Callout.astro` and `apps/website/src/components/content/Metric.astro`
|
|
- [X] T016 [US1] Implement the Home and Product routes in `apps/website/src/pages/index.astro` and `apps/website/src/pages/product.astro`
|
|
|
|
**Checkpoint**: Home and Product are independently functional and demonstrable as the MVP slice.
|
|
|
|
---
|
|
|
|
## Phase 4: User Story 2 - Evaluate Fit by Audience (Priority: P2)
|
|
|
|
**Goal**: Add audience-fit, trust framing, and ecosystem-fit pages that help visitors judge whether TenantAtlas fits their environment.
|
|
|
|
**Independent Test**: Visit Solutions, Security & Trust, and Integrations from the shared navigation and verify the smoke suite proves audience-specific framing, substantiated trust messaging, and non-speculative integrations.
|
|
|
|
### Tests for User Story 2
|
|
|
|
> **NOTE**: Write this test first and confirm it fails before implementing the story.
|
|
|
|
- [X] T017 [P] [US2] Write failing smoke coverage for Solutions, Security & Trust, and Integrations in `apps/website/tests/smoke/solutions-trust-integrations.spec.ts`
|
|
|
|
### Implementation for User Story 2
|
|
|
|
- [X] T018 [P] [US2] Create Solutions, Security & Trust, and Integrations content modules in `apps/website/src/content/pages/solutions.ts`, `apps/website/src/content/pages/security-trust.ts`, and `apps/website/src/content/pages/integrations.ts`
|
|
- [X] T019 [P] [US2] Create audience and trust content primitives in `apps/website/src/components/content/AudienceRow.astro`, `apps/website/src/components/content/TrustPrincipleCard.astro`, and `apps/website/src/components/content/IntegrationBadge.astro`
|
|
- [X] T020 [P] [US2] Implement the Solutions route in `apps/website/src/pages/solutions.astro`
|
|
- [X] T021 [P] [US2] Implement the Security & Trust route in `apps/website/src/pages/security-trust.astro`
|
|
- [X] T022 [P] [US2] Implement the Integrations route in `apps/website/src/pages/integrations.astro`
|
|
|
|
**Checkpoint**: Audience fit, trust framing, and integration fit are independently functional and testable.
|
|
|
|
---
|
|
|
|
## Phase 5: User Story 3 - Reach a Qualified Next Step (Priority: P3)
|
|
|
|
**Goal**: Deliver the contact/demo path, legal surfaces, and cross-page CTA/legal reachability needed for a trustworthy conversion flow.
|
|
|
|
**Independent Test**: Visit Contact, Legal, Privacy, and Terms and confirm the smoke suite proves CTA reachability and footer/legal access from every published core page.
|
|
|
|
### Tests for User Story 3
|
|
|
|
> **NOTE**: Write this test first and confirm it fails before implementing the story.
|
|
|
|
- [X] T023 [P] [US3] Write failing smoke coverage for Contact, Legal, Privacy, Terms, footer links, CTA reachability, and legal-surface availability in `apps/website/tests/smoke/contact-legal.spec.ts`
|
|
|
|
### Implementation for User Story 3
|
|
|
|
- [X] T024 [P] [US3] Create Contact and legal content modules, including any required jurisdiction-specific public legal notice content, in `apps/website/src/content/pages/contact.ts`, `apps/website/src/content/pages/legal.ts`, `apps/website/src/content/pages/privacy.ts`, and `apps/website/src/content/pages/terms.ts`
|
|
- [X] T025 [P] [US3] Create conversion and legal content primitives in `apps/website/src/components/content/PrimaryCTA.astro`, `apps/website/src/components/content/SecondaryCTA.astro`, `apps/website/src/components/content/ContactPanel.astro`, `apps/website/src/components/content/DemoPrompt.astro`, and `apps/website/src/components/content/RichText.astro`
|
|
- [X] T026 [P] [US3] Implement the Contact route in `apps/website/src/pages/contact.astro`
|
|
- [X] T027 [P] [US3] Implement the Legal hub route, including any required jurisdiction-specific public legal notice path, in `apps/website/src/pages/legal.astro`
|
|
- [X] T028 [P] [US3] Implement the Privacy and Terms routes in `apps/website/src/pages/privacy.astro` and `apps/website/src/pages/terms.astro`
|
|
- [X] T029 [US3] Add SEO and future-ready content scaffolding, including explicit sitemap output, in `apps/website/src/lib/seo.ts`, `apps/website/src/content.config.ts`, `apps/website/public/robots.txt`, `apps/website/src/pages/sitemap.xml.ts`, and `apps/website/astro.config.mjs`
|
|
- [X] T030 [US3] Wire final CTA and footer/legal reachability across `apps/website/src/pages/index.astro`, `apps/website/src/pages/product.astro`, `apps/website/src/pages/solutions.astro`, `apps/website/src/pages/security-trust.astro`, `apps/website/src/pages/integrations.astro`, and `apps/website/src/pages/contact.astro`
|
|
|
|
**Checkpoint**: The qualified contact path and legal reachability are functional across the full published site.
|
|
|
|
---
|
|
|
|
## Phase 6: Polish & Cross-Cutting Concerns
|
|
|
|
**Purpose**: Final validation, wording review, and workspace-contract verification across all stories.
|
|
|
|
- [X] T031 [P] Validate both required fast-feedback proof commands against `apps/website/package.json`, `apps/website/playwright.config.ts`, and `specs/213-website-foundation-v0/quickstart.md`
|
|
- [X] T032 [P] Review and tighten public wording against substantiated-claim and banned-wording rules in `apps/website/src/content/pages/home.ts`, `apps/website/src/content/pages/product.ts`, `apps/website/src/content/pages/solutions.ts`, `apps/website/src/content/pages/security-trust.ts`, `apps/website/src/content/pages/integrations.ts`, `apps/website/src/content/pages/contact.ts`, `apps/website/src/content/pages/legal.ts`, `apps/website/src/content/pages/privacy.ts`, and `apps/website/src/content/pages/terms.ts`
|
|
- [X] T033 Verify the workspace script and package contracts remain intact in `package.json` and `apps/website/package.json`
|
|
|
|
---
|
|
|
|
## Dependencies & Execution Order
|
|
|
|
### Phase Dependencies
|
|
|
|
- **Setup (Phase 1)**: Starts immediately.
|
|
- **Foundational (Phase 2)**: Depends on Setup and blocks all story work.
|
|
- **User Story 1 (Phase 3)**: Depends on Foundational only.
|
|
- **User Story 2 (Phase 4)**: Depends on Foundational only.
|
|
- **User Story 3 (Phase 5)**: Depends on Foundational and needs the core routes from US1 and US2 in place to satisfy “from any core page” CTA/legal reachability.
|
|
- **Polish (Phase 6)**: Depends on all targeted stories being complete.
|
|
|
|
### User Story Dependencies
|
|
|
|
- **US1**: No dependency on other user stories; this is the MVP slice.
|
|
- **US2**: No dependency on US1 for implementation, but it reuses the same shared shell and primitives from Foundational.
|
|
- **US3**: Depends on the published route set from US1 and US2 to complete the full cross-page CTA/legal contract.
|
|
|
|
### Within Each User Story
|
|
|
|
- Write the browser smoke test first and verify it fails.
|
|
- Create content modules and story-specific primitives before assembling the route files.
|
|
- Finish route implementation before cross-page or SEO wiring tasks.
|
|
|
|
---
|
|
|
|
## Parallel Opportunities
|
|
|
|
- `T002` and `T003` can run in parallel once `T001` is scoped.
|
|
- `T005`, `T006`, `T008`, `T009`, and `T010` can run in parallel after `T004` begins.
|
|
- In US1, `T013`, `T014`, and `T015` can run in parallel before `T016`.
|
|
- In US2, `T018`, `T019`, `T020`, `T021`, and `T022` can be split across contributors once shared story inputs are clear.
|
|
- In US3, `T024`, `T025`, `T026`, `T027`, and `T028` can run in parallel before `T029` and `T030`.
|
|
- `T031` and `T032` can run in parallel during final polish.
|
|
|
|
---
|
|
|
|
## Parallel Example: User Story 2
|
|
|
|
```bash
|
|
# Launch the audience/trust/integration building blocks together:
|
|
Task: "T018 [US2] Create Solutions, Security & Trust, and Integrations content modules"
|
|
Task: "T019 [US2] Create audience and trust content primitives"
|
|
|
|
# Then split the route assembly work:
|
|
Task: "T020 [US2] Implement the Solutions route"
|
|
Task: "T021 [US2] Implement the Security & Trust route"
|
|
Task: "T022 [US2] Implement the Integrations route"
|
|
```
|
|
|
|
---
|
|
|
|
## Implementation Strategy
|
|
|
|
### MVP First
|
|
|
|
1. Complete Phase 1: Setup.
|
|
2. Complete Phase 2: Foundational.
|
|
3. Complete Phase 3: User Story 1.
|
|
4. Run the website build and the US1 smoke test.
|
|
5. Demo the MVP with Home + Product.
|
|
|
|
### Incremental Delivery
|
|
|
|
1. Setup + Foundational establish the reusable website system.
|
|
2. US1 ships the first clear product explanation.
|
|
3. US2 expands into audience fit, trust, and integration context.
|
|
4. US3 completes the conversion/legal path and SEO/discovery scaffolding.
|
|
5. Polish validates wording, scripts, and proof commands before merge.
|
|
|
|
### Suggested MVP Scope
|
|
|
|
- Deliver through **User Story 1** if a smaller first release is needed.
|
|
- Add **User Story 2** next for evaluation depth.
|
|
- Finish with **User Story 3** for full contact/legal/SEO readiness.
|