Merge branch 'develop' into consultation/route-to-facility

.github/workflows/deploy.yaml

@@ -431,3 +431,45 @@ jobs:
           cd kube/deployments/
           sed -i -e "s/_BUILD_NUMBER_/${GITHUB_RUN_NUMBER}/g" care-fe.yaml
           kubectl apply -f care-fe.yaml
+
+  deploy-production-meghalaya:
+    needs: build-production
+    name: Deploy to GKE Meghalaya
+    runs-on: ubuntu-latest
+    environment:
+      name: Production-Meghalaya
+      url: https://care.meghealth.gov.in
+    steps:
+      - name: Checkout Kube Config
+        uses: actions/checkout@v3
+        with:
+          repository: coronasafe/ml-care-infra
+          token: ${{ secrets.GIT_ACCESS_TOKEN }}
+          path: kube
+          ref: main
+
+      # Setup gcloud CLI
+      - uses: google-github-actions/setup-gcloud@94337306dda8180d967a56932ceb4ddcf01edae7
+        with:
+          service_account_key: ${{ secrets.GKE_SA_KEY }}
+          project_id: ${{ secrets.GKE_PROJECT }}
+
+      # Get the GKE credentials, so we can deploy to the cluster
+      - uses: google-github-actions/get-gke-credentials@fb08709ba27618c31c09e014e1d8364b02e5042e
+        with:
+          cluster_name: ${{ secrets.GKE_CLUSTER }}
+          location: ${{ secrets.GKE_ZONE }}
+          credentials: ${{ secrets.GKE_SA_KEY }}
+
+      - name: install kubectl
+        uses: azure/[email protected]
+        with:
+          version: "v1.23.6"
+        id: install
+
+      - name: Deploy Care Fe Production
+        run: |
+          mkdir -p $HOME/.kube/
+          cd kube/deployments/
+          sed -i -e "s/_BUILD_NUMBER_/${GITHUB_RUN_NUMBER}/g" care-fe.yaml
+          kubectl apply -f care-fe.yaml

src/Components/Assets/AssetServiceEditModal.tsx

@@ -192,6 +192,7 @@ export const AssetServiceEditModal = (props: {
                 className="mt-2"
                 position="LEFT"
                 value={new Date(form.serviced_on)}
+                max={new Date(props.service_record.created_date)}
                 onChange={(date) => {
                   if (
                     dayjs(date.value).format("YYYY-MM-DD") >

src/Components/Assets/AssetsList.tsx

@@ -189,12 +189,12 @@ const AssetsList = () => {
           <Link
             key={asset.id}
             href={`/facility/${asset?.location_object.facility.id}/assets/${asset.id}`}
-            className="text-inherit"
+            className="h-full text-inherit"
             data-testid="created-asset-list"
           >
             <div
               key={asset.id}
-              className="border-1 w-full cursor-pointer items-center justify-center rounded-lg border border-transparent bg-white p-5 shadow hover:border-primary-500"
+              className="border-1 h-full w-full cursor-pointer items-center justify-center rounded-lg border border-transparent bg-white p-5 shadow hover:border-primary-500"
             >
               <div className="md:flex">
                 <p className="flex break-words text-xl font-medium capitalize">

src/Components/Common/DateInputV2.tsx

@@ -4,6 +4,8 @@ import CareIcon from "../../CAREUI/icons/CareIcon";
 import { Popover } from "@headlessui/react";
 import { classNames } from "../../Utils/utils";
 import dayjs from "../../Utils/dayjs";
+import * as Notification from "../../Utils/Notifications.js";
+import { t } from "i18next";
 
 type DatePickerType = "date" | "month" | "year";
 export type DatePickerPosition = "LEFT" | "RIGHT" | "CENTER";
@@ -16,6 +18,7 @@ interface Props {
   value: Date | undefined;
   min?: Date;
   max?: Date;
+  outOfLimitsErrorMessage?: string;
   onChange: (date: Date) => void;
   position?: DatePickerPosition;
   disabled?: boolean;
@@ -34,6 +37,7 @@ const DateInputV2: React.FC<Props> = ({
   value,
   min,
   max,
+  outOfLimitsErrorMessage,
   onChange,
   position,
   disabled,
@@ -100,16 +104,21 @@ const DateInputV2: React.FC<Props> = ({
   ) => void;
 
   const setDateValue = (date: number, close: CloseFunction) => () => {
-    isDateWithinConstraints(date) &&
-      onChange(
-        new Date(
-          datePickerHeaderDate.getFullYear(),
-          datePickerHeaderDate.getMonth(),
-          date
-        )
-      );
-    close();
-    setIsOpen?.(false);
+    isDateWithinConstraints(date)
+      ? (() => {
+          onChange(
+            new Date(
+              datePickerHeaderDate.getFullYear(),
+              datePickerHeaderDate.getMonth(),
+              date
+            )
+          );
+          close();
+          setIsOpen?.(false);
+        })()
+      : Notification.Error({
+          msg: outOfLimitsErrorMessage ?? "Cannot select date out of range",
+        });
   };
 
   const getDayCount = (date: Date) => {
@@ -220,7 +229,7 @@ const DateInputV2: React.FC<Props> = ({
                   readOnly
                   disabled={disabled}
                   className={`cui-input-base cursor-pointer disabled:cursor-not-allowed ${className}`}
-                  placeholder={placeholder ?? "Select date"}
+                  placeholder={placeholder ?? t("select_date")}
                   value={value && dayjs(value).format("DD/MM/YYYY")}
                 />
                 <div className="absolute right-0 top-1/2 -translate-y-1/2 p-2">
@@ -248,7 +257,7 @@ const DateInputV2: React.FC<Props> = ({
                             [dd, mm, yyyy].filter(Boolean).join("/")
                         ) || ""
                       } // Display the value in DD/MM/YYYY format
-                      placeholder="DD/MM/YYYY"
+                      placeholder={t("DD/MM/YYYY")}
                       onChange={(e) => {
                         setDisplayValue(e.target.value.replaceAll("/", ""));
                         const value = dayjs(e.target.value, "DD/MM/YYYY", true);
@@ -330,26 +339,41 @@ const DateInputV2: React.FC<Props> = ({
                             className="aspect-square w-[14.26%] border border-transparent p-1 text-center text-sm"
                           />
                         ))}
-                        {dayCount.map((d, i) => (
-                          <div
-                            key={i}
-                            id={`date-${d}`}
-                            className="aspect-square w-[14.26%]"
-                          >
+                        {dayCount.map((d, i) => {
+                          const withinConstraints = isDateWithinConstraints(d);
+                          const selected = value && isSelectedDate(d);
+
+                          const baseClasses =
+                            "flex h-full items-center justify-center rounded text-center text-sm leading-loose transition duration-100 ease-in-out";
+                          let conditionalClasses = "";
+
+                          if (withinConstraints) {
+                            if (selected) {
+                              conditionalClasses =
+                                "bg-primary-500 font-bold text-white";
+                            } else {
+                              conditionalClasses =
+                                "hover:bg-gray-300 cursor-pointer";
+                            }
+                          } else {
+                            conditionalClasses =
+                              "!cursor-not-allowed !text-gray-400";
+                          }
+                          return (
                             <div
-                              onClick={setDateValue(d, close)}
-                              className={classNames(
-                                "flex h-full cursor-pointer items-center justify-center rounded text-center text-sm leading-loose text-black transition duration-100 ease-in-out",
-                                value && isSelectedDate(d)
-                                  ? "bg-primary-500 font-bold text-white"
-                                  : "hover:bg-gray-300",
-                                !isDateWithinConstraints(d) && "!text-gray-300"
-                              )}
+                              key={i}
+                              id={`date-${d}`}
+                              className="aspect-square w-[14.26%]"
                             >
-                              {d}
+                              <div
+                                onClick={setDateValue(d, close)}
+                                className={`${baseClasses} ${conditionalClasses}`}
+                              >
+                                {d}
+                              </div>
                             </div>
-                          </div>
-                        ))}
+                          );
+                        })}
                       </div>
                     </>
                   )}

src/Components/Common/RelativeDateUserMention.tsx

@@ -8,7 +8,7 @@ function RelativeDateUserMention(props: {
   tooltipPosition?: "top" | "bottom" | "left" | "right";
 }) {
   return (
-    <div className="flex flex-row items-center">
+    <div className="flex flex-row flex-wrap items-center justify-center ">
       <div className="tooltip">
         <span
           className={`tooltip-text tooltip-${props.tooltipPosition || "top"}`}

src/Components/Facility/AddBedForm.tsx

@@ -229,12 +229,21 @@ export const AddBedForm = (props: BedFormProps) => {
                   min={1}
                   max={100}
                   onChange={(e) => setNumberOfBeds(Number(e.value))}
+                  error={
+                    numberOfBeds > 100
+                      ? "Number of beds cannot be greater than 100"
+                      : undefined
+                  }
                 />
               </>
             )}
             <div className="mt-4 flex flex-col gap-3 sm:flex-row sm:justify-end">
               <Cancel onClick={handleCancel} />
-              <Submit onClick={handleSubmit} label={buttonText} />
+              <Submit
+                onClick={handleSubmit}
+                label={buttonText}
+                disabled={numberOfBeds > 100}
+              />
             </div>
           </form>
         </Card>

src/Components/Facility/AddInventoryForm.tsx

@@ -16,6 +16,7 @@ import TextFormField from "../Form/FormFields/TextFormField";
 import { InventoryItemsModel } from "./models";
 import { Cancel, Submit } from "../Common/components/ButtonV2";
 import useAppHistory from "../../Common/hooks/useAppHistory";
+
 const Loading = lazy(() => import("../Common/Loading"));
 
 const initForm = {
@@ -122,6 +123,7 @@ export const AddInventoryForm = (props: any) => {
         setFacilityName("");
       }
     }
+
     fetchFacilityName();
   }, [dispatchAction, facilityId]);
 
@@ -327,7 +329,7 @@ export const AddInventoryForm = (props: any) => {
                 />
               </div>
             </div>
-            <div className="mt-4 flex flex-col justify-between gap-2 md:flex-row">
+            <div className="cui-form-button-group">
               <Cancel onClick={() => goBack()} />
               <Submit onClick={handleSubmit} label="Add/Update Inventory" />
             </div>

src/Components/Facility/AssetCreate.tsx

@@ -883,6 +883,7 @@ const AssetCreate = (props: AssetProps) => {
                         name="last_serviced_on"
                         className="mt-2"
                         position="RIGHT"
+                        disableFuture
                         value={last_serviced_on && new Date(last_serviced_on)}
                         onChange={(date) => {
                           if (

src/Components/Facility/ConsultationCard.tsx

@@ -112,21 +112,25 @@ export const ConsultationCard = (props: ConsultationProps) => {
       <div className="mt-8 flex flex-col">
         {
           <div className="flex flex-col items-center text-sm text-gray-700 md:flex-row">
-            Created:{" "}
+            Created :{" "}
+            <div className=" ml-1 text-black">
+              <RelativeDateUserMention
+                tooltipPosition="right"
+                actionDate={itemData.created_date}
+                user={itemData.created_by}
+              />
+            </div>
+          </div>
+        }
+        <div className="flex flex-col items-center text-sm text-gray-700 md:flex-row">
+          Last Modified :{" "}
+          <div className=" ml-1 text-black">
             <RelativeDateUserMention
               tooltipPosition="right"
-              actionDate={itemData.created_date}
-              user={itemData.created_by}
+              actionDate={itemData.modified_date}
+              user={itemData.last_edited_by}
             />
           </div>
-        }
-        <div className="flex flex-col items-center text-sm text-gray-700 md:flex-row">
-          Last Modified:{" "}
-          <RelativeDateUserMention
-            tooltipPosition="right"
-            actionDate={itemData.modified_date}
-            user={itemData.last_edited_by}
-          />
         </div>
       </div>
       <div className="mt-4 flex w-full flex-col justify-between gap-1 md:flex-row">

src/Components/Facility/Consultations/Feed.tsx

@@ -230,8 +230,28 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId, facilityId }) => {
     }
   };
 
+  const startStreamFeed = () => {
+    startStream({
+      onSuccess: () => setStreamStatus(StreamStatus.Playing),
+      onError: () => {
+        setStreamStatus(StreamStatus.Offline);
+        if (!statusReported) {
+          triggerGoal("Camera Feed Viewed", {
+            consultationId,
+            userId: authUser.id,
+            result: "error",
+          });
+          setStatusReported(true);
+        }
+      },
+    });
+  };
+
   useEffect(() => {
     if (cameraAsset.id) {
+      setTimeout(() => {
+        startStreamFeed();
+      }, 1000);
       getPresets({
         onSuccess: (resp) => setPresets(resp),
         onError: (_) => {
@@ -251,21 +271,8 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId, facilityId }) => {
         setStreamStatus(StreamStatus.Loading);
       }
       tId = setTimeout(() => {
-        startStream({
-          onSuccess: () => setStreamStatus(StreamStatus.Playing),
-          onError: () => {
-            setStreamStatus(StreamStatus.Offline);
-            if (!statusReported) {
-              triggerGoal("Camera Feed Viewed", {
-                consultationId,
-                userId: authUser.id,
-                result: "error",
-              });
-              setStatusReported(true);
-            }
-          },
-        });
-      }, 100);
+        startStreamFeed();
+      }, 5000);
     } else if (!statusReported) {
       triggerGoal("Camera Feed Viewed", {
         consultationId,
@@ -459,9 +466,9 @@ export const Feed: React.FC<IFeedProps> = ({ consultationId, facilityId }) => {
                   getCameraStatus({});
                 }}
                 className={classNames(
-                  "block border border-gray-500 px-4 py-2",
+                  "block border border-gray-500 px-4 py-2 first:rounded-l last:rounded-r",
                   currentPreset === preset
-                    ? "rounded border-primary-500 bg-primary-500 text-white"
+                    ? "border-primary-500 bg-primary-500 text-white"
                     : "bg-transparent"
                 )}
               >