🛠️ Replace useDispatch with useQuery/request

[rithviknishad]

❕ Do not assign this EPIC to yourself. Sub-issues specified below can be assigned to yourself.

Currently, we are using useDispatch to dispatch actions through fireRequest. We need to migrate this to use useQuery (for performing GET requests on component mount) and request to perform API calls of other methods (such as form submissions, etc.)

📖 References for the request and useQuery data fetching utilities

• 📖 Documentation https://github.com/coronasafe/care_fe/blob/develop/src/Utils/request/README.md
• 👀 Example PR: Asset Configure: Migrate useDispatch to use useQuery (inherently fixes camera not reloading on configure saved) #6327

Tasks

Feel free to split these individual tasks further into multiple sub-tasks/PRs if the refactor is large. It will be easier to do the refactor, QA testing, and code review.

• 🛠️ Replace useDispatch w. useQuery/request: ABDM (src/Components/ABDM/**) #6330
• 🛠️ Replace useDispatch w. useQuery/request: Assets (src/Components/Assets/**) #6326
• 🛠️ Replace useDispatch w. useQuery/request: Auth (src/Components/Auth/**) #6331
• 🛠️ Replace useDispatch w. useQuery/request: DeathReport (src/Components/DeathReport/**) #6328
• 🛠️ Replace useDispatch w. useQuery/request: ExternalResult (src/Components/ExternalResult/**) #6360
• 🛠️ Replace useDispatch w. useQuery/request: Consultations (src/Components/Facility/Consultations/**) #6372
• 🛠️ Replace useDispatch w. useQuery/request: Facility (Part 1, A-D) (src/Components/Facility/*) #6376
• 🛠️ Replace useDispatch w. useQuery/request: Facility (Part 2, E-H) (src/Components/Facility/[E-H]*.tsx) #6391
• 🛠️ Replace useDispatch w. useQuery/request: Facility (Part 3, I-Z) (src/Components/Facility/[I-Z]*.tsx) #7036
• Replace useDispatch w. useQuery/request: HCX (src/Components/HCX/**) #6381
• 🛠️ Replace useDispatch w. useQuery/request: Medicine (src/Components/Medicine/**) #6442
• 🛠️ Replace useDispatch w. useQuery/request: Notifications (src/Components/Notifications/**) #6392
• 🛠️ Replace useDispatch w. useQuery/request: Patient (src/Components/Patient/**) #6546
• 🛠️ Replace useDispatch w. useQuery/request: Resource (src/Components/Resource/**) #6443
• 🛠️ Replace useDispatch w. useQuery/request: Shifting (src/Components/Shifting/**) #6483
• Replace useDispatch w. useQuery/request: Users (src/Components/Users/**) #6530
• Replace useDispatch with useQuery in Doctor Notes related components #6705
• 🛠️ Replace useDispatch w. useQuery/request: Common (src/Components/Common/**) #6888
• Replace useDispatch w. useQuery/request: Investigations (src/Components/Facility/Investigations) #7168
• Replace useDispatch w. useQuery/request: Daily Rounds form (src/Components/Patient/DailyRounds.tsx) #7169
• Replace useDispatch w. useQuery/request: File Upload (src/Components/Patient/FileUpload.tsx) #7170
• Replace useDispatch w. useQuery/request: Patient Registration Form (src/Components/Patient/PatientRegister.tsx) #7171

Steps to follow

1. Perform a global search with from "react-redux" and specify the corresponding files to include regex as shown

2. In all of the files in the search results, you'll have to remove the usage of useDispatch (and corresponding actions that are dispatched) and replace it with useQuery and request appropriately.

3. All of the existing routes are available at src/Redux/api.tsx which can be passed to the useQuery/request directly.

4. For each route that is being used, ensure the response type is also present. If not, you'll have to add it.

Example:

config: {
  path: "/config.json",
  noAuth: true,
  TRes: Res<IConfig>(),  // 👈 Add this
},

5. Delete the relevant no longer used actions from actions.tsx. (Ensure the action is not used outside the scope of the migration too)

6. You'll also need to add cypress tests if existing cypress tests do not cover pages/components where the replacements are being done.

[syedfardeenjeelani]

hi @rithviknishad i would like to try to work on this can you please assign this to me