colouring-montreal/app/src/frontend/building/data-containers/team.tsx

139 lines
5.1 KiB
TypeScript
Raw Normal View History

2019-08-14 17:12:24 -04:00
import React, { Fragment } from 'react';
import InfoBox from '../../components/info-box';
2022-06-01 05:35:35 -04:00
import { dataFields } from '../../config/data-fields-config';
2022-06-01 05:36:47 -04:00
import SelectDataEntry from '../data-components/select-data-entry';
2022-06-01 06:15:19 -04:00
import NumericDataEntry from '../data-components/numeric-data-entry';
2022-06-01 09:29:06 -04:00
import Verification from '../data-components/verification';
import withCopyEdit from '../data-container';
2019-11-07 02:39:26 -05:00
import { CategoryViewProps } from './category-view-props';
/**
* Team view/edit section
*/
2022-06-01 06:12:49 -04:00
const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
const building = props.building;
2022-06-01 06:29:59 -04:00
const currentYear = new Date().getFullYear();
2022-06-01 06:12:49 -04:00
const currentBuildingConstructionYear = building.date_year || undefined;
2022-06-01 09:08:46 -04:00
if (props.building.is_extension == "The main building"){
return (
<Fragment>
<InfoBox msg="Can you help us capture information on who built the current building?"></InfoBox>
<SelectDataEntry
title={dataFields.is_extension.title}
slug="is_extension"
value={props.building.is_extension}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.is_extension.tooltip}
placeholder={dataFields.is_extension.example}
options={dataFields.is_extension.items}
/>
2022-06-01 06:12:49 -04:00
2022-06-01 09:08:46 -04:00
<NumericDataEntry
slug='date_year'
title={dataFields.extension_year.title}
2022-06-01 09:08:46 -04:00
value={currentBuildingConstructionYear}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
step={1}
min={1}
max={currentYear}
tooltip={dataFields.extension_year.tooltip}
2022-06-01 09:08:46 -04:00
/>
2022-06-01 09:29:06 -04:00
<Verification
slug="date_year"
allow_verify={props.user !== undefined && props.building.date_year !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("date_year")}
user_verified_as={props.user_verified.date_year}
verified_count={props.building.verified.date_year}
/>
2022-06-01 10:01:22 -04:00
<SelectDataEntry
slug='developer_type'
title={dataFields.developer_type.title}
value={props.building.developer_type}
options={dataFields.developer_type.items}
onChange={props.onChange}
mode={props.mode}
copy={props.copy}
/>
2022-06-01 10:54:01 -04:00
<MultiDataEntry
title={dataFields.designers.title}
slug="designers"
value={props.building.designers}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.designers.tooltip}
editableEntries={true}
2022-06-01 11:01:09 -04:00
maxLength={10}
2022-06-01 10:54:01 -04:00
/>
2022-06-01 09:08:46 -04:00
</Fragment>
);
};
2022-06-01 09:17:17 -04:00
return ( // This is what gets used when is_extension == "A major extension"
<Fragment>
<InfoBox msg="Can you help us capture information on who built the building extension?"></InfoBox>
<SelectDataEntry
title={dataFields.is_extension.title}
slug="is_extension"
value={props.building.is_extension}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.is_extension.tooltip}
placeholder={dataFields.is_extension.example}
options={dataFields.is_extension.items}
/>
<NumericDataEntry
slug='extension_year'
title={dataFields.extension_year.title}
value={props.building.extension_year}
2022-06-01 09:17:17 -04:00
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
step={1}
min={1}
max={currentYear}
tooltip={dataFields.extension_year.tooltip_extension}
2022-06-01 09:17:17 -04:00
/>
2022-06-01 09:29:06 -04:00
<Verification
slug="extension_year"
allow_verify={props.user !== undefined && props.building.extension_year !== null && !props.edited}
2022-06-01 09:29:06 -04:00
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("extension_year")}
user_verified_as={props.user_verified.extension_year}
verified_count={props.building.verified.extension_year}
2022-06-01 09:29:06 -04:00
/>
2022-06-01 10:01:22 -04:00
<SelectDataEntry
slug='developer_type'
title={dataFields.developer_type.title}
value={props.building.developer_type}
options={dataFields.developer_type.items}
onChange={props.onChange}
mode={props.mode}
copy={props.copy}
/>
2022-06-01 10:54:01 -04:00
<MultiDataEntry
title={dataFields.designers.title}
slug="designers"
value={props.building.designers}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
tooltip={dataFields.designers.tooltip}
editableEntries={true}
2022-06-01 11:01:09 -04:00
maxLength={10}
2022-06-01 10:54:01 -04:00
/>
2022-06-01 09:17:17 -04:00
</Fragment>
);
2022-06-01 06:12:49 -04:00
};
const TeamContainer = withCopyEdit(TeamView);
export default TeamContainer;