Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */

import React, { useEffect, useState } from "react";

import { useForm } from "react-hook-form";

import { axios } from "../../../utils";

import { connect } from "react-redux";

import { addNotification } from "../../../redux/notification/notification.actions";

// Components

import SwitchInput from "./switch-input/SwitchInput";

import Spinner from "../../../shared/loading-spinner/Spinner";

const PRIVACY_OPTIONS = [

  {

    label: '',

    input_name: '',

    value: false

  }

]

const Privacy = ({ addNotification }) => {

  const [loading, setLoading] = useState(false);

  const [options, setOptions] = useState(PRIVACY_OPTIONS);

  const { handleSubmit } = useForm();

  const handleOnSubmit = () => {

    setLoading(true);

    const formData = new FormData();

    options.map(({ input_name, value }) => {

      if (value) return formData.append(input_name, value)

    });

    axios

      .post("/account-settings/privacy", formData)

      .then(({ data: response }) => {

        if (!response.success) {

          typeof response.data === "string"

            ? addNotification({ style: "danger", msg: response.data })

            : Object

              .entries(response.data)

              .map(([key, value]) => addNotification({ style: "success", msg: `${key} error: ${value} ` }))

        }

        addNotification({ style: "success", msg: response.data })

      })

      .finally(() => setLoading(false))

  };

  useEffect(() => {

    setLoading(true)

    axios

      .get("/account-settings/privacy")

      .then(({ data: response }) => {

        if (response.success) {

          Object

            .entries(response.data)

            .map(([key, value]) =>

              setOptions((prevNotifications) => prevNotifications

                .map((notification) =>

                  notification.input_name === key

                    ? { ...notification, value: Boolean(value) }

                    : notification

                )))

        }

      })

      .finally(() => setLoading(false))

  }, []);

  return (

    <div className="acc-setting">

      <h3>Notificaciones</h3>

      <form onSubmit={handleSubmit(handleOnSubmit)}>

        <div className="notbat">

          Mostrar en la búsqueda

          <SwitchInput />

        </div>

        <button type="submit" className="btn btn-primary">

          Guardar

        </button>

      </form>

      {loading && <Spinner />}

    </div>

  );

};

const mapDispatchToProps = {

  addNotification: (notification) => addNotification(notification),

};

export default connect(null, mapDispatchToProps)(Privacy);