BA-2680: switch to just-in-time compilation strategy

[anicioalexandre]

• components and design-system should follow just-in-time strategy

• remove tools and configs from the previous compilation strategy

• make sure to have minimal breaking changes regarding file exports

• update documentation

• check if it's compatible with submodules

Summary by CodeRabbit

• New Features

  • More granular, source-based exports for design-system and components, plus explicit CSS exports for web styles.
  • Unified test utilities entry point for web tests.

• Refactor

  • Simplified build/dev workflows to TypeScript-first JIT compilation; removed legacy build/watch scripts.

• Tests

  • Enhanced component test workflow with Cypress binary caching and Chrome setup.

• Documentation

  • Streamlined developer setup guides and updated package READMEs/CHANGELOGs.

• Chores

  • Upgraded pnpm to 10.14.0 across workflows and package.json; added lint ignore for generated; version bumps across packages.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 2ae758d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[coderabbitai]

Walkthrough

Tooling updated to pnpm 10.14.0, CI adds Cypress setup and Chrome for component tests, and turbo dev graph simplified. Build/watch scripts and related utilities removed across design-system and components. Both packages migrate exports to TypeScript source paths with tsc builds, adjust tests/imports, and update package metadata and docs.

Changes

Cohort / File(s)	Summary
CI workflows (pnpm 10.14.0 + Cypress in component tests) .github/workflows/deploy-github-pages.yaml, .github/workflows/main.yml, .github/workflows/release.yml	Bump pnpm setup from 9.12.0 to 10.14.0. In main.yml test-component job: remove “Build Packages”, add Cypress cache/install, Chrome setup, and binary verification before component tests.
Monorepo task graph turbo.json	Remove dev env export and dev-time build tasks for @baseapp-frontend/components and @baseapp-frontend/wagtail. Keep other tasks unchanged.
Root tooling/docs package.json, README.md	Update packageManager to pnpm@10.14.0. Simplify Dev instructions to pnpm dev; minor catalog/docs edits.
Removed shared build utilities .scripts/command-utils.mjs, .scripts/copy-dts.js	Delete process mgmt, rsync, ready-file, and DTS copy utilities.
Components: build/export rework packages/components/package.json, packages/components/tsconfig.build.json, packages/components/CHANGELOG.md, packages/components/README.md, packages/components/.gitignore, packages/components/baseapp-frontend-imports.d.ts, packages/components/tailwind.config.js, packages/components/.scripts/build-command.mjs, packages/components/.scripts/build.mjs, packages/components/.scripts/dev-command.mjs, packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx	Switch to tsc-based build and TS-source exports; drop dist-based exports and build/watch scripts; clean up gitignore; remove ambient imports d.ts; adjust Tailwind imports; update tests to new design-system tests entry; add changelog; simplify tsconfig.build excludes.
Design-system: build/export rework and tests entry packages/design-system/package.json, packages/design-system/tsconfig.build.json, packages/design-system/CHANGELOG.md, packages/design-system/README.md, packages/design-system/.gitignore, packages/design-system/.scripts/build-command.mjs, packages/design-system/.scripts/build.mjs, packages/design-system/.scripts/dev-command.mjs, packages/design-system/styles/web/globals.ts, packages/design-system/styles/web/index.ts, packages/design-system/providers/web/SnackbarProvider/index.tsx, packages/design-system/tests/web/index.ts, packages/design-system/tests/web/utils/index.ts (removed), packages/design-system/tests/web/utils/...	Move to tsc and TS-source exports with many explicit subpath entries; add CSS exports; remove build/watch scripts; adjust styles to stop importing global CSS via TS; add ts-ignore in SnackbarProvider for timeout type; introduce tests/web/index.ts entry and update test util paths; update gitignore; simplify tsconfig.build.
Config package tweaks packages/config/.eslintrc.js, packages/config/package.json, packages/config/CHANGELOG.md	Add __generated__/ to ESLint ignore; bump version to 2.1.12; update changelog.
Authentication dep cleanup packages/authentication/package.json	Remove jotai catalog dependency entry.
Wagtail updates packages/wagtail/.storybook/decorators/withProviders.tsx, packages/wagtail/package.json, packages/wagtail/CHANGELOG.md	Update import to new design-system tests entry; bump version to 1.0.37; changelog entry.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  participant GH as GitHub Actions
  participant Runner as Runner (Ubuntu)
  participant PNPM as pnpm/action-setup@v4
  participant Cache as actions/cache@v4 (Cypress)
  participant Cypress as Cypress CLI
  participant Chrome as setup-chrome@v1
  participant Tests as Component Tests

  GH->>Runner: Start job: test-component
  Runner->>PNPM: Setup pnpm 10.14.0
  Runner->>Runner: pnpm install
  Runner->>Cache: Restore Cypress cache (~/.cache/Cypress, key by OS+13.16.1)
  Runner->>Cypress: pnpm --filter components exec cypress install
  Runner->>Chrome: Setup Chrome
  Runner->>Runner: Verify Cypress binary exists
  Runner->>Tests: Run component tests (Cypress)
  Tests-->>Runner: Results (success/failure)

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

• BA-2259: improve dev mode #218 — Introduced the build/watch scripts and utilities that this PR removes; directly related to deletions here.
• BA-2192: mobile features into packages #198 — Touched the same build utilities and packaging/export surfaces later overhauled in this PR.
• BA-2279: mobile settings menu #223 — Modified packages/components/baseapp-frontend-imports.d.ts, which this PR deletes.

Suggested labels

approved

Suggested reviewers

• deboracosilveira
• priscilladeroode

Poem

I thump my paw: the builds go light,
No more watch—just types take flight.
Exports hop on tidy trails,
Cypress cached, our testing sails.
With pnpm ten, we bound ahead—
Carrots, commits, and greens instead. 🥕✨

Tip

🔌 Remote MCP (Model Context Protocol) integration is now available!

Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats.

✨ Finishing Touches

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature/BA-2680-apply-jit-strategy

---

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

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbitai help to get the list of available commands.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

• Visit our Status Page to check the current availability of CodeRabbit.
• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[coderabbitai]

Actionable comments posted: 10

🧹 Nitpick comments (13)

packages/design-system/providers/web/SnackbarProvider/index.tsx (1)

26-37: Remove ts-ignore; fix timer typing for browser (client) code

This is a web/client component. setTimeout returns number in the DOM, so storing it as NodeJS.Timeout triggers the TS mismatch you silenced. Prefer DOM-safe typing and window.* APIs to eliminate the ignore and keep type safety.

Apply this diff to address it:

-  const timeoutID = useRef<NodeJS.Timeout | null>(null)
+  const timeoutID = useRef<ReturnType<typeof window.setTimeout> | null>(null)
...
-    if (timeoutID.current) clearTimeout(timeoutID.current)
+    if (timeoutID.current) window.clearTimeout(timeoutID.current)
...
-      // @ts-ignore TODO: check typing error
-      timeoutID.current = setTimeout(() => {
+      timeoutID.current = window.setTimeout(() => {
         timeoutID.current = null
         handleClose()
       }, HIDE_DURATION)
...
-      if (timeoutID.current) {
-        clearTimeout(timeoutID.current)
+      if (timeoutID.current) {
+        window.clearTimeout(timeoutID.current)
         timeoutID.current = null
       }

Notes:

• Using ReturnType ensures a number ref in the browser and avoids the NodeJS type.
• window.clearTimeout matches the ref’s type and avoids overload ambiguity from Node typings.

Also applies to: 44-49, 50-56

.github/workflows/release.yml (1)

27-27: PNPM 10.14.0 bump looks good; consider enabling dependency caching for faster CI.

To shave minutes off installs, enable built-in caching on the Node step.

You can add caching like this (outside the selected lines):

- name: Setup Node.js 20.17.0
  uses: actions/setup-node@v4
  with:
    node-version: 20.17.0
    cache: pnpm

packages/config/.eslintrc.js (1)

17-17: Broaden __generated__ ignore pattern to include nested directories

The current '__generated__/' pattern only matches directories at the project root. We have a nested directory at packages/components/__generated__/, which won’t be ignored. To catch generated artifacts at any depth, update the pattern as follows:

-    '__generated__/',
+    '**/__generated__/**',

.github/workflows/main.yml (1)

27-27: Consistent PNPM 10.14.0 usage—consider adding pnpm cache on Node setup to speed CI.

The version bump is consistent across jobs. Adding caching typically reduces install time substantially.

Update each Node setup step (outside the selected lines):

with:
  node-version: 20.17.0
  cache: pnpm

Also applies to: 53-53, 76-76

packages/eslint-plugin/package.json (1)

24-24: Verify Jest usage or drop Jest types

You added @types/jest but this package.json doesn’t depend on jest and the test script runs ts-node directly. If tests don’t run under Jest, these types are redundant and can confuse TS. If you intend to use Jest, add jest and switch the test script accordingly.

Suggested diff to remove the unused type (if not using Jest here):

   "devDependencies": {
     "@baseapp-frontend/tsconfig": "workspace:*",
     "@types/eslint": "^8.0.0",
-    "@types/jest": "29.5.12",
     "parcel": "^2.12.0",

If you do want Jest here, I can provide a minimal jest.config.ts and update the test script. Would you like that?

packages/provider/package.json (1)

21-22: Relax React peer range to avoid patch-level lock-in

Pinning peerDependencies.react to an exact 19.1.0 can cause unnecessary resolution conflicts for consumers on 19.0.x or future 19.x. Prefer a semver range.

   "peerDependencies": {
     "@baseapp-frontend/utils": "workspace:*",
-    "react": "19.1.0"
+    "react": "^19.0.0"
   },

If the package is compatible with 18 as well, consider "react": "^18.2.0 || ^19.0.0".

packages/graphql/package.json (1)

29-29: Peer React range consistency

As elsewhere, consider relaxing to "^19.0.0" to avoid hard pinning to 19.1.0 unless that patch is strictly required.

-    "react": "19.1.0"
+    "react": "^19.0.0"

README.md (2)

91-95: Nice simplification; consider adding targeted dev instructions

“pnpm dev” as the single entry point is great. Consider adding a one-liner on how to dev a single package to reduce noise in large repos, e.g., “pnpm --filter @baseapp-frontend/utils dev”.

Example addition:

• To develop a single package: pnpm --filter @baseapp-frontend/ dev
• To run multiple: pnpm --filter '@baseapp-frontend/*' dev

---

145-145: Minor clarity improvement

“Push the code to GitHub and copy the last commit hash.” Consider specifying “of your feature branch” to avoid confusion in repos with merge commits.

-  Push the code to GitHub and copy the last commit hash. You’ll need this hash to point your consumer app to the correct version of the package.
+  Push the code to GitHub and copy the last commit hash from your feature branch. You’ll need this hash to point your consumer app to the correct version of the package.

packages/utils/package.json (2)

16-18: Review framework deps as runtime vs peer

This shared utils package lists next and react-native as runtime dependencies. That can bloat consumers and create duplicate framework copies. Typically, frameworks remain peerDependencies (optionally with devDeps for local tests).

   "dependencies": {
     "axios": "1.9.0",
@@
-    "next": "^15.3.2",
+    "next": "^15.3.2",
@@
-    "react-native": "0.79.2",
+    "react-native": "0.79.2",

Follow-up: If you’re open to it, I can propose a structured shift moving these to peerDependencies with optionalPeerDependencies and add minimal test scaffolding to keep local DX intact.

Also applies to: 20-32

---

34-35: Relax React peer range

Same rationale as other packages: avoid exact patch pin for peers.

   "peerDependencies": {
-    "react": "19.1.0"
+    "react": "^19.0.0"
   },

packages/components/package.json (1)

13-13: Consider removing dist directory in clean script.

The clean script no longer removes the dist directory, which might leave build artifacts behind during cleanup operations.

-    "clean": "rm -rf .turbo && rm -rf node_modules",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",

packages/design-system/package.json (1)

7-8: Minor: use tsc build-mode flags over rm -rf.

Build-mode provides native cleaning/forcing and watch. Slightly faster and more portable:

-    "build": "rm -rf dist && tsc --build tsconfig.build.json",
-    "dev": "rm -rf dist && tsc --watch",
+    "build": "tsc -b --clean tsconfig.build.json && tsc -b tsconfig.build.json",
+    "dev": "tsc -b -w tsconfig.build.json",

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between c7675e1 and 79f88d9.

⛔ Files ignored due to path filters (3)

• packages/components/__generated__/ActivityLogsFragment.graphql.ts is excluded by !**/__generated__/**
• packages/components/__generated__/RemoveMemberMutation.graphql.ts is excluded by !**/__generated__/**
• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (43)

• .github/workflows/deploy-github-pages.yaml (1 hunks)
• .github/workflows/main.yml (3 hunks)
• .github/workflows/release.yml (1 hunks)
• .scripts/command-utils.mjs (0 hunks)
• .scripts/copy-dts.js (0 hunks)
• README.md (3 hunks)
• package.json (1 hunks)
• packages/authentication/package.json (1 hunks)
• packages/components/.gitignore (0 hunks)
• packages/components/.scripts/build-command.mjs (0 hunks)
• packages/components/.scripts/build.mjs (0 hunks)
• packages/components/.scripts/dev-command.mjs (0 hunks)
• packages/components/README.md (0 hunks)
• packages/components/baseapp-frontend-imports.d.ts (0 hunks)
• packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx (1 hunks)
• packages/components/package.json (1 hunks)
• packages/components/tailwind.config.js (1 hunks)
• packages/config/.eslintrc.js (1 hunks)
• packages/config/package.json (1 hunks)
• packages/design-system/.gitignore (0 hunks)
• packages/design-system/.scripts/build-command.mjs (0 hunks)
• packages/design-system/.scripts/build.mjs (0 hunks)
• packages/design-system/.scripts/dev-command.mjs (0 hunks)
• packages/design-system/README.md (0 hunks)
• packages/design-system/package.json (1 hunks)
• packages/design-system/providers/web/SnackbarProvider/index.tsx (1 hunks)
• packages/design-system/styles/web/globals.ts (0 hunks)
• packages/design-system/styles/web/index.ts (0 hunks)
• packages/design-system/tests/web/index.ts (1 hunks)
• packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/types.ts (1 hunks)
• packages/design-system/tests/web/utils/index.ts (0 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts (1 hunks)
• packages/eslint-plugin/package.json (1 hunks)
• packages/graphql/package.json (1 hunks)
• packages/provider/package.json (1 hunks)
• packages/test/package.json (1 hunks)
• packages/utils/package.json (1 hunks)
• packages/wagtail/.storybook/decorators/withProviders.tsx (1 hunks)
• packages/wagtail/package.json (1 hunks)
• turbo.json (0 hunks)

💤 Files with no reviewable changes (17)

• packages/design-system/styles/web/globals.ts
• packages/design-system/README.md
• packages/components/.gitignore
• packages/design-system/styles/web/index.ts
• packages/components/.scripts/build-command.mjs
• .scripts/copy-dts.js
• packages/design-system/.scripts/build-command.mjs
• packages/components/README.md
• packages/design-system/.scripts/dev-command.mjs
• packages/components/.scripts/dev-command.mjs
• packages/design-system/.gitignore
• packages/design-system/.scripts/build.mjs
• packages/components/baseapp-frontend-imports.d.ts
• packages/components/.scripts/build.mjs
• packages/design-system/tests/web/utils/index.ts
• turbo.json
• .scripts/command-utils.mjs

🔇 Additional comments (28)

package.json (1)

53-53: Root packageManager pinned to pnpm@10.14.0 — workflows and package.json aligned. LGTM.

• All .github/workflows use pnpm/action-setup@v4 with version: 10.14.0
• package.json’s packageManager is set to pnpm@10.14.0
• No hard-coded pnpm@9 occurrences found

This ensures consistent local tooling across CI and development environments.

packages/eslint-plugin/package.json (1)

27-27: Confirm TypeScript version compatibility with toolchain

TypeScript 5.8.3 is fine in general, but please confirm local parcel and ts-node paths compile correctly with it for this plugin (parcel won’t emit d.ts; ensure your types path is produced elsewhere).

If you need declaration output without extra scripts, consider replacing parcel build with tsc for this package or adding a prepublish step that runs tsc --emitDeclarationOnly.

packages/provider/package.json (1)

16-18: LGTM on dependency pins

@tanstack/react-query 5.76.1 and lodash 4.17.21 are solid, widely used versions.

packages/graphql/package.json (1)

35-39: Ignore removal of @types/react-relay
react-relay@19.0.0 does not ship its own TypeScript declarations. Removing @types/react-relay will break type checking—they must be kept until an official v19 type package is published.

• In packages/graphql/package.json → devDependencies, retain:

• "@types/react-relay": "18.2.1"
• "@types/relay-runtime": "19.0.1"
• "@types/relay-test-utils": "19.0.0"

When a matching @types/react-relay@19.x is released, bump the major then.

Likely an incorrect or invalid review comment.

packages/utils/package.json (2)

40-57: Testing stack looks coherent for TS 5 + Jest 29

Pins for @testing-library, jest, ts-jest, and ts-node look consistent. No action needed.

---

26-27: Compatibility Verified: React 19 & React Native 0.79 Aligned Across Repo

All scanned package.json files report React 19.1.0 and React Native 0.79.2, matching Next 15’s React 19 requirement and RN 0.79.x support. No version mismatches detected—no changes to the peer dependency range are needed.

packages/test/package.json (3)

17-23: LGTM: Dependency version pinning aligns with JIT strategy.

The migration from catalog placeholders to explicit version pins supports the just-in-time compilation approach by ensuring deterministic builds and reducing dependency resolution overhead.

---

26-26: LGTM: React peer dependency updated to latest version.

The update to React 19.1.0 is consistent with the broader modernization effort.

---

31-44: LGTM: Development tooling consolidated with explicit versions.

The replacement of catalog placeholders with explicit versions for testing libraries and TypeScript tooling ensures consistent development environments across the monorepo.

packages/wagtail/package.json (3)

22-28: LGTM: Core dependencies updated with explicit version pins.

The transition from catalog placeholders to explicit versions supports build determinism. The version choices align well with the modern React ecosystem.

---

34-34: LGTM: React peer dependency modernized.

The update to React 19.1.0 maintains consistency across the monorepo.

---

37-84: Verify compatibility of all pinned versions (Babel, Storybook, Webpack, TypeScript/@types, and React)

Our initial scan didn’t flag any direct version conflicts, but given the sizable jumps, please manually confirm against each tool’s compatibility matrix:

• Babel loader 9.2.1 ⇄ @babel/preset-env 7.26.0, preset-react 7.25.9, preset-typescript 7.26.0
• Storybook 8.4.7 core ⇄ addons (essentials, interactions, links), blocks, react-webpack5, styling-webpack 1.0.1, webpack5-compiler-babel 3.0.3
• Webpack 5.93.0 ⇄ webpack-cli 5.1.4 ⇄ webpack-dev-server 5.0.4
• TypeScript 5.8.3 ⇄ @types/react 19.1.4, @types/react-dom 19.1.5
• React version “19.1.0” (ensure this release exists and aligns with the above @types)

No immediate issues surfaced in our grep-based checks, but please verify each pairing against official docs before merging.

packages/authentication/package.json (3)

17-23: LGTM: Dependencies updated with explicit version pins.

The migration from catalog placeholders to explicit versions supports deterministic builds. The removal of jotai and addition of explicit versions for form handling libraries is appropriate.

---

27-27: LGTM: React peer dependency updated consistently.

The update to React 19.1.0 maintains alignment with the monorepo-wide React version standardization.

---

34-48: LGTM: Testing infrastructure modernized.

The addition of comprehensive testing dependencies with explicit versions supports the JIT compilation strategy by ensuring consistent test environments.

packages/config/package.json (1)

14-29: LGTM: ESLint and Prettier tooling consolidated.

The replacement of catalog placeholders with explicit versions for linting and formatting tools ensures consistent code quality standards across the monorepo. This aligns well with the JIT strategy by reducing configuration resolution overhead.

packages/components/package.json (5)

7-8: LGTM: Build system modernized to TypeScript-first approach.

The migration from complex build scripts to direct tsc usage simplifies the build process and supports the JIT compilation strategy by eliminating intermediate build steps.

---

23-131: LGTM: Export structure supports modular architecture.

The new export structure with explicit TypeScript source paths enables tree-shaking and supports the JIT compilation strategy by allowing consumers to import only the modules they need. The consistent pattern across common/web/native variants promotes code organization.

---

134-139: LGTM: Files configuration supports TypeScript-first publishing.

The updated files array correctly includes the modules directory and essential configuration files while removing the old dist-based artifacts. This aligns with the TS-first export strategy.

---

141-174: LGTM: Dependencies updated with explicit version pins.

The comprehensive migration from catalog placeholders to explicit versions supports build determinism and the JIT compilation approach.

---

180-181: LGTM: Peer dependencies updated consistently.

The React and ReactDOM updates to 19.1.0 maintain consistency across the monorepo.

packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx (1)

3-3: LGTM: import path update aligns with the new exports surface.

The shorter relative path matches the restructured tests/web entry points. No runtime changes.

packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts (1)

3-3: LGTM: path updated to consolidated hooks/web export.

Keeps types local to the package boundary after the export refactor.

packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx (1)

2-2: LGTM: consume the new public test utilities entry.

Importing from '@baseapp-frontend/design-system/tests/web' matches the new granular export strategy and removes reliance on the old utils barrel.

packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx (1)

5-6: LGTM: provider and mocks imports now align with the reorganized structure.

No functional changes; keeps the provider wiring intact under the new layout.

packages/wagtail/.storybook/decorators/withProviders.tsx (1)

3-3: Confirm re-export and compose ordering

The automated search didn’t locate the re-export or a compose implementation in our repo (they live in the external design-system package), so please manually verify:

• In @baseapp-frontend/design-system/tests/web/index.ts, ensure there’s

  export { default as withDesignSystemTestProviders } from './withDesignSystemTestProviders'

• Confirm the compose utility used by the test providers applies functions in the expected order (i.e. compose(a, b)(X) === a(b(X)))

packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx (1)

8-10: Path updates are consistent and correct relative to the file location.

No functional changes; imports resolve to the expected package internals.

packages/design-system/tests/web/index.ts (1)

12-12: Ignore default re‐export suggestion: no default export in theme mocks

The mock file packages/design-system/tests/web/utils/__mocks__/theme.ts only declares

export const defaultTheme = { … }

– there is no export default. As a result,

export * from './utils/__mocks__/theme'

already re-exports the named defaultTheme, and there’s no default export to forward. You can leave the entry point unchanged.

Likely an incorrect or invalid review comment.

[coderabbitai]

🛠️ Refactor suggestion

Pin Node version in this workflow to avoid environment drift.

This job does not set up Node explicitly. Runners can change preinstalled Node versions, which can break Storybook builds or violate engines in package.json. Align with other workflows by pinning Node and enabling pnpm cache.

Add this before “Setup pnpm” (outside the selected lines):

- name: Setup Node.js 20.17.0
  uses: actions/setup-node@v4
  with:
    node-version: 20.17.0
    cache: pnpm

🤖 Prompt for AI Agents

.github/workflows/deploy-github-pages.yaml around line 22: the workflow doesn't
explicitly set up Node which can cause environment drift; add a step before the
existing "Setup pnpm" step to invoke actions/setup-node@v4, pin node-version to
20.17.0 and enable pnpm caching (cache: pnpm) so the runner uses a fixed Node
version and leverages pnpm cache.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Unify module system: ESM imports with CommonJS export will likely throw at runtime

This file mixes top-level ESM import with module.exports/require(...). In Node/Tailwind CLI, that usually results in “Cannot use import statement outside a module.” Choose one module system and stick to it.

Two safe paths:

• Option A (keep CommonJS): Replace the new import statements with require(...) to match module.exports.

Apply this diff to the changed lines:

-import {
-  hideScrollbar,
-  responsiveTypography,
-} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
-
-import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
-import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
-import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
-import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
-import { typography } from '@baseapp-frontend/design-system/styles/web/typography'
+const {
+  hideScrollbar,
+  responsiveTypography,
+} = require('@baseapp-frontend/design-system/styles/web/tailwind/plugins')
+const { breakpoints } = require('@baseapp-frontend/design-system/styles/web/breakpoint')
+const { createPalette } = require('@baseapp-frontend/design-system/styles/web/palette')
+const { createCustomShadows } = require('@baseapp-frontend/design-system/styles/web/customShadow')
+const { createShadows } = require('@baseapp-frontend/design-system/styles/web/shadow')
+const { typography } = require('@baseapp-frontend/design-system/styles/web/typography')

• Option B (make the config ESM): Keep the import statements, switch module.exports = { ... } to export default { ... }, and convert the @tailwindcss/typography plugin to an ESM import to avoid mixing systems. Also avoid a name collision with the typography design token by aliasing the plugin import.

Example (outside the changed lines, shown for clarity):

// tailwind.config.js (ESM)
import {
  hideScrollbar,
  responsiveTypography,
} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
import { typography as dsTypography } from '@baseapp-frontend/design-system/styles/web/typography'
import tailwindTypography from '@tailwindcss/typography'

export default {
  // ...
  theme: {
    extend: {
      typography: () => ({
        h1: { css: dsTypography.h1 },
        // ...and so on
      }),
      // ...
    },
  },
  plugins: [tailwindTypography, responsiveTypography, hideScrollbar],
}

Run this quick check to decide which option is viable in your repo (verifies module type where it matters):

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "Root package.json type:"
jq -r '.type // "(not set)"' package.json || true
echo

echo "packages/components/package.json type:"
jq -r '.type // "(not set)"' packages/components/package.json || true
echo

echo "Design-system package type (if in workspace):"
for path in packages/design-system packages/design-system/* design-system; do
  if [ -f "$path/package.json" ]; then
    echo "$path/package.json -> type: $(jq -r '.type // "(not set)"' "$path/package.json")"
  fi
done
echo

echo "Note:"
echo "- If any of the above are 'module', prefer Option B (ESM)."
echo "- If all are CommonJS or unset, Option A (require/module.exports) is safer."

Length of output: 3759

---

Use CommonJS require in tailwind.config.js to match your repo’s default module type

All of your package.json files have no "type" field (defaulting to CommonJS), so import statements in a .js config will throw “Cannot use import statement outside a module.” Convert the top-level ESM imports to require(...):

--- a/packages/components/tailwind.config.js
+++ b/packages/components/tailwind.config.js
@@ Lines 1-10
-import {
-  hideScrollbar,
-  responsiveTypography,
-} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
-import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
-import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
-import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
-import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
-import { typography } from '@baseapp-frontend/design-system/styles/web/typography'
+const {
+  hideScrollbar,
+  responsiveTypography,
+} = require('@baseapp-frontend/design-system/styles/web/tailwind/plugins')
+const { breakpoints } = require('@baseapp-frontend/design-system/styles/web/breakpoint')
+const { createPalette } = require('@baseapp-frontend/design-system/styles/web/palette')
+const { createCustomShadows } = require('@baseapp-frontend/design-system/styles/web/customShadow')
+const { createShadows } = require('@baseapp-frontend/design-system/styles/web/shadow')
+const { typography } = require('@baseapp-frontend/design-system/styles/web/typography')

This change will prevent runtime errors when Tailwind CLI loads your CommonJS config.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	import {
	hideScrollbar,
	breakpoints,
	typography,
	createPalette,
	createShadows,
	createCustomShadows,
	} = require('@baseapp-frontend/design-system/styles/web')
	responsiveTypography,
	} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
	import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
	import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
	import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
	import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
	import { typography } from '@baseapp-frontend/design-system/styles/web/typography'
	// packages/components/tailwind.config.js
	const {
	hideScrollbar,
	responsiveTypography,
	} = require('@baseapp-frontend/design-system/styles/web/tailwind/plugins')
	const { breakpoints } = require('@baseapp-frontend/design-system/styles/web/breakpoint')
	const { createPalette } = require('@baseapp-frontend/design-system/styles/web/palette')
	const { createCustomShadows } = require('@baseapp-frontend/design-system/styles/web/customShadow')
	const { createShadows } = require('@baseapp-frontend/design-system/styles/web/shadow')
	const { typography } = require('@baseapp-frontend/design-system/styles/web/typography')
	// …the rest of your Tailwind configuration…

🤖 Prompt for AI Agents

In packages/components/tailwind.config.js around lines 1 to 10, the file uses
top-level ESM import statements which will fail because the repo packages
default to CommonJS; replace each import with the equivalent CommonJS require
form (e.g., const X = require('...')) for all listed imports (hideScrollbar,
responsiveTypography, breakpoints, createPalette, createCustomShadows,
createShadows, typography) so the Tailwind CLI can load the .js config; keep the
rest of the file/module.exports unchanged.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Critical: exports point to .ts sources — consumers will fail at runtime without extra transpilation.

Every export maps "default" to a TypeScript source file. Node and most bundlers don’t execute .ts from node_modules by default. This can break consumers (and published usage) unless all apps are configured to transpile this package on the fly.

Two safe paths forward:

• Ship compiled JS + .d.ts and point exports to dist.
• If you truly want JIT (ship sources), add a "source" condition and ensure consumers are configured (Next.js transpilePackages, Storybook/jest transforms) and publish .d.ts (or keep TypeScript-aware "types" mapping to .d.ts).

Recommend shipping JS + d.ts (least surprise). Example for one entry (apply the same pattern across all entries):

-    "./components/native/appbars": {
-      "types": "./components/native/appbars/index.ts",
-      "default": "./components/native/appbars/index.ts"
-    },
+    "./components/native/appbars": {
+      "types": "./dist/components/native/appbars/index.d.ts",
+      "default": "./dist/components/native/appbars/index.js"
+    },

If you intend to keep JIT, at minimum:

• Emit and export .d.ts, not .ts, under "types"
• Consider adding a "source" condition for bundlers that understand it
• Ensure all consumers transpile this package

I can generate a codemod to rewrite all export entries consistently. Let me know.

To validate JIT viability across the monorepo, run this script to check consumer configs (Next.js, Jest, Storybook) for transpiling this package:

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "== Searching for Next.js transpilePackages configs that include @baseapp-frontend/design-system =="
rg -nP -C3 '(transpilePackages\s*:\s*\[[^\]]*\])' | rg -nP '@baseapp-frontend/design-system' || {
  echo "WARN: No Next.js transpilePackages including @baseapp-frontend/design-system found."
}

echo
echo "== Searching for Jest transforms that include @baseapp-frontend/design-system (ts-jest/babel-jest) =="
fd -HI 'jest.config.*' -t f | while read -r f; do
  echo "--- $f"
  rg -nC3 'transformIgnorePatterns|ts-jest|babel-jest|esm|transform' "$f" || true
done

echo
echo "== Searching Storybook main config to ensure framework/transforms are set =="
fd -HI 'main.(js|cjs|mjs|ts)' -t f | while read -r f; do
  echo "--- $f"
  rg -nC3 '.' "$f" | sed -n '1,120p'
done

Length of output: 12128

---

Critical: Exports reference .ts source files—runtime failures ahead
Node and most bundlers won’t load .ts from node_modules by default, so consumers of this package will hit missing‐module errors unless they explicitly transpile it. While your Jest and Storybook configs in this monorepo already handle TS (via ts-jest and Babel’s TypeScript preset), downstream apps (e.g. Next.js) aren’t configured to transpile @baseapp-frontend/design-system.

You must update your packages/design-system/package.json exports to point at compiled JS (and .d.ts) under dist. For example, change each entry like this:

-    "./components/native/appbars": {
-      "types": "./components/native/appbars/index.ts",
-      "default": "./components/native/appbars/index.ts"
-    },
+    "./components/native/appbars": {
+      "types": "./dist/components/native/appbars/index.d.ts",
+      "default": "./dist/components/native/appbars/index.js"
+    },

• Apply the same pattern across all export entries
• Ensure your build step emits the dist/ folder with compiled .js and .d.ts files
• Remove or repurpose the TS‐only entries if you don’t intend on JIT‐transpiling from source

🤖 Prompt for AI Agents

In packages/design-system/package.json around lines 16 to 231, the exports map
currently points to .ts source files which will break consumers that don’t
transpile node_modules; update every export entry to reference the compiled
outputs under dist (point "default" to the compiled .js file in dist and "types"
to the corresponding .d.ts in dist), ensure the package build emits dist with
.js and .d.ts for each exported entry, and remove or replace any remaining
direct .ts paths so all exports resolve to dist/*.js and dist/*.d.ts at runtime.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Verify peer/version compatibility (React 19 with MUI v5 and others).

Pinned versions look modern, but MUI v5 historically declared peer support up to React 18. React 19 may lead to peer warnings or subtle issues. Also validate RN-related version alignment.

Please confirm with upstream docs before merging.

Also applies to: 281-284

---

🌐 Web query:

Does @mui/material v5.18.0 officially support React 19?

💡 Result:

@mui/material v5.18.0 does not officially support React 19; official support for React 19 was introduced in later versions (v6 and above), and v5.18.0's peer dependencies do not include React 19.

• The official installation guide for Material UI lists peer dependencies for @mui/material that include "react": "^17.0.0 || ^18.0.0 || ^19.0.0"[8]. However, these are for the latest v5 releases. V5.18.0 was released prior to React 19 (which launched at the end of 2024), so its published peer dependencies only include React 17 and 18.
• The MUI team explicitly planned React 19 support for v6 first, followed by possible backports to v5 once compatibility was validated[2]. The MUI team’s blog and GitHub issues explain that React 19 support for v5 was added much later, and only to the final v5 release(s), not to earlier 5.x releases like v5.18.0[1][2].
• If you check the release timing: v5.18.0 was released before React 19 became stable, so it cannot include official support, testing, or compatibility fixes for React 19’s breaking changes.
• You may encounter runtime or type errors when attempting to use v5.18.0 with React 19, especially around changes like useRef() and types, which were addressed in maintenance releases and v6[1].
• For best results with React 19 and Material UI v5, use the latest available v5.x release (such as 5.15+, if/when backports land)[1][2]. For guaranteed official support, upgrade to Material UI v6.

Summary Table

@mui/material Version	Official React 19 Support	Recommendation for React 19
v5.18.0	No	Do not use
Latest v5.x (if backported)	Possibly, check release notes	Use only if docs state support
v6.x	Yes	Recommended

If you require React 19 support, do not use v5.18.0; upgrade to at least the last v5 maintenance release that declares support, or ideally v6[1][2].

Citations:

• 1: https://mui.com/blog/react-19-update/
• 2: [core] Support React 19 mui/material-ui#42381
• 3: https://mui.com/material-ui/migration/migration-v4/
• 4: https://mui.com/material-ui/migration/upgrade-to-v7/
• 5: https://mui.com/material-ui/migration/upgrade-to-v6/
• 6: https://mui.com/versions/
• 7: [@mui/styles] v5 is not compatible with React 18 mui/material-ui#32142
• 8: https://mui.com/material-ui/getting-started/installation/
• 9: https://github.com/mui/material-ui/releases

---

🌐 Web query:

Does react-native-paper ^5.14.5 support React Native 0.79?

💡 Result:

Short answer: Not reliably — react-native-paper 5.14.5 does not officially guarantee compatibility with React Native 0.79, and there are reported breakages when running Paper on RN 0.79.x.

Details and sources:

• The Paper changelog/release notes for the 5.14.x cycle mention support added for RN 0.77 but do not claim RN 0.79 support. (newreleases.io)
• There are active GitHub issues reporting runtime errors with Paper components (example: Card) on React Native 0.79.2. That indicates real incompatibilities for at least some components/use-cases. (github.com)
• React Native 0.79 introduced changes (deep import / internal API updates) that have required dependent libraries to update; some ecosystem packages have already landed fixes elsewhere (e.g., repack), but that doesn’t mean every library (including all Paper components) is free of issues yet. (reactnative.dev, github.com)
• Version 5.14.5 of react-native-paper is published, but the repo/issues indicate you should test thoroughly before upgrading production apps. (mvnrepository.com, github.com)

What I recommend

• If you can, try the upgrade in a small sandbox/repro first and exercise the Paper components you use (Buttons, Card, TextInput, Portal, etc.).
• If you hit errors, look for an open GitHub issue for that component (or open one) — there are fixes/PRs being posted and maintainers/community may have workarounds. (github.com)
• As a temporary option, either remain on a React Native version the release explicitly supports (e.g., 0.77/0.78) or pin Paper to a version you know is stable for your app until the library confirms 0.79 compatibility.

If you want, tell me:

• the Paper components you use and any error messages you see (or your package.json), and I can help check for known issues or suggest specific workarounds.

Citations:

• 1: https://newreleases.io/project/github/callstack/react-native-paper/release/v5.14.1?utm_source=chatgpt.com
• 2: https://github.com/callstack/react-native-paper/issues/4714?utm_source=chatgpt.com
• 3: https://reactnative.dev/blog/2025/04/08/react-native-0.79?utm_source=chatgpt.com
• 4: https://github.com/callstack/repack/issues/1118?utm_source=chatgpt.com
• 5: https://mvnrepository.com/artifact/org.mvnpm/react-native-paper/5.14.5?utm_source=chatgpt.com
• 6: https://github.com/callstack/react-native-paper/issues/4714?utm_source=chatgpt.com
• 7: https://github.com/callstack/react-native-paper/issues/4714?utm_source=chatgpt.com

---

Ensure peer compatibility for React 19 and React Native 0.79

Pinned dependencies here do not officially support the target React/RN versions:

• packages/design-system/package.json (lines 243–279)

• @mui/material@5.18.0 only declares peer support for React 17–18. React 19 support arrives in v6.x (and select backported v5 releases).
  • To use React 19, upgrade to @mui/material@^6.0.0 (or the final v5 maintenance release once it backports React 19).
  • Alternatively, downgrade React to ^18 until v5 adds official React 19 support.

• packages/design-system/package.json (lines 281–284)

• react-native-paper@5.14.5 isn’t tested against RN 0.79 and has known breakages.
  • Either downgrade React Native to ^0.78 or wait for a Paper release that explicitly supports RN 0.79 (and test your critical components).

Recommended action: adjust these versions (or your React/RN targets) before merging to avoid runtime or peer‐dependency issues.

🤖 Prompt for AI Agents

In packages/design-system/package.json around lines 243–279 (and lines
~281–284), the pinned UI deps are incompatible with your target React 19 and RN
0.79; update @mui/material to a React‑19 compatible release (e.g. bump to
"^6.0.0" or to the final v5 maintenance release that backports React 19) and
adjust react-native/react-native-paper pairing (either downgrade React Native to
"^0.78" or pin react-native-paper to a release that explicitly supports RN
0.79), then run install and smoke-test UI components before merging.

[coderabbitai]

🛠️ Refactor suggestion

Align ESLint runtime and types major versions

You’re pinning eslint to v8 while using @types/eslint v9. These majors usually track each other; mixing them can cause type incompatibilities when authoring rules.

Apply this diff to keep majors aligned (example pins shown; feel free to pick the exact v8 types you want):

   "dependencies": {
-    "eslint": "^8.42.0"
+    "eslint": "^8.42.0"
   },
   "devDependencies": {
     "@baseapp-frontend/tsconfig": "workspace:*",
-    "@types/eslint": "^9.6.1",
+    "@types/eslint": "^8.0.0",

Also applies to: 23-23

🤖 Prompt for AI Agents

packages/eslint-plugin/package.json lines 19 (and also lines 23): ESLint is
pinned to major v8 while @types/eslint is v9, causing possible type mismatches;
change the @types/eslint dependency to a v8 release that matches the eslint
major (e.g., @types/eslint v8.x) so majors align, update the version string
accordingly in package.json at the indicated lines, then reinstall/update
lockfile (npm/yarn/pnpm) to ensure dependencies are consistent.

[coderabbitai]

🛠️ Refactor suggestion

Move Storybook and test utilities to devDependencies

• @storybook/react should not be a runtime dependency of a GraphQL utility package.
• relay-test-utils is test-only and should be devDependency.

This reduces consumer install size and avoids bundling dev-only code.

   "dependencies": {
     "graphql": "16.11.0",
     "graphql-ws": "6.0.5",
     "isomorphic-ws": "5.0.0",
     "js-cookie": "3.0.5",
     "react-relay": "19.0.0",
     "relay-connection-handler-plus": "0.1.2",
     "relay-runtime": "19.0.0",
-    "relay-test-utils": "19.0.0",
-    "@storybook/react": "8.4.7"
+    "relay-test-utils": "19.0.0"
   },
   "peerDependencies": {
@@
   "devDependencies": {
     "@baseapp-frontend/config": "workspace:*",
     "@baseapp-frontend/tsconfig": "workspace:*",
+    "@storybook/react": "8.4.7",

If relay-test-utils is only used in tests, consider moving it similarly into devDependencies too.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"graphql": "16.11.0",
	"graphql-ws": "6.0.5",
	"isomorphic-ws": "5.0.0",
	"js-cookie": "3.0.5",
	"react-relay": "19.0.0",
	"relay-connection-handler-plus": "0.1.2",
	"relay-runtime": "19.0.0",
	"relay-test-utils": "19.0.0",
	"@storybook/react": "8.4.7"
	},
	"dependencies": {
	"graphql": "16.11.0",
	"graphql-ws": "6.0.5",
	"isomorphic-ws": "5.0.0",
	"js-cookie": "3.0.5",
	"react-relay": "19.0.0",
	"relay-connection-handler-plus": "0.1.2",
	"relay-runtime": "19.0.0",
	"relay-test-utils": "19.0.0"
	},
	"peerDependencies": {
	…
	},
	"devDependencies": {
	"@baseapp-frontend/config": "workspace:*",
	"@baseapp-frontend/tsconfig": "workspace:*",
	"@storybook/react": "8.4.7",
	…
	}

🤖 Prompt for AI Agents

packages/graphql/package.json lines 16-25: Storybook and test utilities are
declared as runtime dependencies but should be devDependencies; move
"@storybook/react" and "relay-test-utils" from "dependencies" into
"devDependencies" in package.json (or add a devDependencies section if missing),
then run package manager install/update to update lockfile and ensure no runtime
imports rely on these packages.

[coderabbitai]

Actionable comments posted: 5

♻️ Duplicate comments (1)

packages/components/tailwind.config.js (1)

1-10: Fix mixed ESM/CJS in Tailwind config — will throw at runtime

This file uses ESM import while exporting with module.exports and using require(...). Tailwind (loading this CommonJS .js config) will error with “Cannot use import statement outside a module.” Use a single module system.

Option A (safer here): keep CommonJS and switch the imports to require(...).

Apply this diff to the changed lines:

-import {
-  hideScrollbar,
-  responsiveTypography,
-} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
-
-import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
-import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
-import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
-import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
-import { typography } from '@baseapp-frontend/design-system/styles/web/typography'
+const {
+  hideScrollbar,
+  responsiveTypography,
+} = require('@baseapp-frontend/design-system/styles/web/tailwind/plugins')
+const { breakpoints } = require('@baseapp-frontend/design-system/styles/web/breakpoint')
+const { createPalette } = require('@baseapp-frontend/design-system/styles/web/palette')
+const { createCustomShadows } = require('@baseapp-frontend/design-system/styles/web/customShadow')
+const { createShadows } = require('@baseapp-frontend/design-system/styles/web/shadow')
+const { typography } = require('@baseapp-frontend/design-system/styles/web/typography')

Alternative (if you want ESM everywhere): make the config ESM and alias the design token to avoid a name clash with the typography plugin import.

Example (for illustration; touches lines outside the selected range):

// ESM at top
import {
  hideScrollbar,
  responsiveTypography,
} from '@baseapp-frontend/design-system/styles/web/tailwind/plugins'
import { breakpoints } from '@baseapp-frontend/design-system/styles/web/breakpoint'
import { createPalette } from '@baseapp-frontend/design-system/styles/web/palette'
import { createCustomShadows } from '@baseapp-frontend/design-system/styles/web/customShadow'
import { createShadows } from '@baseapp-frontend/design-system/styles/web/shadow'
import { typography as dsTypography } from '@baseapp-frontend/design-system/styles/web/typography'
import tailwindTypography from '@tailwindcss/typography'

export default {
  // ...
  theme: {
    extend: {
      typography: () => ({
        h1: { css: dsTypography.h1 },
        // ...
      }),
      // ...
    },
  },
  plugins: [tailwindTypography, responsiveTypography, hideScrollbar],
}

🧹 Nitpick comments (3)

packages/components/package.json (3)

12-13: Split lint and typecheck for speed and clarity.

Running tsc in lint slows the cycle. Consider separate scripts.

-    "lint": "eslint . --ext .tsx --ext .ts && tsc --noEmit",
+    "lint": "eslint . --ext .tsx --ext .ts",
+    "typecheck": "tsc --noEmit",

---

184-250: Remove unused build tools to trim dev install (tsup).

tsup is present but not used in scripts. If unused, drop it.

-    "tsup": "8.3.6",

If you plan to use tsup later, ignore this.

---

141-174: Question heavy web/native deps as hard dependencies (Next/Expo).

Having next, expo-router, expo-* as runtime dependencies in a shared components library forces all consumers (including RN-only or Next-only apps) to install the other stack. Prefer placing these in peerDependencies and scoping usage to per-platform subpaths.

If keeping them here is intentional due to internal monorepo constraints, consider marking them as optionalDependencies to reduce friction for external consumers.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 79f88d9 and 6b38edb.

⛔ Files ignored due to path filters (3)

• packages/components/__generated__/ActivityLogsFragment.graphql.ts is excluded by !**/__generated__/**
• packages/components/__generated__/RemoveMemberMutation.graphql.ts is excluded by !**/__generated__/**
• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (43)

• .github/workflows/deploy-github-pages.yaml (1 hunks)
• .github/workflows/main.yml (3 hunks)
• .github/workflows/release.yml (1 hunks)
• .scripts/command-utils.mjs (0 hunks)
• .scripts/copy-dts.js (0 hunks)
• README.md (3 hunks)
• package.json (1 hunks)
• packages/authentication/package.json (1 hunks)
• packages/components/.gitignore (0 hunks)
• packages/components/.scripts/build-command.mjs (0 hunks)
• packages/components/.scripts/build.mjs (0 hunks)
• packages/components/.scripts/dev-command.mjs (0 hunks)
• packages/components/README.md (0 hunks)
• packages/components/baseapp-frontend-imports.d.ts (0 hunks)
• packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx (1 hunks)
• packages/components/package.json (1 hunks)
• packages/components/tailwind.config.js (1 hunks)
• packages/config/.eslintrc.js (1 hunks)
• packages/config/package.json (1 hunks)
• packages/design-system/.gitignore (0 hunks)
• packages/design-system/.scripts/build-command.mjs (0 hunks)
• packages/design-system/.scripts/build.mjs (0 hunks)
• packages/design-system/.scripts/dev-command.mjs (0 hunks)
• packages/design-system/README.md (0 hunks)
• packages/design-system/package.json (1 hunks)
• packages/design-system/providers/web/SnackbarProvider/index.tsx (1 hunks)
• packages/design-system/styles/web/globals.ts (0 hunks)
• packages/design-system/styles/web/index.ts (0 hunks)
• packages/design-system/tests/web/index.ts (1 hunks)
• packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/types.ts (1 hunks)
• packages/design-system/tests/web/utils/index.ts (0 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts (1 hunks)
• packages/eslint-plugin/package.json (1 hunks)
• packages/graphql/package.json (1 hunks)
• packages/provider/package.json (1 hunks)
• packages/test/package.json (1 hunks)
• packages/utils/package.json (1 hunks)
• packages/wagtail/.storybook/decorators/withProviders.tsx (1 hunks)
• packages/wagtail/package.json (1 hunks)
• turbo.json (0 hunks)

💤 Files with no reviewable changes (17)

• packages/design-system/styles/web/index.ts
• packages/design-system/styles/web/globals.ts
• packages/design-system/.scripts/build.mjs
• packages/components/.scripts/dev-command.mjs
• packages/design-system/.scripts/build-command.mjs
• packages/components/.scripts/build-command.mjs
• packages/design-system/tests/web/utils/index.ts
• turbo.json
• packages/components/.scripts/build.mjs
• packages/design-system/README.md
• packages/components/baseapp-frontend-imports.d.ts
• packages/components/.gitignore
• .scripts/command-utils.mjs
• .scripts/copy-dts.js
• packages/design-system/.scripts/dev-command.mjs
• packages/design-system/.gitignore
• packages/components/README.md

✅ Files skipped from review due to trivial changes (1)

• .github/workflows/deploy-github-pages.yaml

🚧 Files skipped from review as they are similar to previous changes (23)

• packages/config/.eslintrc.js
• packages/design-system/providers/web/SnackbarProvider/index.tsx
• package.json
• packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx
• packages/eslint-plugin/package.json
• packages/design-system/tests/web/index.ts
• packages/config/package.json
• packages/utils/package.json
• packages/wagtail/.storybook/decorators/withProviders.tsx
• packages/provider/package.json
• packages/authentication/package.json
• packages/design-system/tests/web/utils/ThemeTestProvider/types.ts
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts
• .github/workflows/release.yml
• packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx
• .github/workflows/main.yml
• packages/graphql/package.json
• packages/test/package.json
• README.md
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx
• packages/wagtail/package.json
• packages/design-system/package.json
• packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Analyze (javascript)
• GitHub Check: Build and Lint Packages

🔇 Additional comments (2)

packages/components/package.json (2)

23-131: No bare root imports detected; subpath-only exports are sufficient
We searched the repo for any import … from '@baseapp-frontend/components' and found only subpath usages (e.g. …/activity-log/web) and installation instructions in README. No consumer is importing the package root, so the current exports are safe if this was intentional.

If you do need a root entrypoint, you can add:

"exports": {
+  ".": {
+    "types": "./dist/index.d.ts",
+    "default": "./dist/index.js",
+    "source": "./modules/index.ts"
+  },
  // …existing subpath exports…
}

---

163-163: Move React Native to peerDependencies

Bundling React Native inside this library can lead to duplicate RN copies and Metro resolution errors in consuming apps. It should be treated as a singleton:

• In packages/components/package.json:
– Remove
diff - "react-native": "0.79.2"
from the dependencies section.
– Add
diff + "react-native": ">=0.75 <1.0.0"
under peerDependencies.
– Add
diff + "react-native": "0.79.2"
under devDependencies (for local development).

• We searched for direct imports of react-native and found them only in native-specific modules (packages/components/modules/**/native), which is expected.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Ensure compiled JS is produced and published; add prepublish hook.

The build/dev scripts use tsc but the package exports reference TS sources (see exports block). If JS is emitted to dist (as the rm -rf dist suggests), the exports must point to JS. Also, ensure builds run before publish.

Proposed tweaks:

   "scripts": {
-    "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
-    "dev": "rm -rf dist && tsc --watch",
+    "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
+    "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build"
   },

Run this to verify tsconfig.build.json exists and where outDir points (used below to fix exports/files):

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail
jq -r '.compilerOptions.outDir // "<no outDir>"' packages/components/tsconfig.build.json || true

Length of output: 118

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- tsconfig.build.json ----"
sed -n '1,200p' packages/components/tsconfig.build.json

echo -e "\n---- package.json (scripts & exports) ----"
jq '{scripts, exports}' packages/components/package.json

Length of output: 5460

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- packages/components/tsconfig.json ----"
sed -n '1,200p' packages/components/tsconfig.json

echo -e "\n---- package.json (main, module, types, files) ----"
jq '{main, module, types, files}' packages/components/package.json

Length of output: 1217

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- package.json (main, module, types, files) ----"
jq '{main: .main, module: .module, types: .types, files: .files}' packages/components/package.json

Length of output: 406

---

Publish compiled JS and type declarations; enforce build before publishing

The current setup emits TypeScript sources (under modules/) but never publishes compiled artifacts (dist or tmp-dts). Exports still point at “.ts” files, and “files” doesn’t include the output directory. To fix:

• Add a prepublishOnly hook to run the build
• Align your build output and exports: either emit to dist or update exports to point at tmp-dts
• Update package.json “files” to include the output directory (and remove raw modules if you’re no longer publishing them)

Example patch:

--- a/packages/components/tsconfig.build.json
+++ b/packages/components/tsconfig.build.json
@@ compilerOptions
-    "outDir": "tmp-dts",
+    "outDir": "dist",

--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ "scripts": {
-    "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
+    "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
     "dev":   "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build"
@@ "files": [
-    "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
     "schema.graphql",
     "__generated__"
@@ "exports": {
-    "./shared/common": {
-      "types": "./modules/__shared__/common/index.ts",
-      "default": "./modules/__shared__/common/index.ts"
-    },
+    "./shared/common": {
+      "types": "./dist/shared/common/index.d.ts",
+      "default": "./dist/shared/common/index.js"
+    },
    // …repeat for each export entry…
}

With these changes:

• pnpm build will emit JS+declarations into dist
• Package exports reference the compiled .js and .d.ts files
• Publishing is gated on a successful build via prepublishOnly

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
	"dev": "rm -rf dist && tsc --watch",
	"scripts": {
	"build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
	"dev": "rm -rf dist && tsc --watch",
	"prepublishOnly": "pnpm build"
	},
	"files": [
	"dist",
	"tsconfig.json",
	"relay.config.js",
	"schema.graphql",
	"__generated__"
	],
	"exports": {
	"./shared/common": {
	"types": "./dist/shared/common/index.d.ts",
	"default": "./dist/shared/common/index.js"
	}
	// …repeat for each export entry…
	}

[coderabbitai]

⚠️ Potential issue

Exports point to .ts sources; runtime consumers need .js (and .d.ts) outputs.

All subpath exports set "default" to .ts and "types" to .ts. Node/webpack/Metro do not execute .ts from node_modules by default and TypeScript prefers .d.ts for "types". This will break consumers at runtime and/or type resolution.

Suggested pattern (apply to every subpath). Assuming tsc emits to dist and declaration: true:

-    "./shared/common": {
-      "types": "./modules/__shared__/common/index.ts",
-      "default": "./modules/__shared__/common/index.ts"
-    },
+    "./shared/common": {
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
-    "./shared/web": {
-      "types": "./modules/__shared__/web/index.ts",
-      "default": "./modules/__shared__/web/index.ts"
-    },
+    "./shared/web": {
+      "types": "./dist/modules/__shared__/web/index.d.ts",
+      "default": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },

Notes:

• Keep "./package.json" as-is.
• If you emit ESM/CJS separately, use "import" and "require" keys instead of a single "default".
• If you truly intend to ship TS sources, you must add a JS build target in exports for runtime and ensure d.ts exists; shipping raw .ts in "default" is not viable.

Verification script to find any .ts targets in exports:

#!/bin/bash
set -euo pipefail
jq -r '.exports | .. | select(type=="string")' packages/components/package.json | grep -n '\.ts$' && { echo "Found .ts in exports (must fix)"; exit 1; } || echo "OK: no .ts in exports strings"

🤖 Prompt for AI Agents

In packages/components/package.json lines 23-131 the exports map points to .ts
sources (both "default" and "types"), which breaks runtime consumers; change
each subpath to point "default"/"import"/"require" to the compiled .js in your
build output (e.g. dist/.../index.js) and change "types" to the corresponding
.d.ts (e.g. dist/.../index.d.ts); keep "./package.json" entry as-is, ensure your
build emits JS and declaration files to the referenced dist paths, and if you
publish both ESM and CJS provide separate "import" and "require" entries instead
of a single "default".

[coderabbitai]

⚠️ Potential issue

@storybook/react should be a devDependency, not a runtime dependency.

Storybook is tooling; shipping it to consumers bloats installs and can cause transitive conflicts.

Move it to devDependencies:

   "dependencies": {
-    "@storybook/react": "8.4.7",

   "devDependencies": {
+    "@storybook/react": "8.4.7",

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"@storybook/react": "8.4.7",
	"dependencies": {
	// …other runtime dependencies
	},
	"devDependencies": {
	"@storybook/react": "8.4.7",
	// …other development dependencies
	}

🤖 Prompt for AI Agents

In packages/components/package.json at line 151, "@storybook/react" is currently
listed as a runtime dependency but should be a devDependency; remove the
"@storybook/react" entry from "dependencies" and add the same version under
"devDependencies" instead, then run your package manager (npm/yarn/pnpm) to
update the lockfile so consumers won't receive Storybook as a shipped
dependency.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

React 19 peer pin: confirm ecosystem compatibility.

You pin react and react-dom to 19.1.0. Ensure all dependencies (MUI 5.x, @mui/x-date-pickers 7.x, react-relay 19, Storybook 8.x, zustand 5) officially support React 19; otherwise consider widening the range (e.g., ">=18.2 <20") to avoid blocking consumers.

Script to surface declared peer ranges of key libs:

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail
for pkg in @mui/material @mui/x-date-pickers react-relay zustand @storybook/react; do
  echo "== $pkg peer deps =="
  node -e "console.log(require(require('path').join('packages/components/node_modules','$pkg','package.json')).peerDependencies || {})" || true
done

Length of output: 6103

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "== Current peerDependencies in packages/components/package.json =="
jq '.peerDependencies' packages/components/package.json

echo
for pkg in "@mui/material" "@mui/x-date-pickers" "react-relay" "zustand" "@storybook/react"; do
  version=$(jq -r --arg pkg "$pkg" '.dependencies[$pkg] // .peerDependencies[$pkg] // empty' packages/components/package.json)
  if [[ -z "$version" ]]; then
    echo "== Skipping $pkg: not declared in deps or peerDeps =="
    continue
  fi
  echo "== $pkg@$version peerDependencies from npm =="
  npm view "$pkg@$version" peerDependencies --json || echo "  (no peerDependencies or fetch failed)"
  echo
done

Length of output: 3605

---

Ensure React 19 pin doesn’t break key dependencies

Our peerDependencies currently pin React and React-DOM to 19.1.0, but two core libs lack stable React 19 support:

• @mui/x-date-pickers@7.6.2 peerDependencies only allow ^17 || ^18
• @storybook/react@8.4.7 peerDependencies allow React ^19.0.0-beta only (no stable 19.x)

Action items:
• In packages/components/package.json (around lines 180–182), replace the hard pins

 "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20",
  …
 }

• Once both @mui/x-date-pickers and @storybook/react officially support stable React 19, you can tighten this range (e.g., ^19.0.0) or bump the minimum.

This change prevents consumers from being blocked by mismatched peer ranges.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"react": "19.1.0",
	"react-dom": "19.1.0"
	},
	"react": ">=18.2 <20",
	"react-dom": ">=18.2 <20",
	},

🤖 Prompt for AI Agents

In packages/components/package.json around lines 180–182, the React and
React-DOM fields are hard-pinned to "19.1.0"; change these to a permissive
semver range (for example ">=17 <20") so consumers using React 17, 18, or future
React 19 releases aren't blocked by peerDependency mismatches with
@mui/x-date-pickers and @storybook/react; once those libs officially support
stable React 19, tighten the ranges (e.g., ^19.0.0) or bump the minimum.

[coderabbitai]

Actionable comments posted: 5

♻️ Duplicate comments (9)

packages/components/package.json (5)

23-31: Exports point to .ts sources; runtime consumers need .js outputs (or explicit JIT support).

Node/bundlers won’t execute .ts from node_modules by default. Either point exports to compiled JS + d.ts in dist or formally adopt JIT with proper conditions/config in consumers.

Recommended (compiled):

     "./shared/common": {
-      "types": "./modules/__shared__/common/index.ts",
-      "default": "./modules/__shared__/common/index.ts"
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
     },

Apply the same pattern to every subpath. Also ensure tsc emits declarations to dist.

If you truly want JIT:

• Keep “default” pointing at .ts but add a “source” condition, and ensure all consumers transpile this package.
• Prefer mapping “types” to .d.ts (not .ts) for faster editor perf. Emit d.ts alongside sources and point to those.
  Run the verification script in my previous comment to confirm consumer setup.

---

134-139: Publish compiled artifacts: include dist (if switching exports to dist).

If you adopt compiled outputs in exports, add “dist” to files so consumers get runtime JS and d.ts.

   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
     "schema.graphql",
     "__generated__"
   ],

---

151-151: Move Storybook to devDependencies.

Storybook is tooling; shipping it bloats consumer installs and may cause conflicts.

   "dependencies": {
-    "@storybook/react": "8.4.7",

   "devDependencies": {
+    "@storybook/react": "8.4.7",

---

180-182: Relax React peer range to avoid ecosystem conflicts.

Pinning to 19.1.0 will block consumers and conflicts with libs that haven’t declared React 19 support.

   "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   },

Once all peers officially support React 19, tighten to ^19.

---

7-14: Enforce compiled build before publish

Repository-wide checks found no Next.js transpilePackages entries, no Jest transforms or Storybook configs that would handle shipping TS sources from @baseapp-frontend/components. Publishing raw TS will break consumer apps.

• packages/components/package.json: add a prepublish hook

--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ "scripts": {
     "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build",
     "relay": "relay-compiler",
     "relay:download-schema": "dotenv -- bash -c 'get-graphql-schema \"$NEXT_PUBLIC_RELAY_ENDPOINT\" > schema.graphql'",
     "relay:update-schema": "pnpm relay:download-schema && pnpm relay",

If you truly intend a JIT-only package (shipping TS), you’ll need to update every consumer to:

• include @baseapp-frontend/components in Next.js transpilePackages
• adjust Jest’s transformIgnorePatterns (and/or ts-jest/babel-jest)
• enable TypeScript transforms in any Storybook config

packages/design-system/package.json (4)

5-5: Don’t tree-shake CSS: declare side-effectful CSS.

With sideEffects: false, bundlers may drop imported CSS. Whitelist CSS globs.

-  "sideEffects": false,
+  "sideEffects": [
+    "*.css"
+  ],

If you emit to dist, refine globs (e.g., "dist/**/*.css").

---

16-230: Exports map to .ts sources; this will break consumers not transpiling node_modules.

Either point to compiled JS/.d.ts in dist (recommended) or fully document and enforce JIT (consumer transpilation).

Recommended (compiled) example (apply to all entries):

     "./components/native/appbars": {
-      "types": "./components/native/appbars/index.ts",
-      "default": "./components/native/appbars/index.ts"
+      "types": "./dist/components/native/appbars/index.d.ts",
+      "default": "./dist/components/native/appbars/index.js",
+      "source": "./components/native/appbars/index.ts"
     },

If staying JIT, emit .d.ts and map “types” to .d.ts; add a “source” condition, and ensure all consumers are configured (Next.js transpilePackages, Jest/Storybook transforms).

---

233-241: Include dist in published files (if exports point to dist).

So compiled JS and d.ts are shipped.

   "files": [
     "components",
     "hooks",
     "layouts",
     "providers",
     "styles",
     "tests",
     "utils",
-    "tsconfig.json"
+    "tsconfig.json",
+    "dist"
   ],

---

282-284: Relax React peer range to avoid blocking consumers.

Pinning to 19.1.0 is risky given many peers still advertise <=18.

   "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   },

🧹 Nitpick comments (8)

packages/utils/package.json (4)

26-26: Consider moving framework packages to peerDependencies (Next.js, React Native)

Frameworks should usually be peers so the app dictates the versions, preventing duplicate installs and bundler conflicts. Keeping them in dependencies in a shared utils package risks multiple copies and version skew.

Suggested change:

   "dependencies": {
     "axios": "1.9.0",
     "events": "^3.3.0",
     "expo-constants": "~17.1.6",
     "expo-secure-store": "~14.2.3",
     "humps": "^2.0.1",
     "js-cookie": "3.0.5",
     "jwt-decode": "^4.0.0",
     "lodash": "4.17.21",
     "luxon": "3.6.1",
-    "next": "^15.3.2",
     "qs": "^6.14.0",
     "react-hook-form": "7.56.4",
-    "react-native": "0.79.2",
     "server-only": "^0.0.1",
     "zustand": "5.0.4"
   },
   "peerDependencies": {
-    "react": "19.1.0"
+    "react": "^19.0.0",
+    "next": "^15.3.2",
+    "react-native": "^0.79.0"
   },

If these peers are optional (utils only conditionally imports them), consider marking them optional to improve DX:

"peerDependenciesMeta": {
  "next": { "optional": true },
  "react-native": { "optional": true }
}

Also applies to: 29-29, 33-35

---

16-32: Version specifiers are mixed (exact, caret, tilde) — align on a policy

You’re pinning some packages exactly (axios, lodash, luxon, zustand), while others use caret/tilde (events, next, qs). In a workspace, mixing can cause unpredictable diff behavior between packages. Consider a consistent policy (e.g., exact pins for libs + renovate-bot, or caret for app-layer and exact for infra-critical deps).

---

29-29: React Native should typically be a peer for shared libraries

Having react-native as a direct dependency can create duplicate RN versions in apps, causing Metro/Gradle issues. Recommend making it a peer (possibly optional) in shared packages.

---

26-26: Next.js runtime import detected in utils – consider moving to peerDependency

The getTokenSSR helper in packages/utils/functions/token/getTokenSSR/index.ts imports from next/headers, which means Next.js is a true runtime dependency of this package. To avoid pulling Next into non-Next consumers, you can:

• In packages/utils/package.json, remove "next": "^15.3.2" from dependencies
• Add "next": "^15.3.2" under peerDependencies so consuming apps must provide it
• Add "next": "^15.3.2" under devDependencies to satisfy your tests

This change ensures Next.js isn’t bundled for projects that don’t use it, while keeping your Next-specific helpers functional.

packages/components/tsconfig.build.json (1)

3-3: Exclude Cypress .ts specs too (not only .tsx).

You’re excluding “.cy.tsx” but not “.cy.ts”. TS will try to compile Cypress TS spec files otherwise.

-  "exclude": ["node_modules", "cypress", "jest", "**/*.test.ts", "**/*.test.tsx", "**/*.cy.tsx"]
+  "exclude": ["node_modules", "cypress", "jest", "**/*.test.ts", "**/*.test.tsx", "**/*.cy.ts", "**/*.cy.tsx"]

Optional: if Storybook stories live alongside sources and should be excluded from builds, consider adding "**/*.stories.ts", "**/*.stories.tsx".

README.md (1)

145-146: Nit: Clarify which commit hash to use.

Say “the commit that contains the package changes you want to consume” to avoid ambiguity when multiple commits exist.

-  Push the code to GitHub and copy the last commit hash. You’ll need this hash to point your consumer app to the correct version of the package.
+  Push the code to GitHub and copy the commit hash that includes the package changes you want to consume. You’ll need this hash to point your consumer app to the correct version of the package.

packages/design-system/tsconfig.build.json (1)

3-3: Also exclude Cypress .ts spec files.

Mirror the components tsconfig: exclude “.cy.ts” too, not only “.cy.tsx”.

-  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx", "**/*.cy.tsx"]
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx", "**/*.cy.ts", "**/*.cy.tsx"]

packages/components/package.json (1)

163-163: Library should not depend on react-native at runtime; make it a peerDependency.

Bundling react-native as a dependency risks duplicate installations and version skew. Prefer peerDependency with a compatible range.

   "dependencies": {
-    "react-native": "0.79.2",

   "peerDependencies": {
+    "react-native": ">=0.78 <0.80",

Adjust the range per your support policy.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 6b38edb and aa09452.

⛔ Files ignored due to path filters (3)

• packages/components/__generated__/ActivityLogsFragment.graphql.ts is excluded by !**/__generated__/**
• packages/components/__generated__/RemoveMemberMutation.graphql.ts is excluded by !**/__generated__/**
• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (45)

• .github/workflows/deploy-github-pages.yaml (1 hunks)
• .github/workflows/main.yml (3 hunks)
• .github/workflows/release.yml (1 hunks)
• .scripts/command-utils.mjs (0 hunks)
• .scripts/copy-dts.js (0 hunks)
• README.md (3 hunks)
• package.json (1 hunks)
• packages/authentication/package.json (1 hunks)
• packages/components/.gitignore (0 hunks)
• packages/components/.scripts/build-command.mjs (0 hunks)
• packages/components/.scripts/build.mjs (0 hunks)
• packages/components/.scripts/dev-command.mjs (0 hunks)
• packages/components/README.md (0 hunks)
• packages/components/baseapp-frontend-imports.d.ts (0 hunks)
• packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx (1 hunks)
• packages/components/package.json (1 hunks)
• packages/components/tailwind.config.js (1 hunks)
• packages/components/tsconfig.build.json (1 hunks)
• packages/config/.eslintrc.js (1 hunks)
• packages/config/package.json (1 hunks)
• packages/design-system/.gitignore (0 hunks)
• packages/design-system/.scripts/build-command.mjs (0 hunks)
• packages/design-system/.scripts/build.mjs (0 hunks)
• packages/design-system/.scripts/dev-command.mjs (0 hunks)
• packages/design-system/README.md (0 hunks)
• packages/design-system/package.json (1 hunks)
• packages/design-system/providers/web/SnackbarProvider/index.tsx (1 hunks)
• packages/design-system/styles/web/globals.ts (0 hunks)
• packages/design-system/styles/web/index.ts (0 hunks)
• packages/design-system/tests/web/index.ts (1 hunks)
• packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/ThemeTestProvider/types.ts (1 hunks)
• packages/design-system/tests/web/utils/index.ts (0 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx (1 hunks)
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts (1 hunks)
• packages/design-system/tsconfig.build.json (1 hunks)
• packages/eslint-plugin/package.json (1 hunks)
• packages/graphql/package.json (1 hunks)
• packages/provider/package.json (1 hunks)
• packages/test/package.json (1 hunks)
• packages/utils/package.json (1 hunks)
• packages/wagtail/.storybook/decorators/withProviders.tsx (1 hunks)
• packages/wagtail/package.json (1 hunks)
• turbo.json (0 hunks)

💤 Files with no reviewable changes (17)

• packages/components/.gitignore
• packages/design-system/styles/web/index.ts
• .scripts/copy-dts.js
• packages/components/baseapp-frontend-imports.d.ts
• .scripts/command-utils.mjs
• turbo.json
• packages/design-system/.scripts/build.mjs
• packages/design-system/styles/web/globals.ts
• packages/components/.scripts/build.mjs
• packages/design-system/README.md
• packages/design-system/.gitignore
• packages/design-system/.scripts/dev-command.mjs
• packages/components/README.md
• packages/components/.scripts/build-command.mjs
• packages/design-system/tests/web/utils/index.ts
• packages/design-system/.scripts/build-command.mjs
• packages/components/.scripts/dev-command.mjs

✅ Files skipped from review due to trivial changes (1)

• package.json

🚧 Files skipped from review as they are similar to previous changes (20)

• packages/provider/package.json
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/types.ts
• packages/design-system/tests/web/utils/ThemeTestProvider/index.tsx
• packages/components/modules/tests/web/utils/withComponentCompleteTestProviders/index.tsx
• packages/config/.eslintrc.js
• packages/eslint-plugin/package.json
• .github/workflows/deploy-github-pages.yaml
• packages/design-system/tests/web/utils/ReactSuspenseWithLoading/index.tsx
• .github/workflows/release.yml
• packages/graphql/package.json
• packages/test/package.json
• packages/config/package.json
• packages/design-system/tests/web/utils/withDesignSystemTestProviders/index.tsx
• packages/design-system/tests/web/index.ts
• .github/workflows/main.yml
• packages/authentication/package.json
• packages/design-system/tests/web/utils/ThemeTestProvider/types.ts
• packages/components/tailwind.config.js
• packages/design-system/providers/web/SnackbarProvider/index.tsx
• packages/wagtail/package.json

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Analyze (javascript)
• GitHub Check: Build and Lint Packages

🔇 Additional comments (7)

packages/wagtail/.storybook/decorators/withProviders.tsx (2)

7-7: Confirm compose wrapping order is intentional.

Depending on compose semantics (commonly right-to-left), this yields withGraphqlTestProviders(withDesignSystemTestProviders(x)). If your desired outer/inner provider order differs, adjust the argument order accordingly.

---

3-3: Import path update validated

• No remaining imports from @baseapp-frontend/design-system/tests/web/utils found across the repo.
• withDesignSystemTestProviders is correctly re-exported from packages/design-system/tests/web/index.ts.

All checks passed—this change is good to merge.

packages/utils/package.json (3)

19-21: Verify and align Expo package versions across the monorepo

I didn’t find any sdkVersion declarations in your app configs, but these Expo-coupled libraries are spread across several packages with differing major versions:

• packages/utils/package.json
• expo-constants@~17.1.6
• expo-secure-store@~14.2.3

• packages/components/package.json
• expo-file-system@~18.1.10
• expo-image-picker@~16.1.4
• expo-router@~5.0.7

• packages/design-system/package.json
• expo-image-picker@~16.1.4
• expo-router@~5.0.7

Mixing Expo package majors (e.g. 14.x, 16.x, 17.x, 18.x) can lead to mismatched native modules or subtle runtime issues. Please:

• Confirm which Expo SDK version (e.g. 49) your apps target.
• Align all Expo-prefixed dependencies to the corresponding major version for that SDK across every package.

---

31-31: Zustand v5 upgrade: audit all store‐creation & hook call sites

I ran a repo scan and found no direct uses of persist, devtools, or immer, but multiple createStore/create and useStore imports across your utils, design-system, components, and auth modules. Before shipping v5, please manually verify each of these patterns against the v5 API:

• packages/utils/hooks/useNotification/index.tsx
• packages/utils/hooks/useCookie/{index.tsx, store.ts}
• packages/design-system/hooks/web/useUISettings/{index.tsx, store.ts}
• packages/components/modules/messages/{…}/ChatRoomProvider & useChatRoom
• packages/components/modules/comments/{…}/CommentReplyProvider & useCommentReply
• packages/authentication/modules/profile/useCurrentProfile/{index.tsx, store.ts}

Key areas to confirm:

• Store creation vs. hook binding (v5 splits vanilla createStore from the React-hook create).
• Correct import paths/types for any middleware you intend to use (e.g. import { persist } from 'zustand/middleware').
• Updated TypeScript typings for selectors and store APIs in useStore.

Please review these call sites and adjust for any v5 breaking changes.

---

40-58: No local Jest config in packages/utils; suggestion not applicable

The packages/utils package declares Jest and ts-jest in its devDependencies but contains no jest.config.* files or test suites—testing is handled centrally in packages/test with its own Jest setup. There’s nothing here that requires additional ts-jest presets, transforms, or ESM flags.

Likely an incorrect or invalid review comment.

README.md (1)

91-95: LGTM: Simplified dev flow is clear.

Moving to a single “pnpm dev” entry point aligns with the PR’s JIT direction. No issues.

packages/components/package.json (1)

211-216: Verify @types/react-relay version vs react-relay 19.

You have react-relay 19.0.0 but @types/react-relay 18.2.1. Confirm whether react-relay ships its own types (if yes, drop @types package) or bump the types package if a matching version exists.

[coderabbitai]

🛠️ Refactor suggestion

Run builds before publish; align with publish strategy.

Add a prepublishOnly hook. If you move exports to dist, ensure tsc emits declarations and JS.

   "scripts": {
     "build": "rm -rf dist && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build",

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"build": "rm -rf dist && tsc --build tsconfig.build.json",
	"dev": "rm -rf dist && tsc --watch",
	"lint": "eslint . --ext .tsx --ext .ts && tsc --noEmit",
	"clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
	"clean": "rm -rf .turbo && rm -rf node_modules",
	"storybook": "storybook dev -p 6006",
	"storybook:build": "storybook build",
	"test:unit": "jest --config ./jest.config.ts",
	"prepublishOnly": "pnpm run build"
	"test:unit": "jest --config ./jest.config.ts"
	},
	"scripts": {
	"build": "rm -rf dist && tsc --build tsconfig.build.json",
	"dev": "rm -rf dist && tsc --watch",
	"prepublishOnly": "pnpm build",
	"lint": "eslint . --ext .tsx --ext .ts && tsc --noEmit",
	"clean": "rm -rf .turbo && rm -rf node_modules",
	"storybook": "storybook dev -p 6006",
	"storybook:build": "storybook build",
	"test:unit": "jest --config ./jest.config.ts"
	},

🤖 Prompt for AI Agents

In packages/design-system/package.json around lines 7-14, add a prepublishOnly
script to run the build before publishing and ensure the distribution output
contains both JS and type declarations; update the build step to run tsc --build
(tsconfig.build.json) and confirm tsconfig.build.json has "declaration": true
and "outDir": "dist" (and any composite/project refs set correctly) so tsc emits
.d.ts and JS into dist, and update package exports/entry points to reference
files under dist before publishing.

[coderabbitai]

⚠️ Potential issue

Version mismatch: @mui/material-nextjs@6 with @mui/material@5.

Material Next.js integration v6 expects MUI v6. Running it with v5 risks runtime/typing incompatibilities.

Actions:

• Either upgrade MUI to v6 across the board (preferred), or
• Downgrade @mui/material-nextjs to the last version that supports MUI v5 (if any).

[coderabbitai]

🛠️ Refactor suggestion

Move Storybook to devDependencies.

Storybook should not be a runtime dependency of a design-system library.

   "dependencies": {
-    "@storybook/react": "8.4.7",

   "devDependencies": {
+    "@storybook/react": "8.4.7",

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"@storybook/react": "8.4.7",
	"dependencies": {
	// …other dependencies (remove Storybook)
	},
	"devDependencies": {
	"@storybook/react": "8.4.7",
	// …other devDependencies
	},

🤖 Prompt for AI Agents

In packages/design-system/package.json around line 259, the Storybook dependency
("@storybook/react": "8.4.7") is currently listed in dependencies and should be
moved to devDependencies; edit package.json to remove the entry from
"dependencies" and add the same "@storybook/react": "8.4.7" entry under
"devDependencies", then run package manager install (npm/yarn/pnpm) to update
the lockfile and ensure no runtime bundle includes Storybook.

[coderabbitai]

🛠️ Refactor suggestion

Widen React peerDependency to a range to avoid install conflicts

Pinning the peer to an exact version forces consumers to match 19.1.0 exactly, which is brittle (patch/minor upgrades in the same major will fail). Prefer a caret range for peers.

Apply this diff:

   "peerDependencies": {
-    "react": "19.1.0"
+    "react": "^19.0.0"
   },

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"react": "19.1.0"
	},
	"peerDependencies": {
	"react": "^19.0.0"
	},

🤖 Prompt for AI Agents

In packages/utils/package.json around lines 34-35, the peerDependency for react
is pinned to an exact version ("19.1.0"); update it to a range (for example
"^19.1.0" or ">=19.1.0 <20.0.0") so consumers can install compatible patch/minor
releases without conflict, then run your package manager's install/lockfile
update to persist the change.

[coderabbitai]

⚠️ Potential issue

Fix Markdown link syntax.

The link text/URL are inverted.

-    Refer to the (Restore Catalog Entries)[https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries] section to reapply catalog entries.
+    Refer to the [Restore Catalog Entries](https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries) section to reapply catalog entries.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	Refer to the (Restore Catalog Entries)[https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries] section to reapply catalog entries.
	Refer to the [Restore Catalog Entries](https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries) section to reapply catalog entries.

🧰 Tools

🪛 markdownlint-cli2 (0.17.2)

161-161: Reversed link syntax
(Restore Catalog Entries)[https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries]

(MD011, no-reversed-links)

🤖 Prompt for AI Agents

In README.md around lines 161 to 162, the Markdown link uses the inverted syntax
"(Text)[URL]" instead of "[Text](URL)"; update the line to use standard Markdown
by placing the link text in square brackets followed by the URL in parentheses
(e.g., [Restore Catalog
Entries](https://github.com/silverlogic/baseapp-frontend/blob/master/README.md#restore-catalog-entries))
so the link renders correctly.

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (4)

.github/workflows/main.yml (4)

24-27: pnpm 10.14.0 bump is consistent across jobs; enable built-in pnpm cache to speed CI (30–60% faster installs).

Looks good to pin pnpm. Consider enabling pnpm cache via pnpm/action-setup to avoid re-downloading the store every run.

Apply this diff to each “Setup pnpm” step:

 uses: pnpm/action-setup@v4
 with:
   version: 10.14.0
+  cache: true

Additional hardening (optional):

• Pin actions to commit SHAs instead of tags (@v4, @v1) per security best practices.
• Add a least-privilege permissions block at workflow/job level.

Example (top-level):

permissions:
  contents: read

Also applies to: 50-53, 73-76

---

78-84: Refine Cypress cache key to reduce misses and make it version-aware.

The current key is tied to OS and pnpm lockfile. Adding Cypress config and package.json improves hit rates while still invalidating on Cypress upgrades.

Apply this diff:

       uses: actions/cache@v4
       with:
         path: ~/.cache/Cypress
-        key: cypress-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
+        key: cypress-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml', '**/cypress.config.*', '**/package.json') }}
         restore-keys: |
           cypress-${{ runner.os }}-

If you want to be explicit and consistent about the cache path everywhere, set it once at the job level:

# under `test-component:` (job)
env:
  CYPRESS_CACHE_FOLDER: ~/.cache/Cypress

---

94-95: Pin Chrome to a major version to avoid surprise breakages from auto-updates.

CI will always get the latest stable; tests can suddenly fail when Chrome updates. Pinning a major version stabilizes runs and you can upgrade intentionally.

Example:

-uses: browser-actions/setup-chrome@v1
+uses: browser-actions/setup-chrome@v1
+with:
+  chrome-version: 128 # pin a known-good major; update intentionally later

If using the Cypress action, you can omit this step altogether (it auto-detects installed browsers and works with the system Chrome).

---

89-93: Use the official Cypress GitHub Action to simplify caching, binary install, and browser setup

Your existing steps work correctly—you manually cache ~/.cache/Cypress, run npx cypress install, then spin up Chrome before invoking your component tests. However, you can collapse those four steps into a single, maintained action that automatically handles caching, diagnostics, and browser dependencies.

• Current workflow (lines 89–93 in .github/workflows/main.yml)

- name: Cache Cypress binary
  uses: actions/cache@v4
  with:
    path: ~/.cache/Cypress
    key: cypress-${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
    restore-keys: |
      cypress-${{ runner.os }}-
- name: Install Dependencies
  run: pnpm install --frozen-lockfile
- name: Install Cypress binary (if needed)
  run: npx cypress install
  env:
    CYPRESS_CACHE_FOLDER: ~/.cache/Cypress
- name: Setup Chrome
  uses: browser-actions/setup-chrome@v1
- name: Component Test
  run: pnpm test:component

• Simplified alternative using the official action

- name: Cypress Component Tests
  uses: cypress-io/github-action@v6
  with:
    component: true
    browser: chrome
    headed: true           # omit or set headed: false to run headless
  env:
    CYPRESS_CACHE_FOLDER: ~/.cache/Cypress

This single step will:

• Download and cache the Cypress binary
• Install dependencies and any required browsers
• Run cypress run --component --browser chrome --headed under the hood (matching your pnpm test:component script)

If you prefer to retain granular control, your manual steps are perfectly valid—just ensure you’re running in headless mode (or explicitly using --headed as you already do). Otherwise, switching to the Cypress Action reduces maintenance overhead and improves CI resilience.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between aa09452 and 88a5121.

📒 Files selected for processing (1)

• .github/workflows/main.yml (3 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: Analyze (javascript)
• GitHub Check: Unit Test Packages
• GitHub Check: Build and Lint Packages

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (5)

.github/workflows/main.yml (5)

27-27: Centralize pnpm version and verify lockfile compatibility with v10.14.0

Good to see pnpm bumped consistently. Two suggestions:

• Avoid triplicating the version by defining it once and referencing it, which reduces drift.
• Please confirm the repo’s packageManager field and pnpm-lock.yaml are compatible with pnpm 10 (lockfile v9). A mismatch will break --frozen-lockfile.

Apply this diff to reference a single env var in the three jobs:

-      - name: Setup pnpm
-        uses: pnpm/action-setup@v4
-        with:
-          version: 10.14.0
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: ${{ env.PNPM_VERSION }}

Add these at the workflow root (outside jobs) to define the shared versions:

# top-level (e.g., right under `name:`)
env:
  PNPM_VERSION: '10.14.0'
  CYPRESS_VERSION: '13.16.1' # used below in cache key and verification

Optional speed-up: enable dependency caching via setup-node:

-      - name: Setup Node.js 20.17.0
+      - name: Setup Node.js 20.17.0
         uses: actions/setup-node@v4
         with:
           node-version: 20.17.0
+          cache: 'pnpm'
+          cache-dependency-path: 'pnpm-lock.yaml'

Also applies to: 53-53, 76-76

---

78-83: Make Cypress cache path explicit and key parametric

Two small tweaks make the cache more robust and self-documenting:

• Use $HOME to avoid relying on tilde expansion within the cache action.
• Parameterize the key with a single CYPRESS_VERSION env var so the version isn’t hard-coded in multiple places.

-      - name: Cache Cypress binary
-        uses: actions/cache@v4
-        with:
-          path: ~/.cache/Cypress
-          key: cypress-${{ runner.os }}-13.16.1
+      - name: Cache Cypress binary
+        uses: actions/cache@v4
+        with:
+          path: ${{ env.HOME }}/.cache/Cypress
+          key: cypress-${{ runner.os }}-${{ env.CYPRESS_VERSION }}

---

87-95: Run a proper Cypress verification and scope env var once

• After installing the binary, run cypress verify to ensure the binary is healthy on the runner. This is more reliable than manual file checks in a later step.
• You’re exporting CYPRESS_CACHE_FOLDER only for this step. Consider defining it once at the job level to keep all Cypress steps consistent.

Minimal change to add verification:

       - name: Install Cypress binary (components workspace)
         run: |
           pnpm --filter @baseapp-frontend/components exec cypress cache path
           pnpm --filter @baseapp-frontend/components exec cypress cache list || true
           pnpm --filter @baseapp-frontend/components exec cypress install
-          pnpm --filter @baseapp-frontend/components exec cypress cache list
+          pnpm --filter @baseapp-frontend/components exec cypress cache list
+          pnpm --filter @baseapp-frontend/components exec cypress verify
         env:
-          CYPRESS_CACHE_FOLDER: ~/.cache/Cypress
+          CYPRESS_CACHE_FOLDER: ${{ env.HOME }}/.cache/Cypress

Optional: move the env var to the job so all Cypress steps inherit it:

# under `test-component:` job
env:
  CYPRESS_CACHE_FOLDER: ${{ env.HOME }}/.cache/Cypress

---

96-98: Pin Chrome channel for reproducibility

Explicitly pin the Chrome channel to avoid surprises when the default moves.

-      - name: Setup Chrome
-        uses: browser-actions/setup-chrome@v1
+      - name: Setup Chrome
+        uses: browser-actions/setup-chrome@v1
+        with:
+          chrome-version: stable

---

99-104: Avoid hard-coding Cypress version in the verify step

The check currently hard-codes 13.16.1 and duplicates the path logic. Either:

• Replace this with cypress verify (preferred; see prior comment), or
• Derive the binary path dynamically from the cache path so it keeps working after a version bump.

Option A (replace with verify — simplest):

-      - name: Verify Cypress binary exists
-        run: |
-          ls -la ~/.cache/Cypress || true
-          ls -la ~/.cache/Cypress/13.16.1/Cypress || true
-          test -x ~/.cache/Cypress/13.16.1/Cypress/Cypress
+      - name: Verify Cypress binary
+        run: pnpm --filter @baseapp-frontend/components exec cypress verify

Option B (derive the binary path):

-      - name: Verify Cypress binary exists
-        run: |
-          ls -la ~/.cache/Cypress || true
-          ls -la ~/.cache/Cypress/13.16.1/Cypress || true
-          test -x ~/.cache/Cypress/13.16.1/Cypress/Cypress
+      - name: Verify Cypress binary exists
+        run: |
+          CYP_CACHE_DIR="$(pnpm --filter @baseapp-frontend/components exec cypress cache path)"
+          echo "Cypress cache dir: $CYP_CACHE_DIR"
+          BIN="$(ls -d "$CYP_CACHE_DIR"/*/Cypress/Cypress | head -1)"
+          test -x "$BIN"
+          echo "Cypress binary: $BIN"

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 88a5121 and c8817a2.

📒 Files selected for processing (1)

• .github/workflows/main.yml (3 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: Analyze (javascript)
• GitHub Check: Component Test Packages
• GitHub Check: Build and Lint Packages

[coderabbitai]

Actionable comments posted: 0

♻️ Duplicate comments (5)

packages/components/package.json (5)

141-174: Move build-time tooling to devDependencies; consider peering app frameworks

• @storybook/react is a tool, not a runtime dep; move it to devDependencies.
• Consider peering large app frameworks (next, expo-*) and platform libs (react-native) to avoid forcing installs in environments that don’t need them. If certain subpath exports require them, mark as peer + optionalPeer and document.

   "dependencies": {
     ...
-    "@storybook/react": "8.4.7",
     ...
-    "next": "^15.3.2",
-    "expo-file-system": "~18.1.10",
-    "expo-image-picker": "~16.1.4",
-    "expo-router": "~5.0.7",
+    // consider moving these to peerDependencies (and possibly mark as optional)
+    // "next": "^15.3.2",
+    // "expo-file-system": "~18.1.10",
+    // "expo-image-picker": "~16.1.4",
+    // "expo-router": "~5.0.7",
     ...
-    "react-native": "0.79.2",
+    // consider peerDependency for react-native as well
+    // "react-native": "0.79.2",
     ...
   },
   "devDependencies": {
+    "@storybook/react": "8.4.7",

If you decide to keep Next/Expo/RN as peers, add ranges under peerDependencies and (optionally) peerDependenciesMeta to mark optional peers for platform-specific subpaths.

---

7-8: Add a prepublishOnly hook to guarantee compiled artifacts are shipped

Right now nothing enforces a build before publish. If you intend to ship compiled JS/typings, this will produce broken releases.

Apply:

   "scripts": {
     "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build"
   },

Verification script to ensure a non-empty outDir and emitted files exist:

#!/bin/bash
set -euo pipefail
jq -r '.compilerOptions.outDir // "<no outDir>"' packages/components/tsconfig.build.json

---

23-131: Exports target .ts sources; point to compiled .js and .d.ts instead

Node/bundlers won’t execute TypeScript from node_modules; TS expects .d.ts for “types”. Shipping .ts in exports will break consumers at runtime and type resolution.

Pattern to apply to every subpath (showing two examples; repeat for all):

   "exports": {
     "./package.json": "./package.json",
-    "./shared/common": {
-      "types": "./modules/__shared__/common/index.ts",
-      "default": "./modules/__shared__/common/index.ts"
-    },
+    "./shared/common": {
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
-    "./shared/web": {
-      "types": "./modules/__shared__/web/index.ts",
-      "default": "./modules/__shared__/web/index.ts"
-    },
+    "./shared/web": {
+      "types": "./dist/modules/__shared__/web/index.d.ts",
+      "default": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },
     ...
   }

If you truly intend to ship TS sources, add parallel runtime entries that point to compiled JS and ensure declarations exist; leaving only .ts will not work.

Quick check to catch any .ts targets left in exports:

#!/bin/bash
set -euo pipefail
jq -r '.exports | .. | select(type=="string")' packages/components/package.json | grep -n '\.ts$' && { echo "Found .ts in exports (must fix)"; exit 1; } || echo "OK"

---

134-139: Publish compiled output directory

The “files” list omits dist, so even if you compile, consumers won’t receive runtime JS/typings.

   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
     "schema.graphql",
     "__generated__"
   ],

---

180-181: Relax React peer ranges for ecosystem compatibility

Pinning to 19.1.0 conflicts with libs that don’t yet allow stable React 19 or allow only ^17/18. Use a permissive range until all peers catch up.

   "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   }

🧹 Nitpick comments (1)

packages/components/package.json (1)

12-13: Include build artifacts in clean step

Dev/CI “clean” should wipe build outputs to avoid stale artifacts.

-    "clean": "rm -rf .turbo && rm -rf node_modules",
+    "clean": "rm -rf .turbo node_modules dist tmp-dts",

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between c8817a2 and a6d4f72.

📒 Files selected for processing (1)

• packages/components/package.json (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: Analyze (javascript)
• GitHub Check: Component Test Packages
• GitHub Check: Build and Lint Packages

🔇 Additional comments (2)

packages/components/package.json (2)

19-20: LGTM: component and unit test scripts are clear

Cypress runs are pinned to Chrome and headed; unit tests use Jest config. No action needed.

---

185-249: Dev toolchain versions look consistent

Babel/Jest/TS/Storybook/Relay versions align and match usage. Keep @types/react* aligned with your chosen peer range; dev-only is fine even if peers allow React 18.

If you relax React peer ranges, confirm local Storybook and test builds still type-check by running eslint/tsc.

[coderabbitai]

Actionable comments posted: 5

♻️ Duplicate comments (9)

packages/components/package.json (4)

99-100: Relax React peer pins to avoid ecosystem conflicts (MUI v5 + React 19).

Pinned "19.1.0" risks peer clashes with MUI v5 and other libs. Prefer a range.

   "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   },

To surface peer ranges of key UI deps:

#!/bin/bash
for pkg in @mui/material @mui/x-date-pickers react-relay zustand; do
  echo "== $pkg peer deps =="; npm view "$pkg@latest" peerDependencies --json || true; echo
done

---

7-8: Enforce build before publish (prepublishOnly).

Guarantees artifacts (or at least Relay outputs) are generated prior to publish, preventing broken releases.

   "scripts": {
     "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build",

---

70-70: Move Storybook to devDependencies.

Storybook is tooling and shouldn’t be a runtime dependency of a components library.

   "dependencies": {
-    "@storybook/react": "8.4.7",

   "devDependencies": {
+    "@storybook/react": "8.4.7",

---

23-50: Use compiled JS and type exports to prevent breaking consumers

I verified that no Next.js apps in the monorepo include @baseapp-frontend/components in their transpilePackages configuration—consumers will not transpile .ts files in node_modules, so pointing exports at .ts sources will break imports at runtime.

• Affected file: packages/components/package.json (exports block, lines 23-50)
• Issue: all export entries currently target .ts modules without a compiled fallback
• Resolution: ship compiled JS and declaration files by default (Option A), using the original .ts source as a fallback

Recommended diff (apply same pattern to every entry in this block):

-    "./shared/common": "./modules/__shared__/common/index.ts",
+    "./shared/common": {
+      "types":  "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
-    "./shared/web": "./modules/__shared__/web/index.ts",
+    "./shared/web": {
+      "types":  "./dist/modules/__shared__/web/index.d.ts",
+      "default": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },
# …and so on for native, activity-log, comments, messages, navigations, notifications, profiles, tests, content-feed

packages/design-system/package.json (5)

126-127: Relax React peer pins to a range to avoid conflicts with ecosystem peers.

Hard-pinning to 19.1.0 won’t play well with MUI v5 and others. Prefer a range for smoother installs.

   "peerDependencies": {
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   },

To inspect current peer expectations:

#!/bin/bash
for pkg in @mui/material @mui/material-nextjs @mui/x-date-pickers react-native-paper; do
  echo "== $pkg peer deps =="; npm view "$pkg@latest" peerDependencies --json || true; echo
done

---

7-8: Add prepublishOnly to ensure builds run before publish.

Prevents publishing stale/missing artifacts.

   "scripts": {
     "build": "rm -rf dist && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
+    "prepublishOnly": "pnpm build",

---

93-99: Version alignment: @mui/material-nextjs v6 with @mui/material v5.

These major versions are meant to pair; mixing can cause incompatibilities. Either upgrade MUI to v6 or use an adapter compatible with v5.

Possible fix (upgrade MUI stack):

-    "@mui/material": "5.18.0",
-    "@mui/system": "5.18.0",
-    "@mui/x-date-pickers": "7.6.2",
-    "@mui/material-nextjs": "6.1.4",
+    "@mui/material": "^6.0.0",
+    "@mui/system": "^6.0.0",
+    "@mui/x-date-pickers": "^7.10.0",
+    "@mui/material-nextjs": "^6.1.4",

(Adjust exact versions to your tested set.)

---

103-103: Move @storybook/react to devDependencies.

Keep Storybook out of consumers’ dependency trees.

-    "@storybook/react": "8.4.7",

   "devDependencies": {
+    "@storybook/react": "8.4.7",

---

5-5: Prevent CSS from being tree-shaken by sideEffects=false.

You export CSS paths (lines 51–56). With sideEffects: false, bundlers may drop CSS. Whitelist CSS as side-effectful.

-  "sideEffects": false,
+  "sideEffects": [
+    "*.css",
+    "**/*.css"
+  ],

🧹 Nitpick comments (2)

packages/components/package.json (1)

52-57: Publish compiled output when exporting dist (or stick to JIT explicitly).

If you adopt “Option A” above, add dist to "files" so JS/d.ts are shipped. If you keep JIT, consider explicitly documenting that only sources are published.

   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
     "schema.graphql",
     "__generated__"
   ],

packages/design-system/package.json (1)

77-85: Include dist in published files when exporting compiled outputs.

If you adopt the dist strategy, ensure it’s shipped.

   "files": [
     "components",
     "hooks",
     "layouts",
     "providers",
     "styles",
     "tests",
     "utils",
-    "tsconfig.json"
+    "tsconfig.json",
+    "dist"
   ],

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between a6d4f72 and 1f3fea3.

📒 Files selected for processing (2)

• packages/components/package.json (1 hunks)
• packages/design-system/package.json (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Build and Lint Packages
• GitHub Check: Component Test Packages

🔇 Additional comments (1)

packages/design-system/package.json (1)

51-56: CSS exports are good; pair with sideEffects whitelist.

The explicit CSS subpath exports look correct; once sideEffects includes CSS (see earlier comment), bundlers won’t tree-shake these unintentionally.

[coderabbitai]

🛠️ Refactor suggestion

Avoid shipping Next.js as a runtime dependency.

Libraries should not depend on "next"; it bloats installs and can cause version conflicts. Move to devDependencies (or remove if unused).

-    "next": "^15.3.2",

   "devDependencies": {
+    "next": "^15.3.2",

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"next": "^15.3.2",
	"dependencies": {
	// …other runtime dependencies…
	},
	"devDependencies": {
	"next": "^15.3.2",
	// …other dev dependencies…
	}

🤖 Prompt for AI Agents

In packages/components/package.json at line 79, Next.js is listed as a runtime
dependency ("next": "^15.3.2"), which should not be shipped by libraries; move
the "next" entry from dependencies to devDependencies (or remove it entirely if
unused) so the package does not force Next.js on consumers and to avoid bloated
installs and version conflicts; update package.json accordingly and run a fresh
install to verify no runtime references break and update any build/test scripts
to use the devDependency.

[coderabbitai]

🛠️ Refactor suggestion

React Native should be a peerDependency, not a runtime dependency.

Bundling react-native in a library risks duplicate RN copies and Metro/linking issues. Declare as a peer and optional devDependency for local demos.

-    "react-native": "0.79.2",
-    "react-native-gesture-handler": "~2.24.0",
+    "react-native-gesture-handler": "~2.24.0",

Add under "peerDependencies" (and optionally "devDependencies" for local storybook/sandboxes):

   "peerDependencies": {
     "@baseapp-frontend/authentication": "workspace:*",
     "@baseapp-frontend/design-system": "workspace:*",
     "@baseapp-frontend/graphql": "workspace:*",
     "@baseapp-frontend/utils": "workspace:*",
     "react": "19.1.0",
     "react-dom": "19.1.0",
+    "react-native": ">=0.77 <0.80"
   },

(Adjust the RN range to what you actually support.)

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"react-native": "0.79.2",
	"react-native-gesture-handler": "~2.24.0",
	"react-relay": "19.0.0",
	// packages/components/package.json
	{
	// … other fields …
	"dependencies": {
	// moved react-native to peerDependencies
	"react-native-gesture-handler": "~2.24.0",
	"react-relay": "19.0.0",
	// … other dependencies …
	},
	// … other fields …
	"peerDependencies": {
	"@baseapp-frontend/authentication": "workspace:*",
	"@baseapp-frontend/design-system": "workspace:*",
	"@baseapp-frontend/graphql": "workspace:*",
	"@baseapp-frontend/utils": "workspace:*",
	"react": "19.1.0",
	"react-dom": "19.1.0",
	"react-native": ">=0.77 <0.80"
	}
	// … remaining fields …
	}

🤖 Prompt for AI Agents

In packages/components/package.json around lines 82-84, react-native is listed
as a runtime dependency; remove "react-native": "0.79.2" from dependencies and
add it to "peerDependencies" with an appropriate semver range you support (for
example ">=0.70 <0.81"), and optionally add it to "devDependencies" for local
storybook/sandbox usage; update package.json accordingly, run your package
manager to refresh the lockfile, and verify examples/builds still work with the
new peer/dev placement.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Exports mapped to .ts sources — add "source"/transpile guarantees or point to dist.

Shipping TS sources requires all consumers to transpile node_modules. Either:

• Keep JIT and add "source" per entry (and document consumer config), or
• Export compiled JS + d.ts from dist.

Option A (compiled):

-    "./components/web/buttons": "./components/web/buttons/index.ts",
+    "./components/web/buttons": {
+      "types": "./dist/components/web/buttons/index.d.ts",
+      "default": "./dist/components/web/buttons/index.js",
+      "source": "./components/web/buttons/index.ts"
+    },

Option B (JIT, safer metadata):

-    "./components/web/buttons": "./components/web/buttons/index.ts",
+    "./components/web/buttons": {
+      "default": "./components/web/buttons/index.ts",
+      "source": "./components/web/buttons/index.ts"
+    },

Run this to check consumer transpilation config in the repo:

---

🏁 Script executed:

#!/bin/bash
rg -nP -C2 'transpilePackages\s*:\s*\[[^\]]*\]' | rg -nP '@baseapp-frontend/design-system' || echo "WARN: No Next.js transpilePackages entries for @baseapp-frontend/design-system found"
fd -HI 'jest.config.*' -t f | xargs -I{} rg -nC2 'transformIgnorePatterns|ts-jest|babel-jest' {}
fd -HI '.storybook/main.(js|ts|cjs|mjs)' -t f | xargs -I{} rg -nC2 '.' {}

Length of output: 1136

---

🏁 Script executed:

#!/bin/bash
# Check if a compiled output directory exists for the design-system package
if [ -d packages/design-system/dist ]; then
  echo "✅ dist directory exists at packages/design-system/dist"
else
  echo "❌ No dist directory found in packages/design-system"
fi

Length of output: 153

---

Ensure Design System package exports compiled JS or properly annotated TS sources

The packages/design-system/package.json currently maps exports directly to TypeScript source files (lines 16–75), and there is no dist/ directory with compiled output. Consumers (e.g. Next.js) do not transpile node_modules by default—our search found no transpilePackages entry for @baseapp-frontend/design-system—so importing .ts files at runtime will fail. To address this, choose one of the following mandatory fixes:

• Option A: Compile and ship JS + type definitions
  1. Add a build step that emits .js and .d.ts files into packages/design-system/dist.
  2. Update the exports field in package.json to point to dist/. For example:

     // packages/design-system/package.json
     "exports": {
  -    "./components/web/buttons": "./components/web/buttons/index.ts",
  +    "./components/web/buttons": {
  +      "types": "./dist/components/web/buttons/index.d.ts",
  +      "default": "./dist/components/web/buttons/index.js",
  +      "source": "./components/web/buttons/index.ts"
  +    },
     // …repeat for each entry
     }

• Option B: JIT TS with explicit “source” metadata
  1. Annotate each export to include "source" alongside "default".
  2. Document in the README that consumers must transpile this package—e.g., by adding:

     // next.config.js
     module.exports = {
       transpilePackages: ['@baseapp-frontend/design-system', /* … */],
     };

  3. Ensure your CI/docs guide host projects to configure their bundler/test runner accordingly.

Both approaches require updating the codebase:

• Add/verify a build script (e.g. tsc --build or equivalent) that outputs to packages/design-system/dist.
• Modify packages/design-system/package.json as shown.
• If using Option B, update documentation and verify consumer configs (e.g. Next.js, Jest’s transformIgnorePatterns, Storybook) include this package for TS transpilation.

These changes are critical to prevent runtime import errors in consumer applications.

[coderabbitai]

🛠️ Refactor suggestion

Do not ship Next.js as a runtime dependency in a library.

Move "next" to devDependencies or drop entirely if unused.

-    "next": "^15.3.2",

   "devDependencies": {
+    "next": "^15.3.2",

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"next": "^15.3.2",
	{
	"dependencies": {
	"react": "^19.0.0",
	"react-dom": "^19.0.0",
	- "next": "^15.3.2",
	"typescript": "^5.2.2"
	},
	"devDependencies": {
	"next": "^15.3.2",
	"jest": "^29.0.0",
	"typescript": "^5.2.2"
	},
	// …rest of package.json…
	}

🤖 Prompt for AI Agents

In packages/design-system/package.json around line 111, Next.js is declared as a
runtime dependency ("next": "^15.3.2") but should not be shipped as a dependency
of a reusable library. Remove "next" from dependencies and either add it to
devDependencies (if used only for local dev/build/test) or drop it entirely if
unused; then run npm/yarn install and update any build/test scripts that relied
on it to use the repo-level Next.js or a dev-only entry.

[coderabbitai]

🛠️ Refactor suggestion

React Native should be a peerDependency (not a runtime dependency).

Prevents duplicate RN bundles and Metro conflicts in consuming apps. Apply the same for strongly-coupled RN-only libs if appropriate.

-    "react-native": "0.79.2",
-    "react-native-gesture-handler": "~2.24.0",
-    "react-native-paper": "^5.14.5",
-    "react-native-reanimated": "~3.17.4",
-    "react-native-svg": "15.11.2",
+    "react-native-gesture-handler": "~2.24.0",
+    "react-native-paper": "^5.14.5",
+    "react-native-reanimated": "~3.17.4",
+    "react-native-svg": "15.11.2",

Add peer declaration:

   "peerDependencies": {
     "@baseapp-frontend/utils": "workspace:*",
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "react-native": ">=0.77 <0.80"
   },

(Adjust RN range to match your tested version(s).)

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"react-native": "0.79.2",
	"react-native-gesture-handler": "~2.24.0",
	"react-native-paper": "^5.14.5",
	"react-native-reanimated": "~3.17.4",
	"react-native-svg": "15.11.2",
	"simplebar-react": "3.2.5",
	"dependencies": {
	"react-native-gesture-handler": "~2.24.0",
	"react-native-paper": "^5.14.5",
	"react-native-reanimated": "~3.17.4",
	"react-native-svg": "15.11.2",
	"simplebar-react": "3.2.5",
	…other deps…
	},
	"peerDependencies": {
	"@baseapp-frontend/utils": "workspace:*",
	"react": "19.1.0",
	"react-dom": "19.1.0",
	"react-native": ">=0.77 <0.80"
	},

🤖 Prompt for AI Agents

In packages/design-system/package.json lines 116-121, react-native (and other
RN-only libs like react-native-gesture-handler, react-native-reanimated,
react-native-svg, react-native-paper if they are required by consumers) are
declared as runtime dependencies; move them to peerDependencies (with an
appropriate semver range matching tested versions) to avoid duplicate RN
bundles/Metro conflicts, and optionally add them to devDependencies for local
development/testing purposes; update package.json by removing them from
"dependencies", adding matching entries under "peerDependencies", and keeping a
pinned version under "devDependencies" if the library needs them for
building/tests.

[coderabbitai]

Actionable comments posted: 1

♻️ Duplicate comments (4)

packages/components/package.json (4)

100-101: Relax React peer pins to avoid ecosystem conflicts (MUI, Storybook, X-Date-Pickers).

Pinning to 19.1.0 will block consumers and clash with libs that haven’t finalized React 19 support. Use a permissive range for now.

   "peerDependencies": {
@@
-    "react": "19.1.0",
-    "react-dom": "19.1.0"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20"
   },

When your dependencies officially support stable React 19, you can tighten this (e.g., ^19).

---

24-51: Exports target .ts sources — this will break runtime consumers; point to compiled .js and .d.ts (keep TS as "source").

Tooling like Node, Webpack, Metro won’t execute TypeScript from node_modules. The current subpath exports map directly to .ts files. Ship compiled JS and declarations instead, and optionally include a "source" hint for tooling. Apply the pattern below to every subpath.

   "exports": {
-    "./package.json": "./package.json",
-    "./shared/common": "./modules/__shared__/common/index.ts",
-    "./shared/web": "./modules/__shared__/web/index.ts",
-    "./shared/native": "./modules/__shared__/native/index.ts",
-    "./activity-log/common": "./modules/activity-log/common/index.ts",
-    "./activity-log/web": "./modules/activity-log/web/index.ts",
-    "./activity-log/native": "./modules/activity-log/native/index.ts",
-    "./comments/common": "./modules/comments/common/index.ts",
-    "./comments/web": "./modules/comments/web/index.ts",
-    "./comments/native": "./modules/comments/native/index.ts",
-    "./messages/common": "./modules/messages/common/index.ts",
-    "./messages/web": "./modules/messages/web/index.ts",
-    "./messages/native": "./modules/messages/native/index.ts",
-    "./navigations/common": "./modules/navigations/common/index.ts",
-    "./navigations/web": "./modules/navigations/web/index.ts",
-    "./navigations/native": "./modules/navigations/native/index.ts",
-    "./notifications/common": "./modules/notifications/common/index.ts",
-    "./notifications/web": "./modules/notifications/web/index.ts",
-    "./notifications/native": "./modules/notifications/native/index.ts",
-    "./profiles/common": "./modules/profiles/common/index.ts",
-    "./profiles/web": "./modules/profiles/web/index.ts",
-    "./profiles/native": "./modules/profiles/native/index.ts",
-    "./tests/common": "./modules/tests/common/index.ts",
-    "./tests/web": "./modules/tests/web/index.ts",
-    "./tests/native": "./modules/tests/native/index.ts",
-    "./content-feed/common": "./modules/content-feed/common/index.ts",
-    "./content-feed/web": "./modules/content-feed/web/index.ts",
-    "./content-feed/native": "./modules/content-feed/native/index.ts"
+    "./package.json": "./package.json",
+    "./shared/common": {
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
+    "./shared/web": {
+      "types": "./dist/modules/__shared__/web/index.d.ts",
+      "default": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },
+    "./shared/native": {
+      "types": "./dist/modules/__shared__/native/index.d.ts",
+      "default": "./dist/modules/__shared__/native/index.js",
+      "source": "./modules/__shared__/native/index.ts"
+    },
+    "./activity-log/common": {
+      "types": "./dist/modules/activity-log/common/index.d.ts",
+      "default": "./dist/modules/activity-log/common/index.js",
+      "source": "./modules/activity-log/common/index.ts"
+    }
+    // ...repeat for all other subpaths (web/native variants, comments, messages, navigations, etc.)
   }

If you emit separate ESM/CJS, use "import"/"require" keys instead of a single "default". Ensure tsc/tsup outputs to the referenced dist paths with declaration: true.

---

7-8: Build/publish flow: enforce build at publish time and include compiled outputs in package files.

You added a prepare hook and build cleans dist, but the package doesn’t publish dist and exports still point to .ts. At minimum:

• Gate publishing with prepublishOnly so npm publishes compiled artifacts.
• Publish dist in "files". Consider dropping prepare (runs on git installs and can fail if env isn’t set for Relay).

   "scripts": {
     "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
     "dev": "rm -rf dist && tsc --watch",
@@
-    "prepare": "pnpm build"
+    "prepare": "echo \"skip local prepare (use prepublishOnly)\"",
+    "prepublishOnly": "pnpm build"
   },
@@
   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
-    "schema.graphql",
+    // Consider excluding unless consumers need it:
+    // "schema.graphql",
     "__generated__"
   ],

Verification script to confirm no .ts in exports and that outDir matches “dist”:

#!/bin/bash
set -euo pipefail
echo "== outDir from tsconfig.build.json =="
jq -r '.compilerOptions.outDir // "<no outDir>"' packages/components/tsconfig.build.json
echo "== any .ts targets in exports? =="
jq -r '.exports | .. | select(type=="string")' packages/components/package.json | grep -n '\.ts$' && { echo "Found .ts in exports"; exit 1; } || echo "OK: no .ts in export strings"

Also applies to: 21-21, 54-58

---

71-71: Move tooling/frameworks out of runtime deps: Storybook/Next belong in dev, React Native should be a peer.

• @storybook/react is tooling — ship as devDependency.
• next should not be a runtime dependency of a library.
• react-native should be a peer (and optional dev for local demos), not bundled.

   "dependencies": {
@@
-    "@storybook/react": "8.4.7",
@@
-    "next": "^15.3.2",
@@
-    "react-native": "0.79.2",
+    // (moved)
   },
   "peerDependencies": {
@@
+    "react-native": ">=0.79 <0.80",
   },
   "devDependencies": {
@@
+    "@storybook/react": "8.4.7",
+    "next": "^15.3.2",
+    // Optional for local native storybook/sandboxes:
+    // "react-native": "0.79.2",

Note: pick a RN range you actually support; 0.x minors can be breaking, so keep it narrow.

Also applies to: 80-80, 83-83

🧹 Nitpick comments (2)

packages/components/package.json (2)

13-13: Nit: consider a lighter clean target.

Deleting node_modules in a package deep inside a monorepo is heavy and can disrupt workspaces. Prefer a focused clean (dist, cache, generated) and leave node_modules to root-level tooling.

-    "clean": "rm -rf .turbo && rm -rf node_modules",
+    "clean": "rm -rf .turbo dist tmp-dts __generated__"

---

7-8: Potential CI/install breakages due to Relay in prepare.

"prepare" triggers pnpm build, which runs Relay. For git-based installs or certain CI steps without NEXT_PUBLIC_RELAY_ENDPOINT, this can fail. Prefer "prepublishOnly" to gate npm publishing and run Relay/codegen during CI jobs that provision env.

If you must keep prepare for git installs, consider guarding Relay:

-    "build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
+    "build": "rm -rf dist && if [ -n \"$NEXT_PUBLIC_RELAY_ENDPOINT\" ]; then pnpm relay; else echo 'Skipping relay: NEXT_PUBLIC_RELAY_ENDPOINT not set'; fi && tsc --build tsconfig.build.json",

Also applies to: 21-21

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 1f3fea3 and 3819c7d.

📒 Files selected for processing (1)

• packages/components/package.json (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: Build and Lint Packages

🔇 Additional comments (2)

packages/components/package.json (2)

19-19: Good: component tests now prep Relay before Cypress.

Running Relay before Cypress reduces flakiness in component tests that import generated artifacts.

---

12-12: Lint script runs type-checks — solid.

eslint + tsc --noEmit is a good combo to catch TS-level issues early.

[coderabbitai]

Actionable comments posted: 2

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

packages/wagtail/package.json (1)

31-35: Replace peerDependencies workspace: with explicit semver ranges*

Using workspace:* in peerDependencies can lead to resolution warnings or mismatches for your published package. Please update these entries to explicit semver ranges that match the versions you’re releasing.

Action items:

• Update @baseapp-frontend/design-system from workspace:* to ^1.1.0.
• Update @baseapp-frontend/graphql from workspace:* to ^1.3.3.
• Update @baseapp-frontend/utils from workspace:* to ^4.0.1.
• Replace the non-semver React entry with an explicit range—if you support both React 18 and 19, use ^18.2.0 || ^19.0.0; otherwise choose the single major range you support (e.g., ^19.0.0).

Proposed diff for packages/wagtail/package.json:

--- a/packages/wagtail/package.json
+++ b/packages/wagtail/package.json
@@ peerDependencies
-    "@baseapp-frontend/design-system": "workspace:*",
+    "@baseapp-frontend/design-system": "^1.1.0",
-    "@baseapp-frontend/graphql": "workspace:*",
+    "@baseapp-frontend/graphql": "^1.3.3",
-    "@baseapp-frontend/utils": "workspace:*",
+    "@baseapp-frontend/utils": "^4.0.1",
-    "react": "catalog:react19"
+    "react": "^18.2.0 || ^19.0.0"

♻️ Duplicate comments (5)

packages/components/package.json (5)

60-94: Move tooling/frameworks out of runtime dependencies

Libraries should not ship Storybook, Next.js, or React Native as runtime deps. They bloat installs and cause version conflicts for consumers. Make them dev/peer deps instead.

   "dependencies": {
@@
-    "@storybook/react": "catalog:storybook",
@@
-    "next": "catalog:",
@@
-    "react-native": "catalog:react-native",

Then (see separate comments below) add:

• @storybook/react under devDependencies.
• next under devDependencies if used for local examples/tests only.
• react-native under peerDependencies (and optional devDependency for local demos).

---

95-102: Relax React peer range to avoid blocking consumers; add React Native as a peer

Pinning React to a “react19” catalog risks peer conflicts (e.g., MUI/X-Date-Pickers and Storybook often lag stable React majors). Prefer a permissive range until the ecosystem is fully aligned. Also, RN should be a peer so apps provide their own version.

   "peerDependencies": {
     "@baseapp-frontend/authentication": "workspace:*",
     "@baseapp-frontend/design-system": "workspace:*",
     "@baseapp-frontend/graphql": "workspace:*",
     "@baseapp-frontend/utils": "workspace:*",
-    "react": "catalog:react19",
-    "react-dom": "catalog:react19"
+    "react": ">=18.2 <20",
+    "react-dom": ">=18.2 <20",
+    "react-native": "catalog:react-native"
   },

If you must keep catalogs, ensure the catalog aliases resolve to compatible ranges and that downstream libs (MUI, Storybook, Relay) officially support them.

---

103-169: Place Storybook and Next in devDependencies; prune unused tooling

Move @storybook/react and next to devDependencies. Also consider removing tsup if it’s no longer used.

   "devDependencies": {
@@
+    "@storybook/react": "catalog:storybook",
@@
+    "next": "catalog:",
@@
-    "tsup": "catalog:",
+    // "tsup": "catalog:", // remove if unused

Quick check for tsup usage:

#!/bin/bash
set -euo pipefail
rg -nP '\btsup\b' -g '!**/node_modules/**' -C2 || echo "No tsup usage found"

---

24-51: Critical: subpath exports point to .ts sources; ship compiled .js and .d.ts instead

Exporting raw TypeScript from node_modules breaks many consumers (Node, Webpack, Metro) and deprives TS of stable .d.ts resolution. Point each export to compiled JS and declarations (typically under dist/), and optionally keep a "source" pointer for tooling.

Apply this pattern to every subpath (example shown for a few entries):

   "exports": {
-    "./package.json": "./package.json",
-    "./shared/common": "./modules/__shared__/common/index.ts",
-    "./shared/web": "./modules/__shared__/web/index.ts",
-    "./shared/native": "./modules/__shared__/native/index.ts",
-    "./activity-log/common": "./modules/activity-log/common/index.ts",
+    "./package.json": "./package.json",
+    "./shared/common": {
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "import": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
+    "./shared/web": {
+      "types": "./dist/modules/__shared__/web/index.d.ts",
+      "import": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },
+    "./shared/native": {
+      "types": "./dist/modules/__shared__/native/index.d.ts",
+      "import": "./dist/modules/__shared__/native/index.js",
+      "source": "./modules/__shared__/native/index.ts"
+    },
+    "./activity-log/common": {
+      "types": "./dist/modules/activity-log/common/index.d.ts",
+      "import": "./dist/modules/activity-log/common/index.js",
+      "source": "./modules/activity-log/common/index.ts"
+    },
     // ...repeat this object form for every other subpath export...

Additionally (outside the selected lines), if you are emitting ESM, set "type": "module" at the top level to avoid Node treating emitted .js as CJS:

{
  "type": "module"
}

Run to surface any .ts targets still present in exports:

#!/bin/bash
set -euo pipefail
jq -r '.exports | .. | select(type=="string")' packages/components/package.json | grep -n '\.ts$' && { echo "Found .ts in exports (must fix)"; exit 1; } || echo "OK: no .ts in exports strings"

---

53-59: Package won’t publish runtime artifacts: add dist to files

files omits dist, so even if you build, compiled JS and .d.ts won’t be published.

   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
     "schema.graphql",
     "__generated__"
   ],

If consumers don’t need schema.graphql, consider excluding it to reduce package size.

🧹 Nitpick comments (3)

packages/wagtail/package.json (3)

7-7: sideEffects: false — ensure no required side-effect CSS or global registrations

If any module relies on side-effect-only imports (CSS-in-JS theme side-effects, MSW worker registration in package init, etc.), tree-shaking may drop them. If everything is component-scoped and safe, keep as is.

---

13-13: Replace yarn with pnpm in the schema update script

I ran

rg -nP -C2 '"yarn\s' --glob '**/package.json'

and the only occurrence of yarn in your package.json files is on line 13 of packages/wagtail/package.json. Swapping to pnpm here aligns with the repo-wide move to pnpm and avoids potential missing‐yarn errors in CI/dev containers.

• packages/wagtail/package.json:13

-    "relay:update-schema": "yarn relay:download-schema && yarn relay",
+    "relay:update-schema": "pnpm relay:download-schema && pnpm relay",

---

66-67: Remove redundant dotenv dependency

Our search confirmed there are no runtime imports or requires of dotenv (e.g., import 'dotenv', require('dotenv'), or import 'dotenv/config') anywhere in the repo. All usages of the dotenv command come via the CLI invocation (dotenv -- …), which is provided by dotenv-cli, not the core dotenv package. Therefore, you can safely remove the top-level dotenv dependency from packages/wagtail/package.json.

• File: packages/wagtail/package.json
• Remove the "dotenv": "^16.4.5", line

Proposed diff:

   "scripts": {
     "relay:download-schema": "dotenv -- bash -c 'get-graphql-schema \"$NEXT_PUBLIC_RELAY_ENDPOINT\" > schema.graphql'",
     // …
   },
   "dependencies": {
-    "dotenv": "^16.4.5",
     "dotenv-cli": "^7.4.2",
     // …
   }

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 3819c7d and 44100d3.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (11)

• packages/authentication/package.json (0 hunks)
• packages/components/CHANGELOG.md (1 hunks)
• packages/components/package.json (1 hunks)
• packages/config/CHANGELOG.md (1 hunks)
• packages/config/package.json (1 hunks)
• packages/design-system/CHANGELOG.md (1 hunks)
• packages/design-system/package.json (1 hunks)
• packages/graphql/package.json (0 hunks)
• packages/wagtail/CHANGELOG.md (1 hunks)
• packages/wagtail/package.json (1 hunks)
• turbo.json (0 hunks)

💤 Files with no reviewable changes (3)

• packages/authentication/package.json
• turbo.json
• packages/graphql/package.json

✅ Files skipped from review due to trivial changes (4)

• packages/wagtail/CHANGELOG.md
• packages/components/CHANGELOG.md
• packages/config/CHANGELOG.md
• packages/design-system/CHANGELOG.md

🚧 Files skipped from review as they are similar to previous changes (1)

• packages/design-system/package.json

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: Analyze (javascript)

🔇 Additional comments (6)

packages/config/package.json (2)

4-4: LGTM: Patch bump to 2.1.12 is appropriate for linter ignore-only changes.
Changelog alignment and pnpm CI updates in the PR context make this a sensible patch release.

---

4-4: Release hygiene verified

All checks passed for the 2.1.12 release:

• packages/config version is correctly set to 2.1.12
• CHANGELOG.md contains the “## 2.1.12” entry
• generated/ is listed in ignorePatterns in packages/config/.eslintrc.js
• No internal package still pins @baseapp-frontend/config to 2.1.11

Good to merge and publish.

packages/components/package.json (2)

7-9: Good: prepublishOnly now enforces builds before publish

Build/dev scripts look consistent, and prepublishOnly will prevent publishing stale artifacts. No issues here.

Also applies to: 21-21

---

12-13: Nice: tighter lint and component test flow

Running tsc --noEmit during lint and invoking Relay before component tests will catch schema drift early and stabilize Cypress runs. Looks good.

Also applies to: 19-20

packages/wagtail/package.json (2)

4-4: Major version bump to 2.0.0: double-check breaking-change surface and downstream consumers

Going to 2.x implies breaking changes. Please confirm:

• CHANGELOG entry clearly enumerates the breakages (e.g., import path changes to design-system tests).
• Any app/packages depending on @baseapp-frontend/wagtail have their ranges updated (>=2.0.0).
• CI/publish workflows are ready for a major bump (release notes, tag, version policy).

If you want, I can scan dependents in the monorepo and list which need range bumps.

---

21-29: Verify TypeScript typings for react-relay in packages/wagtail/package.json

Please ensure that the version of react-relay resolved by your catalog:graphql alias bundles its own TypeScript definitions and that your project compiles without errors. If the pinned version does not include built-in types, re-add @types/react-relay under devDependencies.

Files/lines to check:

• packages/wagtail/package.json: lines 21–29
• also applies to lines 59–60 and 75–77

Steps:

• Inspect the react-relay package.json (e.g., check the "types" or "typings" field).
• Run tsc --noEmit to confirm there are no missing-type errors.
• If definitions are missing, install @types/react-relay as a dev dependency.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Ensure tsc emits declarations to dist and matches exports

Double-check tsconfig.build.json sets declaration: true, emitDeclarationOnly: false, and outDir: "dist" (or adjust exports accordingly).

Expected: outDir "dist", declaration true, emitDeclarationOnly false (if also emitting JS).

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail
jq '.compilerOptions | {outDir, declaration, emitDeclarationOnly, module}' packages/components/tsconfig.build.json

Length of output: 402

---

I’ll locate the actual tsconfig.build.json in packages/components, dump its compilerOptions, and explicitly extract the three fields:

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

# 1. Find the tsconfig.build.json path
config_file=$(find packages/components -type f -name "tsconfig.build.json")
echo "Using tsconfig: $config_file"

# 2. Show the entire compilerOptions block for context
echo "--- compilerOptions block ---"
awk '/"compilerOptions"/,/}/' "$config_file"

# 3. Extract the specific fields
echo "--- Selected compilerOptions fields ---"
jq '.compilerOptions | {outDir: .outDir, declaration: .declaration, emitDeclarationOnly: .emitDeclarationOnly}' "$config_file"

Length of output: 715

---

I need to check if your tsconfig.build.json is inheriting those settings from a base config. Running a script to:

1. Dump the full tsconfig.build.json (to see extends and any compilerOptions).
2. If it extends another file, locate and dump that base config’s compilerOptions for those fields.

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

config_file="packages/components/tsconfig.build.json"
echo "==> Reading $config_file"
echo "--- Full file content ---"
sed -n '1,200p' "$config_file"
echo

# Grab 'extends' if present
extends=$(jq -r '.extends // empty' "$config_file")
echo "extends: '$extends'"
echo

# Show compilerOptions in tsconfig.build.json
echo "--- compilerOptions in tsconfig.build.json ---"
jq '.compilerOptions // {}' "$config_file"
echo

if [[ -n "$extends" ]]; then
  # Resolve relative path of base config
  base_file=$(dirname "$config_file")/"$extends"
  echo "==> Found base config: $base_file"
  echo "--- Full base config content ---"
  sed -n '1,200p' "$base_file"
  echo

  echo "--- Extracted compilerOptions fields from base ---"
  jq '.compilerOptions | {outDir, declaration, emitDeclarationOnly}' "$base_file"
fi

Length of output: 2176

---

Add explicit declaration and emitDeclarationOnly compilerOptions in tsconfig.build.json

Our investigation shows:

• packages/components/tsconfig.build.json only extends ./tsconfig.json and doesn’t declare any compilerOptions of its own.
• The local packages/components/tsconfig.json sets "outDir": "./dist" but omits both declaration and emitDeclarationOnly, so they default to false. As a result, running tsc --build tsconfig.build.json will emit JavaScript only and no .d.ts files.
• To ensure type declarations are generated into dist/, you must explicitly enable them.

Please update packages/components/tsconfig.build.json (or your build-specific tsconfig) to include:

--- packages/components/tsconfig.build.json
+++ packages/components/tsconfig.build.json
@@
- {
-   "extends": "./tsconfig.json",
+ {
+   "extends": "./tsconfig.json",
+   "compilerOptions": {
+     "declaration": true,
+     "emitDeclarationOnly": false
+   },
    "exclude": [
      "node_modules",
      "cypress",
      "jest",
      "**/*.test.ts",
      "**/*.test.tsx",
      "**/*.cy.tsx"
    ]
 }

This guarantees that:

• .d.ts files are emitted alongside your JS output in dist/.
• Your package exports align with the types you publish.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	"build": "rm -rf dist && pnpm relay && tsc --build tsconfig.build.json",
	"dev": "rm -rf dist && tsc --watch",
	"relay": "relay-compiler",
	// packages/components/tsconfig.build.json
	{
	"extends": "./tsconfig.json",
	"compilerOptions": {
	"declaration": true,
	"emitDeclarationOnly": false
	},
	"exclude": [
	"node_modules",
	"cypress",
	"jest",
	"**/*.test.ts",
	"**/*.test.tsx",
	"**/*.cy.tsx"
	]
	}

🤖 Prompt for AI Agents

In packages/components/tsconfig.build.json (update this build-specific tsconfig;
lines not provided), add compilerOptions that explicitly enable declaration:
true and emitDeclarationOnly: true and ensure outDir points to ./dist (or
inherits/overrides to ./dist) so tsc --build emits .d.ts files into dist
alongside JS; update the file to extend ./tsconfig.json and include a
compilerOptions block with "declaration": true and "emitDeclarationOnly": true
(and confirm/outdir is ./dist).

[coderabbitai]

Actionable comments posted: 0

♻️ Duplicate comments (1)

packages/wagtail/package.json (1)

5-6: Point “main” to compiled JS and add package exports

“main” targets a .ts entry which will break consumers that don’t transpile TS from node_modules (Node, Jest without ts-jest, Storybook builders, etc.). Types already point to dist/. Please switch runtime entry to built JS and define exports.

-  "main": "./index.ts",
-  "types": "dist/index.d.ts",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },

Optional but recommended to publish only build artifacts:

+  "files": [
+    "dist",
+    "README.md"
+  ],

If your TS compiler emits ESM (e.g., module ES2020/ESNext) and you want native ESM semantics, add "type": "module" and (optionally) emit dual CJS/ESM outputs; I can draft that layout if needed.

Run to confirm module format before choosing ESM/CJS wiring:

#!/bin/bash
echo "compilerOptions.module:"
rg -nC0 '"module"\s*:\s*"' packages/wagtail/tsconfig.build.json || sed -n '1,120p' packages/wagtail/tsconfig.build.json
echo ""
echo "package type field:"
rg -n '"type"\s*:\s*"' packages/wagtail/package.json || echo "(no type field)"

🧹 Nitpick comments (3)

packages/wagtail/package.json (3)

8-20: Guarantee builds are included on publish with a prepack hook

To prevent publishing an empty/missing dist (e.g., from a clean CI), add a prepack hook.

   "scripts": {
     "build": "rm -rf dist && tsc --build tsconfig.build.json",
     "dev": "tsc --watch",
@@
-    "cypress:open": "cypress open --browser chrome"
+    "cypress:open": "cypress open --browser chrome",
+    "prepack": "pnpm --filter @baseapp-frontend/wagtail build"
   },

If you publish from workspace root, we can instead wire a root-level prepack that builds all packages.

---

66-67: Remove redundant dotenv dependency

No programmatic imports or requires of dotenv were found in packages/wagtail (excluding dist/), so the plain dotenv package isn’t used at runtime—only dotenv-cli (the dotenv binary) is utilized in your scripts.

Please update packages/wagtail/package.json accordingly:

   "dependencies": {
-    "dotenv": "^16.4.5",
     "dotenv-cli": "^7.4.2",
     … 
   }

---

28-35: Move next and react-relay to peerDependencies

We found direct imports of next/* in this package, which means it relies on the host app’s Next.js runtime rather than bundling its own. We did not detect any direct react-relay imports, but since Relay runtimes are also typically provided by the consumer, it’s best to peer-depend on it (or remove it entirely if unused).

• Files importing next/*:
– packages/wagtail/modules/utils/requests.ts
– packages/wagtail/modules/components/PageTypes/StandardPage/index.tsx
– packages/wagtail/modules/components/Blocks/BannerBlock/index.tsx

• No direct react-relay imports detected; verify whether this package needs Relay at all or should defer to the consumer’s runtime.

Suggested diff in packages/wagtail/package.json:

   "dependencies": {
-    "next": "...",
-    "react-relay": "catalog:graphql"
+    // only runtime‐bundled deps here; remove next & react-relay
   },
   "peerDependencies": {
     "@baseapp-frontend/design-system": "workspace:*",
     "@baseapp-frontend/graphql": "workspace:*",
     "@baseapp-frontend/utils": "workspace:*",
     "react": "catalog:react19",
+    "next": "^<your-next-version>",
+    "react-relay": "catalog:graphql"
   },

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 2be5fd5 and 25263f7.

📒 Files selected for processing (2)

• packages/wagtail/CHANGELOG.md (1 hunks)
• packages/wagtail/package.json (1 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

• packages/wagtail/CHANGELOG.md

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Analyze (javascript)
• GitHub Check: Component Test Packages

🔇 Additional comments (2)

packages/wagtail/package.json (2)

4-4: Semver bump to 1.0.37 looks fine

Version increment acknowledged. Ensure a matching CHANGELOG entry and git tag are created when publishing.

---

7-7: sideEffects flag verification complete

No CSS/SCSS or core-polyfill imports were found anywhere under packages/wagtail (excluding dist and stories), so marking "sideEffects": false in packages/wagtail/package.json is safe.

[sonarqubecloud]

Quality Gate failed

Failed conditions
2 Security Hotspots

See analysis details on SonarQube Cloud

[coderabbitai]

Actionable comments posted: 1

♻️ Duplicate comments (5)

packages/wagtail/package.json (1)

5-6: Point runtime entry to built JS and add exports map to prevent consumer breakage

"main" currently targets a TypeScript source file ("./index.ts") while "types" points at "dist". Consumers that don't transpile TS from node_modules (Node, Jest without ts-jest, some bundlers) will fail at runtime. Please point "main" (and add "exports") to the compiled JS in dist. Also consider whitelisting published files.

Apply this diff:

@@
-  "main": "./index.ts",
-  "types": "dist/index.d.ts",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
@@
   "publishConfig": {
     "access": "public"
   },
+  "files": [
+    "dist",
+    "README.md"
+  ],

If your build emits ESM instead of CJS, keep "main" as above but we may also need "type": "module" (or dual exports). See verification comment below.

packages/components/package.json (4)

71-71: Move Storybook to devDependencies

Storybook is tooling, not a runtime dependency; shipping it bloats consumers and can cause conflicts. Move @storybook/react under devDependencies.

   "dependencies": {
@@
-    "@storybook/react": "catalog:storybook",
@@
   "devDependencies": {
+    "@storybook/react": "catalog:storybook",

---

80-84: Do not ship Next.js and React Native as runtime dependencies

Libraries should not force-install next or react-native. Make them peers (and optional devDeps for local demos). This avoids version clashes and duplicate RN installs.

   "dependencies": {
@@
-    "next": "catalog:",
@@
-    "react-native": "catalog:react-native",
+    // (remove next and react-native)
@@
   "peerDependencies": {
@@
+    "react-native": ">=0.77 <0.80"
   },
   "devDependencies": {
@@
+    "next": "catalog:"

Adjust the RN range to what you actually support.

If you prefer, I can scan the repo for any runtime imports from "next" or "react-native" to double-check moving them won’t break consumers.

---

24-52: Critical: exports point to TypeScript sources; publish compiled JS and .d.ts instead

Shipping .ts in exports will break consumers at runtime (Node/bundlers don’t execute TS from node_modules by default) and types should resolve to .d.ts. Align exports to compiled outputs (e.g., dist) and optionally include a "source" condition for tooling.

Apply this pattern to every subpath (showing a few; repeat similarly):

   "exports": {
-    "./package.json": "./package.json",
-    "./shared/common": "./modules/__shared__/common/index.ts",
-    "./shared/web": "./modules/__shared__/web/index.ts",
-    "./shared/native": "./modules/__shared__/native/index.ts",
+    "./package.json": "./package.json",
+    "./shared/common": {
+      "types": "./dist/modules/__shared__/common/index.d.ts",
+      "default": "./dist/modules/__shared__/common/index.js",
+      "source": "./modules/__shared__/common/index.ts"
+    },
+    "./shared/web": {
+      "types": "./dist/modules/__shared__/web/index.d.ts",
+      "default": "./dist/modules/__shared__/web/index.js",
+      "source": "./modules/__shared__/web/index.ts"
+    },
+    "./shared/native": {
+      "types": "./dist/modules/__shared__/native/index.d.ts",
+      "default": "./dist/modules/__shared__/native/index.js",
+      "source": "./modules/__shared__/native/index.ts"
+    },
@@
-    "./activity-log/common": "./modules/activity-log/common/index.ts",
+    "./activity-log/common": {
+      "types": "./dist/modules/activity-log/common/index.d.ts",
+      "default": "./dist/modules/activity-log/common/index.js",
+      "source": "./modules/activity-log/common/index.ts"
+    },
@@
-    "./content-feed/native": "./modules/content-feed/native/index.ts"
+    "./content-feed/native": {
+      "types": "./dist/modules/content-feed/native/index.d.ts",
+      "default": "./dist/modules/content-feed/native/index.js",
+      "source": "./modules/content-feed/native/index.ts"
+    }
   },

Notes:

• If you produce dual ESM/CJS, replace "default" with "import" and "require" keys.
• Ensure tsconfig.build.json sets "outDir": "./dist" and "declaration": true so .d.ts are emitted.

I can generate a complete exports block covering all entries if you confirm the final outDir and module format (ESM-only vs ESM+CJS).

---

54-58: Include build output in published files

dist is not listed, so compiled artifacts (JS and typings) won’t be published even after fixing exports. Add it to "files" (and consider excluding schema unless consumers need it).

   "files": [
     "modules",
+    "dist",
     "tsconfig.json",
     "relay.config.js",
-    "schema.graphql",
     "__generated__"
   ],

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 25263f7 and 2ae758d.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (2)

• packages/components/package.json (1 hunks)
• packages/wagtail/package.json (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Build and Lint Packages
• GitHub Check: Component Test Packages

🔇 Additional comments (5)

packages/wagtail/package.json (2)

4-4: Version bump acknowledged

1.0.37 looks fine given the changelog context in the PR summary. No further action from me here.

---

7-7: It looks like there are no CSS/SCSS/SASS/LESS imports, no bare “import '…';” statements, and no require('…css') calls anywhere under packages/wagtail/. That means it’s safe to keep "sideEffects": false without worrying about dropping needed side-effect-only imports.

Resolution
– No side-effect imports detected; "sideEffects": false is appropriate here.

packages/components/package.json (3)

7-8: Good: build gated via prepublishOnly; lint runs tsc --noEmit

Prepublish hook ensures artifacts are built before publishing. Lint’s typecheck is also a good safeguard.

Also applies to: 12-13, 19-21

---

133-135: Relay typings alignment confirmed

Both react-relay and its associated @types/* entries in packages/components/package.json use the identical catalog:graphql alias. This means the type definitions will always track the same version as the runtime package, so there is no risk of a major‐version mismatch. No changes are needed.

---

100-101: Maintain React peerDependencies alias for now

Verification shows that our direct dependency @mui/x-date-pickers is itself pinned to the catalog alias for React 19, so our package must align to avoid peer‐dependency mismatches. Specifically:

• packages/components/package.json (lines 100–101) currently declare:

    "react": "catalog:react19",
    "react-dom": "catalog:react19"

• @mui/x-date-pickers’s own peerDependencies (from packages/components/node_modules) are:

  {
    "react": "catalog:react19",
    "react-dom": "catalog:react19",
    …  
  }

Until MUI X-Date-Pickers and other key libraries adopt semver peer ranges, widening our peerDependencies to something like >=18.2 <20 would lead to conflicts (e.g., consumers installing React 18 only to have MUI insist on React 19 via the alias). We should therefore retain the current alias pins and revisit this once all downstream dependencies support a broader semver range.

Likely an incorrect or invalid review comment.

[coderabbitai]

💡 Verification agent

🧩 Analysis chain

Verify emitted module format and dist outputs before publishing

Please confirm the TS build emits JS into dist and whether it’s CJS or ESM so the exports mapping is correct.

---

🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "== Inspect tsconfig for outDir and module =="
if [[ -f packages/wagtail/tsconfig.build.json ]]; then
  sed -n '1,200p' packages/wagtail/tsconfig.build.json | sed -n '1,120p' | rg -n 'outDir|declaration|emitDeclarationOnly|module|moduleResolution' -n -N -H || true
else
  echo "tsconfig.build.json not found at packages/wagtail/tsconfig.build.json"
fi

echo
echo "== Check for built artifacts =="
if [[ -d packages/wagtail/dist ]]; then
  fd . packages/wagtail/dist -t f -a | sed -n '1,40p'
else
  echo "dist directory not present. Run: pnpm --filter @baseapp-frontend/wagtail build"
fi

echo
echo "== Grep index outputs in dist =="
rg -n --glob 'packages/wagtail/dist/**' -P '(^|/)index\.(js|cjs|mjs|d\.ts)$' -n || true

Length of output: 1005

---

Update package.json entry points to match compiled output

The package currently points at the raw TypeScript source (index.ts) and assumes a dist/ directory for types, but no build artifacts exist and your TS config hasn’t been verified to emit into dist/. Before publishing, you need to:

• Configure packages/wagtail/tsconfig.build.json
  • Ensure "outDir": "./dist" is set
  • Confirm "declaration": true, "emitDeclarationOnly": true (if using a separate build for types)
  • Choose the correct "module" (e.g. "commonjs" for CJS or "ESNext"/"ES2020" for ESM) and matching "moduleResolution"

• Run the build and inspect outputs

  pnpm --filter @baseapp-frontend/wagtail build
  ls -R packages/wagtail/dist

  • Verify that you have index.js (or index.cjs/index.mjs) alongside index.d.ts in dist/

• Update packages/wagtail/package.json to point at those artifacts

  {
    …

• "main": "./index.ts",

• "main": "./dist/index.js",

• "types": "dist/index.d.ts",

• "types": "./dist/index.d.ts",
  …
  }

- (Optional) If you’re publishing separate ESM and CJS builds, either add a `"module"` field pointing at `dist/index.mjs` or use a conditional `"exports"` map to distinguish them.

Without these changes, consumers installing this package will either get uncompiled TypeScript (if your bundler doesn’t transpile it) or receive broken import paths.

<details>
<summary>🤖 Prompt for AI Agents</summary>

In packages/wagtail/package.json around lines 5-6 the package points at the
TypeScript source ("main": "./index.ts") and a types path ("types":
"dist/index.d.ts") but the build output isn't guaranteed to produce those
artifacts; update the build config and package.json: add/verify
packages/wagtail/tsconfig.build.json with "outDir": "./dist", "declaration":
true (and "emitDeclarationOnly": true if using a separate types build), pick a
matching "module" and "moduleResolution", run the build and confirm dist
contains index.js (or index.cjs/index.mjs) and index.d.ts, then change
package.json "main" to the compiled JS entry in dist and "types" to
dist/index.d.ts (and optionally add "module" or an "exports" map for ESM/CJS
variants).

</details>

<!-- fingerprinting:phantom:triton:chinchilla -->

<!-- This is an auto-generated comment by CodeRabbit -->