Merge pull request #79 from palladiumkenya/KHP3-5430

(feat) KHP3-5430: Update the icons used for radiology
palladiumkenya · Jun 12, 2024 · c08946c · c08946c
2 parents ca0caef + 1f51f2e
commit c08946c
Show file tree

Hide file tree

Showing 7 changed files with 46 additions and 29 deletions.
diff --git a/src/form/radiology-orders/add-radiology-order/add-radiology-order.workspace.tsx b/src/form/radiology-orders/add-radiology-order/add-radiology-order.workspace.tsx
@@ -5,16 +5,14 @@ import { useTranslation } from "react-i18next";
 import { Button } from "@carbon/react";
 import { ArrowLeft } from "@carbon/react/icons";
 import {
+  DefaultWorkspaceProps,
   age,
   formatDate,
   parseDate,
   useLayoutType,
   usePatient,
 } from "@openmrs/esm-framework";
-import {
-  type DefaultWorkspaceProps,
-  launchPatientWorkspace,
-} from "@openmrs/esm-patient-common-lib";
+import { launchPatientWorkspace } from "@openmrs/esm-patient-common-lib";
 import { TestTypeSearch } from "./radiology-type-search";
 import { RadiologyOrderForm } from "./radiology-order-form.component";
 import styles from "./add-radiology-order.scss";

diff --git a/src/form/radiology-orders/add-radiology-order/radiology-order-form.component.tsx b/src/form/radiology-orders/add-radiology-order/radiology-order-form.component.tsx
@@ -1,7 +1,6 @@
 import React, { useCallback, useEffect, useState } from "react";
 import classNames from "classnames";
 import {
-  type DefaultWorkspaceProps,
   launchPatientWorkspace,
   useOrderBasket,
 } from "@openmrs/esm-patient-common-lib";
@@ -10,11 +9,11 @@ import {
   useLayoutType,
   useSession,
   useConfig,
+  DefaultWorkspaceProps,
 } from "@openmrs/esm-framework";
 import {
   careSettingUuid,
   prepRadiologyOrderPostData,
-  useOrderReasons,
   useConceptById,
 } from "../api";
 import {

diff --git a/src/form/radiology-orders/add-radiology-order/radiology-type-search.tsx b/src/form/radiology-orders/add-radiology-order/radiology-type-search.tsx
@@ -18,9 +18,9 @@ import {
   useLayoutType,
   useSession,
   ResponsiveWrapper,
+  closeWorkspace,
 } from "@openmrs/esm-framework";
 import {
-  closeWorkspace,
   launchPatientWorkspace,
   useOrderBasket,
 } from "@openmrs/esm-patient-common-lib";

diff --git a/src/form/radiology-orders/radiology-order-basket-panel/radiology-icon.component.tsx b/src/form/radiology-orders/radiology-order-basket-panel/radiology-icon.component.tsx
@@ -1,10 +1,10 @@
 import React from "react";
 
-interface LabIconProps {
+interface ImagingProps {
   isTablet: boolean;
 }
 
-export default function LabIcon({ isTablet }: LabIconProps) {
+export default function ImagingIcon({ isTablet }: ImagingProps) {
   const size = isTablet ? 40 : 24;
   return (
     <svg
@@ -14,17 +14,37 @@ export default function LabIcon({ isTablet }: LabIconProps) {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <g clipPath="url(#clip0_11156_284413)">
-        <path d="M24 0H0V24H24V0Z" fill="#E8DAFF" />
-        <path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M17.6157 15.8091L14 10.8374V6H15V5H9V6H10V10.8374L6.3843 15.8091C5.9398 16.4203 5.87585 17.2292 6.2188 17.9026C6.56175 18.576 7.25358 19 8.0093 19H15.9907C16.7464 19 17.4383 18.576 17.7812 17.9026C18.1242 17.2292 18.0602 16.4203 17.6157 15.8091ZM11 11.1626V6H13V11.1626L14.3364 13H9.6636L11 11.1626ZM15.9907 18H8.0093C7.62971 17.9999 7.28226 17.7868 7.10998 17.4486C6.93771 17.1103 6.96973 16.704 7.19285 16.3969L8.9363 14H15.0637L16.8072 16.3969C17.0303 16.704 17.0623 17.1103 16.89 17.4486C16.7178 17.7868 16.3703 17.9999 15.9907 18Z"
-          fill="#6929C4"
-        />
+      <g clip-path="url(#clip0_319_622)">
+        <mask
+          id="mask0_319_622"
+          maskUnits="userSpaceOnUse"
+          x="0"
+          y="0"
+          width="24"
+          height="24"
+        >
+          <path d="M24 0H0V24H24V0Z" fill="white" />
+        </mask>
+        <g mask="url(#mask0_319_622)">
+          <path d="M24 0H0V24H24V0Z" fill="#B2FFC7" />
+          <g clip-path="url(#clip1_319_622)">
+            <path
+              d="M18.5625 6.3125H12.4375C12.3215 6.3125 12.2102 6.35859 12.1281 6.44064C12.0461 6.52269 12 6.63397 12 6.75V12.4375C12 12.5535 12.0461 12.6648 12.1281 12.7469C12.2102 12.8289 12.3215 12.875 12.4375 12.875H18.5625C18.6785 12.875 18.7898 12.8289 18.8718 12.7469C18.9539 12.6648 19 12.5535 19 12.4375V6.75C19 6.63397 18.9539 6.52269 18.8718 6.44064C18.7898 6.35859 18.6785 6.3125 18.5625 6.3125ZM17.25 8.9375H15.9375V10.25H17.25V11.125H15.9375V12H15.0625V11.125H13.75V10.25H15.0625V8.9375H13.75V8.0625H15.0625V7.1875H15.9375V8.0625H17.25V8.9375Z"
+              fill="#028E28"
+            />
+            <path
+              d="M11.5625 18.125H10.6875V16.375C10.6907 16.2018 10.6589 16.0297 10.594 15.869C10.5292 15.7083 10.4326 15.5624 10.3101 15.4399C10.1876 15.3173 10.0417 15.2208 9.88099 15.1559C9.72031 15.0911 9.54822 15.0593 9.37498 15.0625H7.62498C7.45175 15.0593 7.27965 15.0911 7.11898 15.1559C6.9583 15.2208 6.81235 15.3173 6.68983 15.4399C6.56732 15.5624 6.47076 15.7083 6.40592 15.869C6.34109 16.0297 6.30931 16.2018 6.31248 16.375V18.125H5.43748V16.375C5.43464 16.0869 5.48928 15.8012 5.59821 15.5345C5.70713 15.2678 5.86816 15.0256 6.07185 14.8219C6.27555 14.6182 6.51783 14.4572 6.78451 14.3482C7.0512 14.2393 7.33693 14.1847 7.62498 14.1875H9.37498C9.66304 14.1847 9.94877 14.2393 10.2155 14.3482C10.4821 14.4572 10.7244 14.6182 10.9281 14.8219C11.1318 15.0256 11.2928 15.2678 11.4018 15.5345C11.5107 15.8012 11.5653 16.0869 11.5625 16.375V18.125Z"
+              fill="#028E28"
+            />
+            <path
+              d="M8.49998 9.8125C8.84808 9.8125 9.18192 9.95078 9.42806 10.1969C9.6742 10.4431 9.81248 10.7769 9.81248 11.125C9.81248 11.4731 9.6742 11.8069 9.42806 12.0531C9.18192 12.2992 8.84808 12.4375 8.49998 12.4375C8.15189 12.4375 7.81805 12.2992 7.57191 12.0531C7.32576 11.8069 7.18748 11.4731 7.18748 11.125C7.18748 10.7769 7.32576 10.4431 7.57191 10.1969C7.81805 9.95078 8.15189 9.8125 8.49998 9.8125ZM8.49998 8.9375C7.91982 8.9375 7.36342 9.16797 6.95319 9.5782C6.54295 9.98844 6.31248 10.5448 6.31248 11.125C6.31248 11.7052 6.54295 12.2616 6.95319 12.6718C7.36342 13.082 7.91982 13.3125 8.49998 13.3125C9.08014 13.3125 9.63654 13.082 10.0468 12.6718C10.457 12.2616 10.6875 11.7052 10.6875 11.125C10.6875 10.5448 10.457 9.98844 10.0468 9.5782C9.63654 9.16797 9.08014 8.9375 8.49998 8.9375Z"
+              fill="#028E28"
+            />
+          </g>
+        </g>
       </g>
       <defs>
-        <clipPath id="clip0_11156_284413">
+        <clipPath id="clip0_319_622">
           <rect width={size} height={size} fill="white" />
         </clipPath>
       </defs>

diff --git a/.../radiology-orders/radiology-order-basket-panel/radiology-order-basket-panel.extension.tsx b/.../radiology-orders/radiology-order-basket-panel/radiology-order-basket-panel.extension.tsx
@@ -11,7 +11,7 @@ import {
 } from "@openmrs/esm-patient-common-lib";
 import { RadiologyOrderBasketItemTile } from "./radiology-order-basket-item-tile.component";
 import { prepRadiologyOrderPostData } from "../api";
-import LabIcon from "./radiology-icon.component";
+import ImagingIcon from "./radiology-icon.component";
 import styles from "./radiology-order-basket-panel.scss";
 import { type RadiologyOrderBasketItem } from "../../../types";
 
@@ -98,7 +98,7 @@ export default function RadiologyOrderBasketPanelExtension() {
     >
       <div className={styles.container}>
         <div className={styles.iconAndLabel}>
-          <LabIcon isTablet={isTablet} />
+          <ImagingIcon isTablet={isTablet} />
           <h4 className={styles.heading}>{`${t(
             "radiologyOrders",
             "Radiology orders"

diff --git a/src/form/radiology-orders/radiology-order-basket-panel/radiology-order-basket-panel.scss b/src/form/radiology-orders/radiology-order-basket-panel/radiology-order-basket-panel.scss
@@ -3,16 +3,16 @@
 @import '@openmrs/esm-styleguide/src/vars';
 
 .desktopTile {
-  border-left: 4px solid #6929c4;
+  border-left: 4px solid #18cd69;
   background-color: $ui-02;
-  border-top: 1px solid #e8daff;
+  border-top: 1px solid #8ecdaa;
   border-right: none;
   padding: 0;
 }
 
 .tabletTile {
   @extend .desktopTile;
-  border-top: 1px solid #612EBD;
+  border-top: 1px solid #0ec862;
 }
 
 .collapsedTile {
@@ -71,4 +71,4 @@
   svg {
     fill: black;
   }
-}
+}
diff --git a/yarn.lock b/yarn.lock
@@ -4173,9 +4173,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@openmrs/esm-patient-common-lib@npm:^7.1.0":
-  version: 7.1.0
-  resolution: "@openmrs/esm-patient-common-lib@npm:7.1.0"
+"@openmrs/esm-patient-common-lib@npm:next":
+  version: 8.0.2-pre.4670
+  resolution: "@openmrs/esm-patient-common-lib@npm:8.0.2-pre.4670"
   dependencies:
     "@carbon/react": ^1.12.0
     lodash-es: ^4.17.21
@@ -4184,7 +4184,7 @@ __metadata:
     "@openmrs/esm-framework": 5.x
     react: 18.x
     single-spa: 6.x
-  checksum: ba8b5194a7aeb9a1f3ecbb441e64c6843e991a52a208f2c57a1d015df1d090c34362afe8c7323072894ebec7d7ae584962f10f59c2c0dc24c68dc95b40935029
+  checksum: 5fa6cd535a2d5612fe24d6ac20a8eef12c5db0b98cc151f6cb20994c22b15ba3b994ce87290d5a479bdf8841bd028ab46d81006df19e2ff77fb0990e26cd73d8
   languageName: node
   linkType: hard
 
@@ -4195,7 +4195,7 @@ __metadata:
     "@carbon/react": ^1.33.1
     "@hookform/resolvers": ^3.3.4
     "@openmrs/esm-framework": next
-    "@openmrs/esm-patient-common-lib": ^7.1.0
+    "@openmrs/esm-patient-common-lib": next
     "@openmrs/esm-styleguide": next
     "@playwright/test": ^1.30.0
     "@swc/cli": ^0.1.62