@openmrs/esm-react-utils 4.0.0-pre.0 → 4.0.0-pre.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-react-utils",
-  "version": "4.0.0-pre.0",
+  "version": "4.0.0-pre.1",
   "license": "MPL-2.0",
   "description": "React utilities for OpenMRS.",
   "browser": "dist/openmrs-esm-react-utils.js",
@@ -55,11 +55,11 @@
     "react-i18next": "11.x"
   },
   "devDependencies": {
-    "@openmrs/esm-api": "^4.0.0-pre.0",
-    "@openmrs/esm-config": "^4.0.0-pre.0",
-    "@openmrs/esm-error-handling": "^4.0.0-pre.0",
-    "@openmrs/esm-extensions": "^4.0.0-pre.0",
-    "@openmrs/esm-globals": "^4.0.0-pre.0",
+    "@openmrs/esm-api": "^4.0.0-pre.1",
+    "@openmrs/esm-config": "^4.0.0-pre.1",
+    "@openmrs/esm-error-handling": "^4.0.0-pre.1",
+    "@openmrs/esm-extensions": "^4.0.0-pre.1",
+    "@openmrs/esm-globals": "^4.0.0-pre.1",
     "dayjs": "^1.10.8",
     "i18next": "^19.6.0",
     "react": "^18.1.0",
@@ -68,5 +68,5 @@
     "rxjs": "^6.5.3",
     "unistore": "^3.5.2"
   },
-  "gitHead": "254a7226212aac82df4434639b2584e24ac240e4"
+  "gitHead": "9f58b801f07526083a9edc1cc5a1e58660d71eb0"
 }

package/src/ConfigurableLink.tsx

@@ -1,8 +1,12 @@
 /** @module @category Navigation */
 import React, { MouseEvent, AnchorHTMLAttributes } from "react";
-import { navigate, interpolateUrl } from "@openmrs/esm-config";
+import { navigate, interpolateUrl, TemplateParams } from "@openmrs/esm-config";
 
-function handleClick(event: MouseEvent, to: string) {
+function handleClick(
+  event: MouseEvent,
+  to: string,
+  templateParams?: TemplateParams
+) {
   if (
     !event.metaKey &&
     !event.ctrlKey &&
@@ -10,7 +14,7 @@ function handleClick(event: MouseEvent, to: string) {
     event.button == 0
   ) {
     event.preventDefault();
-    navigate({ to });
+    navigate({ to, templateParams });
   }
 }
 
@@ -20,25 +24,30 @@ function handleClick(event: MouseEvent, to: string) {
 export interface ConfigurableLinkProps
   extends AnchorHTMLAttributes<HTMLAnchorElement> {
   to: string;
+  templateParams?: TemplateParams;
 }
 
 /**
  * A React link component which calls [[navigate]] when clicked
  *
  * @param to The target path or URL. Supports interpolation. See [[navigate]]
+ * @param urlParams: A dictionary of values to interpolate into the URL, in addition to the default keys `openmrsBase` and `openmrsSpaBase`.
  * @param children Inline elements within the link
  * @param otherProps Any other valid props for an <a> tag except `href` and `onClick`
  */
-export const ConfigurableLink: React.FC<ConfigurableLinkProps> = ({
+export function ConfigurableLink({
   to,
+  templateParams,
   children,
   ...otherProps
-}) => (
-  <a
-    onClick={(event) => handleClick(event, to)}
-    href={interpolateUrl(to)}
-    {...otherProps}
-  >
-    {children}
-  </a>
-);
+}: ConfigurableLinkProps) {
+  return (
+    <a
+      onClick={(event) => handleClick(event, to, templateParams)}
+      href={interpolateUrl(to, templateParams)}
+      {...otherProps}
+    >
+      {children}
+    </a>
+  );
+}

package/src/UserHasAccess.tsx

@@ -1,14 +1,16 @@
 /** @module @category API */
+import { getCurrentUser, LoggedInUser, userHasAccess } from "@openmrs/esm-api";
 import React, { useEffect, useState } from "react";
-import { getCurrentUser, userHasAccess, LoggedInUser } from "@openmrs/esm-api";
 
 export interface UserHasAccessProps {
   privilege: string;
+  fallback?: React.ReactNode;
   children?: React.ReactNode;
 }
 
 export const UserHasAccess: React.FC<UserHasAccessProps> = ({
   privilege,
+  fallback,
   children,
 }) => {
   const [user, setUser] = useState<LoggedInUser | null>(null);
@@ -22,7 +24,7 @@ export const UserHasAccess: React.FC<UserHasAccessProps> = ({
 
   if (user && userHasAccess(privilege, user)) {
     return <>{children}</>;
+  } else {
+    return fallback ? <>{fallback}</> : null;
   }
-
-  return null;
 };

package/src/useSession.tsx

@@ -98,11 +98,11 @@ export function useSession(): Session {
   if (!result) {
     if (promise) {
       console.warn(
-        "useSessionUser is in an unexpected state. Attempting to recover."
+        "useSession is in an unexpected state. Attempting to recover."
       );
       throw promise;
     } else {
-      throw Error("useSessionUser is in an invalid state.");
+      throw Error("useSession is in an invalid state.");
     }
   }
   return result;

package/src/useVisit.ts

@@ -7,6 +7,7 @@ import {
 import useSWR from "swr";
 import dayjs from "dayjs";
 import isToday from "dayjs/plugin/isToday";
+import { useMemo } from "react";
 
 dayjs.extend(isToday);
 
@@ -15,6 +16,7 @@ interface VisitReturnType {
   mutate: () => void;
   isValidating: boolean;
   currentVisit: Visit | null;
+  isLoading: boolean;
 }
 
 /**
@@ -28,15 +30,26 @@ export function useVisit(patientUuid: string): VisitReturnType {
   const { data, error, mutate, isValidating } = useSWR<{
     data: { results: Array<Visit> };
   }>(
-    `/ws/rest/v1/visit?patient=${patientUuid}&v=${defaultVisitCustomRepresentation}&includeInactive=false`,
+    patientUuid
+      ? `/ws/rest/v1/visit?patient=${patientUuid}&v=${defaultVisitCustomRepresentation}&includeInactive=false`
+      : null,
     openmrsFetch
   );
 
-  const currentVisit =
-    data?.data.results.find(
-      (visit) =>
-        visit.stopDatetime === null && dayjs(visit.startDatetime).isToday()
-    ) ?? null;
+  const currentVisit = useMemo(
+    () =>
+      data?.data.results.find(
+        (visit) =>
+          visit.stopDatetime === null && dayjs(visit.startDatetime).isToday()
+      ) ?? null,
+    [data?.data.results]
+  );
 
-  return { error, mutate, isValidating, currentVisit };
+  return {
+    error,
+    mutate,
+    isValidating,
+    currentVisit,
+    isLoading: !data && !error,
+  };
 }