Skip to content

Conversation

@jianwei1
Copy link
Contributor

@jianwei1 jianwei1 commented Jan 15, 2026

Summary by CodeRabbit

  • New Features
    • Expanded icon library with 10+ new icons (additional arrows, messaging, home, link, audio, note, user/profile, phone), increasing choices in icon pickers and throughout the UI.
  • Documentation / Localization
    • Updated icon labels and translations to reflect new icons and revised display names.

✏️ Tip: You can customize this high-level summary in your review settings.

@jianwei1 jianwei1 requested a review from csiyang January 15, 2026 01:22
@jianwei1 jianwei1 self-assigned this Jan 15, 2026
@linear
Copy link

linear bot commented Jan 15, 2026

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 15, 2026

Walkthrough

Adds ten new icon identifiers across GraphQL schemas, registers new SVG icon components, updates shared and journeys UI icon mappings and admin picker entries, updates tests/stories, and adjusts localization keys. No control-flow or runtime behavior changes beyond expanded icon assets and values.

Changes

Cohort / File(s) Summary
GraphQL schemas
apis/api-gateway/schema.graphql, apis/api-journeys-modern/schema.graphql, apis/api-journeys/schema.graphql, apis/api-journeys/src/app/modules/block/icon/icon.graphql
Added IconName enum values: ArrowLeftContained2, ArrowRightContained2, MessageChat1, Home4, LinkAngled, Volume5, Note2, UserProfile2, UsersProfiles3, Phone.
Icon type values
apis/api-journeys-modern/src/schema/block/icon/enums/iconName.ts, apis/api-journeys-modern/.../iconName.ts* , libs/shared/ui/src/components/icons/Icon.tsx
Extended ICON_NAME_VALUES / IconName union to include the new icon names.
New SVG icon components
libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx, libs/shared/ui/src/components/icons/ArrowRightContained2.tsx, libs/shared/ui/src/components/icons/Note2.tsx, libs/shared/ui/src/components/icons/*, libs/shared/ui/src/components/icons/icon.stories.tsx
Added new SVG icon components and registered them in the shared icon list/stories.
Icon rendering & mapping
libs/journeys/ui/src/components/Icon/Icon.tsx, libs/shared/ui/src/components/icons/Icon.tsx
Replaced several Material UI icon imports with custom icons, updated iconComponents mapping and alias keys, and exposed new icon keys for rendering.
Admin icon picker
apps/journeys-admin/src/components/Editor/.../controls/Icon/Icon.tsx
Expanded and re-mapped the admin icons array: new entries, re-labeled items, reordered list, and swapped display components; runtime selection logic unchanged.
Tests & stories
apps/journeys-admin/src/.../Button/Button.spec.tsx, .../Icon/Icon.spec.tsx, libs/journeys/ui/src/components/*/Button.spec.tsx, Icon.spec.tsx, *.stories.tsx
Updated tests and stories to reflect new/default icon names and adjust expectations/selectors.
Localization
libs/locales/en/apps-journeys-admin.json
Removed legacy icon label keys and added new translation keys matching updated icon labels (reordered and some keys reintroduced elsewhere).

Sequence Diagram(s)

(omitted — changes are asset/mapping updates without new multi-component control-flow)

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

Possibly related PRs

🚥 Pre-merge checks | ✅ 2 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat: add new button icons' accurately describes the primary change—adding new icon options for buttons across the codebase.

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

✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch jianweichong/nes-855-add-phone-and-circle-chat-icon-option-to-leading-and

🧹 Recent nitpick comments
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (1)

57-57: Minor typo: stray quote at end of comment.

There's an extra double quote character at the end of this comment.

Suggested fix
-// icons is equivalent to IconName from global types"
+// icons is equivalent to IconName from global types

📜 Recent review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • 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 c54a787 and 0ca5bc5.

📒 Files selected for processing (1)
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (.cursor/rules/base.mdc)

**/*.{ts,tsx,js,jsx}: Use early returns whenever possible to make the code more readable.
Use descriptive variable and function/const names.
Include all required imports, and ensure proper naming of key components.

Files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/base.mdc)

Define a type if possible.

Files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
apps/**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/apps.mdc)

apps/**/*.{js,jsx,ts,tsx}: Always use MUI over HTML elements; avoid using CSS or tags.
Use descriptive variable and function/const names. Also, event functions should be named with a “handle” prefix, like “handleClick” for onClick and “handleKeyDown” for onKeyDown.
Implement accessibility features on elements. For example, a tag should have a tabindex=“0”, aria-label, on:click, and on:keydown, and similar attributes.

Files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
🧬 Code graph analysis (1)
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (1)
apps/journeys-admin/src/components/Editor/Slider/JourneyFlow/nodes/LinkNode/LinkNode.stories.tsx (1)
  • Bible (143-167)
⏰ 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). (14)
  • GitHub Check: Deploy Preview (watch-modern, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (watch, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (journeys, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (player, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (videos-admin, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (resources, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (short-links, 8596/merge, pull_request, 22)
  • GitHub Check: Deploy Preview (journeys-admin, 8596/merge, pull_request, 22)
  • GitHub Check: lint (22)
  • GitHub Check: test (22, 1/3)
  • GitHub Check: test (22, 2/3)
  • GitHub Check: test (22, 3/3)
  • GitHub Check: build (22)
  • GitHub Check: Analyze (javascript)
🔇 Additional comments (3)
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (3)

19-40: LGTM!

The new icon imports are well-organized and follow the existing import pattern. All imported components are used in the icons array below.


203-301: LGTM!

The component logic correctly:

  • Uses MUI components throughout (FormControl, Select, MenuItem, Box, Typography)
  • Follows naming conventions with handleChange for the event handler
  • Implements accessibility with aria-label on the input
  • Properly renders the new icon set with consistent formatting

58-189: All new IconName enum values are defined and verified.

The icon mappings are correct. The pattern of maintaining existing IconName enum values while updating display components preserves backwards compatibility with existing data.

All new IconName values (ArrowLeftContained2, ArrowRightContained2, MessageChat1, Home4, LinkAngled, Phone, UserProfile2, UsersProfiles3, Volume5, Note2) are properly defined in the generated GraphQL types.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.


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

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

@nx-cloud
Copy link

nx-cloud bot commented Jan 15, 2026

View your CI Pipeline Execution ↗ for commit 0ca5bc5

Command Status Duration Result
nx run journeys-admin-e2e:e2e ✅ Succeeded 3m 43s View ↗
nx run journeys-e2e:e2e ✅ Succeeded 15s View ↗
nx run watch-e2e:e2e ✅ Succeeded 13s View ↗
nx run videos-admin-e2e:e2e ✅ Succeeded 5s View ↗
nx run resources-e2e:e2e ✅ Succeeded 7s View ↗
nx run short-links-e2e:e2e ✅ Succeeded 5s View ↗
nx run player-e2e:e2e ✅ Succeeded 3s View ↗
nx run watch-modern-e2e:e2e ✅ Succeeded 4s View ↗
Additional runs (3) ✅ Succeeded ... View ↗

☁️ Nx Cloud last updated this comment at 2026-01-15 04:24:05 UTC

@github-actions github-actions bot temporarily deployed to Preview - videos-admin January 15, 2026 01:24 Inactive
@github-actions github-actions bot temporarily deployed to Preview - journeys January 15, 2026 01:24 Inactive
@github-actions github-actions bot temporarily deployed to Preview - watch-modern January 15, 2026 01:24 Inactive
@github-actions github-actions bot temporarily deployed to Preview - short-links January 15, 2026 01:24 Inactive
@github-actions github-actions bot requested a deployment to Preview - resources January 15, 2026 01:24 Pending
@github-actions github-actions bot requested a deployment to Preview - journeys-admin January 15, 2026 01:24 Pending
@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
watch-modern ✅ Ready watch-modern preview Thu Jan 15 16:19:29 NZDT 2026

@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
player ✅ Ready player preview Thu Jan 15 16:19:34 NZDT 2026

@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
short-links ✅ Ready short-links preview Thu Jan 15 16:20:18 NZDT 2026

@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
videos-admin ✅ Ready videos-admin preview Thu Jan 15 16:19:45 NZDT 2026

@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
journeys ✅ Ready journeys preview Thu Jan 15 16:20:55 NZDT 2026

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

Caution

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

⚠️ Outside diff range comments (2)
apis/api-gateway/schema.graphql (1)

3425-3458: Update IconName docstring: no longer only “equivalent to @mui/icons-material”.
With custom icons now included (e.g., ArrowLeftContained2, Note2), the comment will mislead consumers. If this file is generated, update the generator/template instead.

Proposed doc fix
-"""
-IconName is equivalent to the icons found in `@mui/icons-material`
-"""
+"""
+IconName is the set of supported icon identifiers exposed by the journeys icon system
+(includes both Material icons and custom icons).
+"""
 enum IconName `@join__type`(graph: API_JOURNEYS)  `@join__type`(graph: API_JOURNEYS_MODERN)  {
apis/api-journeys-modern/schema.graphql (1)

576-606: Add unknown icon fallback to prevent crashes from unmapped IconName values.

The Icon component in libs/shared/ui/src/components/icons/Icon.tsx directly accesses the iconComponents mapping without handling cases where an icon name is not found (when older clients encounter newer enum values from the server). Add a fallback icon or error boundary to gracefully handle unknown values instead of attempting to render undefined.

For example, you could:

  • Return a default/placeholder icon when iconComponents[name] is undefined
  • Add a null check and render null or a fallback component
  • Document that clients must always re-generate their type definitions from the latest schema
🧹 Nitpick comments (3)
apis/api-journeys-modern/src/schema/block/icon/enums/iconName.ts (1)

3-42: Minor: either export ICON_NAME_VALUES (if truly “for reuse”) or adjust the comment.
Right now it’s only reused locally.

Proposed tweak
-// Define the icon name values as a const array for reuse
-const ICON_NAME_VALUES = [
+// Define the icon name values as a const array (single source for this module)
+const ICON_NAME_VALUES = [
   'PlayArrowRounded',
   'TranslateRounded',
   'CheckCircleRounded',
   'RadioButtonUncheckedRounded',
   'FormatQuoteRounded',
   'LockOpenRounded',
   'ArrowForwardRounded',
   'ArrowBackRounded',
   'ChatBubbleOutlineRounded',
   'LiveTvRounded',
   'MenuBookRounded',
   'ChevronRightRounded',
   'ChevronLeftRounded',
   'BeenhereRounded',
   'SendRounded',
   'SubscriptionsRounded',
   'ContactSupportRounded',
   'Launch',
   'MailOutline',
   'ArrowLeftContained2',
   'ArrowRightContained2',
   'MessageChat1',
   'Home4',
   'LinkAngled',
   'Volume5',
   'Note2',
   'UserProfile2',
   'UsersProfiles3',
   'Phone'
 ] as const
apis/api-journeys/schema.graphql (1)

732-763: Consider updating the enum documentation comment.

The comment on line 732 states that IconName is "equivalent to the icons found in @mui/icons-material", but the newly added icons (e.g., ArrowLeftContained2, MessageChat1, Note2) are custom icons, not MUI icons. This documentation is now misleading.

📝 Suggested documentation update
-"""IconName is equivalent to the icons found in `@mui/icons-material`"""
+"""IconName represents available icons, including Material UI icons and custom icons"""
 enum IconName {
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (1)

58-91: Consider extracting shared icon registry to reduce duplication.

The icon mapping here largely duplicates what's in libs/journeys/ui/src/components/Icon/Icon.tsx. A shared icon configuration could be extracted to @core/shared/ui/icons to serve both the runtime component and the admin selector, reducing maintenance burden when adding new icons.

📜 Review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

  • 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 f1d0722 and 50bb0a8.

⛔ Files ignored due to path filters (8)
  • apis/api-journeys/src/__generated__/graphql.ts is excluded by !**/__generated__/**
  • apis/api-journeys/src/app/__generated__/graphql.ts is excluded by !**/__generated__/**
  • apps/journeys-admin/__generated__/globalTypes.ts is excluded by !**/__generated__/**
  • apps/journeys/__generated__/globalTypes.ts is excluded by !**/__generated__/**
  • apps/resources/__generated__/globalTypes.ts is excluded by !**/__generated__/**
  • apps/watch/__generated__/globalTypes.ts is excluded by !**/__generated__/**
  • libs/journeys/ui/__generated__/globalTypes.ts is excluded by !**/__generated__/**
  • libs/shared/gql/src/__generated__/graphql-env.d.ts is excluded by !**/__generated__/**
📒 Files selected for processing (19)
  • apis/api-gateway/schema.graphql
  • apis/api-journeys-modern/schema.graphql
  • apis/api-journeys-modern/src/schema/block/icon/enums/iconName.ts
  • apis/api-journeys/schema.graphql
  • apis/api-journeys/src/app/modules/block/icon/icon.graphql
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
  • libs/journeys/ui/src/components/Button/Button.spec.tsx
  • libs/journeys/ui/src/components/Button/Button.stories.tsx
  • libs/journeys/ui/src/components/Icon/Icon.spec.tsx
  • libs/journeys/ui/src/components/Icon/Icon.stories.tsx
  • libs/journeys/ui/src/components/Icon/Icon.tsx
  • libs/locales/en/apps-journeys-admin.json
  • libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx
  • libs/shared/ui/src/components/icons/ArrowRightContained2.tsx
  • libs/shared/ui/src/components/icons/Icon.tsx
  • libs/shared/ui/src/components/icons/Note2.tsx
  • libs/shared/ui/src/components/icons/icon.stories.tsx
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (.cursor/rules/base.mdc)

**/*.{ts,tsx,js,jsx}: Use early returns whenever possible to make the code more readable.
Use descriptive variable and function/const names.
Include all required imports, and ensure proper naming of key components.

Files:

  • libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx
  • libs/shared/ui/src/components/icons/ArrowRightContained2.tsx
  • libs/journeys/ui/src/components/Icon/Icon.spec.tsx
  • libs/shared/ui/src/components/icons/Icon.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx
  • libs/shared/ui/src/components/icons/icon.stories.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
  • libs/journeys/ui/src/components/Button/Button.stories.tsx
  • libs/shared/ui/src/components/icons/Note2.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
  • libs/journeys/ui/src/components/Button/Button.spec.tsx
  • libs/journeys/ui/src/components/Icon/Icon.stories.tsx
  • libs/journeys/ui/src/components/Icon/Icon.tsx
  • apis/api-journeys-modern/src/schema/block/icon/enums/iconName.ts
**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/base.mdc)

Define a type if possible.

Files:

  • libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx
  • libs/shared/ui/src/components/icons/ArrowRightContained2.tsx
  • libs/journeys/ui/src/components/Icon/Icon.spec.tsx
  • libs/shared/ui/src/components/icons/Icon.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx
  • libs/shared/ui/src/components/icons/icon.stories.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
  • libs/journeys/ui/src/components/Button/Button.stories.tsx
  • libs/shared/ui/src/components/icons/Note2.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
  • libs/journeys/ui/src/components/Button/Button.spec.tsx
  • libs/journeys/ui/src/components/Icon/Icon.stories.tsx
  • libs/journeys/ui/src/components/Icon/Icon.tsx
  • apis/api-journeys-modern/src/schema/block/icon/enums/iconName.ts
apps/**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/apps.mdc)

apps/**/*.{js,jsx,ts,tsx}: Always use MUI over HTML elements; avoid using CSS or tags.
Use descriptive variable and function/const names. Also, event functions should be named with a “handle” prefix, like “handleClick” for onClick and “handleKeyDown” for onKeyDown.
Implement accessibility features on elements. For example, a tag should have a tabindex=“0”, aria-label, on:click, and on:keydown, and similar attributes.

Files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
🧠 Learnings (9)
📚 Learning: 2025-12-19T04:58:24.460Z
Learnt from: CR
Repo: JesusFilm/core PR: 0
File: apps/watch/AGENTS.md:0-0
Timestamp: 2025-12-19T04:58:24.460Z
Learning: Applies to apps/watch/src/**/*.{ts,tsx} : Do not introduce new MUI usage; migrate existing MUI to shadcn/Tailwind. New shadcn work should coexist with core shells/wrappers still using MUI until explicit migration tasks retire them.

Applied to files:

  • libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
  • libs/journeys/ui/src/components/Icon/Icon.tsx
📚 Learning: 2025-07-15T03:19:53.274Z
Learnt from: Kneesal
Repo: JesusFilm/core PR: 7171
File: apps/watch/src/components/LanguageSwitchDialog/SubtitlesSelect/SubtitlesSelect.spec.tsx:125-125
Timestamp: 2025-07-15T03:19:53.274Z
Learning: The team has a specific approach for testing icons that differs from using data-testid or role/aria-label attributes. Need to learn their established pattern for icon testing in test files.

Applied to files:

  • libs/journeys/ui/src/components/Icon/Icon.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx
  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
  • libs/journeys/ui/src/components/Button/Button.spec.tsx
📚 Learning: 2025-12-19T04:58:24.460Z
Learnt from: CR
Repo: JesusFilm/core PR: 0
File: apps/watch/AGENTS.md:0-0
Timestamp: 2025-12-19T04:58:24.460Z
Learning: Applies to apps/watch/src/**/*.{ts,tsx} : Compose UI with shadcn/ui primitives or semantic HTML styled via Tailwind. Use the shared `cn` helper for conditional classes.

Applied to files:

  • libs/shared/ui/src/components/icons/icon.stories.tsx
📚 Learning: 2025-11-16T21:30:53.412Z
Learnt from: Kneesal
Repo: JesusFilm/core PR: 8309
File: apps/journeys-admin/setupTests.tsx:47-51
Timestamp: 2025-11-16T21:30:53.412Z
Learning: In apps/journeys-admin/setupTests.tsx, the `document.clearImmediate` mock is required for tests involving the mux upload provider, as an underlying library uses clearImmediate for timeout management to prevent race conditions and unnecessary polling calls.

Applied to files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx
📚 Learning: 2025-08-20T23:32:18.117Z
Learnt from: mikeallisonJS
Repo: JesusFilm/core PR: 7486
File: apis/api-journeys-modern/schema.graphql:199-205
Timestamp: 2025-08-20T23:32:18.117Z
Learning: The ChatButton.link field in api-journeys is actually nullable (String), not non-nullable (String!) as previously learned. When migrating GraphQL types from api-journeys to api-journeys-modern, the ChatButton.link field should remain nullable to match the existing api-journeys schema.

Applied to files:

  • apis/api-journeys-modern/schema.graphql
📚 Learning: 2025-12-19T04:58:24.460Z
Learnt from: CR
Repo: JesusFilm/core PR: 0
File: apps/watch/AGENTS.md:0-0
Timestamp: 2025-12-19T04:58:24.460Z
Learning: Applies to apps/watch/src/**/*.tsx : Use optional props with sensible defaults, include className prop for extensibility, and use ReactNode for children and content slots. Name interfaces with component name prefix (e.g., `ComponentNameProps`).

Applied to files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
📚 Learning: 2025-12-19T04:58:24.460Z
Learnt from: CR
Repo: JesusFilm/core PR: 0
File: apps/watch/AGENTS.md:0-0
Timestamp: 2025-12-19T04:58:24.460Z
Learning: Applies to apps/watch/src/**/*.{ts,tsx} : Use `<Link>` for navigation instead of custom click handlers in Next.js.

Applied to files:

  • apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx
📚 Learning: 2025-12-19T19:18:43.790Z
Learnt from: CR
Repo: JesusFilm/core PR: 0
File: apps/resources/AGENTS.md:0-0
Timestamp: 2025-12-19T19:18:43.790Z
Learning: Applies to apps/resources/**/*.spec.ts?(x) : Wrap component specs with `MockedProvider`, `VideoProvider`, and `WatchProvider` when the unit touches those contexts—`NewVideoContentPage.spec.tsx` shows the expected harness

Applied to files:

  • libs/journeys/ui/src/components/Button/Button.spec.tsx
📚 Learning: 2025-09-12T20:30:23.683Z
Learnt from: mikeallisonJS
Repo: JesusFilm/core PR: 7658
File: libs/locales/ms-MY/apps-watch.json:62-62
Timestamp: 2025-09-12T20:30:23.683Z
Learning: Interpolation spacing and localization fixes for i18n files are specific to journeys-admin context and may not apply to other apps like apps-watch.

Applied to files:

  • libs/locales/en/apps-journeys-admin.json
🧬 Code graph analysis (5)
libs/journeys/ui/src/components/Icon/Icon.spec.tsx (1)
apis/api-journeys-modern/src/schema/block/icon/enums/iconSize.ts (1)
  • IconSize (10-12)
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx (1)
libs/shared/ui/src/components/icons/Icon.tsx (1)
  • IconName (235-465)
apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (1)
apps/journeys-admin/src/components/Editor/Slider/JourneyFlow/nodes/LinkNode/LinkNode.stories.tsx (1)
  • Bible (143-167)
libs/journeys/ui/src/components/Button/Button.spec.tsx (1)
libs/shared/ui/src/components/icons/Icon.tsx (1)
  • IconName (235-465)
libs/journeys/ui/src/components/Icon/Icon.tsx (1)
apps/journeys-admin/src/components/Editor/Slider/JourneyFlow/nodes/LinkNode/LinkNode.stories.tsx (1)
  • Bible (143-167)
⏰ 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). (7)
  • GitHub Check: affected (22)
  • GitHub Check: test (22, 2/3)
  • GitHub Check: lint (22)
  • GitHub Check: test (22, 1/3)
  • GitHub Check: test (22, 3/3)
  • GitHub Check: build (22)
  • GitHub Check: Analyze (javascript)
🔇 Additional comments (26)
libs/shared/ui/src/components/icons/Note2.tsx (1)

1-10: LGTM: standard createSvgIcon wrapper and naming matches IconName (Note2).
No issues spotted in the SVG wrapper.

libs/shared/ui/src/components/icons/ArrowLeftContained2.tsx (1)

1-17: LGTM: clean SVG composition and correct component key (ArrowLeftContained2).

apis/api-journeys/src/app/modules/block/icon/icon.graphql (1)

1-34: LGTM! The enum expansion is consistent with the main schema.

The new icon values are correctly added and align with the broader icon system updates. Same documentation comment applies here regarding the outdated reference to MUI icons.

libs/locales/en/apps-journeys-admin.json (1)

380-398: LGTM! Localization keys added for new icons.

The new icon labels are clear and follow the existing naming patterns in the file. The user-friendly labels (e.g., "Arrow Circle Left" for ArrowLeftContained2) will provide a better experience in the UI.

libs/journeys/ui/src/components/Button/Button.stories.tsx (1)

144-169: LGTM! Improved icon choices for the story.

Using ChevronLeftRounded for the Start icon and ChevronRightRounded for the End icon provides better visual semantics than the previous CheckCircleRounded, clearly demonstrating directional leading/trailing icon usage.

apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/blocks/Button/Button.spec.tsx (1)

100-144: LGTM! Test updates correctly reflect the new icon choices.

The test data and assertions are properly updated to use ChevronLeftRounded for the leading icon with the corresponding accessibility text "Leading Icon Chevron Left". This maintains consistency with the Storybook story changes and ensures the Button component is tested with the updated icon configuration.

libs/journeys/ui/src/components/Icon/Icon.spec.tsx (1)

14-64: LGTM!

The test updates are consistent throughout the file - the icon name in the test block and all corresponding test ID selectors have been properly updated to use ArrowForwardRounded. The size assertions for sm (16px), md (20px), lg (28px), and xl (48px) remain correct.

libs/shared/ui/src/components/icons/Icon.tsx (6)

18-23: LGTM!

The new icon imports (ArrowLeftContained2, ArrowRightContained2) are correctly placed in alphabetical order among the existing arrow icon imports.


163-163: LGTM!

The Note2 import is correctly positioned alphabetically after More.


249-254: LGTM!

The new icon names are properly added to the IconName union type, maintaining alphabetical consistency with the existing entries.


395-395: LGTM!

Note2 is correctly added to the IconName union type.


485-490: LGTM!

The new icon components are correctly registered in the iconComponents mapping object, matching their corresponding imports and type definitions.


631-631: LGTM!

Note2 is properly added to the iconComponents mapping.

libs/journeys/ui/src/components/Button/Button.spec.tsx (2)

1093-1121: LGTM!

The start icon test is consistently updated to use ChevronLeftRounded with the matching test ID selector ChevronLeftRoundedIcon. The test assertions properly verify the icon class and parent element class.


1123-1151: LGTM!

The end icon test mirrors the start icon test updates with consistent use of ChevronLeftRounded and its test ID.

apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.spec.tsx (3)

171-207: LGTM!

The "changes the icon when selecting a different icon" test is properly updated with consistent use of IconName.ChevronLeftRounded in both the GraphQL variables and response, matching the UI option label 'Chevron Left'.


209-271: LGTM!

The undo test correctly models the state transition from ArrowForwardRounded to ChevronLeftRounded and back, with properly configured GraphQL mocks for both directions.


273-340: LGTM!

The redo test properly configures maxUsageCount: 2 on the first mock to handle the redo action, and the state transitions are correctly modeled.

libs/shared/ui/src/components/icons/ArrowRightContained2.tsx (1)

1-17: LGTM!

The new icon component follows the established pattern in this codebase:

  • Uses createSvgIcon from MUI utilities
  • Default export with matching icon name
  • Proper SVG path definitions with fillRule and clipRule attributes
libs/shared/ui/src/components/icons/icon.stories.tsx (1)

8-8: LGTM!

The new icons (ArrowLeftContained2, ArrowRightContained2, Note2) are correctly added to the storybook showcase, and CenterCheck is properly enabled for visual testing of icon alignment.

Also applies to: 25-25, 30-30, 171-171, 326-326

libs/journeys/ui/src/components/Icon/Icon.stories.tsx (2)

85-115: LGTM!

The expanded variants list properly showcases all the new icons added in this PR. The icon additions align with the GraphQL schema and component changes.


160-160: Default icon change looks intentional.

The default iconName switched from CheckCircleRounded to ChevronLeftRounded for both Color and Size stories. This appears consistent with the broader icon updates.

Also applies to: 202-202

libs/journeys/ui/src/components/Icon/Icon.tsx (2)

10-31: LGTM! Icon mappings correctly extend the registry.

The icon component properly maps all new IconName enum values to their corresponding custom icon components. Good practice retaining backward compatibility for deprecated icons with clear comments.

Also applies to: 58-91


93-96: The suggested RTL handling approach is incorrect. The new icons don't require the same RTL treatment:

  • ArrowLeftContained2 and ArrowRightContained2 are separate, directionally-designed icons—select the appropriate one based on RTL context rather than flipping a single icon.
  • MessageChat1 is a chat bubble with no directional visual elements; it doesn't need RTL handling.
  • Send2 already receives RTL handling through the existing SendRounded mapping (line 70).

The current flipping approach (lines 93-96) applies only to icons like SendRounded and ChatBubbleOutlineRounded that reuse the same visual. For directional arrow icons, the pattern should be conditional selection of the correct variant.

Likely an incorrect or invalid review comment.

apps/journeys-admin/src/components/Editor/Slider/Settings/CanvasDetails/Properties/controls/Icon/Icon.tsx (2)

16-37: LGTM! Imports align with the icon component updates.

The new icon imports correctly match those added in libs/journeys/ui/src/components/Icon/Icon.tsx, maintaining consistency across the codebase.


58-188: Icon entries correctly expanded with consistent structure.

All new icons follow the established pattern with value, label, and display properties. The display components correctly use the new custom icons from @core/shared/ui/icons.

✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.

@github-actions github-actions bot temporarily deployed to Preview - videos-admin January 15, 2026 01:30 Inactive
@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
resources ✅ Ready resources preview Thu Jan 15 16:19:58 NZDT 2026

@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The latest updates on your projects.

Name Status Preview Updated (UTC)
journeys-admin ✅ Ready journeys-admin preview Thu Jan 15 17:14:34 NZDT 2026

@github-actions github-actions bot temporarily deployed to Preview - resources January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - journeys January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - videos-admin January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - short-links January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - journeys-admin January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - watch-modern January 15, 2026 02:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview - videos-admin January 15, 2026 03:17 Inactive
@github-actions github-actions bot temporarily deployed to Preview - journeys January 15, 2026 03:17 Inactive
@github-actions github-actions bot temporarily deployed to Preview - short-links January 15, 2026 03:17 Inactive
@github-actions github-actions bot temporarily deployed to Preview - journeys-admin January 15, 2026 03:17 Inactive
@github-actions github-actions bot temporarily deployed to Preview - watch-modern January 15, 2026 03:17 Inactive
@github-actions github-actions bot temporarily deployed to Preview - resources January 15, 2026 03:17 Inactive
@blacksmith-sh

This comment has been minimized.

@stage-branch-merger
Copy link

I see you added the "on stage" label, I'll get this merged to the stage branch!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants