Add new mih text form field to Appointments

Frontend/lib/mih_packages/calendar/builder/build_appointment_list.dart

@@ -1,12 +1,13 @@
 import 'package:flutter_speed_dial/flutter_speed_dial.dart';
 import 'package:mzansi_innovation_hub/main.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_mzansi_calendar_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_date_input.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_multiline_text_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_inputs_and_buttons/mih_time_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_env/env.dart';
@@ -57,6 +58,7 @@ class _BuildAppointmentListState extends State<BuildAppointmentList> {
   TextEditingController fnameController = TextEditingController();
   TextEditingController lnameController = TextEditingController();
   TextEditingController daysExtensionController = TextEditingController();
+  final _formKey = GlobalKey<FormState>();
   int counter = 0;
   late double width;
   late double height;
@@ -203,43 +205,53 @@ class _BuildAppointmentListState extends State<BuildAppointmentList> {
           windowBody: Column(
             children: [
               const SizedBox(height: 10),
-              SizedBox(
+              MihTextFormField(
-                // width: 500,
+                fillColor:
-                child: MIHTextField(
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  controller: widget.titleController,
+                inputColor:
-                  hintText: "Title",
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                  editable: false,
+                controller: widget.titleController,
-                  required: false,
+                multiLineInput: false,
-                ),
+                requiredText: true,
+                readOnly: true,
+                hintText: "Appointment Title",
               ),
               const SizedBox(height: 10),
-              SizedBox(
+              MihTextFormField(
-                  // width: 500,
+                fillColor:
-                  child: MIHTextField(
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
                 controller: widget.dateController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
                 hintText: "Date",
-                editable: false,
+              ),
-                required: false,
-              )),
               const SizedBox(height: 10),
-              SizedBox(
+              MihTextFormField(
-                  // width: 500,
+                fillColor:
-                  child: MIHTextField(
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
                 controller: widget.timeController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
                 hintText: "Time",
-                editable: false,
+              ),
-                required: false,
-              )),
               const SizedBox(height: 10),
-              SizedBox(
+              MihTextFormField(
-                // width: 500,
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: widget.descriptionIDController,
+                multiLineInput: true,
                 height: 250,
-                child: MIHMLTextField(
+                requiredText: true,
-                  controller: widget.descriptionIDController,
+                readOnly: true,
-                  hintText: "Description",
+                hintText: "Appointment Description",
-                  editable: false,
-                  required: false,
-                ),
               ),
               const SizedBox(height: 10),
             ],
@@ -304,55 +316,66 @@ class _BuildAppointmentListState extends State<BuildAppointmentList> {
           },
           windowBody: Column(
             children: [
-              SizedBox(
+              const SizedBox(height: 10),
-                // width: 500,
+              MihTextFormField(
-                child: MIHTextField(
+                fillColor:
-                  controller: widget.titleController,
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  hintText: "Title",
+                inputColor:
-                  editable: false,
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                  required: false,
+                controller: widget.titleController,
-                ),
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
+                hintText: "Appointment Title",
               ),
               const SizedBox(height: 10),
-              SizedBox(
+              MihTextFormField(
-                // width: 500,
+                fillColor:
-                child: MIHTextField(
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  controller: widget.titleController,
+                inputColor:
-                  hintText: "Patient ID Number",
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                  editable: false,
-                  required: false,
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                  // width: 500,
-                  child: MIHTextField(
                 controller: widget.dateController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
                 hintText: "Date",
-                editable: false,
-                required: false,
-              )),
-              const SizedBox(height: 10),
-              SizedBox(
-                  // width: 500,
-                  child: MIHTextField(
-                controller: widget.timeController,
-                hintText: "Time",
-                editable: false,
-                required: false,
-              )),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                height: 250,
-                child: MIHMLTextField(
-                  controller: widget.descriptionIDController,
-                  hintText: "Description",
-                  editable: false,
-                  required: false,
-                ),
               ),
-              const SizedBox(height: 20),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: widget.timeController,
+                multiLineInput: false,
+                requiredText: true,
+                readOnly: true,
+                hintText: "Time",
+              ),
+              const SizedBox(height: 10),
+              MihTextFormField(
+                fillColor:
+                    MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                inputColor:
+                    MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                controller: widget.descriptionIDController,
+                multiLineInput: true,
+                height: 250,
+                requiredText: true,
+                readOnly: true,
+                hintText: "Appointment Description",
+              ),
+              const SizedBox(height: 10),
+              // SizedBox(
+              //   // width: 500,
+              //   child: MIHTextField(
+              //     controller: widget.titleController,
+              //     hintText: "Patient ID Number",
+              //     editable: false,
+              //     required: false,
+              //   ),
+              // ),
+              // const SizedBox(height: 10),
             ],
           ),
         );
@@ -384,70 +407,95 @@ class _BuildAppointmentListState extends State<BuildAppointmentList> {
           },
           windowBody: Column(
             children: [
-              SizedBox(
+              MihForm(
-                // width: 500,
+                formKey: _formKey,
-                child: MIHTextField(
+                formFields: [
-                  controller: widget.titleController,
+                  MihTextFormField(
-                  hintText: "Title",
+                    fillColor:
-                  editable: true,
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  required: true,
+                    inputColor:
-                ),
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
-              ),
+                    controller: widget.titleController,
-              const SizedBox(height: 10),
+                    multiLineInput: false,
-              SizedBox(
+                    requiredText: true,
-                // width: 500,
+                    hintText: "Appointment Title",
-                child: MIHDateField(
+                    validator: (value) {
-                  controller: widget.dateController,
+                      return MihValidationServices().isEmpty(value);
-                  lableText: "Date",
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                child: MIHTimeField(
-                  controller: widget.timeController,
-                  lableText: "Time",
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                height: 250,
-                child: MIHMLTextField(
-                  controller: widget.descriptionIDController,
-                  hintText: "Description",
-                  editable: true,
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 20),
-              Wrap(
-                alignment: WrapAlignment.center,
-                runSpacing: 10,
-                spacing: 10,
-                children: [
-                  MihButton(
-                    onPressed: () {
-                      updateAppointmentCall(index);
                     },
-                    buttonColor:
+                  ),
-                        MzanziInnovationHub.of(context)!.theme.successColor(),
+                  // SizedBox(
-                    width: 300,
+                  //   // width: 500,
-                    child: Text(
+                  //   child: MIHTextField(
-                      "Update",
+                  //     controller: widget.titleController,
-                      style: TextStyle(
+                  //     hintText: "Title",
-                        color: MzanziInnovationHub.of(context)!
+                  //     editable: true,
-                            .theme
+                  //     required: true,
-                            .primaryColor(),
+                  //   ),
-                        fontSize: 20,
+                  // ),
-                        fontWeight: FontWeight.bold,
+                  const SizedBox(height: 10),
-                      ),
+                  SizedBox(
+                    // width: 500,
+                    child: MIHDateField(
+                      controller: widget.dateController,
+                      lableText: "Date",
+                      required: true,
+                    ),
+                  ),
+                  const SizedBox(height: 10),
+                  SizedBox(
+                    // width: 500,
+                    child: MIHTimeField(
+                      controller: widget.timeController,
+                      lableText: "Time",
+                      required: true,
+                    ),
+                  ),
+                  const SizedBox(height: 10),
+                  MihTextFormField(
+                    fillColor:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    inputColor:
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                    controller: widget.descriptionIDController,
+                    multiLineInput: true,
+                    height: 250,
+                    requiredText: true,
+                    hintText: "Appointment Description",
+                    validator: (value) {
+                      return MihValidationServices().isEmpty(value);
+                    },
+                  ),
+                  const SizedBox(height: 20),
+                  Center(
+                    child: Wrap(
+                      alignment: WrapAlignment.center,
+                      runSpacing: 10,
+                      spacing: 10,
+                      children: [
+                        MihButton(
+                          onPressed: () {
+                            updateAppointmentCall(index);
+                          },
+                          buttonColor: MzanziInnovationHub.of(context)!
+                              .theme
+                              .successColor(),
+                          width: 300,
+                          child: Text(
+                            "Update",
+                            style: TextStyle(
+                              color: MzanziInnovationHub.of(context)!
+                                  .theme
+                                  .primaryColor(),
+                              fontSize: 20,
+                              fontWeight: FontWeight.bold,
+                            ),
+                          ),
+                        ),
+                      ],
                     ),
                   ),
                 ],
-              )
+              ),
             ],
           ),
         );

Frontend/lib/mih_packages/calendar/package_tools/appointments.dart

@@ -1,14 +1,15 @@
 import 'package:flutter_speed_dial/flutter_speed_dial.dart';
 import 'package:mzansi_innovation_hub/mih_apis/mih_mzansi_calendar_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_date_input.dart';
-import 'package:mzansi_innovation_hub/mih_components/mih_inputs_and_buttons/mih_multiline_text_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_inputs_and_buttons/mih_time_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_floating_menu.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_objects/appointment.dart';
 import 'package:mzansi_innovation_hub/mih_objects/business.dart';
@@ -59,6 +60,8 @@ class _PatientAccessRequestState extends State<Appointments> {
   late Future<List<Appointment>> businessAppointmentResults;
   late Future<List<Appointment>> appointmentResults;
 
+  final _formKey = GlobalKey<FormState>();
+
   Widget displayAppointmentList(List<Appointment> appointmentList) {
     if (appointmentList.isNotEmpty) {
       return Expanded(
@@ -113,61 +116,79 @@ class _PatientAccessRequestState extends State<Appointments> {
           },
           windowBody: Column(
             children: [
-              SizedBox(
+              MihForm(
-                // width: 500,
+                formKey: _formKey,
-                child: MIHTextField(
+                formFields: [
-                  controller: _appointmentTitleController,
+                  MihTextFormField(
-                  hintText: "Title",
+                    fillColor:
-                  editable: true,
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-                  required: true,
+                    inputColor:
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                child: MIHDateField(
-                  controller: _appointmentDateController,
-                  lableText: "Date",
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                child: MIHTimeField(
-                  controller: _appointmentTimeController,
-                  lableText: "Time",
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 10),
-              SizedBox(
-                // width: 500,
-                height: 250,
-                child: MIHMLTextField(
-                  controller: _appointmentDescriptionIDController,
-                  hintText: "Description",
-                  editable: true,
-                  required: true,
-                ),
-              ),
-              const SizedBox(height: 20),
-              MihButton(
-                onPressed: () {
-                  addAppointmentCall();
-                },
-                buttonColor:
-                    MzanziInnovationHub.of(context)!.theme.successColor(),
-                width: 300,
-                child: Text(
-                  "Add",
-                  style: TextStyle(
-                    color:
                         MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                    fontSize: 20,
+                    controller: _appointmentTitleController,
-                    fontWeight: FontWeight.bold,
+                    multiLineInput: false,
+                    requiredText: true,
+                    hintText: "Appointment Title",
+                    validator: (value) {
+                      return MihValidationServices().isEmpty(value);
+                    },
                   ),
-                ),
+                  const SizedBox(height: 10),
+                  SizedBox(
+                    // width: 500,
+                    child: MIHDateField(
+                      controller: _appointmentDateController,
+                      lableText: "Date",
+                      required: true,
+                    ),
+                  ),
+                  const SizedBox(height: 10),
+                  SizedBox(
+                    // width: 500,
+                    child: MIHTimeField(
+                      controller: _appointmentTimeController,
+                      lableText: "Time",
+                      required: true,
+                    ),
+                  ),
+                  const SizedBox(height: 10),
+                  MihTextFormField(
+                    fillColor:
+                        MzanziInnovationHub.of(context)!.theme.secondaryColor(),
+                    inputColor:
+                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
+                    controller: _appointmentDescriptionIDController,
+                    multiLineInput: true,
+                    height: 250,
+                    requiredText: true,
+                    hintText: "Appointment Description",
+                    validator: (value) {
+                      return MihValidationServices().isEmpty(value);
+                    },
+                  ),
+                  const SizedBox(height: 20),
+                  Center(
+                    child: MihButton(
+                      onPressed: () {
+                        if (_formKey.currentState!.validate()) {
+                          addAppointmentCall();
+                        }
+                      },
+                      buttonColor:
+                          MzanziInnovationHub.of(context)!.theme.successColor(),
+                      width: 300,
+                      child: Text(
+                        "Add",
+                        style: TextStyle(
+                          color: MzanziInnovationHub.of(context)!
+                              .theme
+                              .primaryColor(),
+                          fontSize: 20,
+                          fontWeight: FontWeight.bold,
+                        ),
+                      ),
+                    ),
+                  ),
+                ],
               ),
             ],
           ),