diff --git a/cypress/integration/navigation.spec.js b/cypress/integration/navigation.spec.js index afc1ac9..aa7afcd 100644 --- a/cypress/integration/navigation.spec.js +++ b/cypress/integration/navigation.spec.js @@ -7,7 +7,8 @@ describe("Navigation", () => { cy.visit("/"); cy.contains("[data-testid=day]", "Tuesday") - .click() - .should("have.class", "day-list__item--selected"); + .click() + .should("have.class", "day-list__item--selected") + ; }); }) \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 1f83f49..03ecb52 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6016,7 +6016,8 @@ }, "kind-of": { "version": "6.0.2", - "resolved": "" + "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz", + "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==" } } }, @@ -8255,7 +8256,8 @@ }, "dot-prop": { "version": "4.2.0", - "resolved": "", + "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz", + "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ==", "requires": { "is-obj": "^1.0.0" } @@ -9303,7 +9305,8 @@ }, "kind-of": { "version": "6.0.2", - "resolved": "" + "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz", + "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==" } } }, @@ -17542,7 +17545,8 @@ }, "kind-of": { "version": "6.0.2", - "resolved": "" + "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz", + "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==" } } }, diff --git a/src/components/Application.js b/src/components/Application.js index 7c82fee..11a67b9 100644 --- a/src/components/Application.js +++ b/src/components/Application.js @@ -1,5 +1,4 @@ import React from "react"; - import "components/Application.scss"; import DayList from "./DayList"; import Appointment from "./Appointment/index"; @@ -7,7 +6,6 @@ import useApplicationData from "hooks/useApplicationData"; import { getAppointmentsForDay, getInterview, getInterviewersForDay } from "helpers/selectors"; - export default function Application(props) { const { state, @@ -35,8 +33,6 @@ export default function Application(props) { ); }); - - return (
@@ -66,4 +62,4 @@ export default function Application(props) {
); -} +}; diff --git a/src/components/Appointment/Confirm.js b/src/components/Appointment/Confirm.js index 92ff305..9a308ce 100644 --- a/src/components/Appointment/Confirm.js +++ b/src/components/Appointment/Confirm.js @@ -2,7 +2,6 @@ import React from "react"; import Button from "components/Button"; export default function Confirm(props) { - return (

{props.message}

@@ -11,5 +10,5 @@ export default function Confirm(props) {
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Empty.js b/src/components/Appointment/Empty.js index 4aa896d..fa093f1 100644 --- a/src/components/Appointment/Empty.js +++ b/src/components/Appointment/Empty.js @@ -1,7 +1,6 @@ import React from "react"; export default function Empty(props) { - return (
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Error.js b/src/components/Appointment/Error.js index 5d6adff..c67c662 100644 --- a/src/components/Appointment/Error.js +++ b/src/components/Appointment/Error.js @@ -1,7 +1,6 @@ import React from "react"; export default function Error(props) { - return (
@@ -15,5 +14,5 @@ export default function Error(props) { onClick={props.onClose} />
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Form.js b/src/components/Appointment/Form.js index 004bfcb..4c77d97 100644 --- a/src/components/Appointment/Form.js +++ b/src/components/Appointment/Form.js @@ -3,34 +3,33 @@ import Button from "components/Button"; import InterviewerList from "components/InterviewerList"; - export default function Form(props) { - const [name, setName] = useState(props.name || ""); const [error, setError] = useState(""); const valueChange = (event) => { return setName(event.target.value); - } + }; const [interviewer, setInterviewer] = useState(props.interviewer || null); const reset = (event) => { setName(""); setInterviewer(null); - } + }; + const cancel = (event) => { reset(); props.onCancel() - } + }; const validate = () => { if (name === "") { setError("Student name cannot be blank"); return; - } + }; setError("") props.onSave(name, interviewer); - } + }; return (
@@ -61,5 +60,5 @@ export default function Form(props) {
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Header.js b/src/components/Appointment/Header.js index 80aff37..19961d7 100644 --- a/src/components/Appointment/Header.js +++ b/src/components/Appointment/Header.js @@ -1,11 +1,10 @@ import React from "react"; export default function Header(props) { - return (

{props.time}


- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Show.js b/src/components/Appointment/Show.js index 3add1aa..facd98b 100644 --- a/src/components/Appointment/Show.js +++ b/src/components/Appointment/Show.js @@ -1,7 +1,6 @@ import React from "react"; export default function Show(props) { - return (
@@ -26,5 +25,5 @@ export default function Show(props) {
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/Status.js b/src/components/Appointment/Status.js index 0733311..6676f25 100644 --- a/src/components/Appointment/Status.js +++ b/src/components/Appointment/Status.js @@ -1,7 +1,6 @@ import React from "react"; export default function Status(props) { - return (

{props.message}

- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Appointment/index.js b/src/components/Appointment/index.js index 8ae51bf..1e85997 100644 --- a/src/components/Appointment/index.js +++ b/src/components/Appointment/index.js @@ -28,18 +28,18 @@ export default function Appointment(props) { const onAdd = () => { transition(CREATE); - } + }; const onCancel = () => { back(); - } + }; const onDelete = () => { transition(DELETING, true); props.cancelInterview(props.id) .then(() => transition(EMPTY)) .catch((error) => transition(ERROR_DELETE, true)) - } + }; const onSave = (name, interviewer) => { const interview = { @@ -51,7 +51,7 @@ export default function Appointment(props) { .bookInterview(props.id, interview) .then(() => transition(SHOW)) .catch((error) => transition(ERROR_SAVE, true)) - } + }; return (
@@ -103,5 +103,5 @@ export default function Appointment(props) { /> )}
- ) -} \ No newline at end of file + ); +}; \ No newline at end of file diff --git a/src/components/Button.js b/src/components/Button.js index 20d72f5..107153f 100644 --- a/src/components/Button.js +++ b/src/components/Button.js @@ -1,5 +1,4 @@ import React from "react"; - import "components/Button.scss"; import classNames from "classnames"; @@ -22,4 +21,4 @@ export default function Button(props) { {props.children} ); -} +}; diff --git a/src/components/DayListItem.js b/src/components/DayListItem.js index 0c7bf13..3e33e29 100644 --- a/src/components/DayListItem.js +++ b/src/components/DayListItem.js @@ -1,5 +1,4 @@ import React from "react"; - import "components/DayListItem.scss"; import classNames from "classnames"; @@ -11,7 +10,7 @@ export default function DayListItem(props) { 'day-list__item--selected': props.selected, 'day-list__item--full': props.spots === 0 } - ) + ); const formatSpots = function(spots) { if (spots > 1) { @@ -23,7 +22,7 @@ export default function DayListItem(props) { if (spots === 0) { return ("no spots remaining"); } - } + }; return (
  • {formatSpots(props.spots)}
  • ); -} \ No newline at end of file +}; \ No newline at end of file diff --git a/src/components/InterviewerList.js b/src/components/InterviewerList.js index 9ae22f6..5d48d5d 100644 --- a/src/components/InterviewerList.js +++ b/src/components/InterviewerList.js @@ -1,11 +1,9 @@ import React from "react"; import PropTypes from "prop-types"; - import "components/InterviewerList.scss"; import InterviewerListItem from "components/InterviewerListItem"; - export default function InterviewerList(props) { const list = props.interviewers.map((interviewer) => { return ( @@ -17,15 +15,15 @@ export default function InterviewerList(props) { setInterviewer={(event) => props.setInterviewer(interviewer.id)} /> ) - }) + }); return (

    Interviewer

    - ) -} + ); +}; InterviewerList.propTypes = { interviewers: PropTypes.array.isRequired diff --git a/src/components/__tests__/Application.test.js b/src/components/__tests__/Application.test.js index 36eeff8..79bcd0e 100644 --- a/src/components/__tests__/Application.test.js +++ b/src/components/__tests__/Application.test.js @@ -1,13 +1,10 @@ import React from "react"; - import { render, cleanup, waitForElement, fireEvent, getByText, prettyDOM, getAllByTestId, getByAltText, getByPlaceholderText, queryByText, queryByAltText } from "@testing-library/react"; import axios from "axios"; - import Application from "components/Application"; afterEach(cleanup); - describe("Application", () => { it("defaults to Monday and changes the schedule when a new day is selected", () => { const { getByText } = render(); diff --git a/src/components/__tests__/Appointment.test.js b/src/components/__tests__/Appointment.test.js index 9059351..ea07df5 100644 --- a/src/components/__tests__/Appointment.test.js +++ b/src/components/__tests__/Appointment.test.js @@ -1,7 +1,5 @@ import React from "react"; - import { render, cleanup } from "@testing-library/react"; - import Appointment from "components/Appointment/index"; afterEach(cleanup); @@ -10,4 +8,4 @@ describe("Appointment", () => { it("renders without crashing", () => { render(); }); -}); +}); \ No newline at end of file diff --git a/src/components/__tests__/Button.test.js b/src/components/__tests__/Button.test.js index 9a8b209..aaabc5c 100644 --- a/src/components/__tests__/Button.test.js +++ b/src/components/__tests__/Button.test.js @@ -1,59 +1,59 @@ import React from "react"; - import { render, cleanup, fireEvent } from "@testing-library/react"; - import Button from "components/Button"; afterEach(cleanup); -it("renders without crashing", () => { - render(); - expect(getByText("Default")).toBeInTheDocument(); -}); - -it("renders a default button style", () => { - const { getByText } = render(); - expect(getByText("Default")).toHaveClass("button"); -}); - -it("renders a confirm button", () => { - const { getByText } = render(); - expect(getByText("Confirm")).toHaveClass("button--confirm"); -}); - -it("renders a danger button", () => { - const { getByText } = render(); - expect(getByText("Danger")).toHaveClass("button--danger"); -}); - -it("renders a clickable button", () => { - const handleClick = jest.fn(); - const { getByText } = render( - - ); - - const button = getByText("Clickable"); - - fireEvent.click(button); - - expect(handleClick).toHaveBeenCalledTimes(1); -}); - -it("renders a disabled button", () => { - const handleClick = jest.fn(); - const { getByText } = render( - - ); - - const button = getByText("Disabled"); - - fireEvent.click(button); - - expect(handleClick).toHaveBeenCalledTimes(0); -}); +describe("Button", () => { + it("renders without crashing", () => { + render(); + expect(getByText("Default")).toBeInTheDocument(); + }); + + it("renders a default button style", () => { + const { getByText } = render(); + expect(getByText("Default")).toHaveClass("button"); + }); + + it("renders a confirm button", () => { + const { getByText } = render(); + expect(getByText("Confirm")).toHaveClass("button--confirm"); + }); + + it("renders a danger button", () => { + const { getByText } = render(); + expect(getByText("Danger")).toHaveClass("button--danger"); + }); + + it("renders a clickable button", () => { + const handleClick = jest.fn(); + const { getByText } = render( + + ); + + const button = getByText("Clickable"); + + fireEvent.click(button); + + expect(handleClick).toHaveBeenCalledTimes(1); + }); + + it("renders a disabled button", () => { + const handleClick = jest.fn(); + const { getByText } = render( + + ); + + const button = getByText("Disabled"); + + fireEvent.click(button); + + expect(handleClick).toHaveBeenCalledTimes(0); + }); +}); \ No newline at end of file diff --git a/src/components/__tests__/DayListItem.test.js b/src/components/__tests__/DayListItem.test.js index 2184bd3..80fbfc0 100644 --- a/src/components/__tests__/DayListItem.test.js +++ b/src/components/__tests__/DayListItem.test.js @@ -1,26 +1,26 @@ import React from "react"; - import { render, cleanup } from "@testing-library/react"; - import DayListItem from "components/DayListItem"; afterEach(cleanup); -it("renders without crashing", () => { - render(); -}); - -it("renders 'no spots remaining' when there are 0 spots", () => { - const { getByText } = render(); - expect(getByText("no spots remaining")).toBeInTheDocument(); -}); - -it("renders '1 spot remaining' when there is 1 spot", () => { - const { getByText } = render(); - expect(getByText("1 spot remaining")).toBeInTheDocument(); -}); - -it("renders '2 spots remaining' when there are 2 spots", () => { - const { getByText } = render(); - expect(getByText("2 spots remaining")).toBeInTheDocument(); +describe("DayListItem", () => { + it("renders without crashing", () => { + render(); + }); + + it("renders 'no spots remaining' when there are 0 spots", () => { + const { getByText } = render(); + expect(getByText("no spots remaining")).toBeInTheDocument(); + }); + + it("renders '1 spot remaining' when there is 1 spot", () => { + const { getByText } = render(); + expect(getByText("1 spot remaining")).toBeInTheDocument(); + }); + + it("renders '2 spots remaining' when there are 2 spots", () => { + const { getByText } = render(); + expect(getByText("2 spots remaining")).toBeInTheDocument(); + }); }); \ No newline at end of file diff --git a/src/components/__tests__/Form.test.js b/src/components/__tests__/Form.test.js index fa13fcf..b9f1474 100644 --- a/src/components/__tests__/Form.test.js +++ b/src/components/__tests__/Form.test.js @@ -1,7 +1,5 @@ import React from "react"; - import { render, cleanup, fireEvent } from "@testing-library/react"; - import Form from "components/Appointment/Form"; afterEach(cleanup); diff --git a/src/helpers/selectors.js b/src/helpers/selectors.js index 669e920..9bc081b 100644 --- a/src/helpers/selectors.js +++ b/src/helpers/selectors.js @@ -7,9 +7,9 @@ export function getAppointmentsForDay(state, day) { output.push(state.appointments[value]); } } - } + }; return output; -} +}; export function getInterview(state, interview) { if (!interview) { @@ -21,7 +21,7 @@ export function getInterview(state, interview) { output.interviewer = state.interviewers[interview.interviewer]; return output; -} +}; export function getInterviewersForDay(state, day) { let output = []; @@ -30,8 +30,8 @@ export function getInterviewersForDay(state, day) { if (currentDay.length === 0) { return []; - } + }; output = currentDay[0].interviewers.map((name) => state.interviewers[name]); return output; -} \ No newline at end of file +}; \ No newline at end of file diff --git a/src/hooks/useApplicationData.js b/src/hooks/useApplicationData.js index 2926d36..fcbcacd 100644 --- a/src/hooks/useApplicationData.js +++ b/src/hooks/useApplicationData.js @@ -2,17 +2,14 @@ import { useEffect, useState } from "react"; import axios from "axios"; export default function useApplicationData() { - const [state, setState] = useState({ day: "Monday", days: [], appointments: {}, interviewers: {} - }) + }); const newSpots = (state, appointments) => { - console.log("State.days: ", state.days); - let dayID = state.days.filter((item) => { return item.name === state.day; })[0].id; @@ -25,20 +22,19 @@ export default function useApplicationData() { if (appointments[appt].interview === null) { spots++; } - } + }; const days = state.days.map((day) => { if (day.id === dayID) { return { ...day, spots } } return day; - }) + }); return days; - } + }; const bookInterview = (id, interview) => { - console.log(id, interview); const appointment = { ...state.appointments[id], interview: { ...interview } @@ -47,17 +43,14 @@ export default function useApplicationData() { ...state.appointments, [id]: appointment }; - // setState({ - // ...state, - // appointments - // }); + const days = newSpots(state, appointments); return axios.put(`api/appointments/${id}`, appointment) .then((response) => { console.log("Added to database: ", response); setState({...state, appointments, days }); - }) + }); } const cancelInterview = (id) => { @@ -69,7 +62,7 @@ export default function useApplicationData() { const appointments = { ...state.appointments, [id]: appointment - } + }; const days = newSpots(state, appointments); @@ -77,16 +70,15 @@ export default function useApplicationData() { .then((response) => { console.log("Deleted from database: ", response); setState({...state, appointments, days }); - }) - } + }); + }; const setDay = (day) => { return setState((prev) => ({ ...prev, day })); - } + }; useEffect(() => { - Promise.all([ axios.get("/api/days"), axios.get("/api/appointments"), @@ -99,9 +91,8 @@ export default function useApplicationData() { appointments: response[1].data, interviewers: response[2].data })); - }) - }, []) + }); + }, []); return { state, setDay, bookInterview, cancelInterview }; - } \ No newline at end of file diff --git a/src/hooks/useVisualMode.js b/src/hooks/useVisualMode.js index 5949a51..ffae84a 100644 --- a/src/hooks/useVisualMode.js +++ b/src/hooks/useVisualMode.js @@ -18,7 +18,7 @@ export default function useVisualMode(initial) { return [...prev, newMode] }) } - } + }; const back = () => { if (history.length > 1) { @@ -27,10 +27,9 @@ export default function useVisualMode(initial) { setMode(output[output.length - 1]); setHistory(output); } - } + }; return {mode, transition, back}; - -} +}; diff --git a/src/hooks/useVisualMode.test.js b/src/hooks/useVisualMode.test.js index 1a0e9db..2628598 100644 --- a/src/hooks/useVisualMode.test.js +++ b/src/hooks/useVisualMode.test.js @@ -40,7 +40,6 @@ test("useVisualMode should replace the current mode", () => { act(() => result.current.transition(SECOND)); expect(result.current.mode).toBe(SECOND); - // Passing "true" to transition(THIRD, true) says "Transition to THIRD by REPLACING SECOND" act(() => result.current.transition(THIRD, true)); expect(result.current.mode).toBe(THIRD); diff --git a/src/index.js b/src/index.js index 94d3a0f..4509d61 100644 --- a/src/index.js +++ b/src/index.js @@ -1,8 +1,6 @@ import React from "react"; import ReactDOM from "react-dom"; - import "index.scss"; - import Application from "components/Application"; -ReactDOM.render(, document.getElementById("root")); +ReactDOM.render(, document.getElementById("root")); \ No newline at end of file