How to Integrate Retool with Practo

Navigate to the Resources tab in your Retool instance and click Add Resource. From the resource type list, select REST API. Name the resource 'Practo API' to distinguish it from other resources in your workspace. In the Base URL field, enter your Practo API base URL. For most partners, this is https://api.practo.com — confirm the exact URL with your Practo account manager, as partner API endpoints may differ. Do not include a trailing slash. For authentication, Practo typically uses API key authentication sent as a custom header. In the Headers section, add a new header with key = X-API-Key and value = your Practo API key. If your Practo integration uses Bearer token authentication instead, select Bearer Token from the Authentication dropdown and enter your token. To keep credentials secure, store your API key as a Retool configuration variable first: go to Settings → Configuration Variables, create a variable named PRACTO_API_KEY, and mark it as Secret. Then in the header value field, use {{ retoolContext.configVars.PRACTO_API_KEY }} instead of the raw key value. This ensures the key is never exposed to frontend users. If your Practo API requires additional headers such as X-Partner-Id or X-Clinic-Id, add those as default headers too. Click Save Changes when done.

Open your Retool app and create your first query. In the Code panel, click the + icon to add a new query. Name it getAppointments and select the Practo API resource. Set Method to GET. In the Path field, enter /api/v1/appointments (adjust the path based on your Practo API version documentation). Add URL parameters to filter by date: key = date, value = {{ datePicker1.value }} to filter appointments by the selected date. Add another parameter: key = clinic_id, value = {{ dropdown_clinic.value }} if your account manages multiple clinic locations. For pagination, add: key = page, value = {{ pagination.page || 1 }} and key = per_page, value = 50. Create a second query named getPatientByPhone for patient lookup. Set Method to GET, Path to /api/v1/patients, and add URL parameters: key = phone, value = {{ textInput_phone.value }}. Create a third query named getPractitioners (GET, /api/v1/practitioners) to populate a dropdown for filtering appointments by doctor. Run this query on page load to populate the filter controls. Bind the getAppointments query result to a Table component by setting the table's Data property to {{ getAppointments.data.appointments }} (adjust the response path based on Practo's actual response structure).

1// JavaScript transformer — flatten Practo appointment response for Table
2const appointments = data.appointments || data.data || [];
3return appointments.map(appt => ({
4  id: appt.id,
5  patient_name: appt.patient
6    ? `${appt.patient.first_name || ''} ${appt.patient.last_name || ''}`.trim()
7    : appt.patient_name || 'N/A',
8  phone: appt.patient?.phone || appt.phone || 'N/A',
9  practitioner: appt.doctor
10    ? `Dr. ${appt.doctor.first_name} ${appt.doctor.last_name}`
11    : appt.practitioner_name || 'N/A',
12  appointment_time: appt.appointment_time
13    ? new Date(appt.appointment_time).toLocaleTimeString('en-IN', {
14        hour: '2-digit', minute: '2-digit'
15      })
16    : 'N/A',
17  type: appt.consultation_type || appt.type || 'In-clinic',
18  status: appt.status || 'scheduled',
19  notes: appt.notes || ''
20}));

Clinic staff need to update appointment statuses as patients progress through their visit — from scheduled, to checked-in, to in-consultation, to completed. Create a mutation query for this. Create a new query named updateAppointmentStatus. Set Method to PATCH. In the Path field, enter /api/v1/appointments/{{ table_appointments.selectedRow.id }}. Set the Body type to JSON and enter the body: { "status": "{{ select_status.value }}", "updated_at": "{{ new Date().toISOString() }}" } Add a Select component named select_status with options for your status values (e.g., 'scheduled', 'checked_in', 'in_consultation', 'completed', 'cancelled'). Add an Update Status button that triggers updateAppointmentStatus when clicked. In the event handler for updateAppointmentStatus, set On Success to trigger getAppointments to refresh the appointment table, then show a notification 'Appointment status updated.' This creates the complete update-and-refresh loop. For cancellations, create a separate cancelAppointment query (DELETE or PATCH with status=cancelled) and add a Cancel button with a confirmation modal. Use Retool's Modal component to display 'Are you sure you want to cancel this appointment?' before the query runs, preventing accidental cancellations. For complex integrations with multiple clinics and practitioners, RapidDev's team can help architect a Retool solution that handles multi-location appointment management and integrates with additional data sources.

1{
2  "status": "{{ select_status.value }}",
3  "notes": "{{ textInput_notes.value }}",
4  "updated_by": "{{ retoolContext.currentUser.email }}",
5  "updated_at": "{{ new Date().toISOString() }}"
6}

Add a summary view showing each practitioner's appointment load for the day. This helps clinic managers identify overloaded doctors and redistribute patients to available slots. Create a query named getAvailabilitySlots (GET, /api/v1/practitioners/{{ dropdown_practitioner.value }}/slots) with URL parameters date = {{ datePicker1.value }}, and duration = 15 (15-minute slot intervals). This returns the practitioner's available and booked time slots. Create a JavaScript query named computeWorkloadSummary that aggregates appointment counts per practitioner. This query runs after getAppointments completes and groups the appointment data: Bind the workload summary to a Chart component. Set the Chart type to Bar, x-axis to practitioner name, and y-axis to appointment count. This gives clinic managers an at-a-glance view of the day's distribution. Add a date picker at the top of the app that controls all queries — when the date changes, getAppointments, getAvailabilitySlots, and computeWorkloadSummary all re-run with the new date. Configure this using the Run on value change setting in each query, or trigger them sequentially from the date picker's onChange event handler. For the availability grid, add a Table component with practitioners as rows and time slots as columns. Use a transformer to build this matrix structure from the slots API response, marking booked slots as 'Booked' and available slots as 'Available'.

1// JavaScript query — compute workload summary from appointment data
2const appointments = getAppointments.data?.appointments || [];
3const workloadMap = {};
4
5appointments.forEach(appt => {
6  const practitioner = appt.practitioner_name
7    || (appt.doctor ? `Dr. ${appt.doctor.first_name} ${appt.doctor.last_name}` : 'Unknown');
8  if (!workloadMap[practitioner]) {
9    workloadMap[practitioner] = { name: practitioner, total: 0, completed: 0, pending: 0 };
10  }
11  workloadMap[practitioner].total++;
12  if (appt.status === 'completed') workloadMap[practitioner].completed++;
13  else workloadMap[practitioner].pending++;
14});
15
16return Object.values(workloadMap).sort((a, b) => b.total - a.total);

The most valuable Retool-Practo integration joins appointment data from Practo with internal records — billing, insurance claims, patient satisfaction, or inventory. Add your clinic's internal database as a second resource in the same Retool app. Create a PostgreSQL or MySQL resource (Resources tab → Add Resource → PostgreSQL/MySQL) pointing to your clinic's internal database. Name it 'Clinic DB'. Create a database query named getPatientBilling: SELECT patient_id, appointment_ref, invoice_amount, payment_status, insurance_claim_id, created_at FROM billing WHERE patient_phone = '{{ table_appointments.selectedRow.phone }}' ORDER BY created_at DESC LIMIT 10 When a clinic staff member selects an appointment in the Practo appointments table, this query automatically runs and populates a billing detail panel on the right side of the screen. This gives front desk staff instant visibility into whether a patient has outstanding balances before they complete their visit. Add a second internal query named getPatientSatisfaction to pull NPS or satisfaction scores from your internal database for the selected patient. Display these alongside the Practo appointment history to give clinicians context about the patient's overall experience. Create a JavaScript query named buildPatientProfile that merges the Practo patient record with internal data, producing a unified object that drives a summary panel at the top of the patient detail view.

1SELECT
2  b.patient_id,
3  b.appointment_ref,
4  b.invoice_amount,
5  b.payment_status,
6  b.insurance_claim_id,
7  b.created_at,
8  ic.claim_status,
9  ic.approved_amount
10FROM billing b
11LEFT JOIN insurance_claims ic ON b.insurance_claim_id = ic.id
12WHERE b.patient_phone = '{{ table_appointments.selectedRow.phone }}'
13ORDER BY b.created_at DESC
14LIMIT 10;