From a46c9fa3cb7f6b8019a5f1302df7d7675be4c9d9 Mon Sep 17 00:00:00 2001
From: Earl Munyua <142984533+Munyua123@users.noreply.github.com>
Date: Wed, 27 Nov 2024 16:14:45 +0300
Subject: [PATCH] (feat) O3-4216 Add the Programs Icon to CarbonMRS icon pack
 (#1212)

---
 packages/framework/esm-styleguide/mock.tsx    |  1 +
 .../src/icons/icon-registration.ts            |  2 +
 .../esm-styleguide/src/icons/icons.tsx        | 40 +++++++++++--------
 .../src/icons/svgs/programs.svg               | 13 ++++++
 4 files changed, 40 insertions(+), 16 deletions(-)
 create mode 100644 packages/framework/esm-styleguide/src/icons/svgs/programs.svg

diff --git a/packages/framework/esm-styleguide/mock.tsx b/packages/framework/esm-styleguide/mock.tsx
index 55425af5b..35df02169 100644
--- a/packages/framework/esm-styleguide/mock.tsx
+++ b/packages/framework/esm-styleguide/mock.tsx
@@ -50,6 +50,7 @@ export const OverflowMenuVerticalIcon = () => <div>OverflowMenuVerticalIcon</div
 export const PedestrianFamilyIcon = () => <div>PedestrianFamilyIcon</div>;
 export const PenIcon = () => <div>PenIcon</div>;
 export const PrinterIcon = () => <div>PrinterIcon</div>;
+export const ProgramsIcon = () => <div>ProgramsIcon</div>;
 export const RenewIcon = () => <div>RenewIcon</div>;
 export const ReportIcon = () => <div>ReportIcon</div>;
 export const SyringeIcon = () => <div>SyringeIcon</div>;
diff --git a/packages/framework/esm-styleguide/src/icons/icon-registration.ts b/packages/framework/esm-styleguide/src/icons/icon-registration.ts
index fcb12f6b3..a9bb4bf99 100644
--- a/packages/framework/esm-styleguide/src/icons/icon-registration.ts
+++ b/packages/framework/esm-styleguide/src/icons/icon-registration.ts
@@ -55,6 +55,7 @@ import overflowMenuVertical from './svgs/overflow-menu--vertical.svg';
 import pedestrianFamily from './svgs/pedestrian-family.svg';
 import pen from './svgs/pen.svg';
 import printer from './svgs/printer.svg';
+import programs from './svgs/programs.svg';
 import renew from './svgs/renew.svg';
 import password from './svgs/password.svg';
 import report from './svgs/report.svg';
@@ -139,6 +140,7 @@ export function setupIcons() {
   addSvg('omrs-icon-pedestrian-family', pedestrianFamily);
   addSvg('omrs-icon-pen', pen);
   addSvg('omrs-icon-printer', printer);
+  addSvg('omrs-icon-programs', programs);
   addSvg('omrs-icon-renew', renew);
   addSvg('omrs-icon-password', password);
   addSvg('omrs-icon-report', report);
diff --git a/packages/framework/esm-styleguide/src/icons/icons.tsx b/packages/framework/esm-styleguide/src/icons/icons.tsx
index 0398cc8dc..4506cbf64 100644
--- a/packages/framework/esm-styleguide/src/icons/icons.tsx
+++ b/packages/framework/esm-styleguide/src/icons/icons.tsx
@@ -455,6 +455,14 @@ export const PrinterIcon = memo(
   }),
 );
 
+/**
+ */
+export const ProgramsIcon = memo(
+  forwardRef<SVGSVGElement, IconProps>(function ProgramsIcon(props, ref) {
+    return <Icon ref={ref} icon="omrs-icon-programs" iconProps={props} />;
+  }),
+);
+
 /**
  */
 export const RenewIcon = memo(
@@ -463,6 +471,14 @@ export const RenewIcon = memo(
   }),
 );
 
+/**
+ */
+export const ReportIcon = memo(
+  forwardRef<SVGSVGElement, IconProps>(function ReportIcon(props, ref) {
+    return <Icon ref={ref} icon="omrs-icon-report" iconProps={props} />;
+  }),
+);
+
 /**
  */
 export const ResetIcon = memo(
@@ -530,6 +546,14 @@ export const StickyNoteAddIcon = memo(
   }),
 );
 
+/**
+ */
+export const SyringeIcon = memo(
+  forwardRef<SVGSVGElement, IconProps>(function SyringeIcon(props, ref) {
+    return <Icon ref={ref} icon="omrs-icon-syringe" iconProps={props} />;
+  }),
+);
+
 /**
  * Used as a button to add an item to the Order basket from a search
  */
@@ -643,22 +667,6 @@ export const WarningIcon = memo(
   }),
 );
 
-/**
- */
-export const ReportIcon = memo(
-  forwardRef<SVGSVGElement, IconProps>(function ReportIcon(props, ref) {
-    return <Icon ref={ref} icon="omrs-icon-report" iconProps={props} />;
-  }),
-);
-
-/**
- */
-export const SyringeIcon = memo(
-  forwardRef<SVGSVGElement, IconProps>(function SyringeIcon(props, ref) {
-    return <Icon ref={ref} icon="omrs-icon-syringe" iconProps={props} />;
-  }),
-);
-
 // Icon aliases that are a little more aligned to specific use-cases
 // should all resolve to a defined React icon
 
diff --git a/packages/framework/esm-styleguide/src/icons/svgs/programs.svg b/packages/framework/esm-styleguide/src/icons/svgs/programs.svg
new file mode 100644
index 000000000..b143d501b
--- /dev/null
+++ b/packages/framework/esm-styleguide/src/icons/svgs/programs.svg
@@ -0,0 +1,13 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<g>
+<path d="M15 15H14V14C14 13.7243 13.7759 13.5 13.5 13.5H10.5C10.2241 13.5 10 13.7243 10 14V15H9V14C9 13.1729 9.67285 12.5 10.5 12.5H13.5C14.3271 12.5 15 13.1729 15 14V15Z"/>
+<path d="M12 12C10.897 12 10 11.1028 10 10C10 8.8972 10.897 8 12 8C13.103 8 14 8.8972 14 10C14 11.1028 13.103 12 12 12ZM12 9C11.4488 9 11 9.4485 11 10C11 10.5515 11.4488 11 12 11C12.5512 11 13 10.5515 13 10C13 9.4485 12.5512 9 12 9Z"/>
+<path d="M5 10H4V11H5V10Z"/>
+<path d="M9 10H6V11H9V10Z"/>
+<path d="M5 8H4V9H5V8Z"/>
+<path d="M9 8H6V9H9V8Z"/>
+<path d="M5 6H4V7H5V6Z"/>
+<path d="M9 6H6V7H9V6Z"/>
+<path d="M10.5 2.5H9V2C9 1.4485 8.55125 1 8 1H5C4.44875 1 4 1.4485 4 2V2.5H2.5C1.94875 2.5 1.5 2.9485 1.5 3.5V13C1.5 13.5515 1.94875 14 2.5 14H7V13H2.5V3.5H4V4.5H9V3.5H10.5V6.99995H11.5V3.5C11.5 2.9485 11.0513 2.5 10.5 2.5ZM8 3.5H5V2H8V3.5Z" />
+</g>
+</svg>