fix: submit button not enabled when toggling switches in room edit#6669
fix: submit button not enabled when toggling switches in room edit#6669OtavioStasiak merged 1 commit intodevelopfrom
Conversation
Rohit3523
had a problem deploying
to
approve_e2e_testing
GitHub Actions
Failure
WalkthroughAdds react-hook-form SetValueConfig and a shared dirtyOptions with shouldDirty: true, updating toggle handlers in RoomInfoEditView to pass this option to setValue so related fields register as dirty when toggled. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor U as User
participant V as RoomInfoEditView
participant F as react-hook-form
participant S as setValue(..., value, { shouldDirty: true })
U->>V: Toggle a switch (e.g., Read Only)
V->>F: setValue(field, value, dirtyOptions)
activate F
F->>S: Apply value with shouldDirty: true
S-->>F: Field updated and marked dirty
deactivate F
F-->>V: Form state updated (dirty = true)
V-->>U: UI reflects change and dirty state
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested reviewers
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests
Comment |
Rohit3523
had a problem deploying
to
experimental_ios_build
GitHub Actions
Failure
Rohit3523
had a problem deploying
to
official_ios_build
GitHub Actions
Failure
Rohit3523
had a problem deploying
to
official_android_build
GitHub Actions
Failure
Rohit3523
had a problem deploying
to
experimental_android_build
GitHub Actions
Failure
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
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 (1)
app/views/RoomInfoEditView/index.tsx (1)
274-281: Save button still won’t enable when only “System Messages” selection changes.
MultiSelectupdatessystemMessagesviasetValuewithoutshouldDirty, so toggling only the selection won’t enable “Save Changes.” Mirror the toggle fix here.- onChange={({ value }) => setValue('systemMessages', value)} + onChange={({ value }) => setValue('systemMessages', value, dirtyOptions)}Also applies to: 307-309
🧹 Nitpick comments (3)
app/views/RoomInfoEditView/index.tsx (3)
6-6: Use type‑only import (combine with existing import).Simplify and avoid potential value import by combining into a single type‑only import.
-import { useForm } from 'react-hook-form'; -import { type SetValueConfig } from 'react-hook-form'; +import { useForm, type SetValueConfig } from 'react-hook-form';
291-293: Double‑check encryption behavior when switching room type.With
disabled={!t}on the Encrypted switch, encryption is only toggleable whentis true (public). Combined withsetValue('encrypted', value && encrypted, ...), switching to private (value=false) forcesencryptedto false. If the product rule is “encryption allowed only on private rooms,” this is inverted.If that rule applies, adjust to disable when public and keep previous value when switching to private:
- setValue('t', value, dirtyOptions); - setValue('encrypted', value && encrypted, dirtyOptions); + setValue('t', value, dirtyOptions); + // If encryption is only for private rooms, zero it when going public, preserve otherwise + setValue('encrypted', !value && encrypted, dirtyOptions);And in the Encrypted switch:
- disabled={!t} + disabled={t}
480-486: Optional: add a quick e2e to prevent regressions.Add a Detox test that toggles each switch (
t,readOnly,reactWhenReadOnly,enableSysMes,encrypted) and assertsroom-info-edit-view-submitbecomes enabled.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Jira integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
app/views/RoomInfoEditView/index.tsx(3 hunks)
🧰 Additional context used
🧬 Code graph analysis (1)
app/views/RoomInfoEditView/index.tsx (1)
app/lib/methods/helpers/log/index.ts (1)
logEvent(35-42)
⏰ 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: ESLint and Test / run-eslint-and-test
🔇 Additional comments (4)
app/views/RoomInfoEditView/index.tsx (4)
43-45: Good: centralized dirty options.Defining a shared
dirtyOptionswithshouldDirty: trueis the right fix for enabling the submit button on toggle.
297-297: Good: readOnly now marks form dirty.
302-302: Good: reactWhenReadOnly now marks form dirty.
313-313: Good: encrypted toggle now marks form dirty.
|
Thanks :) |
2 participants
Proposed changes
In the Room Edit screen, the Save Changes button wasn’t enabling when toggling switches, Based on react-hook-form/react-hook-form#72 (comment) comment , I am passing { shouldDirty } as the third parameter in setValue to ensure that it updates the value as soon as we click the switch and enables the submit button.
Issue(s)
N/A
How to test or reproduce
Screenshots
Types of changes
Checklist
Further comments
Summary by CodeRabbit