refactor(forms): update placeholders for improved clarity and user guidance

- Made the placeholder in InputGroup optional for better flexibility.
- Updated various form components (CreateCompany, CreateCustomer, CreateNotification, CreateCompanyCategory) to provide more descriptive placeholders, enhancing user understanding of expected input.
- Ensured consistency in placeholder text across different fields to improve overall user experience.

src/components/forms/customers/CreateCustomer.tsx

@@ -54,7 +54,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             name="username"
             label="Username"
             type="text"
-            placeholder="Enter username"
+            placeholder="Unique login, letters and numbers only"
             required
           />
           {errors.username && (
@@ -75,9 +75,9 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
                   }))
                 : []
             }
-            placeholder="Select companies to assign"
             {...register("companies")}
             errors={errors}
+            placeholder=""
           />
         </div>
         <div className="flex flex-col gap-2">
@@ -93,7 +93,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             label="Email"
             type="email"
             required
-            placeholder="Enter email"
+            placeholder="name@company.com"
           />
           {errors.email && (
             <p className="mt-1 text-sm text-red-500">{errors.email.message}</p>
@@ -108,7 +108,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             name="role"
             value={watch("role")}
             items={getEnumAsArray(AdminRoles)}
-            placeholder="Select Role"
+            placeholder="Choose a role"
             required
           />
         </div>
@@ -141,7 +141,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
               iconPosition="right"
               label="Password"
               type={showPassword ? "text" : "password"}
-              placeholder="Enter password"
+              placeholder="At least 8 characters"
               required={!editMode}
             />
             {errors.password && (
@@ -163,8 +163,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             })}
             name="full_name"
             label="Full name"
-            type="full_name"
-            placeholder="Enter full name"
+            type="text"
           />
           {errors.full_name && (
             <p className="mt-1 text-sm text-red-500">
@@ -187,7 +186,6 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             name="phone"
             label="Phone"
             type="tel"
-            placeholder="Enter phone"
           />
           {errors.phone && (
             <p className="mt-1 text-sm text-red-500">{errors.phone.message}</p>
@@ -206,7 +204,7 @@ const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
             label="Type"
             required
             value={watch("type")}
-            placeholder="Select Type"
+            placeholder="Choose customer type"
             prefixIcon={<GlobeIcon />}
             items={[
               {