import React, { Component } from "react";
import BasePage from "@/components/Layout/BasePage";
import { getPT } from "@/actions/PT";
import { getPelanggaran } from "@/actions/pelanggaran";
import Select from "react-select";
import AsyncSelect from "react-select/async";
import { Row, Col, FormGroup, Input, Card, CardBody, Button, CustomInput, Navbar, NavItem, NavLink, NavbarBrand, NavbarToggler, Nav, Collapse } from "reactstrap";
import ContentWrapper from "@/components/Layout/ContentWrapper";

const menu = [
	{
		title: "Home",
		path: "/app",
	},
	{
		title: "Membuat Laporan",
		path: "/laporan/new",
	},
	{
		title: "Pemantauan",
		path: "/pemantauan",
	},
	{
		title: "Login",
		path: "/login",
	},
];
class PublicPage extends Component {
	constructor(props) {
		super(props);
		this.state = {
			isOpen: false,
			inputValue: "",
			stat: "Waiting to add files..",
			pelaporanNumber: Math.floor(Date.now() * Math.random()),
			nama: "",
			alamat: "",
			no_hp: "",
			email: "",
			fileIdentitas: null,
			pelanggaran: [],
			selectedPerguruanTinggi: {},
			selectedJenis: [],
			keteranganLaporan: "",
			files: [],
		};
	}

	render() {
		return (
			<div>
				<Navbar color="info" expand="md" dark>
					<NavbarBrand href="/">
						<img className="img-fluid" src="/static/img/logo-single.png" alt="App Logo" /> Aldila Dikti
					</NavbarBrand>
					<NavbarToggler onClick={this.toggleCollapse} />
					<Collapse isOpen={this.state.isOpen} navbar>
						<Nav className="ml-auto" navbar>
							{menu.map((e) => (
								<NavItem active={e.path === this.props.pathname ? true : false}>
									<NavLink href={e.path}>{e.title}</NavLink>
								</NavItem>
							))}
						</Nav>
					</Collapse>
				</Navbar>
				<ContentWrapper>
					<Row>
						<Col lg={8} className="block-center d-block ">
							{this.props.children}
						</Col>
					</Row>
				</ContentWrapper>
			</div>
		);
	}
}

PublicPage.Layout = BasePage;

export default PublicPage;