Gsoc 2024 : Validation rule builder for the form builder

Primary mentor

Backup mentor

Assigned to

Abstract

The form engine and builder currently support JavaScript expression-based validation. However, this can be challenging when creating complex validations and may potentially lead to errors. In most cases, form creation is done by BAs who may not have experience with writing JavaScript expressions. The proposed solution is to introduce a UI-based validation rule builder to the form builder, something similar to https://tally.so/help/conditional-form-logic

Project Overview

Primary Goal:

   Develop a user-friendly rule builder integrated with a form builder.

Purpose:

    Help users create conditional logic for forms, streamlining workflow and enhancing form functionality.

Target Users:
   • Beneficial for users with no experience in writing JavaScript expressions.
   • Users who need to create dynamic, responsive forms.

Key Features:
   • Provides an intuitive, graphical interface.
   • Supports building complex form rules.

Main Advantage:

     Simplifies the process of adding conditional logic without requiring manual coding.


Project Objective

Reduce Manual Effort:

  • Eliminate the need for users to manually write JavaScript expressions for form logic.
  • Provide a streamlined, automated approach to building conditional logic for forms.

Empower Users:

  •  Allow users with minimal technical knowledge to create complex form rules.
  •  Offer a user-friendly, graphical interface that simplifies the process of adding conditional logic.

Key Features:

  Pre-Built Conditions:

      Provide a library of common conditions that users can select and customize to fit their needs.

  Real-Time Validation:

      Ensure that the logic being created is valid and functional as users build it, preventing errors and saving time.

Goals:

  Enhance User Productivity:

    Speed up the process of creating dynamic forms, allowing users to focus on other tasks.

  Reduce Errors:

    Minimize mistakes by providing real-time feedback and pre-built components, ensuring that the form logic works as intended.

  Increase Efficiency:

    Make the form-building process more efficient by providing tools that simplify the creation of complex rules.

  Improve User Experience:

    Offer a seamless and intuitive interface that makes the form-building process enjoyable and accessible for all users.


Required Skills

React,

TypeScript

Project Rating and Length

Medium

175 hours


Weekly Meeting Notes:

Meeting 01:

Participants: Dennis KigenHadijah Kyampeire

Key Notes:

  • We discussed the UI/UX design of the rule builder and the optimal placement of the rule builder within the form builder.
  • Dennis advised me to attend the UI/UX team call to get feedback from the UI/UX team.
  • Cleared technical doubts regarding the project, such as real-time schema changes.


Meeting 02:

Participants: Dennis Kigen

Key Notes:

  • Shared the week 01 progress with the mentors, and a demo of adding multiple conditional logic for the same form field
  • Dennis advised me to start writing documentation for the validation rule builder


Meeting 03:

Participants: Dennis Kigen

Key Notes:

  • Shared the week 02 progress with the mentors, and blockers.
  • Asked my primary mentor to review the documentation.
  • Shared the proposed solution for the blockers.


Weekly Blog Posts

WeekBlog Post
Community Bonding Week 01GSoC Journey: Community Bonding
Community Bonding Week 02https://medium.com/@senthilathiban0/gsoc-journey-2nd-week-of-community-bonding-42159ba831db
Community Bonding Week 03https://medium.com/@senthilathiban0/gsoc-journey-3rd-week-of-community-bonding-233bfafaaf0f
Coding Part: Week 01https://medium.com/@senthilathiban0/gsoc-journey-week-01-of-coding-period-48727197abf3
Coding Part: Week 02https://medium.com/@senthilathiban0/gsoc-journey-week-02-of-coding-period-1e36ad6dae36
Coding Part: Week 03https://medium.com/@senthilathiban0/gsoc-journey-week-03-of-coding-period-9a563e3df13b
Coding Part: Week 04
Coding Part: Week 05
Coding Part: Week 06

Coding Part: Week 07


Coding Part: Week 08


Coding Part: Week 09
Coding Part: Week 10
Coding Part: Week 11
Coding Part: Week 12
Coding Part: Week 13
Coding Part: Week 14

Resources

Project's Repo:

Form-builder: https://github.com/openmrs/openmrs-esm-form-builder