@eka-care/abdm-dashboard 0.0.2 → 0.0.21

package/src/components/abha-metric.tsx

@@ -1,321 +0,0 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { useGetCardMutation } from "../features/cardApis/cardApi";
-import {
-  faChartLine,
-  faCheck,
-  faClinicMedical,
-  faFileMedicalAlt,
-  faLink,
-} from "@fortawesome/free-solid-svg-icons";
-import MetricCard from "./cards/metric-card";
-import { useEffect, useState } from "react";
-import { formatDateToBackendISO, getYesterday } from "../utils/helpers";
-import { DATA_DATE_FILTERS } from "../utils/constants";
-import { getClinicId, getHfrId } from "../features/slice/landingApiSlice";
-import { useSelector } from "react-redux";
-import CustomCalendar from "./custom/calendar";
-
-type ValuePiece = Date | null;
-
-type Value = ValuePiece | [ValuePiece, ValuePiece];
-
-const AbhaMetric = () => {
-  const clinicId = useSelector(getClinicId);
-  const hfrId = useSelector(getHfrId);
-  const [isStartDateOpen, setIsStartDateOpen] = useState<boolean>(false);
-  const [isEndDateOpen, setIsEndDateOpen] = useState<boolean>(false);
-  const [getCard, { data, isSuccess }] = useGetCardMutation();
-  const [metricData, setMetricData] = useState<any[]>([
-    { title: "loader" },
-    { title: "loader" },
-    { title: "loader" },
-  ]);
-  const [date, setDate] = useState<{
-    from: Value;
-    to: Value;
-  }>({
-    from: null,
-    to: null,
-  });
-
-  const [selectedDataFilter, setSelectedDataFilter] =
-    useState<DATA_DATE_FILTERS>(DATA_DATE_FILTERS.YESTERDAY);
-
-  const [cardApiBody, setCardApiBody] = useState<{
-    from?: string;
-    to?: string;
-  }>({
-    from: getYesterday().start,
-    to: getYesterday().end,
-  });
-
-  const today = new Date();
-
-  useEffect(() => {
-    getCard({
-      clinicId: clinicId ?? "",
-      body: {
-        start_date: cardApiBody?.from,
-        end_date: cardApiBody?.to,
-      },
-    });
-  }, [cardApiBody]);
-
-  useEffect(() => {
-    if (isSuccess && data) {
-      setMetricData(data);
-    }
-  }, [isSuccess, data]);
-
-  const handleDateChange = (key: "from" | "to", value: Value) => {
-    if (Array.isArray(value)) {
-      console.warn("Range mode not supported here", value);
-      return;
-    }
-
-    setDate({
-      ...date,
-      [key]: value,
-    });
-
-    setCardApiBody((prev) => ({
-      ...prev,
-      [key]: value ? value.toISOString() : "",
-    }));
-  };
-
-  const handleDateFilterChange = (dateFilter: DATA_DATE_FILTERS): void => {
-    if (dateFilter === DATA_DATE_FILTERS.YESTERDAY) {
-      setCardApiBody({
-        from: getYesterday().start,
-        to: getYesterday().end,
-      });
-      setSelectedDataFilter(dateFilter);
-      return;
-    } else if (dateFilter === DATA_DATE_FILTERS.MONTHLY) {
-      const first = new Date(today.getFullYear(), today.getMonth(), 1);
-      const last = new Date(today.getFullYear(), today.getMonth() + 1, 0);
-      const isoFirst = formatDateToBackendISO(
-        first.toISOString().split("T")[0]
-      );
-      const isoLast = formatDateToBackendISO(last.toISOString().split("T")[0]);
-      setCardApiBody({
-        from: isoFirst,
-        to: isoLast,
-      });
-      setSelectedDataFilter(dateFilter);
-      return;
-    } else if (dateFilter === DATA_DATE_FILTERS.CUSTOM) {
-      setIsStartDateOpen(true);
-
-      if (Array.isArray(date?.from) || Array.isArray(date?.to)) {
-        console.warn("Range mode not supported here");
-        return;
-      }
-
-      setCardApiBody({
-        from: date?.from ? date?.from?.toISOString() : "",
-        to: date?.to ? date?.to?.toISOString() : "",
-      });
-      setSelectedDataFilter(dateFilter);
-    }
-  };
-
-  return (
-    <div className="abhaDash-bg-gradient-to-r abhaDash-from-[#DBE5FF] abhaDash-to-[#8EAEFF] abhaDash-p-25 ">
-      <div className="abhaDash-flex abhaDash-gap-20 max-md:abhaDash-justify-between">
-        <div className="AbhaTitlesSubheadline max-md:AbhaTitle2Subheadline">ABHA Metrics</div>
-        {hfrId && (
-          <div
-            className="AbhaBody2Regular 
-        abhaDash-gap-5 abhaDash-py-5 
-        abhaDash-w-fit abhaDash-px-20
-         abhaDash-flex abhaDash-justify-center 
-         abhaDash-items-center 
-          abhaDash-text-text-primary-dark
-           abhaDash-bg-bg-primary-container 
-           abhaDash-border
-           abhaDash-border-bg-white
-            abhaDash-rounded-20
-            
-            max-md:abhaDash-px-10"
-          >
-            <FontAwesomeIcon icon={faClinicMedical} />
-            HFR ID: {hfrId}
-          </div>
-        )}
-      </div>
-      <div className="AbhaBody2Regular abhaDash-text-text-neutral-800-dark abhaDash-py-10">
-        {/* Data for today and this month (last synced 1 day ago) */}
-      </div>
-      <div className="abhaDash-flex abhaDash-flex-wrap abhaDash-gap-8 ">
-        <div
-          onClick={
-            isSuccess
-              ? () => handleDateFilterChange(DATA_DATE_FILTERS.YESTERDAY)
-              : undefined
-          }
-          className={`
-            ${isSuccess ? "abhaDash-cursor-pointer" : "abhaDash-cursor-not-allowed"}
-            ${
-              selectedDataFilter === DATA_DATE_FILTERS.YESTERDAY
-                ? "abhaDash-border-text-primary abhaDash-text-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark"
-            } abhaDash-flex abhaDash-items-center abhaDash-gap-5 abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-1 abhaDash-rounded-10`}
-        >
-          {selectedDataFilter === DATA_DATE_FILTERS.YESTERDAY && (
-            <FontAwesomeIcon icon={faCheck} />
-          )}
-          Yesterday
-        </div>
-        <div
-          onClick={
-            isSuccess
-              ? () => handleDateFilterChange(DATA_DATE_FILTERS.MONTHLY)
-              : undefined
-          }
-          className={`
-            ${isSuccess ? "abhaDash-cursor-pointer" : "abhaDash-cursor-not-allowed"}
-            ${
-              selectedDataFilter === DATA_DATE_FILTERS.MONTHLY
-                ? "abhaDash-border-text-primary abhaDash-text-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark"
-            }  abhaDash-flex abhaDash-items-center abhaDash-gap-5 abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-1 abhaDash-rounded-10`}
-        >
-          {selectedDataFilter === DATA_DATE_FILTERS.MONTHLY && (
-            <FontAwesomeIcon icon={faCheck} />
-          )}
-          Monthly
-        </div>
-        <div
-          className={`abhaDash-flex ${isSuccess ? "abhaDash-cursor-pointer" : "abhaDash-cursor-not-allowed"}`}
-        >
-          <div
-            onClick={
-              isSuccess
-                ? () => handleDateFilterChange(DATA_DATE_FILTERS.CUSTOM)
-                : undefined
-            }
-            className={`${
-              selectedDataFilter === DATA_DATE_FILTERS.CUSTOM
-                ? "abhaDash-border-text-primary abhaDash-text-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark"
-            } abhaDash-flex abhaDash-items-center abhaDash-gap-5 abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-y-1 abhaDash-border-l-1 abhaDash-rounded-l-10`}
-          >
-            {selectedDataFilter === DATA_DATE_FILTERS.CUSTOM && (
-              <FontAwesomeIcon icon={faCheck} />
-            )}
-            Custom
-          </div>
-
-          <div
-            className={`${
-              selectedDataFilter === DATA_DATE_FILTERS.CUSTOM
-                ? "abhaDash-border-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark abhaDash-text-border-neutral-300-strokedark abhaDash-cursor-not-allowed"
-            } abhaDash-flex abhaDash-items-center abhaDash-gap-5 abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-y-1 abhaDash-border-l-1 text-center`}
-          >
-            <CustomCalendar
-              value={date.from}
-              onChange={(val) => handleDateChange("from", val)}
-              placeholder="Start Date"
-              disabled={selectedDataFilter !== DATA_DATE_FILTERS.CUSTOM}
-              minDate={undefined}
-              isOpen={isStartDateOpen}
-              onCalendarClose={() => {
-                setIsEndDateOpen(true);
-              }}
-            />
-          </div>
-          <div
-            className={`${
-              selectedDataFilter === DATA_DATE_FILTERS.CUSTOM
-                ? "abhaDash-border-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark abhaDash-text-border-neutral-300-strokedark abhaDash-cursor-not-allowed"
-            } abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-y-1`}
-          >
-            -
-          </div>
-          <div
-            className={`${
-              selectedDataFilter === DATA_DATE_FILTERS.CUSTOM
-                ? "abhaDash-border-text-primary"
-                : "abhaDash-border-border-neutral-300-strokedark abhaDash-text-border-neutral-300-strokedark abhaDash-cursor-not-allowed"
-            } abhaDash-flex abhaDash-items-center abhaDash-gap-5 abhaDash-py-10 abhaDash-px-12 abhaDash-bg-bg-white abhaDash-border-y-1 abhaDash-border-r-1 abhaDash-rounded-r-10 text-center`}
-          >
-            <CustomCalendar
-              value={date.to}
-              onChange={(val) => handleDateChange("to", val)}
-              placeholder="End Date"
-              disabled={selectedDataFilter !== DATA_DATE_FILTERS.CUSTOM}
-              isOpen={isEndDateOpen}
-              minDate={
-                date.from instanceof Date
-                  ? new Date(
-                      date.from.getFullYear(),
-                      date.from.getMonth(),
-                      date.from.getDate() + 1
-                    )
-                  : undefined
-              }
-              onCalendarClose={() => {
-                setIsEndDateOpen(false);
-                setIsStartDateOpen(false);
-              }}
-            />
-          </div>
-        </div>
-      </div>
-      <div className="abhaDash-flex abhaDash-flex-wrap abhaDash-gap-20 abhaDash-h-full abhaDash-pt-20 ">
-        {metricData?.map((val, idx) => {
-          return (
-            <MetricCard
-              isDataLoaded={isSuccess}
-              key={val?.id ?? idx}     
-              title={val?.title}
-              successText={
-                val?.title?.includes("Consent") ? "Successful" : "KYC Linked"
-              }
-              failedText={
-                val?.title?.includes("Consent") ? "Unsuccessful" : "Non KYC"
-              }
-              success={
-                val?.id?.includes("consent")
-                  ? val?.data?.success
-                  : val?.data?.kyc
-              }
-              failed={
-                val?.id?.includes("consent")
-                  ? val?.data?.failed
-                  : val?.data?.non_kyc
-              }
-              total={val?.data?.total}
-              cardIcon={
-                val?.id?.includes("abha")
-                  ? faChartLine
-                  : val?.id?.includes("records")
-                    ? faLink
-                    : faFileMedicalAlt
-              }
-            />
-          );
-        })}
-        {/* <div className="abhaDash-w-260 abhaDash-h-[55%] abhaDash-border-1 abhaDash-rounded-20 abhaDash-border-bg-primary-light abhaDash-bg-gradient-to-r abhaDash-from-[#95E9C1] abhaDash-to-[#D8FF71] abhaDash-p-20">
-          <div className="AbhaTitleHeadline abhaDash-text-text-primary-dark">
-            ₹400
-          </div>
-          <div className="AbhaTitle2Headline">DHIS Earnings</div>
-          <div className="abhaDash-border abhaDash-border-border-green-light abhaDash-my-10"></div>
-          <div className="AbhaTitle2Headline abhaDash-text-text-primary abhaDash-py-6">
-            See Calculation
-          </div>
-          <div className="AbhaBody3Regular abhaDash-text-text-neutral-800-dark">
-            Last synced 1 day ago*
-          </div>
-        </div> */}
-      </div>
-    </div>
-  );
-};
-
-export default AbhaMetric;

package/src/components/abha-workflows.tsx

@@ -1,225 +0,0 @@
-import {
-  faDownload,
-  faLink,
-  faUserPlus,
-} from "@fortawesome/free-solid-svg-icons";
-import WorkFlowCard from "./cards/workflow-card";
-import pagify from "@eka-care/pagify-sdk";
-import { PdfPage1 } from "../appointment-token-pdf/pdf-page1";
-import { renderToStaticMarkup } from "react-dom/server";
-import { PdfPage2 } from "../appointment-token-pdf/pdf-page2";
-import { useSelector } from "react-redux";
-import { getQrURl, getClinicName } from "../features/slice/landingApiSlice";
-import QRCode from "react-qr-code";
-
-const AbhaWorkFlows = ({
-  setShowAbhaSDK,
-  setShowWorkflowIframe,
-}: {
-  setShowAbhaSDK: (show: boolean) => void;
-  setShowWorkflowIframe: (show: boolean) => void;
-}) => {
-  const qrUrl = useSelector(getQrURl);
-  const clinicName = useSelector(getClinicName);
-
-  const handlePdfGenerate = async () => {
-    const innerHtml = renderToStaticMarkup(
-      <PdfPage1
-        qrUrl={qrUrl ?? "test"}
-        clinicName={clinicName ?? "Test Clinic"}
-      />
-    );
-    const innerHtml1 = renderToStaticMarkup(<PdfPage2 />);
-
-    const bodyHtml =
-      "<!doctype html>" +
-      `<div id="pagify-root" class="page-break" style="transform:rotate(90deg);">` +
-      innerHtml +
-      `</div>` +
-      `<div class="page-break-avoid" style="transform:rotate(90deg);">` +
-      innerHtml1 +
-      `</div>`;
-
-    await pagify.render({
-      head_html: `
-        <style>
-          .page-break-avoid { page-break-inside: avoid; }
-            .page-break {
-                page-break-after: always;
-            }
-        </style>
-    `,
-      body_html: bodyHtml,
-      page_size: "A4",
-      onPdfReady: (blobUrl: string) => {
-        const a = document.createElement("a");
-        a.href = blobUrl;
-        a.target = "_blank";
-        document.body.appendChild(a);
-        a.click();
-        a.remove();
-      },
-      onPdfError: (error: any) => {
-        console.error("PDF generation failed:", error);
-      },
-    } as any);
-  };
-
-  function waitForElement(
-    id: string,
-    callback: (element: HTMLElement) => void
-  ): void {
-    const interval = setInterval(() => {
-      const el = document.getElementById(id);
-      if (el) {
-        clearInterval(interval);
-        callback(el);
-      }
-    }, 50);
-  }
-
-  const handleAbhaSDKMount = () => {
-    setShowAbhaSDK(true);
-
-    if (typeof window === "undefined") return;
-
-    waitForElement("abha-container", () => {
-      console.log("🎉 abha-container found!");
-
-      if (typeof window.initAbhaApp !== "function") {
-        console.error("❌ initAbhaApp is not available on window.");
-        return;
-      }
-
-      window.initAbhaApp({
-        clientId: "doc-web",
-        containerId: "abha-container",
-        method: "create_abha_with_mobile",
-        data: {},
-
-        onSuccess: ({ response }) => {
-          console.log("✅ ABHA Success:", response);
-          const t = new window.Bridge();
-          t.refreshPatientDirectory();
-          setShowAbhaSDK(false);
-        },
-
-        onError: ({ error, response }) => {
-          console.error("❌ ABHA Error:", error || response);
-          setShowAbhaSDK(false);
-        },
-
-        onAbhaClose: () => {
-          console.log("❌ ABHA Close");
-          const t = new window.Bridge();
-          t.refreshPatientDirectory();
-          setShowAbhaSDK(false);
-        },
-      });
-    });
-  };
-
-  const handleIframeMount = (type: string) => {
-    setShowWorkflowIframe(true);
-    const iframeUrl =
-      type === "upload"
-        ? "https://demo.arcade.software/R8kEyxUclnWTItas93qN?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true"
-        : "https://demo.arcade.software/Bx1vEspdLmt5omIcks6H?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true";
-    waitForElement("iframe-container", () => {
-      const container = document.getElementById("iframe-container");
-      if (!container) return;
-
-      container.innerHTML = "";
-      const iframe = document.createElement("iframe");
-      iframe.src = iframeUrl;
-      iframe.title = "Upload and Organize Patient Lab Reports";
-      iframe.frameBorder = "0";
-      iframe.loading = "lazy";
-      iframe.allowFullscreen = true;
-      iframe.allow = "clipboard-write";
-      iframe.className = "abhaDash-h-full abhaDash-w-full";
-      iframe.style.colorScheme = "light";
-
-      container.appendChild(iframe);
-    });
-  };
-
-  return (
-    <div className="abhaDash-p-25 abhaDash-h-[25%] ">
-      <div className="AbhaTitlesSubheadline">ABHA Workflows</div>
-
-      <div className="AbhaBody2Regular abhaDash-text-text-neutral-800-dark abhaDash-py-10">
-        Direct access to ABDM functions
-      </div>
-
-      <div className="abhaDash-flex abhaDash-flex-wrap abhaDash-gap-20 abhaDash-pt-20 abhaDash-pb-70 abhaDash-gap-y-20">
-        <WorkFlowCard
-          bodyColor="abhaDash-bg-bg-primary-light"
-          bodyText="Generate ABHA for new patients"
-          icon={faUserPlus}
-          iconBgGradColorFrom="abhaDash-from-[#2B7FFF]"
-          iconBgGradColorTo="abhaDash-to-[#155DFC]"
-          btnText="Create ABHA"
-          disabled={false}
-          cta={handleAbhaSDKMount}
-          mobileStyling={"max-md:abhaDash-w-169"}
-        />
-        
-        <WorkFlowCard
-          bodyColor="abhaDash-bg-bg-yellow-light"
-          bodyText="Retrieve patient data from ABDM"
-          icon={faDownload}
-          iconBgGradColorFrom="abhaDash-from-[#FE9A00]"
-          iconBgGradColorTo="abhaDash-to-[#FF6900]"
-          btnText="Fetch Records"
-          disabled={false}
-          cta={() => handleIframeMount("fetch")}
-          mobileStyling={"max-md:abhaDash-w-169"}
-        />
-        <WorkFlowCard
-          bodyColor="abhaDash-bg-bg-green-light"
-          bodyText="Connect patient records to ABHA"
-          icon={faLink}
-          iconBgGradColorFrom="abhaDash-from-[#00BC7D]"
-          iconBgGradColorTo="abhaDash-to-[#009966]"
-          btnText="Upload & Link Records"
-          disabled={false}
-          cta={() => handleIframeMount("upload")}
-          mobileStyling={"max-md:abhaDash-w-360 max-md:abhaDash-flex max-md:abhaDash-gap-10 max-md:abhaDash-items-center"}
-        />
-
-        <div className="abhaDash-h-full abhaDash-w-380 abhaDash-pb-20">
-          <div className="abhaDash-w-full abhaDash-from-[#205CFF] abhaDash-to-[#AE71D2] abhaDash-bg-gradient-to-r  abhaDash-border-1 abhaDash-rounded-20 abhaDash-border-bg-neutral-100-bg-dark  abhaDash-p-20 ">
-            <div className="abhaDash-flex abhaDash-h-135 abhaDash-gap-20 abhaDash-text-text-white ">
-              <div className="abhaDash-h-full">
-                <QRCode
-                  className="abhaDash-h-full abhaDash-w-full abhaDash-border abhaDash-border-bg-04 abhaDash-p-10 abhaDash-rounded-10"
-                  value={qrUrl ?? ""}
-                />
-              </div>
-
-              <div className="abhaDash-flex-col abhaDash-flex abhaDash-justify-center">
-                <div className="AbhaTitle2Headline abhaDash-mb-10">
-                  Instant Appointment for Patients
-                </div>
-                <div className="AbhaBody3Regular abhaDash-mb-10">
-                  Patients can generate ABHA and book appointments using this QR
-                  Code.
-                </div>
-                <div
-                  className="AbhaTitle3Headline abhaDash-py-5 abhaDash-w-fit abhaDash-px-20 abhaDash-flex abhaDash-justify-center  abhaDash-text-text-primary abhaDash-bg-bg-white  abhaDash-rounded-20 abhaDash-cursor-pointer"
-                  onClick={handlePdfGenerate}
-                >
-                  {/* Download in your Language adding soon */}
-                  Download and Share
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AbhaWorkFlows;

package/src/components/automate-strip.tsx

@@ -1,29 +0,0 @@
-const AutomateStrip = ({
-  setShowAutomateModal,
-}: {
-  setShowAutomateModal: (show: boolean) => void;
-}) => {
-  return (
-    <div className="abhaDash-px-25">
-      <div className="max-md:abhaDash-flex-col max-md:abhaDash-py-14 max-md:abhaDash-items-start abhaDash-bg-bg-green-light abhaDash-mx-auto abhaDash-flex abhaDash-px-20 abhaDash-py-8 abhaDash-rounded-10 abhaDash-justify-between abhaDash-items-center abhaDash-mt-20">
-        <div className="AbhaBody2Regular max-md:abhaDash-hidden">
-          Maximise your earnings by sending patients KYC requests, ABHA creation
-          and consent for accessing medical history
-        </div>
-
-        <div className="AbhaBody2Regular md:abhaDash-hidden">
-          Maximise your earnings by sending patients <br />
-          - KYC requests, <br />
-          - ABHA creation, and <br />- Consent for accessing medical history
-        </div>
-        <div
-          onClick={() => setShowAutomateModal(true)}
-          className="max-md:abhaDash-w-full max-md:abhaDash-text-center max-md:abhaDash-mt-14 AbhaTitle3Headline abhaDash-px-12 abhaDash-py-10 abhaDash-rounded-8 abhaDash-bg-bg-doc abhaDash-text-text-white abhaDash-cursor-pointer"
-        >
-          Automate tasks
-        </div>
-      </div>
-    </div>
-  );
-};
-export default AutomateStrip;

package/src/components/cards/metric-card.tsx

@@ -1,75 +0,0 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import CardLoader from "../loader/card-loader";
-import { faCircleInfo } from "@fortawesome/free-solid-svg-icons";
-import Loader from "../loader/abdm-dash-loader";
-
-const MetricCard = ({
-  isDataLoaded,
-  total,
-  success,
-  failed,
-  successText,
-  failedText,
-  title,
-  cardIcon,
-}: {
-  isDataLoaded?: boolean;
-  total?: number;
-  success?: number;
-  failed?: number;
-  successText?: string;
-  failedText?: string;
-  title?: string;
-  cardIcon?: any;
-}) => {
-  return isDataLoaded ? (
-    <>
-      <div className="abhaDash-w-260 max-md:abhaDash-w-[47%] abhaDash-border-1 abhaDash-rounded-20 abhaDash-border-bg-green-dark abhaDash-bg-bg-white abhaDash-p-20">
-        <div className="abhaDash-flex abhaDash-justify-between">
-          <div className="AbhaTitleHeadline abhaDash-text-text-primary-dark">
-            {total ?? 0}
-          </div>
-          <FontAwesomeIcon
-            className="abhaDash-text-text-primary abhaDash-w-28 abhaDash-h-28"
-            icon={cardIcon}
-          />
-        </div>
-        <div className="AbhaTitle2Headline">{title}</div>
-
-        <CardLoader value={success ?? 0} total={total ?? 0} />
-
-        <div className="abhaDash-flex abhaDash-justify-between abhaDash-pt-5">
-          <div className="AbhaBody2Regular abhaDash-text-text-neutral-800-dark abhaDash-flex">
-            {successText}
-            <div
-              title={
-                title?.includes("Consent")
-                  ? "No. Of consent requests granted with atleast 1 medical record(s) successfully retrieved"
-                  : title?.includes("Records")
-                    ? "No. Of records linked to KYC verified ABHA"
-                    : "No. Of patients with KYC verified ABHA"
-              }
-            >
-              <FontAwesomeIcon
-                className="abhaDash-pl-5 abhaDash-w-14 abhaDash-h-14 abhaDash-cursor-pointer"
-                icon={faCircleInfo}
-              />
-            </div>
-          </div>
-          <div className="abhaDash-text-text-primary-dark">{success}</div>
-        </div>
-        <div className="abhaDash-flex abhaDash-justify-between">
-          <div className="AbhaBody2Regular abhaDash-text-text-neutral-800-dark">
-            {failedText}
-          </div>
-          <div className="abhaDash-text-text-red-primary">{failed}</div>
-        </div>
-      </div>
-    </>
-  ) : (
-    <div className="abhaDash-w-260 max-md:abhaDash-w-[47%] abhaDash-h-1/2 abhaDash-border-1 abhaDash-rounded-20 abhaDash-border-bg-green-dark abhaDash-bg-bg-white abhaDash-p-65">
-      <Loader bgColor="abhaDash-bg-bg-white" />
-    </div>
-  );
-};
-export default MetricCard;

package/src/components/cards/request-card.tsx

@@ -1,23 +0,0 @@
-const RequestCard = ({
-  bodyText,
-  btnText,
-  bodyColor,
-}: {
-  bodyText: string;
-  btnText: string;
-  bodyColor: string;
-}) => {
-  return (
-    <div
-      className={`${bodyColor} abhaDash-gap-10 abhaDash-text-neutral-1000-black abhaDash-flex abhaDash-items-center abhaDash-p-20 abhaDash-m-5 abhaDash-rounded-20  abhaDash-w-450`}
-    >
-      <div>
-        {bodyText}
-      </div>
-      <div className="AbhaTitle3Headline abhaDash-flex abhaDash-justify-center abhaDash-w-130 abhaDash-text-text-white abhaDash-bg-bg-doc abhaDash-py-12 abhaDash-px-10 abhaDash-rounded-8">
-        {btnText}
-      </div>
-    </div>
-  );
-};
-export default RequestCard;