{"size": 1594, "ext": "js", "max_stars_repo_path": "frontend/app/src/components/contents/ApproverStart.js", "max_stars_repo_name": "TDDD96-Kandidatgrupp-1-2020/Visual1ze", "max_stars_repo_stars_event_min_datetime": "2020-05-25T13:30:55.000Z", "max_stars_repo_stars_event_max_datetime": "2021-11-08T13:00:01.000Z", "max_issues_repo_path": "frontend/app/src/components/contents/ApproverStart.js", "max_issues_repo_name": "matheus-bernat/Visual1ze", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "frontend/app/src/components/contents/ApproverStart.js", "max_forks_repo_name": "matheus-bernat/Visual1ze", "max_forks_repo_forks_event_min_datetime": "2021-03-30T14:38:40.000Z", "max_forks_repo_forks_event_max_datetime": "2021-03-30T14:38:40.000Z"}
{"max_stars_count": 6, "max_issues_count": null, "max_forks_count": 1, "avg_line_length": 31.2549019608, "max_line_length": 109, "alphanum_fraction": 0.7396486826}
/**
 * This file contains the Start content component for approvers.
 */

import React, { useState } from 'react';
import MapViewer from '../map/MapViewer.js';
import { withRouter } from 'react-router-dom';
import styled from 'styled-components';
import PendingRequest from './PendingRequest';
import UserSearch from './UserSearch.js';
import AnsweringRequest from './AnsweringRequest';


const GridLayout = styled.div`
  height: 100vh;
  padding: 0em 1em;
  gap: 1em 1em;
  display: grid;
  box-sizing: border-box;
  grid-template-areas:
    "header header"
    ". search"
    "pending map";
  grid-template-rows: 70px auto 1fr;
  grid-template-columns: 1fr 5fr;
`;

/**
 * Start component. Contains the MapViewer and a button for simulating pressing on a room.
 * The parameter props comes from withRouter (see bottom of document)
 */
function ApproverStart(props) {
	// Variable that decides which component is to be shown: PendingRequests or AnsweringRequest
	const [showPendingRequests, setShowPendingRequest] = useState(true);

	return(
  	<GridLayout>
  		<MapViewer approver={true}/>
  		{showPendingRequests &&
  		<PendingRequest showPendingRequests={showPendingRequests} setShowPendingRequest={setShowPendingRequest}/>
  		}
  		{!showPendingRequests &&
  		<AnsweringRequest setShowPendingRequest={setShowPendingRequest} />
  		}
  		<UserSearch />
  	</GridLayout>
	)
} export default withRouter(ApproverStart)
// Exporting the component wrapped around "withRouter" gives the component access to props.history,
// which means that the component can route the users to other pages.
