Merge pull request #512 from Arnei/update-dependency-muimaterial

Update @mui/material to 5.15.9

package.json

@@ -6,7 +6,7 @@
   "homepage": "/admin-ui",
   "dependencies": {
     "@hello-pangea/dnd": "^16.5.0",
-    "@mui/material": "^5.15.6",
+    "@mui/material": "^5.15.9",
     "@mui/styles": "^5.15.19",
     "@mui/x-date-pickers": "^6.19.0",
     "@reduxjs/toolkit": "^1.9.7",

src/components/shared/wizard/CustomStepIcon.tsx

@@ -2,16 +2,12 @@ import { useStepIconStyles } from "../../../utils/wizardUtils";
 import cn from "classnames";
 import { FaCircle, FaDotCircle } from "react-icons/fa";
 import React from "react";
-
-type customStepIconProps = {
-	active: boolean,
-	completed: boolean,
-}
+import { StepIconProps } from "@mui/material";
 
 /**
  * Component that renders icons of Stepper depending on completeness of steps
  */
-const CustomStepIcon = (props: customStepIconProps) => {
+const CustomStepIcon = (props: StepIconProps) => {
 	const { completed } = props;
 	const classes = useStepIconStyles(props);
 

src/utils/wizardUtils.ts

@@ -1,3 +1,4 @@
+import { StepIconProps } from "@mui/material";
 import  makeStyles  from "@mui/styles/makeStyles";
 
 // Base style for Stepper component
@@ -17,10 +18,6 @@ export const useStepLabelStyles = makeStyles({
 });
 
 // Style of icons used in Stepper
-type stepIconStyleProps = {
-	active: boolean,
-	completed: boolean,
-}
 export const useStepIconStyles = makeStyles({
 	root: {
 		height: 22,
@@ -30,7 +27,7 @@ export const useStepIconStyles = makeStyles({
 		color: "#92a0ab",
 		width: "20px",
 		height: "20px",
-		transform: (props: stepIconStyleProps) => props.active ? "scale(1.3)" : "scale(1.0)",
+		transform: (props: StepIconProps) => props.active ? "scale(1.3)" : "scale(1.0)",
 	},
 });