{"size": 2679, "ext": "js", "max_stars_repo_path": "src/components/application/NewApplication.js", "max_stars_repo_name": "boogeymanCoder/TaskmeV3", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/application/NewApplication.js", "max_issues_repo_name": "boogeymanCoder/TaskmeV3", "max_issues_repo_issues_event_min_datetime": "2022-02-13T06:02:28.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-29T00:53:38.000Z", "max_forks_repo_path": "src/components/application/NewApplication.js", "max_forks_repo_name": "boogeymanCoder/TaskmeV3", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 56, "max_forks_count": null, "avg_line_length": 30.1011235955, "max_line_length": 105, "alphanum_fraction": 0.5856662934}
import { Send } from "@mui/icons-material";
import { Container, IconButton, InputAdornment, LinearProgress, TextField } from "@mui/material";
import { getAuth } from "firebase/auth";
import React, { useState } from "react";
import { useAuthState } from "react-firebase-hooks/auth";
import { setApplication } from "/src/services/application";
import { useFormik } from "formik";
import * as Yup from "yup";
import SnackbarErrorMessage from "../SnackbarErrorMessage";
import PropTypes from "prop-types";

/**
 * Allows users to create applications.
 */
export default function NewApplication({ taskId, employer }) {
  const auth = getAuth();
  const [user, userLoading, userError] = useAuthState(auth);

  const formik = useFormik({
    initialValues: {
      message: "",
    },
    validationSchema: Yup.object({
      message: Yup.string().required("Message is required"),
    }),
    onSubmit: async (values) => {
      console.log("submitted!");
      return setApplication({
        task: taskId,
        employee: user.uid,
        message: values.message,
        date: JSON.stringify(new Date()),
        accepted: false,
        employer,
      })
        .then((res) => {
          console.log({ res });
          formik.resetForm();
        })
        .catch((err) => console.log({ err }));
    },
  });

  if (!user || userLoading) return <LinearProgress />;

  return (
    <>
      {employer !== user.uid && (
        <Container>
          <TextField
            error={Boolean(formik.touched.message && formik.errors.message)}
            helperText={formik.touched.message && formik.errors.message}
            onBlur={formik.handleBlur}
            onChange={formik.handleChange}
            value={formik.values.message}
            disabled={formik.isSubmitting}
            name="message"
            multiline
            fullWidth
            variant="standard"
            label="Application message"
            InputProps={{
              endAdornment: (
                <InputAdornment position="end">
                  <IconButton onClick={formik.submitForm} disabled={formik.isSubmitting}>
                    <Send fontSize="large" color="primary" />
                  </IconButton>
                </InputAdornment>
              ),
            }}
          />
          <SnackbarErrorMessage error={userError} />
        </Container>
      )}
    </>
  );
}

NewApplication.propTypes = {
  /**
   * The id of task received from the database.
   */
  taskId: PropTypes.string.isRequired,
  /**
   * The uid of the employer, if this is the users uid it will not allow the user to create applications.
   */
  employer: PropTypes.string.isRequired,
};
