Conversation
WalkthroughThis pull request updates CI release-note extraction and the Changerawr payload shape, removes caching from config API endpoint constructors, applies consistent SelectContent max-height/padding across multiple UI components, and allows core store re-initialization by removing the isInitialized short-circuit. Changes
Sequence Diagram(s)sequenceDiagram
participant CI as GitHub Actions
participant Script as release-note script
participant File as RELEASE_NOTES.md
participant Changerawr as Changerawr API
CI->>Script: extract notes from PR body
Script->>Script: remove lines matching "Summary by CodeRabbit"
Script->>File: write filtered notes
Script->>Changerawr: POST payload {version, title:"Release v<version>", content}
Changerawr-->>Script: 200/err
Script-->>CI: step result
sequenceDiagram
participant App as Application
participant Core as core-store
App->>Core: init()
alt isInitializing == true
Core-->>App: return (in-progress)
else
Core->>Core: perform initialization (note: no isInitialized short-circuit)
Core-->>App: init complete / error
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Possibly related PRs
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
⏰ 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)
🔇 Additional comments (2)
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. Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
.github/workflows/react-native-cicd.yml(2 hunks)src/api/config/index.ts(1 hunks)src/app/call/[id]/edit.tsx(2 hunks)src/app/call/new/index.tsx(2 hunks)src/components/audio-stream/audio-stream-bottom-sheet.tsx(1 hunks)src/components/calls/close-call-bottom-sheet.tsx(1 hunks)src/components/messages/compose-message-sheet.tsx(1 hunks)src/components/roles/role-assignment-item.tsx(1 hunks)src/components/settings/language-item.tsx(1 hunks)src/components/settings/theme-item.tsx(1 hunks)src/stores/app/core-store.ts(0 hunks)
💤 Files with no reviewable changes (1)
- src/stores/app/core-store.ts
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursorrules)
**/*.{ts,tsx}: Write concise, type-safe TypeScript code
Use camelCase for variable and function names
Use TypeScript for all components and favor interfaces for props and state
Avoid using any; use precise types
Use React Navigation for navigation and deep linking following best practices
Handle errors gracefully and provide user feedback
Implement proper offline support (caching, queueing, retries)
Use Expo SecureStore for sensitive data storage
Use zustand for state management
Use react-hook-form for form handling
Use react-query for data fetching and caching
Use react-native-mmkv for local storage
Use axios for API requests
**/*.{ts,tsx}: Write concise, type-safe TypeScript code
Use camelCase for variable and function names
Use TypeScript for all components, favoring interfaces for props and state
Avoid using any; strive for precise types
Ensure support for dark mode and light mode
Handle errors gracefully and provide user feedback
Use react-query for data fetching
Use react-i18next for internationalization
Use react-native-mmkv for local storage
Use axios for API requests
Files:
src/components/audio-stream/audio-stream-bottom-sheet.tsxsrc/app/call/new/index.tsxsrc/components/settings/language-item.tsxsrc/components/roles/role-assignment-item.tsxsrc/components/settings/theme-item.tsxsrc/components/calls/close-call-bottom-sheet.tsxsrc/app/call/[id]/edit.tsxsrc/components/messages/compose-message-sheet.tsxsrc/api/config/index.ts
**/*.tsx
📄 CodeRabbit inference engine (.cursorrules)
**/*.tsx: Use functional components and React hooks instead of class components
Use PascalCase for React component names
Use React.FC for defining functional components with props
Minimize useEffect/useState usage and avoid heavy computations during render
Use React.memo for components with static props to prevent unnecessary re-renders
Optimize FlatList with removeClippedSubviews, maxToRenderPerBatch, and windowSize
Provide getItemLayout to FlatList when items have consistent size
Avoid anonymous functions in renderItem or event handlers; define callbacks with useCallback or outside render
Use gluestack-ui for styling where available from components/ui; otherwise, style via StyleSheet.create or styled-components
Ensure responsive design across screen sizes and orientations
Use react-native-fast-image for image handling instead of the default Image where appropriate
Wrap all user-facing text in t() from react-i18next for translations
Support dark mode and light mode in UI components
Use @rnmapbox/maps for maps or navigation features
Use lucide-react-native for icons directly; do not use the gluestack-ui icon component
Use conditional rendering with the ternary operator (?:) instead of &&
**/*.tsx: Use functional components and hooks over class components
Ensure components are modular, reusable, and maintainable
Ensure all components are mobile-friendly, responsive, and support both iOS and Android
Use PascalCase for component names
Utilize React.FC for defining functional components with props
Minimize useEffect, useState, and heavy computations inside render
Use React.memo for components with static props to prevent unnecessary re-renders
Optimize FlatList with removeClippedSubviews, maxToRenderPerBatch, and windowSize
Use getItemLayout for FlatList when items have consistent size
Avoid anonymous functions in renderItem or event handlers to prevent re-renders
Ensure responsive design for different screen sizes and orientations
Optimize image handling using rea...
Files:
src/components/audio-stream/audio-stream-bottom-sheet.tsxsrc/app/call/new/index.tsxsrc/components/settings/language-item.tsxsrc/components/roles/role-assignment-item.tsxsrc/components/settings/theme-item.tsxsrc/components/calls/close-call-bottom-sheet.tsxsrc/app/call/[id]/edit.tsxsrc/components/messages/compose-message-sheet.tsx
src/**
📄 CodeRabbit inference engine (.cursorrules)
src/**: Organize files by feature, grouping related components, hooks, and styles
Directory and file names should be lowercase and hyphenated (e.g., user-profile)
Files:
src/components/audio-stream/audio-stream-bottom-sheet.tsxsrc/app/call/new/index.tsxsrc/components/settings/language-item.tsxsrc/components/roles/role-assignment-item.tsxsrc/components/settings/theme-item.tsxsrc/components/calls/close-call-bottom-sheet.tsxsrc/app/call/[id]/edit.tsxsrc/components/messages/compose-message-sheet.tsxsrc/api/config/index.ts
🧠 Learnings (5)
📚 Learning: 2025-08-21T02:47:24.081Z
Learnt from: CR
Repo: Resgrid/Responder PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-08-21T02:47:24.081Z
Learning: Applies to **/*.tsx : Ensure UI is intuitive, user-friendly, and works across different devices and screen sizes
Applied to files:
src/components/settings/language-item.tsxsrc/components/roles/role-assignment-item.tsxsrc/components/settings/theme-item.tsxsrc/app/call/[id]/edit.tsxsrc/components/messages/compose-message-sheet.tsx
📚 Learning: 2025-08-21T02:46:42.743Z
Learnt from: CR
Repo: Resgrid/Responder PR: 0
File: .cursorrules:0-0
Timestamp: 2025-08-21T02:46:42.743Z
Learning: Applies to **/*.tsx : Use gluestack-ui for styling where available from components/ui; otherwise, style via StyleSheet.create or styled-components
Applied to files:
src/components/roles/role-assignment-item.tsxsrc/components/settings/theme-item.tsxsrc/components/messages/compose-message-sheet.tsx
📚 Learning: 2025-08-21T02:46:42.743Z
Learnt from: CR
Repo: Resgrid/Responder PR: 0
File: .cursorrules:0-0
Timestamp: 2025-08-21T02:46:42.743Z
Learning: Applies to **/*.tsx : Support dark mode and light mode in UI components
Applied to files:
src/components/settings/theme-item.tsx
📚 Learning: 2025-08-21T02:47:24.081Z
Learnt from: CR
Repo: Resgrid/Responder PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-08-21T02:47:24.081Z
Learning: Applies to **/*.{ts,tsx} : Ensure support for dark mode and light mode
Applied to files:
src/components/settings/theme-item.tsx
📚 Learning: 2025-08-21T02:47:24.081Z
Learnt from: CR
Repo: Resgrid/Responder PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-08-21T02:47:24.081Z
Learning: Applies to src/components/ui/**/*.tsx : Use gluestack-ui components from components/ui; if unavailable, style via StyleSheet.create or styled-components
Applied to files:
src/components/messages/compose-message-sheet.tsx
🧬 Code graph analysis (1)
src/api/config/index.ts (1)
src/api/common/client.tsx (1)
createApiEndpoint(211-218)
⏰ 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: test
🔇 Additional comments (11)
src/components/calls/close-call-bottom-sheet.tsx (1)
198-198: LGTM! Consistent dropdown styling improvement.This styling constraint ensures the dropdown doesn't overflow on smaller screens and provides appropriate bottom padding. The change is consistent with the same pattern applied across multiple components in this PR.
src/components/audio-stream/audio-stream-bottom-sheet.tsx (1)
148-148: LGTM! Consistent styling update.The dropdown height constraint and padding align with the UI refinements applied throughout the codebase.
src/components/messages/compose-message-sheet.tsx (1)
413-413: LGTM! Consistent dropdown styling.This ensures the message type dropdown remains usable on various screen sizes.
src/components/roles/role-assignment-item.tsx (1)
38-38: LGTM! Consistent styling update.This is particularly useful for role assignment dropdowns that may contain many users.
src/app/call/[id]/edit.tsx (2)
644-644: LGTM! Consistent dropdown styling for priority selection.This ensures the priority dropdown remains usable and doesn't overflow the viewport.
677-677: LGTM! Consistent dropdown styling for type selection.This matches the styling applied to the priority dropdown and maintains consistency across the form.
src/components/settings/language-item.tsx (1)
46-46: LGTM! Consistent styling for language selection.This ensures the language dropdown remains accessible and properly styled.
src/components/settings/theme-item.tsx (1)
46-46: LGTM! Consistent styling for theme selection.This completes the consistent styling pattern applied across all SelectContent components in the application.
.github/workflows/react-native-cicd.yml (1)
345-346: LGTM! Filtering AI-generated summaries from release notes.The
grep -vcommand safely removes CodeRabbit summary lines from the release notes. The command won't fail if no matching lines are found sincegrep -vsucceeds when filtering out patterns.src/api/config/index.ts (1)
4-4: LGTM: Import path updated appropriately.The import path change from
../common/cached-clientto../commoncorrectly aligns with the switch to non-cached endpoint construction.src/app/call/new/index.tsx (1)
834-834: LGTM: Improved dropdown UX with height constraints.The addition of
max-h-[60vh] pb-20to both SelectContent components appropriately constrains dropdown height and adds bottom padding. This prevents overflow on smaller viewports and ensures scrollable content remains accessible, particularly on mobile devices with system UI or safe area insets.Also applies to: 867-867
| "version": $version, | ||
| "title": ("Release v" + $version), | ||
| "content": $notes, | ||
| }') |
There was a problem hiding this comment.
🧩 Analysis chain
Fix JSON syntax error and verify API compatibility.
There's a trailing comma after the last field in the JSON object (line 405), which will cause the jq command to fail.
Apply this fix:
PAYLOAD=$(jq -n \
--arg version "$VERSION" \
--arg date "$RELEASE_DATE" \
--argjson notes "$NOTES_JSON" \
--arg repo "${{ github.repository }}" \
--arg commit "${{ github.sha }}" \
--arg actor "${{ github.actor }}" \
--arg run_url "${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}" \
'{
"version": $version,
"title": ("Release v" + $version),
- "content": $notes,
+ "content": $notes
}')Additionally, the payload structure has been significantly simplified, removing metadata fields like date, repo, commit, actor, and run_url. Verify that the Changerawr API accepts this new format and doesn't require these fields.
I'll help verify this review comment. Let me inspect the actual workflow file and validate the claims.
🏁 Script executed:
#!/bin/bash
# Find and display the relevant section of the workflow file
fd 'react-native-cicd.yml' --type fLength of output: 0
🏁 Script executed:
#!/bin/bash
# Display the context around lines 402-405 in the workflow file
if [ -f ".github/workflows/react-native-cicd.yml" ]; then
sed -n '395,415p' ".github/workflows/react-native-cicd.yml"
fiLength of output: 862
🏁 Script executed:
#!/bin/bash
# Test jq syntax with trailing comma (should fail)
echo '{"version":"1.0","title":"Release v1.0","content":"notes",}' | jq . 2>&1 | head -20Length of output: 65
🏁 Script executed:
#!/bin/bash
# Test jq syntax without trailing comma (should succeed)
echo '{"version":"1.0","title":"Release v1.0","content":"notes"}' | jq . 2>&1 | head -20Length of output: 71
🏁 Script executed:
#!/bin/bash
# Search for Changerawr API references in the codebase
rg -i "changerawr" --type yaml -A5 -B5Length of output: 148
🏁 Script executed:
#!/bin/bash
# Search for PAYLOAD variable usage and construction
rg "PAYLOAD" ".github/workflows/react-native-cicd.yml" -n -A10 -B5Length of output: 1576
Fix JSON syntax error and verify API compatibility.
The trailing comma on line 405 (after "content": $notes,) is a confirmed syntax error that will cause jq to fail with a parse error. The diff provided is correct and necessary.
Additionally, the metadata fields (date, repo, commit, actor, run_url) are defined as jq arguments but excluded from the final JSON payload. Verify that the Changerawr API endpoint accepts this simplified payload format and does not require these fields for proper operation.
PAYLOAD=$(jq -n \
--arg version "$VERSION" \
--arg date "$RELEASE_DATE" \
--argjson notes "$NOTES_JSON" \
--arg repo "${{ github.repository }}" \
--arg commit "${{ github.sha }}" \
--arg actor "${{ github.actor }}" \
--arg run_url "${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}" \
'{
"version": $version,
"title": ("Release v" + $version),
- "content": $notes,
+ "content": $notes
}')🤖 Prompt for AI Agents
.github/workflows/react-native-cicd.yml around lines 402 to 405: the jq JSON
currently has a trailing comma after "content": $notes, which causes jq parse
errors; remove the trailing comma so the object ends with "content": $notes and
re-run the workflow; also confirm the Changerawr API accepts the simplified
payload (version, title, content) — if the API requires metadata (date, repo,
commit, actor, run_url) add those fields into the JSON object using the existing
jq arguments or update the API call to tolerate the reduced payload.
| const getConfigApi = createApiEndpoint('/Config/GetConfig'); | ||
|
|
||
| const getSystemConfigApi = createCachedApiEndpoint('/Config/GetSystemConfig', { | ||
| ttl: 60 * 1000 * 1440, // Cache for 1 days | ||
| enabled: false, | ||
| }); | ||
| const getSystemConfigApi = createApiEndpoint('/Config/GetSystemConfig'); |
There was a problem hiding this comment.
🧩 Analysis chain
Verify performance implications of removing caching.
The removal of cached endpoint construction eliminates TTL-based caching for configuration data. Since config data typically changes infrequently, this could lead to unnecessary API calls if these endpoints are invoked frequently (e.g., on navigation or component remounts).
Please verify:
- The frequency of calls to
getConfigandgetSystemConfigthroughout the application - Whether alternative caching mechanisms (e.g., react-query, zustand state persistence) are in place
- The performance impact on load times and API request volume
Run the following script to identify usage patterns:
🏁 Script executed:
#!/bin/bash
# Description: Find all usages of getConfig and getSystemConfig to assess call frequency
# Search for direct function calls
rg -nP --type=ts --type=tsx -C3 '\b(getConfig|getSystemConfig)\s*\(' -g '!**/node_modules/**' -g '!**/*.test.*'
# Search for imports to understand consumption patterns
rg -nP --type=ts --type=tsx 'from.*@/api/config' -g '!**/node_modules/**' -g '!**/*.test.*'Length of output: 55
🏁 Script executed:
#!/bin/bash
# Description: Find all usages of getConfig and getSystemConfig to assess call frequency
# Using glob patterns instead of --type parameter to avoid filetype issues
# Search for direct function calls in ts and tsx files
rg -nP -C3 '\b(getConfig|getSystemConfig)\s*\(' -g '*.ts' -g '*.tsx' -g '!**/node_modules/**' -g '!**/*.test.*'
# Search for imports from the config module
rg -nP 'from.*@/api/config' -g '*.ts' -g '*.tsx' -g '!**/node_modules/**' -g '!**/*.test.*'Length of output: 1057
🏁 Script executed:
#!/bin/bash
# Description: Examine the core-store implementation to understand state caching behavior
# View the initialization and fetchConfig methods
sed -n '75,205p' src/stores/app/core-store.ts
# Also check if there are any selectors or hooks that consume this store
rg -nP 'useAppStore|useShallow|subscribe' src/stores/app/core-store.ts -A2 -B2Length of output: 4407
🏁 Script executed:
#!/bin/bash
# Description: Check for react-query usage and fetchConfig invocation patterns
# Search for react-query useQuery hooks related to config
rg -nP 'useQuery|useMutation' -g '*.ts' -g '*.tsx' | head -20
# Find all places where fetchConfig is called
rg -nP 'fetchConfig\s*\(' -g '*.ts' -g '*.tsx' -C2
# Check if react-query is in package.json
grep -i 'react-query\|@tanstack/react-query' package.jsonLength of output: 1312
🏁 Script executed:
#!/bin/bash
# Description: Verify if there's any alternative caching/TTL mechanism in place
# Check the createApiEndpoint function to see if it has any built-in caching
rg -nP 'createApiEndpoint|createCachedApiEndpoint' -g '*.ts' -g '*.tsx' -B3 -A5 | head -40
# Look at the actual endpoint creation in the config file
cat src/api/config/index.tsLength of output: 3008
Restore caching for configuration endpoints or implement react-query hooks per coding guidelines.
The removal of createCachedApiEndpoint is a regression. Other API modules in the codebase (units, notes, etc.) consistently use cached endpoints with multi-day TTLs for similar static data. The config endpoints—which are called during app initialization and can be refreshed via fetchConfig() (invoked from _layout.tsx:153 in concurrent batches)—now lack HTTP-level cache protection.
Zustand state caching alone does not prevent duplicate concurrent API calls. Additionally, your coding guidelines mandate using react-query for data fetching and caching, which is not currently applied here.
Fix: Either restore createCachedApiEndpoint with an appropriate TTL (suggest 1-2 hours for config data), or migrate to react-query hooks per your architectural standards (src/api/config/index.ts lines 6-8).
🤖 Prompt for AI Agents
In src/api/config/index.ts around lines 6 to 8, the config endpoints were
changed to use createApiEndpoint which removed HTTP-level caching and caused a
regression; restore caching by replacing createApiEndpoint with
createCachedApiEndpoint (or reintroduce a cached wrapper) for these two
endpoints and set a sensible TTL (suggest 1–2 hours) so concurrent app
initialization calls are deduplicated and stale data is avoided; alternatively,
migrate these endpoints to react-query hooks per guidelines (implement
useGetConfig / useGetSystemConfig with appropriate staleTime/cacheTime and query
keys) and update fetchConfig() callers to use the new hooks or cached endpoint
to ensure single-flight requests and multi-day/hour TTL as required.
|
Approve |
Summary by CodeRabbit
Bug Fixes
Refactor
Chores
✏️ Tip: You can customize this high-level summary in your review settings.