-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #253 from wri/feat/TM-874-Site-Profile-Non-Monitor…
…ing-Partner [TM-874] site profile non monitoring partner
- Loading branch information
Showing
22 changed files
with
1,510 additions
and
240 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
156 changes: 156 additions & 0 deletions
156
src/components/elements/MapPolygonPanel/AttributeInformation.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,156 @@ | ||
import { useT } from "@transifex/react"; | ||
|
||
import Dropdown from "@/components/elements/Inputs/Dropdown/Dropdown"; | ||
import Input from "@/components/elements/Inputs/Input/Input"; | ||
|
||
import Text from "../Text/Text"; | ||
|
||
const dropdownOptionsRestoration = [ | ||
{ | ||
title: "Tree Planting", | ||
value: 1 | ||
}, | ||
{ | ||
title: "Direct Seeding", | ||
value: 2 | ||
}, | ||
{ | ||
title: "Assisted Natural Regeneration", | ||
value: 3 | ||
} | ||
]; | ||
const dropdownOptionsTarget = [ | ||
{ | ||
title: "Agroforest", | ||
value: 1 | ||
}, | ||
{ | ||
title: "Natural Forest", | ||
value: 2 | ||
}, | ||
{ | ||
title: "Mangrove", | ||
value: 3 | ||
}, | ||
{ | ||
title: "Peatland", | ||
value: 4 | ||
}, | ||
{ | ||
title: "Riparian Area or Wetland", | ||
value: 5 | ||
}, | ||
{ | ||
title: "Silvopasture", | ||
value: 6 | ||
}, | ||
{ | ||
title: "Woodlot or Plantation", | ||
value: 7 | ||
}, | ||
{ | ||
title: "Urban Forest", | ||
value: 8 | ||
} | ||
]; | ||
|
||
const dropdownOptionsTree = [ | ||
{ | ||
title: "Single Line", | ||
value: 1 | ||
}, | ||
{ | ||
title: "Partial", | ||
value: 2 | ||
}, | ||
{ | ||
title: "Full", | ||
value: 3 | ||
} | ||
]; | ||
const AttributeInformation = () => { | ||
const t = useT(); | ||
|
||
return ( | ||
<div className="flex flex-col gap-4"> | ||
<Input | ||
label={t("Polygon Name")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Input Polygon Name")} | ||
type="text" | ||
name="" | ||
/> | ||
<label className="flex flex-col gap-2"> | ||
<Text variant="text-14-light" className="text-white"> | ||
{t("Plant Start Date")} | ||
</Text> | ||
<input | ||
type="date" | ||
className="rounded-lg border-neutral-200 focus:border-primary focus:shadow-none focus:ring-transparent" | ||
placeholder={t("Input Plant Start Date")} | ||
/> | ||
</label> | ||
<label className="flex flex-col gap-2"> | ||
<Text variant="text-14-light" className="text-white"> | ||
{t("Plant End Date")} | ||
</Text> | ||
<input | ||
type="date" | ||
className="rounded-lg border-neutral-200 focus:border-primary focus:shadow-none focus:ring-transparent" | ||
placeholder={t("Input Plant Start Date")} | ||
/> | ||
</label> | ||
<Dropdown | ||
multiSelect | ||
label={t("Restoration Practice")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Select Restoration Practice")} | ||
options={dropdownOptionsRestoration} | ||
value={[t("Planting Complete")]} | ||
onChange={() => {}} | ||
className="bg-white" | ||
/> | ||
<Dropdown | ||
label={t("Target Land Use System")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Select Target Land Use System")} | ||
options={dropdownOptionsTarget} | ||
value={[t("Planting Complete")]} | ||
onChange={() => {}} | ||
className="bg-white" | ||
/> | ||
<Dropdown | ||
multiSelect | ||
label={t("Tree Distribution")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Select Tree Distribution")} | ||
options={dropdownOptionsTree} | ||
value={[t("Planting Complete")]} | ||
onChange={() => {}} | ||
className="bg-white" | ||
/> | ||
<Input | ||
label={t("Trees Planted")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Input Trees Planted")} | ||
type="text" | ||
name="" | ||
/> | ||
<Input | ||
label={t("Estimated Area")} | ||
labelClassName="capitalize text-white" | ||
labelVariant="text-14-light" | ||
placeholder={t("Input Estimated Area")} | ||
type="text" | ||
name="" | ||
/> | ||
</div> | ||
); | ||
}; | ||
|
||
export default AttributeInformation; |
86 changes: 86 additions & 0 deletions
86
src/components/elements/MapPolygonPanel/ChecklistInformation.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,86 @@ | ||
import { useT } from "@transifex/react"; | ||
|
||
import Icon, { IconNames } from "@/components/extensive/Icon/Icon"; | ||
import ModalWithMap from "@/components/extensive/Modal/ModalWithMap"; | ||
import { useModalContext } from "@/context/modal.provider"; | ||
|
||
import Button from "../Button/Button"; | ||
import Text from "../Text/Text"; | ||
|
||
const ChecklistInformation = () => { | ||
const { openModal, closeModal } = useModalContext(); | ||
const t = useT(); | ||
|
||
const openFormModalHandlerRequestPolygonSupport = () => { | ||
openModal( | ||
<ModalWithMap | ||
title={t("Request Support")} | ||
onClose={closeModal} | ||
primaryButtonText={t("Submit")} | ||
content="- • -" | ||
primaryButtonProps={{ className: "px-8 py-3", variant: "primary", onClick: closeModal }} | ||
></ModalWithMap> | ||
); | ||
}; | ||
return ( | ||
<div className="text-white"> | ||
<Text variant="text-14-bold">3 {t("out")} 14</Text> | ||
<Text variant="text-14-light">{t("Validation criteria are not met")}</Text> | ||
<Button variant="primary" className="mt-4" onClick={openFormModalHandlerRequestPolygonSupport}> | ||
{t("request support")} | ||
</Button> | ||
<div className="mt-3 grid gap-3"> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("GeoJSON Format")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("WGS84 Projection")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.IC_ERROR} className="h-5 w-5 lg:h-6 lg:w-6" /> | ||
{t("Earth Location")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.IC_ERROR} className="h-5 w-5 lg:h-6 lg:w-6" /> | ||
{t("Country")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("Reasonable Size Self-Intersecting Topology")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.IC_ERROR} className="h-5 w-5 lg:h-6 lg:w-6" /> | ||
{t("Overlapping Polygons")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("Spike")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("Polygon Integrity")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("GeoJSON Format")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.CHECK_PROGRESSBAR} className="h-4 w-4 text-green-400 lg:h-5 lg:w-5" /> | ||
{t("WGS84 Projection")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.IC_ERROR} className="h-5 w-5 lg:h-6 lg:w-6" /> | ||
{t("Earth Location")} | ||
</Text> | ||
<Text variant="text-14-light" className="flex items-center gap-2"> | ||
<Icon name={IconNames.IC_ERROR} className="h-5 w-5 lg:h-6 lg:w-6" /> | ||
{t("Country")} | ||
</Text> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default ChecklistInformation; |
Oops, something went wrong.