{"size": 792, "ext": "js", "max_stars_repo_path": "src/components/Modals.js", "max_stars_repo_name": "kim-jenny5/my-travelogue-frontend", "max_stars_repo_stars_event_min_datetime": "2022-03-07T21:02:22.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-07T21:02:22.000Z", "max_issues_repo_path": "src/components/Modals.js", "max_issues_repo_name": "kim-jenny5/my-travelogue-frontend", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/Modals.js", "max_forks_repo_name": "kim-jenny5/my-travelogue-frontend", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 24.75, "max_line_length": 75, "alphanum_fraction": 0.6224747475}
import React from "react";
import NewTripFormCont from "./NewTripFormCont";
import TripShowCont from "./TripShowCont";
import { Bug } from "akar-icons";

export default function Modals(props) {
	if (props.type === "new trip") {
		return <NewTripFormCont />;
	} else if (props.type === "show trip") {
		return <TripShowCont />;
	} else {
		return ErrorModal();
	}
}

const ErrorModal = () => {
	return (
		<div className="error-container">
			Oops... This is embarassing.{" "}
			<span style={{ fontSize: "1.5em", verticalAlign: "middle" }}>😳</span>
			<div
				style={{ fontSize: "1.25rem", fontWeight: "400", marginBottom: "2em" }}
			>
				We're always bug hunting, but we'll be sure to catch this one too!
			</div>
			<div>
				<Bug strokeWidth={2} size={60} />
			</div>
		</div>
	);
};
