@open-tender/utils/dist/esm/hooks/useAllergenForm.js

A library of utils for use with Open Tender applications that utilize our cloud-based Order API.

import { useState, useEffect, useRef } from 'react';
import { makeFormErrors } from '../utils';
export const useAllergenForm = (allergens, selectedAllergens, isLoading = false, error, setAllergens, updateAllergens, callback) => {
    const submitRef = useRef(null);
    const [data, setData] = useState([]);
    const [errors, setErrors] = useState({});
    const [submitting, setSubmitting] = useState(false);
    const allergenIds = data.map(i => i.allergen_id);
    // const formError = error ? error.detail || error.message : null
    useEffect(() => {
        // uses isLoading boolean because loading state is based on
        // both brand allergens and customer allergens loading
        if (!isLoading) {
            setSubmitting(false);
            if (error) {
                setErrors(makeFormErrors(error));
            }
        }
    }, [isLoading, error]);
    useEffect(() => {
        if (!isLoading)
            setData(selectedAllergens);
    }, [isLoading, selectedAllergens]);
    const handleChange = (allergenId, checked) => {
        const allergen = allergens.find(i => i.allergen_id === allergenId);
        if (!allergen)
            return;
        const newData = checked
            ? [...data, allergen]
            : data.filter(i => i.allergen_id !== allergenId);
        setData(newData);
    };
    const handleSubmit = (evt) => {
        var _a, _b;
        evt === null || evt === void 0 ? void 0 : evt.preventDefault();
        setSubmitting(updateAllergens !== null);
        if (updateAllergens) {
            const newData = data.map(i => ({ allergen_id: i.allergen_id }));
            updateAllergens(newData);
        }
        else {
            setAllergens(data);
        }
        if (callback)
            callback();
        ((_a = submitRef.current) === null || _a === void 0 ? void 0 : _a.blur) && ((_b = submitRef.current) === null || _b === void 0 ? void 0 : _b.blur());
    };
    return {
        submitRef,
        submitting,
        allergenIds,
        errors,
        handleChange,
        handleSubmit
    };
};