RocketChat / RocketChat/Rocket.Chat

Refactor Omnichannel modal validation & internal logic for clarity

Open
#38,432 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
46.1k
Forks
13.9k
Avg merge
3d 3h
Merged PRs (30d)
130

Description

Description:

This issue proposes a small internal refactor in multiple Omnichannel modal components to improve validation logic, readability, and maintainability.
The changes do not affect UI/UX or user-facing behavior and are limited to internal logic improvements (mainly form validation and side-effect handling).

The refactor removes reliance on potentially stale react-hook-form error state inside submit handlers and avoids confusing dependency patterns in useEffect.

Affected files:
  • CloseChatModal.tsx

  • ForwardChatModal.tsx

  • ReturnChatQueueModal.tsx

  • EnterpriseDepartmentsModal.tsx

Steps to reproduce:
  • Open any Omnichannel modal (Close Chat / Forward Chat / Return to Queue).

  • Submit the form with missing required fields (comment, tags, or subject when transcript email is enabled).

  • Observe how validation is handled internally.

Expected behavior:
  • Validation should be evaluated synchronously inside submit handlers.

  • Submission should proceed only when all validation conditions pass.

  • Side-effects (like setting default email subject) should not unintentionally override user input.

  • Internal logic should be easy to understand and maintain for future contributors.

Actual behavior:
  • Validation logic relied on errors state immediately after calling setError, which can reference stale state.

  • Conditional checks were inverted or incomplete in some cases.

  • useEffect dependency on subject could cause unexpected resets of the subject field.

  • While the UI works, the internal logic is harder to reason about and more error-prone.

  • No UI regression observed. No screenshots required.

Server Setup Information:
  • Version of Rocket.Chat Server: N/A (code-level refactor)

  • License Type: N/A

  • Number of Users: N/A

  • Operating System: N/A

  • Deployment Method: N/A

  • Number of Running Instances: N/A

  • DB Replicaset Oplog: N/A

  • NodeJS Version: N/A

  • MongoDB Version: N/A

  • Client Setup Information

  • Desktop App or Browser Version: N/A

  • Operating System: N/A

Additional context
  • changes are non-breaking and do not modify UI or business behavior.

  • The refactor improves:

  • readability

  • contributor friendliness

  • correctness of validation flow

A pull request has already been prepared following this issue for easier review and discussion.

Closes #38432

Relevant logs:

Not applicable.
This is a code refactor / logic cleanup with no runtime errors or logs involved.

Related PR: https://github.com/RocketChat/Rocket.Chat/pull/38387

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing CloseChatModal.tsx, ForwardChatModal.tsx, ReturnChatQueueModal.tsx, and EnterpriseDepartmentsModal.tsx, then compare the prepared changes in PR #38387. Trace each submit handler and the subject-related useEffect; the work is done when validation is synchronous, user input is preserved, and the existing behavior remains unchanged.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Refactor
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.