Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Jay-byte389/AMS/llms.txt

Use this file to discover all available pages before exploring further.

The doctor feature in AMS uses a single async thunk — fetchDoctors — to load the full doctor catalogue from the REST API, combined with four synchronous slice actions that manage selection and favourites entirely in memory. All doctor state lives in src/redux/slices/doctorSlice.js, with the thunk defined in src/redux/thunk/doctorThunk.js and the API call handled by src/services/doctorServices.js.

​
Redux State Shape

FieldTypeDescription
doctorsListDoctor[]Full list of doctors loaded from the API
selectedDoctorDoctor | nullThe doctor currently being viewed or booked
favouriteIdsstring[]Array of doctor IDs the user has favourited
loadingbooleantrue while a fetch is in progress
errorstring | nullLast error message from a failed fetch

​
Async Thunk

​
fetchDoctors

Fetches the full list of doctors from the backend API and stores them in state.doctorsList. This thunk is typically dispatched once on the home or doctors-list screen mount.
Action typedoctors/fetchDoctors
ParametersNone
API callGET /Doctors via fetchDoctorsAPI()
Returns (fulfilled)Doctor[] — the full array from response.data
Returns (rejected)rejectWithValue(error.response?.data | error.message | 'Failed to fetch doctors')
State effects
CaseloadingdoctorsListerror
pendingtrue—null
fulfilledfalsereplaced with API payload—
rejectedfalse—error string
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { fetchDoctors } from '../redux/thunk/doctorThunk';

export default function DoctorsScreen() {
  const dispatch = useDispatch();
  const { doctorsList, loading, error } = useSelector(state => state.doctors);

  useEffect(() => {
    dispatch(fetchDoctors());
  }, []);

  if (loading) return <ActivityIndicator />;
  if (error) return <Text>Error: {error}</Text>;

  return (
    <FlatList
      data={doctorsList}
      keyExtractor={item => item.id}
      renderItem={({ item }) => <DoctorCard doctor={item} />}
    />
  );
}
fetchDoctors stores all doctors in a single flat array. Filtering by specialty, city, or name should be done with a memoised useSelector selector or a useMemo inside the component — no additional thunks are required.

​
Synchronous Actions

All four actions below are exported from doctorSlice.actions and can be imported directly from the slice: 
import {
  setSelectedDoctor,
  clearSelectedDoctor,
  toggleFavourtie,   // note: exported name matches source spelling
  setFavourite,
} from '../redux/slices/doctorSlice';

​
setSelectedDoctor

Sets state.selectedDoctor to the provided doctor object. Dispatch this when the user taps a doctor card to navigate to the detail or booking screen.
​
doctor
Doctor
required
The full doctor object to mark as selected. This is typically an item directly from state.doctorsList.
dispatch(setSelectedDoctor(doctor));
// Read back with: useSelector(state => state.doctors.selectedDoctor)

​
clearSelectedDoctor

Sets state.selectedDoctor to null. Dispatch this when navigating away from a doctor detail screen to avoid stale data if the user returns later. 
dispatch(clearSelectedDoctor());

​
toggleFavourtie

The exported action name is toggleFavourtie (note the transposed u and r in Favourite) — this matches the source code spelling exactly. Use this exact name when importing.
Adds a doctor ID to state.favouriteIds if it is not already present, or removes it if it is. This provides a toggle-on-tap interaction directly from any list or detail screen.
​
doctorId
string
required
The id field of the doctor to toggle. The reducer checks favouriteIds.includes(doctorId) to decide whether to add or remove.
import { useDispatch, useSelector } from 'react-redux';
import { toggleFavourtie } from '../redux/slices/doctorSlice';
import { saveFavourites as saveFavouritesToStorage } from '../services/storage';

const dispatch = useDispatch();
const favouriteIds = useSelector(state => state.doctors.favouriteIds);

const handleFavouritePress = async (doctorId) => {
  dispatch(toggleFavourtie(doctorId));

  // Persist the updated list — read state after dispatch
  const updated = store.getState().doctors.favouriteIds;
  await saveFavouritesToStorage(updated);
};

const isFavourite = favouriteIds.includes(doctor.id);

​
setFavourite

Replaces the entire state.favouriteIds array with the provided list. This is used on app launch to rehydrate persisted favourites from loadFavourites() in storage, ensuring the heart icons render correctly before the user interacts.
​
ids
string[]
required
An array of doctor ID strings to set as the complete favourites list. Passing an empty array [] clears all favourites.
import { useDispatch } from 'react-redux';
import { setFavourite } from '../redux/slices/doctorSlice';
import { loadFavourites } from '../services/storage';

const dispatch = useDispatch();

useEffect(() => {
  const rehydrateFavourites = async () => {
    const ids = await loadFavourites();
    dispatch(setFavourite(ids));
  };

  rehydrateFavourites();
}, []);

​
Reading Doctors in a Component

const doctorsList = useSelector(state => state.doctors.doctorsList);

Build docs developers (and LLMs) love

Get started for freeTalk to us