Add new mih text form field to Business Profile

Frontend/lib/mih_packages/mzansi_profile/business_profile/builders/build_employee_list.dart

@@ -3,9 +3,10 @@ import 'dart:convert';
 import 'package:flutter_speed_dial/flutter_speed_dial.dart';
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_dropdown_input.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_text_input.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_button.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_form.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_window.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_text_form_field.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_delete_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_error_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_loading_circle.dart';
@@ -36,6 +37,7 @@ class _BuildEmployeeListState extends State<BuildEmployeeList> {
   TextEditingController fnameController = TextEditingController();
   TextEditingController lnameController = TextEditingController();
 
+  final _formKey = GlobalKey<FormState>();
   final baseAPI = AppEnviroment.baseApiUrl;
 
   Future<void> updateEmployeeAPICall(int index) async {
@@ -178,63 +180,84 @@ class _BuildEmployeeListState extends State<BuildEmployeeList> {
         },
         windowBody: Column(
           children: [
-            const SizedBox(height: 10.0),
-            MIHTextField(
-              controller: fnameController,
-              hintText: "First Name",
-              editable: false,
-              required: true,
-            ),
-            const SizedBox(height: 10.0),
-            MIHTextField(
-              controller: lnameController,
-              hintText: "Surname",
-              editable: false,
-              required: true,
-            ),
-            const SizedBox(height: 10.0),
-            MIHDropdownField(
-              controller: typeController,
-              hintText: "Title",
-              dropdownOptions: const ["Doctor", "Assistant"],
-              required: true,
-              editable: true,
-              enableSearch: false,
-            ),
-            const SizedBox(height: 10.0),
-            MIHDropdownField(
-              controller: accessController,
-              hintText: "Access",
-              dropdownOptions: const ["Full", "Partial"],
-              required: true,
-              editable: true,
-              enableSearch: false,
-            ),
-            const SizedBox(height: 15.0),
-            MihButton(
-              onPressed: () {
-                if (isRequiredFieldsCaptured()) {
-                  updateEmployeeAPICall(index);
-                } else {
-                  showDialog(
-                    context: context,
-                    builder: (context) {
-                      return const MIHErrorMessage(errorType: "Input Error");
-                    },
-                  );
-                }
-              },
-              buttonColor:
-                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-              width: 300,
-              child: Text(
-                "Update",
-                style: TextStyle(
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                  fontSize: 20,
-                  fontWeight: FontWeight.bold,
+            MihForm(
+              formKey: _formKey,
+              formFields: [
+                MihTextFormField(
+                  fillColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  inputColor:
+                      MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  controller: fnameController,
+                  multiLineInput: false,
+                  requiredText: true,
+                  readOnly: true,
+                  hintText: "First Name",
                 ),
-              ),
+                const SizedBox(height: 10.0),
+                MihTextFormField(
+                  fillColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  inputColor:
+                      MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  controller: lnameController,
+                  multiLineInput: false,
+                  requiredText: true,
+                  readOnly: true,
+                  hintText: "Surname",
+                ),
+                const SizedBox(height: 15.0),
+                MIHDropdownField(
+                  controller: typeController,
+                  hintText: "Title",
+                  dropdownOptions: const ["Doctor", "Assistant"],
+                  required: true,
+                  editable: true,
+                  enableSearch: false,
+                ),
+                const SizedBox(height: 10.0),
+                MIHDropdownField(
+                  controller: accessController,
+                  hintText: "Access",
+                  dropdownOptions: const ["Full", "Partial"],
+                  required: true,
+                  editable: true,
+                  enableSearch: false,
+                ),
+                const SizedBox(height: 20.0),
+                Center(
+                  child: MihButton(
+                    onPressed: () {
+                      if (_formKey.currentState!.validate()) {
+                        if (isRequiredFieldsCaptured()) {
+                          updateEmployeeAPICall(index);
+                        } else {
+                          showDialog(
+                            context: context,
+                            builder: (context) {
+                              return const MIHErrorMessage(
+                                  errorType: "Input Error");
+                            },
+                          );
+                        }
+                      }
+                    },
+                    buttonColor:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    width: 300,
+                    child: Text(
+                      "Update",
+                      style: TextStyle(
+                        color: MzanziInnovationHub.of(context)!
+                            .theme
+                            .primaryColor(),
+                        fontSize: 20,
+                        fontWeight: FontWeight.bold,
+                      ),
+                    ),
+                  ),
+                ),
+              ],
             ),
           ],
         ),

Frontend/lib/mih_packages/mzansi_profile/business_profile/builders/build_user_list.dart

@@ -2,9 +2,10 @@ import 'dart:convert';
 
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_dropdown_input.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_text_input.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_button.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_form.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_window.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_text_form_field.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_error_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_loading_circle.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_success_message.dart';
@@ -31,9 +32,10 @@ class BuildUserList extends StatefulWidget {
 class _BuildUserListState extends State<BuildUserList> {
   TextEditingController accessController = TextEditingController();
   TextEditingController typeController = TextEditingController();
-  TextEditingController fnameController = TextEditingController();
-  TextEditingController lnameController = TextEditingController();
+  TextEditingController usernameController = TextEditingController();
+  TextEditingController emailController = TextEditingController();
 
+  final _formKey = GlobalKey<FormState>();
   final baseAPI = AppEnviroment.baseApiUrl;
 
   Future<void> createBusinessUserAPICall(int index) async {
@@ -118,8 +120,8 @@ class _BuildUserListState extends State<BuildUserList> {
       //typeController.text = widget.users[index].title;
       // var fnameInitial = widget.users[index].fname[0];
       // var lnameInitial = widget.users[index].lname[0];
-      fnameController.text = widget.users[index].username;
-      lnameController.text = hideEmail(widget.users[index].email);
+      usernameController.text = widget.users[index].username;
+      emailController.text = hideEmail(widget.users[index].email);
     });
     showDialog(
         context: context,
@@ -129,67 +131,89 @@ class _BuildUserListState extends State<BuildUserList> {
             windowTitle: "Add Employee",
             windowBody: Column(
               children: [
-                const SizedBox(height: 10.0),
-                MIHTextField(
-                  controller: fnameController,
-                  hintText: "Username Name",
-                  editable: false,
-                  required: true,
-                ),
-                const SizedBox(height: 10.0),
-                MIHTextField(
-                  controller: lnameController,
-                  hintText: "Email",
-                  editable: false,
-                  required: true,
-                ),
-                const SizedBox(height: 10.0),
-                MIHDropdownField(
-                  controller: typeController,
-                  hintText: "Title",
-                  dropdownOptions: const ["Doctor", "Assistant"],
-                  required: true,
-                  editable: true,
-                  enableSearch: false,
-                ),
-                const SizedBox(height: 10.0),
-                MIHDropdownField(
-                  controller: accessController,
-                  hintText: "Access",
-                  dropdownOptions: const ["Full", "Partial"],
-                  required: true,
-                  editable: true,
-                  enableSearch: false,
-                ),
-                const SizedBox(height: 15.0),
-                MihButton(
-                  onPressed: () {
-                    if (isRequiredFieldsCaptured()) {
-                      createBusinessUserAPICall(index);
-                    } else {
-                      showDialog(
-                        context: context,
-                        builder: (context) {
-                          return const MIHErrorMessage(
-                              errorType: "Input Error");
-                        },
-                      );
-                    }
-                  },
-                  buttonColor:
-                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  width: 300,
-                  child: Text(
-                    "Add",
-                    style: TextStyle(
-                      color:
+                MihForm(
+                  formKey: _formKey,
+                  formFields: [
+                    MihTextFormField(
+                      fillColor: MzanziInnovationHub.of(context)!
+                          .theme
+                          .secondaryColor(),
+                      inputColor:
                           MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                      fontSize: 20,
-                      fontWeight: FontWeight.bold,
+                      controller: usernameController,
+                      multiLineInput: false,
+                      requiredText: true,
+                      readOnly: true,
+                      hintText: "Username",
                     ),
-                  ),
+                    const SizedBox(height: 10.0),
+                    MihTextFormField(
+                      fillColor: MzanziInnovationHub.of(context)!
+                          .theme
+                          .secondaryColor(),
+                      inputColor:
+                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                      controller: emailController,
+                      multiLineInput: false,
+                      requiredText: true,
+                      readOnly: true,
+                      hintText: "Email",
+                    ),
+                    const SizedBox(height: 15.0),
+                    MIHDropdownField(
+                      controller: typeController,
+                      hintText: "Title",
+                      dropdownOptions: const ["Doctor", "Assistant"],
+                      required: true,
+                      editable: true,
+                      enableSearch: false,
+                    ),
+                    const SizedBox(height: 10.0),
+                    MIHDropdownField(
+                      controller: accessController,
+                      hintText: "Access",
+                      dropdownOptions: const ["Full", "Partial"],
+                      required: true,
+                      editable: true,
+                      enableSearch: false,
+                    ),
+                    const SizedBox(height: 15.0),
+                    Center(
+                      child: MihButton(
+                        onPressed: () {
+                          if (_formKey.currentState!.validate()) {
+                            if (isRequiredFieldsCaptured()) {
+                              createBusinessUserAPICall(index);
+                            } else {
+                              showDialog(
+                                context: context,
+                                builder: (context) {
+                                  return const MIHErrorMessage(
+                                      errorType: "Input Error");
+                                },
+                              );
+                            }
+                          }
+                        },
+                        buttonColor: MzanziInnovationHub.of(context)!
+                            .theme
+                            .secondaryColor(),
+                        width: 300,
+                        child: Text(
+                          "Add",
+                          style: TextStyle(
+                            color: MzanziInnovationHub.of(context)!
+                                .theme
+                                .primaryColor(),
+                            fontSize: 20,
+                            fontWeight: FontWeight.bold,
+                          ),
+                        ),
+                      ),
+                    ),
+                    const SizedBox(height: 10.0),
+                  ],
                 ),
-                const SizedBox(height: 10.0),
               ],
             ),
             onWindowTapClose: () {
@@ -201,8 +225,8 @@ class _BuildUserListState extends State<BuildUserList> {
   void dispose() {
     accessController.dispose();
     typeController.dispose();
-    fnameController.dispose();
-    lnameController.dispose();
+    usernameController.dispose();
+    emailController.dispose();
     super.dispose();
   }
 

Frontend/lib/mih_packages/mzansi_profile/business_profile/package_tools/mih_business_details.dart

@@ -4,12 +4,15 @@ import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_business_details_apis.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_file_api.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_location_api.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_text_input.dart';
+import 'package:mzansi_innovation_hub/mih_apis/mih_validation_services.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_dropdown_input.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_single_child_scroll.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_button.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_form.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_tool_body.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_alert.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_circle_avatar.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_text_form_field.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_error_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_success_message.dart';
 import 'package:mzansi_innovation_hub/mih_env/env.dart';
@@ -39,17 +42,11 @@ class _MihBusinessDetailsState extends State<MihBusinessDetails> {
   final contactController = TextEditingController();
   final emailController = TextEditingController();
   final locationController = TextEditingController();
+  final _formKey = GlobalKey<FormState>();
   late String env;
 
   Future<void> submitForm() async {
-    if (!isEmailValid()) {
-      showDialog(
-        context: context,
-        builder: (context) {
-          return const MIHErrorMessage(errorType: "Invalid Email");
-        },
-      );
-    } else if (isFormFilled()) {
+    if (isFormFilled()) {
       int statusCode = 0;
       statusCode = await MihBusinessDetailsApi().updateBusinessDetails(
         widget.arguments.business!.business_id,
@@ -180,14 +177,7 @@ class _MihBusinessDetailsState extends State<MihBusinessDetails> {
   }
 
   bool isFormFilled() {
-    if (regController.text.isEmpty ||
-        nameController.text.isEmpty ||
-        typeController.text.isEmpty ||
-        practiceNoController.text.isEmpty ||
-        vatNoController.text.isEmpty ||
-        contactController.text.isEmpty ||
-        emailController.text.isEmpty ||
-        locationController.text.isEmpty) {
+    if (typeController.text.isEmpty) {
       return false;
     } else {
       return true;
@@ -244,132 +234,196 @@ class _MihBusinessDetailsState extends State<MihBusinessDetails> {
     return MihSingleChildScroll(
         child: Column(
       children: [
-        MihCircleAvatar(
-          imageFile: widget.logoImage,
-          width: 150,
-          editable: true,
-          fileNameController: fileNameController,
-          userSelectedfile: imageFile,
-          frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          backgroundColor:
-              MzanziInnovationHub.of(context)!.theme.primaryColor(),
-          onChange: (selectedfile) {
-            setState(() {
-              imageFile = selectedfile;
-            });
-          },
-        ),
-        Visibility(
-          visible: false,
-          child: MIHTextField(
-            controller: fileNameController,
-            hintText: "Selected File Name",
-            editable: false,
-            required: false,
-          ),
-        ),
-        const SizedBox(height: 20),
-        MIHTextField(
-          controller: regController,
-          hintText: "Registration No.",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: nameController,
-          hintText: "Business Name",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: typeController,
-          hintText: "Business Type",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: practiceNoController,
-          hintText: "Practice Number",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: vatNoController,
-          hintText: "VAT Number",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: contactController,
-          hintText: "Contact Number",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        MIHTextField(
-          controller: emailController,
-          hintText: "Email",
-          editable: true,
-          required: true,
-        ),
-        const SizedBox(height: 10),
-        Row(
-          children: [
-            Flexible(
-              child: MIHTextField(
-                controller: locationController,
-                hintText: "Location",
-                editable: false,
-                required: false,
+        MihForm(
+          formKey: _formKey,
+          formFields: [
+            Center(
+              child: MihCircleAvatar(
+                imageFile: widget.logoImage,
+                width: 150,
+                editable: true,
+                fileNameController: fileNameController,
+                userSelectedfile: imageFile,
+                frameColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                backgroundColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                onChange: (selectedfile) {
+                  setState(() {
+                    imageFile = selectedfile;
+                  });
+                },
               ),
             ),
-            const SizedBox(width: 10.0),
-            MihButton(
-              onPressed: () {
-                MIHLocationAPI().getGPSPosition(context).then((position) {
-                  if (position != null) {
-                    setState(() {
-                      locationController.text =
-                          "${position.latitude}, ${position.longitude}";
-                    });
-                  }
-                });
-              },
-              buttonColor:
+            Visibility(
+              visible: false,
+              child: MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: fileNameController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
+                hintText: "Selected File Name",
+              ),
+            ),
+            const SizedBox(height: 20),
+            MihTextFormField(
+              fillColor:
                   MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-              width: 100,
-              child: Text(
-                "Set",
-                style: TextStyle(
-                  color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                  fontSize: 20,
-                  fontWeight: FontWeight.bold,
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: regController,
+              multiLineInput: false,
+              requiredText: true,
+              hintText: "Registration No.",
+              validator: (value) {
+                return MihValidationServices().isEmpty(value);
+              },
+            ),
+            const SizedBox(height: 10),
+            MihTextFormField(
+              fillColor:
+                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: nameController,
+              multiLineInput: false,
+              requiredText: true,
+              hintText: "Business Name",
+              validator: (value) {
+                return MihValidationServices().isEmpty(value);
+              },
+            ),
+            const SizedBox(height: 15),
+            MIHDropdownField(
+              controller: typeController,
+              hintText: "Business Type",
+              dropdownOptions: const ["Doctors Office", "Other"],
+              required: true,
+              editable: true,
+              enableSearch: false,
+            ),
+            const SizedBox(height: 10),
+            MihTextFormField(
+              fillColor:
+                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: practiceNoController,
+              multiLineInput: false,
+              requiredText: typeController.text == "Doctors Office",
+              hintText: "Practice Number",
+              validator: (validateValue) {
+                return MihValidationServices().isEmpty(validateValue);
+              },
+            ),
+            const SizedBox(height: 10),
+            MihTextFormField(
+              fillColor:
+                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: vatNoController,
+              multiLineInput: false,
+              requiredText: true,
+              hintText: "VAT Number",
+              validator: (value) {
+                return MihValidationServices().isEmpty(value);
+              },
+            ),
+            const SizedBox(height: 10),
+            MihTextFormField(
+              fillColor:
+                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: contactController,
+              multiLineInput: false,
+              requiredText: true,
+              hintText: "Contact Number",
+              validator: (value) {
+                return MihValidationServices().isEmpty(value);
+              },
+            ),
+            const SizedBox(height: 10),
+            MihTextFormField(
+              fillColor:
+                  MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+              inputColor: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              controller: emailController,
+              multiLineInput: false,
+              requiredText: true,
+              hintText: "Business Email",
+              validator: (value) {
+                return MihValidationServices().validateEmail(value);
+              },
+            ),
+            const SizedBox(height: 10),
+            Row(
+              crossAxisAlignment: CrossAxisAlignment.end,
+              children: [
+                Flexible(
+                  child: MihTextFormField(
+                    fillColor:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    inputColor:
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                    controller: locationController,
+                    multiLineInput: false,
+                    requiredText: true,
+                    hintText: "GPS Location",
+                  ),
+                ),
+                const SizedBox(width: 10.0),
+                MihButton(
+                  onPressed: () {
+                    MIHLocationAPI().getGPSPosition(context).then((position) {
+                      if (position != null) {
+                        setState(() {
+                          locationController.text =
+                              "${position.latitude}, ${position.longitude}";
+                        });
+                      }
+                    });
+                  },
+                  buttonColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  width: 100,
+                  child: Text(
+                    "Set",
+                    style: TextStyle(
+                      color:
+                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                      fontSize: 20,
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                ),
+              ],
+            ),
+            const SizedBox(height: 15),
+            Center(
+              child: MihButton(
+                onPressed: () {
+                  if (_formKey.currentState!.validate()) {
+                    submitForm();
+                  }
+                },
+                buttonColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                width: 300,
+                child: Text(
+                  "Update",
+                  style: TextStyle(
+                    color:
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                    fontSize: 20,
+                    fontWeight: FontWeight.bold,
+                  ),
                 ),
               ),
             ),
+            const SizedBox(height: 20),
           ],
         ),
-        const SizedBox(height: 15),
-        MihButton(
-          onPressed: () {
-            submitForm();
-          },
-          buttonColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-          width: 300,
-          child: Text(
-            "Update",
-            style: TextStyle(
-              color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              fontSize: 20,
-              fontWeight: FontWeight.bold,
-            ),
-          ),
-        ),
       ],
     ));
   }

Frontend/lib/mih_packages/mzansi_profile/business_profile/package_tools/mih_my_business_user.dart

@@ -3,14 +3,16 @@ import 'package:flutter/material.dart';
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_file_api.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_my_business_user_apis.dart';
+import 'package:mzansi_innovation_hub/mih_apis/mih_validation_services.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_dropdown_input.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_text_input.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_layout/mih_single_child_scroll.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_button.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_form.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_tool_body.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_package_alert.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_circle_avatar.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_image_display.dart';
+import 'package:mzansi_innovation_hub/mih_components/mih_package_components/mih_text_form_field.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_error_message.dart';
 import 'package:mzansi_innovation_hub/mih_components/mih_pop_up_messages/mih_success_message.dart';
 import 'package:mzansi_innovation_hub/mih_env/env.dart';
@@ -42,15 +44,11 @@ class _MihMyBusinessUserState extends State<MihMyBusinessUser> {
   final lnameController = TextEditingController();
   final accessController = TextEditingController();
   final signtureController = TextEditingController();
+  final _formKey = GlobalKey<FormState>();
   late String env;
 
   bool isFormFilled() {
-    if (signtureController.text.isEmpty ||
-        titleDropdownController.text.isEmpty ||
-        titleTextController.text.isEmpty ||
-        fnameController.text.isEmpty ||
-        lnameController.text.isEmpty ||
-        accessController.text.isEmpty) {
+    if (titleDropdownController.text.isEmpty) {
       return false;
     } else {
       return true;
@@ -216,114 +214,171 @@ class _MihMyBusinessUserState extends State<MihMyBusinessUser> {
     return MihSingleChildScroll(
       child: Column(
         children: [
-          MihCircleAvatar(
-            imageFile: widget.userProPicImage,
-            width: 150,
-            editable: false,
-            fileNameController: fileNameController,
-            userSelectedfile: userPicFile,
-            frameColor: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            backgroundColor:
-                MzanziInnovationHub.of(context)!.theme.primaryColor(),
-            onChange: (_) {},
-          ),
-          Visibility(
-            visible: false,
-            child: MIHTextField(
-              controller: fileNameController,
-              hintText: "Selected File Name",
-              editable: false,
-              required: false,
-            ),
-          ),
-          const SizedBox(height: 20),
-          MIHDropdownField(
-            controller: titleDropdownController,
-            hintText: "Title",
-            dropdownOptions: const ["Doctor", "Assistant", "Other"],
-            required: true,
-            editable: true,
-            enableSearch: false,
-          ),
-          const SizedBox(height: 10),
-          MIHTextField(
-            controller: titleTextController,
-            hintText: "Other Title",
-            editable: true,
-            required: true,
-          ),
-          const SizedBox(height: 10),
-          MIHTextField(
-            controller: fnameController,
-            hintText: "Name",
-            editable: false,
-            required: true,
-          ),
-          const SizedBox(height: 10),
-          MIHTextField(
-            controller: lnameController,
-            hintText: "Surname",
-            editable: false,
-            required: true,
-          ),
-          const SizedBox(height: 10),
-          MIHTextField(
-            controller: accessController,
-            hintText: "Access Level",
-            editable: false,
-            required: true,
-          ),
-          const SizedBox(height: 10),
-          Container(
-            width: 300,
-            alignment: Alignment.topLeft,
-            child: const Text(
-              "Signature:",
-              style: TextStyle(
-                fontSize: 15,
-                fontWeight: FontWeight.bold,
+          MihForm(
+            formKey: _formKey,
+            formFields: [
+              Center(
+                child: MihCircleAvatar(
+                  imageFile: widget.userProPicImage,
+                  width: 150,
+                  editable: false,
+                  fileNameController: fileNameController,
+                  userSelectedfile: userPicFile,
+                  frameColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  backgroundColor:
+                      MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  onChange: (_) {},
+                ),
               ),
-            ),
-          ),
-          MihImageDisplay(
-            imageFile: widget.userSignatureImage,
-            width: 300,
-            height: 200,
-            editable: true,
-            fileNameController: signtureController,
-            userSelectedfile: userSignatureFile,
-            onChange: (selectedFile) {
-              setState(() {
-                userSignatureFile = selectedFile;
-              });
-            },
-          ),
-          const SizedBox(height: 10),
-          Visibility(
-            visible: false,
-            child: MIHTextField(
-              controller: signtureController,
-              hintText: "Selected Signature File",
-              editable: false,
-              required: true,
-            ),
-          ),
-          const SizedBox(height: 15),
-          MihButton(
-            onPressed: () {
-              submitForm();
-            },
-            buttonColor:
-                MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            width: 300,
-            child: Text(
-              "Update",
-              style: TextStyle(
-                color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                fontSize: 20,
-                fontWeight: FontWeight.bold,
+              Visibility(
+                visible: false,
+                child: MihTextFormField(
+                  fillColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  inputColor:
+                      MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  controller: fileNameController,
+                  multiLineInput: false,
+                  requiredText: true,
+                  readOnly: true,
+                  hintText: "Selected File Name",
+                ),
               ),
-            ),
+              const SizedBox(height: 20),
+              MIHDropdownField(
+                controller: titleDropdownController,
+                hintText: "Title",
+                dropdownOptions: const ["Doctor", "Assistant", "Other"],
+                required: true,
+                editable: true,
+                enableSearch: false,
+              ),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: titleTextController,
+                multiLineInput: false,
+                requiredText: true,
+                hintText: "Other Title",
+                validator: (value) {
+                  return MihValidationServices().isEmpty(value);
+                },
+              ),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: fnameController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
+                hintText: "First Name",
+                validator: (value) {
+                  return MihValidationServices().isEmpty(value);
+                },
+              ),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: lnameController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
+                hintText: "Surname",
+                validator: (value) {
+                  return MihValidationServices().isEmpty(value);
+                },
+              ),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: accessController,
+                multiLineInput: false,
+                requiredText: true,
+                hintText: "Access Level",
+                readOnly: true,
+                validator: (value) {
+                  return MihValidationServices().isEmpty(value);
+                },
+              ),
+              const SizedBox(height: 10),
+              Container(
+                width: 300,
+                alignment: Alignment.topLeft,
+                child: const Text(
+                  "Signature:",
+                  style: TextStyle(
+                    fontSize: 15,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+              ),
+              Center(
+                child: MihImageDisplay(
+                  imageFile: widget.userSignatureImage,
+                  width: 300,
+                  height: 200,
+                  editable: true,
+                  fileNameController: signtureController,
+                  userSelectedfile: userSignatureFile,
+                  onChange: (selectedFile) {
+                    setState(() {
+                      userSignatureFile = selectedFile;
+                    });
+                  },
+                ),
+              ),
+              const SizedBox(height: 10),
+              Visibility(
+                visible: false,
+                child: MihTextFormField(
+                  fillColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  inputColor:
+                      MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                  controller: fileNameController,
+                  multiLineInput: false,
+                  requiredText: true,
+                  readOnly: true,
+                  hintText: "Selected Signature File",
+                ),
+              ),
+              const SizedBox(height: 15),
+              Center(
+                child: MihButton(
+                  onPressed: () {
+                    if (_formKey.currentState!.validate()) {
+                      submitForm();
+                    }
+                  },
+                  buttonColor:
+                      MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                  width: 300,
+                  child: Text(
+                    "Update",
+                    style: TextStyle(
+                      color:
+                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                      fontSize: 20,
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                ),
+              ),
+              const SizedBox(height: 20),
+            ],
           ),
         ],
       ),