Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/BhushanBadhe39/SkinFirts/llms.txt

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

SkinFirts communicates with a MockAPI REST backend through a thin API layer housed in src/api/. The layer is composed of three files: a shared Axios client (Client.js) that holds the base URL and default timeout, and two resource modules (doctorsApi.js and usersApi.js) that export plain async functions consumed by Redux thunks and the useDoctors hook. Keeping transport configuration in one place means switching to a production backend requires changing a single value in Client.js.

​
Axios Client

All HTTP requests share a single Axios instance created in src/api/Client.js. The instance is pre-configured with the MockAPI base URL and a 10-second request timeout, and is imported by every API module. 
// src/api/Client.js
import axios from "axios";

export const apiClient = axios.create({
  baseURL: 'https://6a63416d1bffb2ffab8bf093.mockapi.io',
  timeout: 10000,
});
ConfigurationValuePurpose
baseURLhttps://6a63416d1bffb2ffab8bf093.mockapi.ioRoot URL prepended to every relative endpoint path
timeout10000 msAborts requests that hang for more than 10 seconds
No authentication headers (e.g. Authorization, API keys) are attached to the Axios instance. This is intentional for the current MockAPI prototype setup, where resources are publicly accessible. Before moving to a production backend, add an interceptor or default header to attach credentials to every outbound request.

​
Doctors API

src/api/doctorsApi.js exposes two functions for reading and mutating doctor records.
1

fetchDoctors()

Issues a GET request to ./doctorData and returns the full array of doctor objects.
export async function fetchDoctors() {
  const { data } = await apiClient.get('./doctorData');
  return data;
}
Returns: Doctor[] — the complete doctor catalogue.
2

updateDoctors(email, updates)

Issues a PATCH request to ./doctorData/:email with a partial update payload and returns the updated doctor object. Despite the parameter name email, the value passed in practice is the doctor’s id field (see DoctorSlice and useDoctors).
export async function updateDoctors(email, updates) {
  const { data } = await apiClient.patch(`./doctorData/${email}`, updates);
  return data;
}
Parameters:
  • email — the doctor record identifier used as the path segment
  • updates — partial object to merge (e.g. { isFavorite: true })
Returns: Doctor — the full updated doctor object as stored by MockAPI.

​
Full Source

// src/api/doctorsApi.js
import { apiClient } from "./Client";

export async function fetchDoctors() {
  const { data } = await apiClient.get('./doctorData');
  return data;
}

export async function updateDoctors(email, updates) {
  const { data } = await apiClient.patch(`./doctorData/${email}`, updates);
  return data;
}

​
Users API

src/api/usersApi.js exposes three functions covering the full create-read-update lifecycle for user records. New users are always created with a set of pre-defined appointment ID lists so that the appointment screens have seed data to render immediately after registration.
1

createUser(newUser)

Merges User_PreDefined_Fields with the caller-supplied newUser payload and issues a POST to ./users/. The pre-defined fields ensure every new account starts with a realistic set of appointment history entries.
export async function createUser(newUser) {
  const payload = { ...User_PreDefined_Fields, ...newUser };
  const { data } = await apiClient.post('./users/', payload);
  return data;
}
Returns: User — the created user object, including the server-assigned id.
2

fetchUsers()

Issues a GET to ./users and returns the full array of registered users.
export async function fetchUsers() {
  const { data } = await apiClient.get('./users');
  return data;
}
Returns: User[] — all user records.
3

updateUser(id, updates)

Issues a PATCH to ./users/:id with a partial update payload and returns the updated user.
export async function updateUser(id, updates) {
  const { data } = await apiClient.patch(`./users/${id}`, updates);
  return data;
}
Parameters:
  • id — the user’s MockAPI record ID
  • updates — partial object to merge into the user record
Returns: User — the full updated user object.

​
Full Source

// src/api/usersApi.js
import { apiClient } from "./Client";

const User_PreDefined_Fields = {
  completeAppointments:  ["1", "2", "3", "4", "5", "6", "7"],
  upcomingAppointments:  [
    "15", "16", "17", "18", "19", "20",
    "21", "22", "23", "24", "25", "26",
    "27", "28", "29", "30", "31", "32",
    "33", "34", "35", "36", "37", "38",
    "39", "40"
  ],
  cancelledAppointments: ["8", "9", "10", "11", "12", "13", "14"],
};

export async function createUser(newUser) {
  const payload = { ...User_PreDefined_Fields, ...newUser };
  const { data } = await apiClient.post('./users/', payload);
  return data;
}

export async function fetchUsers() {
  const { data } = await apiClient.get('./users');
  return data;
}

export async function updateUser(id, updates) {
  const { data } = await apiClient.patch(`./users/${id}`, updates);
  return data;
}

​
Pre-Defined User Appointment Fields

Every account created via createUser is seeded with the following appointment ID lists. The appointment screens use these IDs to look up the corresponding appointment records from the MockAPI doctorData resource.
FieldSeeded IDsCount
completeAppointments1 – 77
upcomingAppointments15 – 4026
cancelledAppointments8 – 147
Any user-supplied fields in the newUser argument will override these defaults if the same key is present (spread order: pre-defined first, then newUser).

​
Doctor Data Fields

Doctor objects returned by fetchDoctors() carry the following fields, as used across the doctor detail and scheduling screens:
FieldTypeDescription
idstringUnique record identifier used for PATCH routes and favorites lookup
doctorNamestringFull display name
departmentstringMedical specialty (e.g. “Dermatology”)
imgstringProfile image URL
ratingsnumberAverage star rating
experiencestringYears of practice
focusstring[]List of treatment focus areas
profilestringShort biography paragraph
careerPathobject[]Structured career history entries
highlightsstring[]Key achievement bullet points
reviews`stringnumber`Review count or summary displayed alongside the doctor’s info
availability`stringnumber`Availability indicator displayed alongside the doctor’s info
isFavoritebooleanWhether the current user has favorited this doctor
genderstringDoctor’s gender

​
Error Handling Patterns

API functions do not catch errors internally — they let Axios throw, which allows callers to decide how to handle failures.
createAsyncThunk automatically catches rejections and dispatches the rejected action with action.error.message. The slice stores the message in state.error:
.addCase(loadDoctors.rejected, (state, action) => {
  state.error   = action.error.message;
  state.loading = false;
})
The current baseURL in Client.js points to a MockAPI prototype endpoint. When promoting SkinFirts to production, replace this value with your real API base URL and add any required authentication interceptors to the apiClient instance in src/api/Client.js. No other files need to change.

Build docs developers (and LLMs) love

Get started for freeTalk to us