Selection of approvers and evaluatiors for cqs

1. Key Features

The key features of this code are centered around managing the steps in a tender approval process, particularly related to procurement managers, evaluators, and reviewers. These features include:

• Dynamic Form Handling: The code provides functionality for adding and removing input fields for both evaluation criteria and proposal criteria, using state manipulation methods like setEvaluationCriteria and setPorposalCriteria.

• Reviewer Selection: The code manages multiple reviewers through a Select dropdown component and handles the selection of different types of reviewers (e.g., reviewers, reviewersEOI, proposalReviewers).

• Checkbox Management: A checkbox is used to toggle the value of isCheckedTOREOR, which determines whether the same set of reviewers is used for multiple stages (reviewing Terms of Reference and EOI).

• Form Validation: The form validates if the required fields (reviewersEOI and proposalReviewers) are filled out before submission, ensuring that no necessary information is omitted.

• Data Submission: On form submission, the gathered data (evaluation criteria, proposal criteria, and reviewers) is formatted and sent to the backend using a tenderService.updateTenderBySerialId API call, which updates the tender’s details.

2. Key Functionalities

The essential operations in this code that contribute to its functionality include:

• Handle Add/Remove Input for Evaluation and Proposal Criteria: Functions like handleAddInputEvaluation, handleRemoveInputEvaluation, handleAddInputPorposalCriteria, and handleRemoveInputPorposalCriteria dynamically modify the lists of evaluation and proposal criteria, allowing the form to grow or shrink as needed.

• Handle Input Change for Evaluation and Proposal Criteria: The handleInputChangeEvaluation and handleInputChangePorposalCriteria functions ensure that the user’s input for the evaluation and proposal criteria is reflected in the state, ensuring real-time updates of the criteria.

• Handle Select Changes: Functions such as handleSelectChange and handleSelectChangeProposal manage the changes in the reviewer selections, ensuring the appropriate state (e.g., reviewers, reviewersEOI) is updated when a new selection is made.

• Form Validation and Submission: The validateFields function checks if all required fields are filled before allowing the form submission, and the submit function handles the final data preparation, API request, and state update after successful submission.

• Checkbox Toggle: The handleCheckboxChange function allows toggling the isCheckedTOREOR state, determining whether the same reviewers are used for both the EOI and proposal review stages.

3. Data Fetching and Step Handling

Data Fetching:

• Tender Data: The data for the tender, such as evaluation criteria, proposal criteria, and reviewer selections, is likely fetched via API calls at earlier stages of the form, which are then manipulated and displayed on the page.
• Fetching Reviewer Data: The list of procurement managers and evaluators (procurementManagersList, evaluatorList) is fetched from the backend and mapped to the necessary structure for the Select components.

Step Handling:

• State Management for Steps: The nextStep and prevStep functions allow the form to transition through various stages. For example, nextStep() is called after the form is successfully submitted, while prevStep() could be used to navigate back to the previous step.

• Managing Data Across Steps: The form maintains step-specific data such as the evaluation criteria and reviewers for different stages of the tender process. The data is stored in state variables and passed to backend services for further processing (e.g., updateTenderBySerialId).

• Final Submission: On submitting the form, the data collected (evaluation criteria, proposal criteria, reviewers) is formatted (via formatData, formatDataReviewrs) and passed to the API to update the tender. This API call is the culmination of the steps, sending all collected data for further processing.

4. Code Reference and Explanation

// Handle adding new evaluation criteria
const handleAddInputEvaluation = () => {
    setEvaluationCriteria([
        ...evaluationCriteria,
        { id: evaluationCriteria.length + 1, criteria: "", score: "" },
    ]);
};

// Handle removing an evaluation criteria item
const handleRemoveInputEvaluation = (id: number) => {
    setEvaluationCriteria(evaluationCriteria.filter((item: any) => item.id !== id));
};

// Handle changing the value of evaluation criteria fields
const handleInputChangeEvaluation = (id: number, field: string, value: string) => {
    setEvaluationCriteria((prevDeliverables: any) =>
        prevDeliverables.map((item: any) =>
            item.id === id ? { ...item, [field]: value } : item
        )
    );
};

// Handle submitting the form
const submit = async () => {
    setIsSubmitting(true);

    // Validate form fields before submission
    if (!validateFields()) {
        setIsSubmitting(false);
        return; // Exit if validation fails
    }

    // Prepare the data for submission
    const evaluationCriteriaFilter = formatData(evaluationCriteria);
    const proposalCriteriaFilter = formatData(porposalCriteria);
    const reviewersFilter = formatDataReviewrs(reviewers);
    const reviewersEOIFilter = formatDataReviewrs(reviewersEOI);
    const proposalReviewersFilter = formatDataReviewrs(proposalReviewers);

    const dataToUpdate = {
        serial_id: draftId,
        EOI_evaluation: evaluationCriteriaFilter,
        proposal_evaluation: proposalCriteriaFilter,
        reviewers_TOR: reviewersFilter,
        reviewers_EOI: reviewersEOIFilter,
        reviewers_evaluation: proposalReviewersFilter,
        is_same_reviewers: isCheckedTOREOR,
        step: 6
    };

    try {
        const updatedTenderDetails = await tenderService.updateTenderBySerialId(dataToUpdate);
        updateCqsProcurementProcess(updatedTenderDetails);
        router.replace(`/create-request?draft-id=${draftId}&step=6&type=${activityType}`);
        nextStep(); // Move to the next step
    } catch (error) {
        console.error("Error updating tender:", error);
    } finally {
        setIsSubmitting(false);
    }
};

Summary:

• The code primarily deals with managing a dynamic form for handling evaluators, criteria, and reviewers in a tender process.
• Key functionalities include adding/removing criteria, managing reviewer selections, validating inputs, and submitting the data.
• Data is fetched (likely through previous API calls) and formatted before submission to update the tender’s details, ensuring smooth transition through different steps of the process.