Upgrade React to 19, additional major dependency updates (Primer, TanStack, tRPC)

### Is your feature request related to a problem? Current versions of React, Primer, TanStack, and tRPC are all outdated. ### Describe the solution you'd like When #409 merges and the project is updated to Next.js 16, these dependencies can then be updated. <details><summary>Detailed migration plan</summary> ## Current State | Package | Current Version | Target Version | | ---------------------- | --------------- | -------------- | | React | 18.3.1 | 19.x | | React DOM | 18.3.1 | 19.x | | @primer/react | 36.27.0 | 38.x | | @primer/octicons-react | 19.15.2 | Latest | | @tanstack/react-query | 4.36.1 | 5.x | | @trpc/client | 10.45.3 | 11.x | | @trpc/react-query | 10.45.3 | 11.x | | @trpc/server | 10.45.3 | 11.x | | styled-components | 5.3.11 | 6.x | ## Migration Steps ### 1. Upgrade React to v19 ``` npm install react@19 react-dom@19 npm install -D @types/react@19 @types/react-dom@19 ``` Breaking Changes: - useFormState is deprecated in favor of useActionState (not used in this codebase) - useFormStatus now includes additional keys (data, method, action) - See <https://react.dev/blog/2024/04/25/react-19-upgrade-guide> Impact: Low - this codebase does not use useFormState or useFormStatus ### 2. Upgrade styled-components to v6 ``` npm install styled-components@6 npm uninstall @types/styled-components # Types are bundled in v6 ``` Breaking Changes: - Improved TypeScript support (types now bundled) - Some internal API changes - See <https://styled-components.com/releases> Impact: Low - mostly internal changes ### 3. Upgrade @tanstack/react-query to v5 Run codemod first: ``` npx @tanstack/react-query-codemod@latest v5/all src/ ``` Then install: ``` npm install @tanstack/react-query@5 ``` Breaking Changes: - cacheTime → gcTime - useErrorBoundary → throwOnError - isLoading → isPending for mutations - status: 'loading' → status: 'pending' - Default staleTime is now 0 - See <https://tanstack.com/query/v5/docs/react/guides/migrating-to-v5> Files to review after codemod: - src/providers/TRPCProvider.tsx - Any files using tRPC queries/mutations ### 4. Upgrade @trpc to v11 Run codemod first: ``` npx @trpc/codemod@latest v11 src/ ``` Then install: ``` npm install @trpc/client@11 @trpc/react-query@11 @trpc/server@11 ``` Breaking Changes: - New initialization API - httpBatchLink changes - React Query integration updated for v5 - See <https://trpc.io/docs/migrate-from-v10-to-v11> Files to review after codemod: - src/server/trpc.ts - tRPC initialization - src/server/routers/ - Router definitions - src/app/api/trpc/[trpc]/route.tsx - tRPC route handler - src/utils/trpc.ts - tRPC client ### 5. Upgrade @primer/react to v38 ``` npm install @primer/react@38 @primer/octicons-react@latest ``` Breaking Changes: - Component API changes - Theme/color system updates - Some components moved from drafts to main export (or vice versa) - See <https://github.com/primer/react/blob/main/CHANGELOG.md> - See [Primer React v37 Release](https://github.com/primer/react/discussions/5165) - See [Primer React v38 Release](https://github.com/primer/react/discussions/7086) - Removed dependency on `styled-components`, so project needs to adapt to new styling approach > We’ve removed our dependency on the end-of-life library styled-components. This means some component styling will need to change: > > - The `sx` prop is no longer supported. You can style components by providing a `className` and using CSS Modules. > - Props from `styled-system` are no longer available. > - Support for theming in JavaScript has been removed. Files to review: - src/app/page.tsx - src/app/[organizationId]/page.tsx - src/app/[organizationId]/forks/[forkId]/page.tsx - src/app/not-found.tsx - src/app/components/dialog/\*.tsx - src/app/components/header/\*.tsx - src/app/components/loading/Loading.tsx - src/app/components/search/\*.tsx Note: We already migrated from internal lib-esm paths to public export paths (@primer/react and @primer/react/drafts) as part of the Next.js 16 upgrade (TODO: link PR once raised externally), which should reduce the migration effort. ## Post-Upgrade Tasks 1. Enable Turbopack for builds - After upgrading @primer/react to v38, test if Turbopack works and remove the `--webpack` flag from the build script 2. Run full test suite - Verify all tests pass 3. Manual testing - Test the application end-to-end ## Acceptance Criteria - React upgraded to v19 - styled-components upgraded to v6 - @tanstack/react-query upgraded to v5 - @trpc packages upgraded to v11 - @primer/react upgraded to v38 - All tests pass - Build succeeds (ideally with Turbopack) - Application functions correctly in development and production ## References - <https://react.dev/blog/2024/04/25/react-19-upgrade-guide> - <https://tanstack.com/query/v5/docs/react/guides/migrating-to-v5> - <https://trpc.io/docs/migrate-from-v10-to-v11> - <https://github.com/primer/react/blob/main/CHANGELOG.md> - <https://styled-components.com/releases> </details> ### Describe alternatives you've considered _No response_ ### Additional context _No response_