Phase 7: Pages Router Cleanup

[jonathansick]

Part of #352

Remove all Pages Router code after the App Router migration is complete.

Research

Files to Remove

Pages Directory (src/pages/):

pages/
├── _app.tsx                    # App wrapper with providers
├── _document.tsx               # Document with Sentry/Plausible scripts
├── index.tsx                   # Home page
├── 404.tsx                     # Custom 404 page
├── docs.tsx                    # Documentation page
├── support.tsx                 # Support page
├── api-aspect.tsx              # API Aspect page
├── settings/                   # All settings pages
├── times-square/               # All Times Square pages
└── api/
    └── dev/                    # All mock API routes

Legacy Context:

• src/contexts/AppConfigContext.tsx - Original Pages Router context

Legacy Loaders:

• src/lib/config/loader.ts - loadAppConfig() function
• src/lib/config/footerLoader.ts - Footer MDX loader

SWR Dependency:

• Remove SWR package after BroadcastBanner migration (Phase 6)

Dependencies to Check

Before removing, verify no code depends on:

1. useAppConfig() hook from AppConfigContext
2. loadAppConfig() function
3. Pages Router specific utilities
4. SWR hooks (after Phase 6 migration)

Configuration Changes

next.config.js:

• Remove any Pages Router specific configuration
• Update rewrites if needed
• Verify transpilePackages still works

package.json:

• Remove SWR dependency
• May be able to remove other Pages Router specific dependencies

Proposed Design

Cleanup Checklist

1. Verify all pages migrated - Each route has App Router equivalent
2. Search for imports - Find any remaining imports of old modules
3. Remove pages directory - Delete src/pages/
4. Remove legacy context - Delete or deprecate AppConfigContext
5. Clean up loaders - Remove or mark as deprecated
6. Remove SWR - Delete SWR dependency from package.json
7. Update documentation - Update any docs referencing old patterns
8. Update tests - Remove or migrate tests for deleted code

Import Search Patterns

Search for these patterns to find remaining dependencies:

# AppConfigContext imports
grep -r "from.*AppConfigContext" src/
grep -r "useAppConfig" src/

# loadAppConfig imports
grep -r "loadAppConfig" src/
grep -r "from.*config/loader" src/

# Pages Router hooks
grep -r "from 'next/router'" src/

# getServerSideProps
grep -r "getServerSideProps" src/

# SWR imports
grep -r "from 'swr'" src/
grep -r "useSWR" src/

Deprecation vs Removal

Option A: Full Removal (Recommended)

• Delete all Pages Router code
• Removes maintenance burden
• Clean codebase

Option B: Deprecation

• Mark old code as deprecated
• Keep for reference
• More complexity

Final State

After cleanup:

src/
├── app/                        # App Router pages and layouts
│   ├── layout.tsx
│   ├── page.tsx
│   ├── settings/
│   ├── times-square/
│   └── api/
│       └── dev/
├── components/                 # Shared components (unchanged)
├── contexts/
│   └── rsc/                    # RSC contexts only
│       └── ConfigProvider.tsx
├── lib/
│   ├── config/
│   │   └── rsc/                # RSC config only
│   ├── discovery/
│   │   └── rsc/
│   └── mdx/
│       └── rsc/
└── ...

Implementation Details

Step 1: Verify Migration Complete

Checklist before cleanup:

• Home page (/) works in App Router
• Docs page (/docs) works
• Support page (/support) works
• API Aspect page (/api-aspect) works
• All settings pages work
• All Times Square pages work
• All mock API routes work
• 404 page works (app/not-found.tsx)
• Error handling works (app/error.tsx, app/global-error.tsx)
• BroadcastBanner uses TanStack Query (Phase 6 complete)

Step 2: Search for Remaining Imports

Run search commands to find any remaining dependencies on old code.

Step 3: Update Any Remaining Code

If components still import old patterns:

• Update to use RSC patterns
• Replace useAppConfig() with useStaticConfig()
• Replace loadAppConfig() with getStaticConfig()

Step 4: Remove Pages Directory

rm -rf src/pages/

Step 5: Remove Legacy Context

File to remove: src/contexts/AppConfigContext.tsx

Or if keeping for backwards compatibility:

// src/contexts/AppConfigContext.tsx
/**
 * @deprecated Use useStaticConfig() from @/contexts/rsc/ConfigProvider instead
 */
export { useStaticConfig as useAppConfig } from "./rsc/ConfigProvider";

Step 6: Remove Legacy Loaders

Files to remove or deprecate:

• src/lib/config/loader.ts
• src/lib/config/footerLoader.ts

Keep if needed for any scripts or tooling.

Step 7: Remove SWR Dependency

After verifying no SWR imports remain:

pnpm remove swr --filter squareone

Step 8: Update Configuration

next.config.js:

// Remove Pages Router specific config
// Verify App Router config is correct

Step 9: Clean Up Tests

• Remove tests for deleted code
• Update test imports
• Verify test suite passes

Step 10: Update Documentation

• Update CLAUDE.md with new patterns
• Update any developer documentation
• Remove references to getServerSideProps
• Remove references to SWR

Testing Strategy

1. Full regression test - All routes render correctly
2. Build verification - Production build succeeds
3. Type checking - No TypeScript errors
4. Lint verification - No lint errors about missing imports
5. E2E tests - All user flows work

Risk Mitigation

• Create backup branch before cleanup
• Run full test suite before and after
• Deploy to staging environment first
• Monitor for errors after production deploy

Acceptance Criteria

• All pages work in App Router
• src/pages/ directory deleted
• No imports of useAppConfig() from old context
• No imports of loadAppConfig()
• No imports from next/router (use next/navigation)
• No getServerSideProps exports
• No imports from swr
• SWR removed from package.json
• TypeScript compilation succeeds
• Lint passes
• Tests pass
• Production build succeeds
• Development mode works
• Documentation updated

Post-Cleanup Verification

After deployment, verify:

1. All pages load correctly
2. Navigation works
3. Authentication flows work
4. Times Square features work
5. Settings pages work
6. Analytics (Plausible) tracking works
7. Error tracking (Sentry) works
8. Development mode with mocks works
9. Broadcast banners display and refresh correctly