Dual Valueset for Medication Request Instructions

public/locale/en.json

@@ -954,6 +954,7 @@
   "enter_aadhaar_otp": "Enter OTP sent to the registered mobile with Aadhaar",
   "enter_abha_address": "Enter ABHA Address",
   "enter_any_id": "Enter any ID linked with your ABHA number",
+  "enter_dosage_instructions": "Enter Dosage Instructions",
   "enter_file_name": "Enter File Name",
   "enter_message": "Start typing...",
   "enter_mobile_number": "Enter Mobile Number",
@@ -1300,6 +1301,7 @@
   "medical_council_registration_required": "Medical Council Registration is required",
   "medical_records": "Medical Records",
   "medical_worker": "Medical Worker",
+  "medication": "Medication",
   "medication_taken_between": "Medication Taken Between",
   "medicine": "Medicine",
   "medicine_administration_history": "Medicine Administration History",
@@ -1434,6 +1436,7 @@
   "noshow": "No-show",
   "not_eligible": "Not Eligible",
   "not_specified": "Not Specified",
+  "note": "Note",
   "notes": "Notes",
   "notes_placeholder": "Type your Notes",
   "notice_board": "Notice Board",
@@ -1654,6 +1657,7 @@
   "priority": "Priority",
   "prn_prescription": "PRN Prescription",
   "prn_prescriptions": "PRN Prescriptions",
+  "prn_reason": "PRN Reason",
   "procedure_suggestions": "Procedure Suggestions",
   "procedures_select_placeholder": "Select procedures to add details",
   "professional_info": "Professional Information",

src/components/Medicine/MedicationsTable.tsx

@@ -0,0 +1,135 @@
+import { useTranslation } from "react-i18next";
+
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@/components/ui/table";
+
+import { reverseFrequencyOption } from "@/components/Questionnaire/QuestionTypes/MedicationRequestQuestion";
+
+import {
+  MEDICATION_REQUEST_TIMING_OPTIONS,
+  MedicationRequestDosageInstruction,
+  MedicationRequestRead,
+} from "@/types/emr/medicationRequest";
+
+function getFrequencyDisplay(
+  timing?: MedicationRequestDosageInstruction["timing"],
+) {
+  if (!timing) return undefined;
+  const code = reverseFrequencyOption(timing);
+  if (!code) return undefined;
+  return {
+    code,
+    meaning: MEDICATION_REQUEST_TIMING_OPTIONS[code].display,
+  };
+}
+
+// Helper function to format dosage in Rx style
+function formatDosage(instruction: MedicationRequestDosageInstruction) {
+  if (!instruction.dose_and_rate) return "";
+
+  if (instruction.dose_and_rate.type === "calculated") {
+    const { dose_range } = instruction.dose_and_rate;
+    if (!dose_range) return "";
+    return `${dose_range.low.value}${dose_range.low.unit.display} - ${dose_range.high.value}${dose_range.high.unit.display}`;
+  }
+
+  const { dose_quantity } = instruction.dose_and_rate;
+  if (!dose_quantity?.value || !dose_quantity.unit) return "";
+
+  return `${dose_quantity.value} ${dose_quantity.unit.display}`;
+}
+
+// Helper function to format dosage instructions in Rx style
+function formatSig(instruction: MedicationRequestDosageInstruction) {
+  const parts: string[] = [];
+
+  // Add route if present
+  if (instruction.route?.display) {
+    parts.push(`Via ${instruction.route.display}`);
+  }
+
+  // Add method if present
+  if (instruction.method?.display) {
+    parts.push(`by ${instruction.method.display}`);
+  }
+
+  // Add site if present
+  if (instruction.site?.display) {
+    parts.push(`to ${instruction.site.display}`);
+  }
+
+  return parts.join(" ");
+}
+
+interface MedicationsTableProps {
+  medications: MedicationRequestRead[];
+}
+
+export const MedicationsTable = ({ medications }: MedicationsTableProps) => {
+  const { t } = useTranslation();
+
+  if (!medications?.length) {
+    return (
+      <div className="flex h-[200px] items-center justify-center rounded-lg border-2 border-dashed p-4 text-muted-foreground">
+        {t("no_medications_found_for_this_encounter")}
+      </div>
+    );
+  }
+
+  return (
+    <div className="border rounded-lg overflow-hidden">
+      <Table>
+        <TableHeader>
+          <TableRow className="divide-x bg-gray-100">
+            <TableHead>{t("medicine")}</TableHead>
+            <TableHead>{t("dosage")}</TableHead>
+            <TableHead>{t("frequency")}</TableHead>
+            <TableHead>{t("duration")}</TableHead>
+            <TableHead>{t("instructions")}</TableHead>
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {medications.map((medication) => {
+            const instruction = medication.dosage_instruction[0];
+            const frequency = getFrequencyDisplay(instruction?.timing);
+            const dosage = formatDosage(instruction);
+            const duration = instruction?.timing?.repeat?.bounds_duration;
+            const remarks = formatSig(instruction);
+            const notes = medication.note;
+            return (
+              <TableRow key={medication.id} className="divide-x font-medium">
+                <TableCell className="py-2 px-3">
+                  {medication.medication?.display}
+                </TableCell>
+                <TableCell className="py-2 px-3">{dosage}</TableCell>
+                <TableCell className="py-2 px-3">
+                  {instruction?.as_needed_boolean
+                    ? `${t("as_needed_prn")} (${instruction?.as_needed_for?.display})`
+                    : frequency?.meaning}
+                  {instruction?.additional_instruction?.[0]?.display && (
+                    <div className="text-sm text-gray-600">
+                      {instruction.additional_instruction[0].display}
+                    </div>
+                  )}
+                </TableCell>
+                <TableCell className="py-2 px-3">
+                  {duration ? `${duration.value} ${duration.unit}` : "-"}
+                </TableCell>
+                <TableCell className="py-2 px-3">
+                  {remarks || "-"}
+                  {notes ? ` (${t("note")}: ${notes})` : ""}
+                </TableCell>
+              </TableRow>
+            );
+          })}
+        </TableBody>
+      </Table>
+    </div>
+  );
+};