Create order

src/components/Input.tsx

@@ -84,9 +84,14 @@ const Input: FC<Props> = (props: Props) => {
 
     return (
         <div className='w-full'>
-            <label className='text-sm'>
-                {props.label}
-            </label>
+            {props.label && (
+                <div className='flex items-center gap-1'>
+                    <label className='text-sm'>{props.label}</label>
+                    {props.isNotRequired && (
+                        <span className='text-xs text-description'>(اختیاری)</span>
+                    )}
+                </div>
+            )}
 
             <div className='w-full relative mt-1'>
                 <input {...props} onChange={(e) => {

src/components/Textarea.tsx

@@ -5,6 +5,7 @@ import { clx } from '../helpers/utils'
 type Props = {
     label?: string,
     error_text?: string
+    isNotRequired?: boolean
 } & InputHTMLAttributes<HTMLTextAreaElement>
 
 const Textarea: FC<Props> = (props: Props) => {
@@ -12,8 +13,11 @@ const Textarea: FC<Props> = (props: Props) => {
         <div className='w-full relative'>
             {
                 props.label &&
-                <div className='text-sm' >
-                    {props.label}
+                <div className='flex items-center gap-1'>
+                    <div className='text-sm'>{props.label}</div>
+                    {props.isNotRequired && (
+                        <span className='text-xs text-description'>(اختیاری)</span>
+                    )}
                 </div>
             }