Fix search modal

resources/scripts/components/elements/InputError.tsx

@@ -1,17 +1,18 @@
 import React from 'react';
 import capitalize from 'lodash-es/capitalize';
 import { FormikErrors, FormikTouched } from 'formik';
+import tw from 'twin.macro';
 
 interface Props {
     errors: FormikErrors<any>;
     touched: FormikTouched<any>;
     name: string;
-    children?: React.ReactNode;
+    children?: string | number | null | undefined;
 }
 
 const InputError = ({ errors, touched, name, children }: Props) => (
     touched[name] && errors[name] ?
-        <p className={'input-help error'}>
+        <p css={tw`text-xs text-red-400 pt-2`}>
             {typeof errors[name] === 'string' ?
                 capitalize(errors[name] as string)
                 :
@@ -19,9 +20,9 @@ const InputError = ({ errors, touched, name, children }: Props) => (
             }
         </p>
         :
-        <React.Fragment>
-            {children}
-        </React.Fragment>
+        <>
+            {children ? <p css={tw`text-xs text-neutral-400 pt-2`}>{children}</p> : null}
+        </>
 );
 
 export default InputError;