reuse-them

    1.0.14 • Public • Published

    Introduction

    reuse-them is a react component library for reusable form and some other components.

    Installation

    npm i reuse-them

    Usage

    import React from "react";
    import { ModalForm } from "reuse-them";
    
    const fields = [
      {
        inputs: [{ label: "City Name", type: "text", name: "cityName", value: "" }],
      },
      {
        inputs: [
          {
            label: "Area",
            type: "text",
            name: "area",
            value: "",
          },
        ],
      },
    ];
    
    function prepareFields(fields) {
      const res = fields.map((field) => {
        return field.inputs;
      });
    
      const merged = [].concat.apply([], res);
      return merged.reduce((a, c) => ({ ...a, [c.name]: c.value }), {});
    }
    
    const App = () => {
      const [cities, setCities] = useState([]);
      const [show, setShow] = useState(false);
      const initialValue = prepareFields(fields);
      const [formData, setFormData] = useState(initialValue);
    
      const handleShow = () => setShow(true);
    
      const handleClose = () => {
        setFormData(initialValue);
        setShow(false);
      };
    
      const handleSetFormData = (params) => {
        setFormData(params);
      };
    
      const showUpdateModal = (obj) => {};
    
      const handleSubmit = async () => {
        handleClose();
        await axios.post(apiEndPoint + "cities/add", formData);
        fetchCities();
      };
    
      return (
        <>
          <button className="btn btn-primary" onClick={handleShow}>
            Add new
          </button>
          <ModalForm
            show={show}
            onClose={handleClose}
            fields={fields}
            formData={formData}
            onSetFormData={handleSetFormData}
            onSubmit={handleSubmit}
          />
        </>
      );
    };
    
    export default App;

    Keywords

    Install

    npm i reuse-them

    DownloadsWeekly Downloads

    21

    Version

    1.0.14

    License

    MIT

    Unpacked Size

    50.1 kB

    Total Files

    35

    Last publish

    Collaborators

    • hudeifa