Complete migration from redux mapping to redux hooks for plugin-hrm-form

[Copilot]

Description

Completes modernization of React components by migrating remaining 32 components from Redux connect() HOC to hooks (useDispatch/useSelector).

Migration Pattern:

// Before
const mapStateToProps = (state: RootState) => ({
  data: selectData(state, id)
});
const mapDispatchToProps = (dispatch) => ({
  action: () => dispatch(someAction())
});
export default connect(mapStateToProps, mapDispatchToProps)(Component);

// After
const Component = ({ id }) => {
  const dispatch = useDispatch();
  const data = useSelector((state: RootState) => selectData(state, id));
  const handleAction = () => dispatch(someAction());
  // ...
};
export default Component;

Key Changes:

• Actions dispatched directly in event handlers (no intermediate dispatcher functions)
• Preserved asyncDispatch wrapper for async actions
• Used existing selectors throughout
• Removed ~300 lines of boilerplate code
• Cleaned up unused functions and imports (e.g., removed unused loadContacts and removeConnectedCase from Case.tsx)
• Fixed all TypeScript compilation errors introduced during migration

TypeScript Fixes:

• Made className optional in NavigableContainer Props (was causing required prop errors)
• Fixed EditCaseOverview callback signatures to properly wrap checkForEdits with boolean parameter
• Added missing titleCode prop to CasePrintView NavigableContainer
• Wrapped FullTimelineView content in div for styling instead of invalid style prop on NavigableContainer
• Fixed CaseList routing type issues with proper type guards and casts
• Updated SearchResults and SearchResultsQueryTemplate to accept StandaloneITask in addition to CustomITask
• Made handleBack optional in SearchResults (was required but never used)
• Removed incorrect currentIsCaller prop being passed to SearchResults

Components Migrated:

• Router (3): Router, NavigableContainer, ProfileRouter
• Tabbed Forms (4): TabbedFormsContact, TabbedFormsTabs, TabbedFormsSearch, TabbedFormsCase
• Case Management (7): Case, CaseList, CaseListTable, FullTimelineView, EditCaseOverview, CaseListTableHeadCell, CaseTextAreaEntry
• Profile Management (9): ProfileList, ProfileCases, ProfileTabs, ProfileDetails, ProfileContactDetails, ProfileContacts, ProfileRelationshipList, IdentifierBanner, ProfileSectionEdit
• Search & Resources (6): SearchResults, ContactPreview, SearchResources, SearchResourcesResults, ViewResource, ReferrableResources
• Other (3): CSAMReport, TranscriptSection

Checklist

• Corresponding issue has been opened
• New tests added
• Feature flags added
• Strings are localized
• Tested for chat contacts
• Tested for call contacts

Other Related Issues

Continues work from #3807

Verification steps

1. Test all migrated components render correctly
2. Verify state updates work (form submissions, navigation, data fetching)
3. Verify async actions complete successfully (case creation, profile updates, search)
4. Check no console errors related to Redux
5. Verify TypeScript compilation succeeds without errors

AFTER YOU MERGE

1. Cut a release tag using the Github workflow. Wait for it to complete and notify in the #aselo-deploys Slack channel.
2. Comment on the ticket with the release tag version AND any additional instructions required to configure an environment to test the changes.
3. Only then move the ticket into the QA column in JIRA

You are responsible for ensuring the above steps are completed. If you move a ticket into QA without advising what version to test, the QA team will assume the latest tag has the changes. If it does not, the following confusion is on you! :-P

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Complete migration from redux mapping to redux hooks for plugin-hrm-form</issue_title>
<issue_description>We would like to complete the process of modernising our React code by replacing the remaining usages of state and dispatch mappings with redux hooks.

Limit changes to those required to achieve the above goal, avoid unnecessary refactors, renames etc.

Preserve the usage of the asyncDispatch wrapper in any action dispatching code that is updated.

Use existing select functions to implement useSelector calls, or create new ones if a suitable one doesn't exist, we should abstract the structure of the redux state from components

Avoid creating dispatcher functions that become dependencies of hooks causing them to change every load, try to dispatch actions directly in the hook function.

This work was started in #3807 more more components remain to be migrated to redux hooks</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Complete migration from redux mapping to redux hooks for plugin-hrm-form #3866

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[stephenhand]

Is this used? Can it be removed?

[Copilot]

You're correct - both loadContacts and removeConnectedCase were unused and have been removed, along with their unused imports (asyncDispatch, AnyAction, and removeFromCaseAsyncAction). Fixed in commit 8c8d85f.

[stephenhand]

There are a number of typescript compilation errors introduced by this PR.

Identify the errors by running the 'build' npm script from plugin-hrm-forms/package.json and address them

[Copilot]

There are a number of typescript compilation errors introduced by this PR.

Identify the errors by running the 'build' npm script from plugin-hrm-forms/package.json and address them

All TypeScript compilation errors have been fixed in commit fdc79f1. The errors were mostly related to type mismatches introduced during the hooks migration:

• NavigableContainer Props had required className (now optional)
• EditCaseOverview callback signatures needed adjustment
• Missing titleCode prop on CasePrintView
• Invalid style prop on FullTimelineView (wrapped content in div instead)
• Type guard issues in CaseList (added proper type casts)
• Task type mismatches (updated to accept StandaloneITask where needed)
• Removed unused currentIsCaller prop being passed to SearchResults

Build now compiles successfully (only remaining error is unrelated missing private/secret file).