From 3c0925065be366844b0cda64bfffe2ce7ba44d99 Mon Sep 17 00:00:00 2001
From: Tsu-ba-me <ynho.li.aa.e@gmail.com>
Date: Wed, 4 May 2022 20:07:33 -0400
Subject: [PATCH] fix(striker-ui): pass MessageBox props to Slider

---
 striker-ui/components/Slider.tsx | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/striker-ui/components/Slider.tsx b/striker-ui/components/Slider.tsx
index 47285529..d3faf0d6 100644
--- a/striker-ui/components/Slider.tsx
+++ b/striker-ui/components/Slider.tsx
@@ -13,7 +13,7 @@ import {
 
 import { BORDER_RADIUS, GREY } from '../lib/consts/DEFAULT_THEME';
 
-import MessageBox from './MessageBox';
+import MessageBox, { MessageBoxProps } from './MessageBox';
 import OutlinedInput from './OutlinedInput';
 import OutlinedInputLabel from './OutlinedInputLabel';
 import { BodyText } from './Text';
@@ -24,10 +24,10 @@ type SliderOnFocus = Exclude<MUISliderProps['onFocus'], undefined>;
 type SliderValue = Exclude<MUISliderProps['value'], undefined>;
 
 type SliderOptionalProps = {
-  error?: string | null;
   isAllowTextInput?: boolean;
   labelId?: string;
   labelProps?: MUITypographyProps;
+  messageBoxProps?: Partial<MessageBoxProps>;
   sliderProps?: Omit<MUISliderProps, 'onChange'> & {
     onChange?: (value: number | number[]) => void;
   };
@@ -41,10 +41,10 @@ type SliderProps = {
 type TextInputOnChange = Exclude<MUIOutlinedInputProps['onChange'], undefined>;
 
 const SLIDER_DEFAULT_PROPS: Required<SliderOptionalProps> = {
-  error: null,
   isAllowTextInput: false,
   labelId: '',
   labelProps: {},
+  messageBoxProps: {},
   sliderProps: {},
 };
 
@@ -150,7 +150,10 @@ const createOutlinedInput = ({
 );
 
 const Slider = ({
-  error,
+  messageBoxProps: {
+    text: messageBoxText,
+    type: messageBoxType,
+  } = SLIDER_DEFAULT_PROPS.messageBoxProps,
   isAllowTextInput,
   label,
   labelId,
@@ -249,8 +252,12 @@ const Slider = ({
               },
         })}
       </Box>
-      {error && (
-        <MessageBox sx={{ marginTop: '.4em' }} type="error" text={error} />
+      {messageBoxText && (
+        <MessageBox
+          sx={{ marginTop: '.4em' }}
+          text={messageBoxText}
+          type={messageBoxType}
+        />
       )}
     </FormControl>
   );