ProfileScreen rework: visual refresh, edit UX overhaul, settings expansion#26
Conversation
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (5)
📝 WalkthroughWalkthroughAdds a profile-level Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant ProfileScreen
participant API as Profile API
participant LogModal
User->>ProfileScreen: change default_context and tap "Save"
ProfileScreen->>API: updateProfile({ default_context })
API-->>ProfileScreen: 200 OK (updated profile)
ProfileScreen-->>User: UI reflects saved profile
Note right of LogModal: Later when creating a log
User->>LogModal: open modal
LogModal->>ProfileScreen: read profile (useProfile)
ProfileScreen-->>LogModal: returns profile with default_context
LogModal->>LogModal: initialise selectedContext = profile.default_context
LogModal-->>User: modal shows preselected context
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Review rate limit: 8/10 reviews remaining, refill in 11 minutes and 8 seconds. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 9
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.github/workflows/main.yml:
- Around line 3-7: Update the GitHub Actions trigger under the on: block so PRs
targeting develop also run this workflow: add "develop" to the branches arrays
for pull_request (and optionally push if you want pushes to develop to trigger
too), i.e., modify the existing pull_request.branches (and push.branches if
desired) entries so they include both main and develop to ensure the TypeScript
gate runs for PRs into develop as well.
- Around line 14-18: Update the GitHub Actions steps to use the latest
maintained action versions: replace uses: actions/checkout@v2 with
actions/checkout@v6 and replace uses: actions/setup-node@v2 with
actions/setup-node@v4, keeping the existing node-version input (node-version:
'22.x') or adjusting it to a supported LTS if desired; ensure the two step
identifiers (uses: actions/checkout and uses: actions/setup-node) are updated
exactly so the workflow uses the newer releases.
In `@src/components/icons/GearIcon.tsx`:
- Line 22: The inner gear SVG path in the GearIcon component is malformed: the
Path element's d attribute (the cubic Bézier that defines the center circle)
ends at the wrong coordinates and uses an incorrect control point; update the
Path d string in GearIcon (the <Path ... /> line) so the final cubic segment
returns to (12,15) and uses (10.3431,15) instead of (10.3431,12), effectively
correcting the last C segment so the center circle closes properly.
In `@src/components/icons/TargetIcon.tsx`:
- Around line 22-23: The inner target Path in TargetIcon (the <Path d="M12
17C14.7614 17 17 14.7614 17 12C17 9.23858 14.7614 7 12 7C9.23858 7 7 9.23858 7
12C7 14.7614 9.23858 12 12 17Z" /> string) has a wrong y-coordinate on the
second control point; update that final cubic Bézier control point from
(9.23858, 12) to (9.23858, 17) so the inner ring closes as a proper circle
inside the TargetIcon component.
In `@src/components/LogModal.tsx`:
- Around line 39-50: The modal's selectedContext is only initialised and synced
in the "close-on-hide" effect but that effect's dependency array is missing
profile?.default_context, so if the user changes default context while the modal
is closed selectedContext won't update; update the effect that calls resetState
(which sets setSelectedContext(profile?.default_context ?? undefined)) to
include profile?.default_context in its dependency array so resetState runs when
the profile default context changes while the modal is hidden.
In `@src/lib/types.ts`:
- Line 28: Change the type of the default_context field to reuse the existing
LogContext type instead of repeating the union; update the declaration for
default_context to use LogContext (e.g., default_context?: LogContext | null) so
it stays aligned with LogEntry.context and avoids drift between definitions.
In `@src/screens/ProfileScreen.tsx`:
- Around line 77-80: Move the inline style object { flex: 1 } on the
KeyboardAvoidingView into the component stylesheet: create a styles object via
StyleSheet.create (e.g., add styles.container = { flex: 1 }) and replace the
inline style prop on KeyboardAvoidingView with style={styles.container}; update
any import/usage if necessary and ensure KeyboardAvoidingView still uses
behavior prop as before.
- Around line 121-126: The onPress handlers (e.g., the PillButton that calls
updateProfile({ name: nameDraft.trim(), occupation: occupationDraft.trim() }))
are fire-and-forget and may reject; update each handler (profile save, goal
save, category archive, default-context handlers referenced by updateProfile and
similar calls) to await the promise or attach a .catch, handle errors by setting
component error state or showing a user-visible toast/alert, and ensure you
clear/disable any "saving" flags appropriately to avoid unhandled promise
rejections and to surface failures to the user; locate functions named
updateProfile (and the goal/category/default-context save handlers) and wrap
their invocation in try/catch or promise.catch to implement this behavior.
- Line 94: Replace all hardcoded design tokens in ProfileScreen (e.g., the
PersonIcon size={38} and any other numeric literals and colour hexes reported at
ranges 174,198,283,400-410,425-430,466-467,588-645) with the corresponding
exports from src/constants/theme.ts; locate usages inside the ProfileScreen
component and styles (e.g., PersonIcon, Avatar, Text elements, buttons) and swap
raw numbers (38, 80, 12, 14, 20, etc.) and hex colours like "#C0392B" for theme
constants such as theme.sizes.avatar, theme.spacing.small/medium,
theme.fontSizes.body*, theme.colors.danger (or the exact names exported in
theme.ts), updating imports to include the theme values and ensuring no literal
design values remain.
🪄 Autofix (Beta)
❌ Autofix failed (check again to retry)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: e2060110-4160-413b-b259-0d4301e93e6e
⛔ Files ignored due to path filters (1)
Build_plan.mdis excluded by!**/*.md
📒 Files selected for processing (6)
.github/workflows/main.ymlsrc/components/LogModal.tsxsrc/components/icons/GearIcon.tsxsrc/components/icons/TargetIcon.tsxsrc/lib/types.tssrc/screens/ProfileScreen.tsx
| on: | ||
| push: | ||
| branches: [ main ] | ||
| pull_request: | ||
| branches: [ main ] |
There was a problem hiding this comment.
Run this workflow for develop PRs too.
This job currently only runs for PRs into main, so it will not protect this PR or any other merge into develop. The new TypeScript gate is effectively bypassed on the branch you are targeting here.
Suggested change
on:
push:
- branches: [ main ]
+ branches: [main, develop]
pull_request:
- branches: [ main ]
+ branches: [main, develop]🧰 Tools
🪛 YAMLlint (1.38.0)
[warning] 3-3: truthy value should be one of [false, true]
(truthy)
[error] 5-5: too many spaces inside brackets
(brackets)
[error] 5-5: too many spaces inside brackets
(brackets)
[error] 7-7: too many spaces inside brackets
(brackets)
[error] 7-7: too many spaces inside brackets
(brackets)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In @.github/workflows/main.yml around lines 3 - 7, Update the GitHub Actions
trigger under the on: block so PRs targeting develop also run this workflow: add
"develop" to the branches arrays for pull_request (and optionally push if you
want pushes to develop to trigger too), i.e., modify the existing
pull_request.branches (and push.branches if desired) entries so they include
both main and develop to ensure the TypeScript gate runs for PRs into develop as
well.
| - uses: actions/checkout@v2 | ||
| - name: Use Node.js | ||
| uses: actions/setup-node@v2 | ||
| with: | ||
| node-version: '22.x' |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
🧩 Analysis chain
🏁 Script executed:
cat -n .github/workflows/main.ymlRepository: FLAiRistaken/firsthand
Length of output: 579
🌐 Web query:
actions/checkout v2 compatibility modern runners 2025 2026 deprecation
💡 Result:
actions/checkout@v2 remains compatible with modern GitHub-hosted runners in 2025-2026 and is not deprecated. The v2 tag points to v2.0.0 (released ~2019), which uses an older Node.js runtime (likely node16 or earlier). Modern GitHub-hosted runners (ubuntu-latest pointing to ubuntu-24.04 as of late 2024, with runner versions v2.327+ in 2025-2026 supporting Node 20/24) fully support legacy Node versions including those used by v2. No deprecation notices exist for actions/checkout@v2 in official GitHub sources; deprecations target specific other actions like actions/cache v1-v2 or OS images like ubuntu-20.04 (retired April 2025). Self-hosted runners require version v2.329.0+ (enforced for new configs from March 2026) but support all checkout versions including v2. Users should upgrade to v6 (latest as of Jan 2026, Node24 runtime, requires runner v2.327.1+) for new features like improved credential security and performance, but v2 continues to function without issues on current infrastructure.
Citations:
- 1: https://github.com/actions/checkout/releases
- 2: https://github.com/actions/checkout
- 3: https://github.com/actions/checkout/blob/main/CHANGELOG.md
- 4: https://github.com/actions/checkout/blob/releases/v2/README.md
- 5: https://github.com/actions/checkout/tree/v2.0.0
- 6: https://github.blog/changelog/2026-02-05-notice-of-upcoming-deprecations-and-breaking-changes-for-github-actions/
- 7: https://github.blog/changelog/2025-09-19-deprecation-of-node-20-on-github-actions-runners
- 8: Update README to include Node.js 24 support details and requirements actions/checkout#2248
- 9: Unable to use actions/checkout in a container without Node.js installed actions/checkout#2243
- 10: actions/checkout@v4 does not work on self-hosted ubuntu 22.04 actions/checkout#1667
- 11: actions/checkout@9f26565
- 12: https://github.blog/changelog/2026-02-05-github-actions-self-hosted-runner-minimum-version-enforcement-extended
🌐 Web query:
actions/setup-node v2 v4 version requirements GitHub Actions runners
💡 Result:
The actions/setup-node action requires GitHub Actions runners that support the Node.js runtime version specified in its action.yml 'runs.using' field. v2 (https://github.com/actions/setup-node/tree/releases/v2): Likely uses 'node16' (common for older versions), compatible with runners from ~v2.280+ that support node16. v4 (latest release v4.4.0): Uses 'node20' runtime. Compatible with GitHub-hosted runners (all current ones) and self-hosted runners v2.317.0+ (when Node 20 became default). Earlier runners may require ACTIONS_ALLOW_USE_UNSECURE_NODE_VERSION=true for node16 fallback if pinned to older checkout/setup actions. Newer versions (v5+, v6): Use 'node24' runtime (action.yml main branch), requiring runner v2.327.1+ explicitly stated in README: "Make sure your runner is on version v2.327.1 or later to ensure compatibility with this release." For self-hosted runners without pre-installed Node.js, setup-node@v4+ may fail as it runs using the runner's Node.js (issue #1287). GitHub-hosted runners always have compatible Node versions pre-installed. Current GitHub-hosted runners (ubuntu-latest etc., as of 2026-04-30) support all versions v2-v6.
Citations:
- 1: https://github.com/actions/setup-node
- 2: https://github.com/actions/setup-node/tree/releases/v2
- 3: https://github.com/actions/setup-node/
- 4: Bump actions/setup-node from 4 to 5 actions/runner#4037
- 5: Support node22 in runs.using for JavaScript actions actions/runner#3600
- 6: Github Actions Self-Hosted Runner issue with node 20 actions/runner#3373
- 7: https://github.com/actions/setup-node/blob/main/action.yml
- 8: https://github.com/actions/runner/releases/tag/v2.317.0
Upgrade GitHub Actions to more recent versions for improved security and performance.
actions/checkout@v2 and actions/setup-node@v2 remain compatible with current runners, but upgrading to v4 (or v6 for checkout) brings improved security features, better performance, and modern Node.js runtime support.
Suggested change
- - uses: actions/checkout@v2
+ - uses: actions/checkout@v4
- name: Use Node.js
- uses: actions/setup-node@v2
+ uses: actions/setup-node@v4📝 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.
| - uses: actions/checkout@v2 | |
| - name: Use Node.js | |
| uses: actions/setup-node@v2 | |
| with: | |
| node-version: '22.x' | |
| - uses: actions/checkout@v4 | |
| - name: Use Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '22.x' |
🧰 Tools
🪛 actionlint (1.7.12)
[error] 14-14: the runner of "actions/checkout@v2" action is too old to run on GitHub Actions. update the action's version to fix this issue
(action)
[error] 16-16: the runner of "actions/setup-node@v2" action is too old to run on GitHub Actions. update the action's version to fix this issue
(action)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In @.github/workflows/main.yml around lines 14 - 18, Update the GitHub Actions
steps to use the latest maintained action versions: replace uses:
actions/checkout@v2 with actions/checkout@v6 and replace uses:
actions/setup-node@v2 with actions/setup-node@v4, keeping the existing
node-version input (node-version: '22.x') or adjusting it to a supported LTS if
desired; ensure the two step identifiers (uses: actions/checkout and uses:
actions/setup-node) are updated exactly so the workflow uses the newer releases.
| <KeyboardAvoidingView | ||
| behavior={Platform.OS === 'ios' ? 'padding' : 'height'} | ||
| style={{ flex: 1 }} | ||
| > |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major | ⚡ Quick win
Move this static container style into StyleSheet.create().
{ flex: 1 } is fixed, so it should live in styles rather than inline.
As per coding guidelines, "Use StyleSheet.create() instead of inline styles in React Native components".
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/screens/ProfileScreen.tsx` around lines 77 - 80, Move the inline style
object { flex: 1 } on the KeyboardAvoidingView into the component stylesheet:
create a styles object via StyleSheet.create (e.g., add styles.container = {
flex: 1 }) and replace the inline style prop on KeyboardAvoidingView with
style={styles.container}; update any import/usage if necessary and ensure
KeyboardAvoidingView still uses behavior prop as before.
| <View style={styles.headerSection}> | ||
| <View style={styles.avatarCircle}> | ||
| <PersonIcon size={36} color={Colors.primary} /> | ||
| <PersonIcon size={38} color={Colors.primary} /> |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major | ⚡ Quick win
Replace the newly added raw design values with theme tokens.
This rework introduces hardcoded sizes, spacing, and colour literals (38, 80, 12, 14, 20, #C0392B, etc.), which breaks the design-system contract and will drift from the rest of the app.
As per coding guidelines, "All design constants (colours, fonts, sizes, spacing) must be imported from src/constants/theme.ts; never hardcode colours, fonts, sizes, or spacing values".
Also applies to: 174-174, 198-198, 283-283, 400-410, 425-430, 466-467, 588-645
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/screens/ProfileScreen.tsx` at line 94, Replace all hardcoded design
tokens in ProfileScreen (e.g., the PersonIcon size={38} and any other numeric
literals and colour hexes reported at ranges
174,198,283,400-410,425-430,466-467,588-645) with the corresponding exports from
src/constants/theme.ts; locate usages inside the ProfileScreen component and
styles (e.g., PersonIcon, Avatar, Text elements, buttons) and swap raw numbers
(38, 80, 12, 14, 20, etc.) and hex colours like "#C0392B" for theme constants
such as theme.sizes.avatar, theme.spacing.small/medium, theme.fontSizes.body*,
theme.colors.danger (or the exact names exported in theme.ts), updating imports
to include the theme values and ensuring no literal design values remain.
|
Note Autofix is a beta feature. Expect some limitations and changes as we gather feedback and continue to improve it. ⛔ CodeRabbit does not have permission to push changes to this repository. Please ensure CodeRabbit has Contents: Read and write permission. |
|
Note Autofix is a beta feature. Expect some limitations and changes as we gather feedback and continue to improve it. ⛔ CodeRabbit does not have permission to push changes to this repository. Please ensure CodeRabbit has Contents: Read and write permission. |
|
Note Autofix is a beta feature. Expect some limitations and changes as we gather feedback and continue to improve it. ⛔ CodeRabbit does not have permission to push changes to this repository. Please ensure CodeRabbit has Contents: Read and write permission. |
…improve LogModal state synchronization
ProfileScreen rework: visual refresh, edit UX overhaul, settings expansion
This PR implements the requested ProfileScreen redesign and functionality changes:
TextInputs for name, occupation, and goal. Added localized conditional "Save" buttons.KeyboardAvoidingViewwith an innerScrollViewand programmatic scrolling to ensure inputs remain visible when focused.profile.default_contextand pre-selects context dynamically inLogModal.default_contextcolumn definition inUserProfile(src/lib/types.ts).Fixes all code review feedback including preserving
addCategoryinput visibility post-add, fixing missing TS typings, setting the correct avatar internal size, and optimizing state comparison checks.PR created automatically by Jules for task 16082256131629205559 started by @FLAiRistaken
Summary by CodeRabbit
New Features
Refactor
Chores