From e89acea98141c67b327ea7f03cde778bc740857f Mon Sep 17 00:00:00 2001 From: lublagg Date: Wed, 4 Oct 2023 15:06:21 -0400 Subject: [PATCH 1/5] Add instructions for attributes dropdown. --- src/components/attribute-options.tsx | 3 +++ src/components/options.scss | 3 +++ 2 files changed, 6 insertions(+) diff --git a/src/components/attribute-options.tsx b/src/components/attribute-options.tsx index 6751255..e6bb686 100644 --- a/src/components/attribute-options.tsx +++ b/src/components/attribute-options.tsx @@ -29,6 +29,9 @@ export const AttributeOptions: React.FC = (props) => { return ( <> +
+ Choose attributes to include in your dataset from the list below. +
{ attributeOptions.map((attr) => { return ( diff --git a/src/components/options.scss b/src/components/options.scss index 2651587..5eb002c 100644 --- a/src/components/options.scss +++ b/src/components/options.scss @@ -81,5 +81,8 @@ .instructions { padding-left: 6px; margin-top: 6px; +} +.header { + margin-bottom: 15px; } \ No newline at end of file From 7bd99b6ff7c879dd21c1e88613ef1c65eb9d8f4c Mon Sep 17 00:00:00 2001 From: lublagg Date: Wed, 4 Oct 2023 15:09:10 -0400 Subject: [PATCH 2/5] User can select Age, Race, Gender. --- src/components/options.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/options.tsx b/src/components/options.tsx index 563e062..d5f8bd7 100644 --- a/src/components/options.tsx +++ b/src/components/options.tsx @@ -31,7 +31,7 @@ export const Options: React.FC = (props) => { newSelection[optionKey].push(e.target.value); // If user selects "Age", "Gender", or "Race", auto-select "Total Farmers" as well if (optionKey === "farmerDemographics" && !newArray.includes("Total Farmers")) { - newSelection.farmDemographics.push("Total Farmers"); + newSelection.farmerDemographics.push("Total Farmers"); } // If user selects a state, de-select "All States" if (optionKey === "states" && newArray.includes("All States")) { From 1f6695852a02af42cf2fc8b4d0b37914d11fe2dc Mon Sep 17 00:00:00 2001 From: lublagg Date: Wed, 4 Oct 2023 15:18:59 -0400 Subject: [PATCH 3/5] If user selects any option under Farm Demographics, auto-select "Total Farms" as well --- src/components/options.tsx | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/components/options.tsx b/src/components/options.tsx index d5f8bd7..ab6ef7c 100644 --- a/src/components/options.tsx +++ b/src/components/options.tsx @@ -33,6 +33,10 @@ export const Options: React.FC = (props) => { if (optionKey === "farmerDemographics" && !newArray.includes("Total Farmers")) { newSelection.farmerDemographics.push("Total Farmers"); } + // If user selects any option under Farm Demographics, auto-select "Total Farms" as well + if (optionKey === "farmDemographics" && !newArray.includes("Total Farms")) { + newSelection.farmDemographics.push("Total Farms"); + } // If user selects a state, de-select "All States" if (optionKey === "states" && newArray.includes("All States")) { newSelection.states = newArray.filter((state) => state !== "All States"); @@ -43,10 +47,15 @@ export const Options: React.FC = (props) => { } } else { if (isOptionSelected(e.target.value)) { - const includes = (opt: string) => selectedOptions.farmerDemographics.includes(opt); + const includesAny = (opts: string[], key: keyof IStateOptions) => opts.some(opt => selectedOptions[key].includes(opt)); // "Total Farmers" can only be unselected if race, gender, and age are unselected if (optionKey === "farmerDemographics" && e.target.value === "Total Farmers") { - const shouldFilter = !includes("Race") && !includes("Gender") && !includes("Age"); + const shouldFilter = !includesAny(["Race", "Gender", "Age"], "farmerDemographics"); + if (shouldFilter) { + newSelection[optionKey] = newArray.filter((o) => o !== e.target.value); + } + } else if (optionKey === "farmDemographics" && e.target.value === "Total Farms") { + const shouldFilter = !includesAny(["Economic Class", "Acres Operated", "Organic", "Organization Type"], "farmDemographics"); if (shouldFilter) { newSelection[optionKey] = newArray.filter((o) => o !== e.target.value); } From 838c0a61f53cab205c47fa7105c770f191a70b65 Mon Sep 17 00:00:00 2001 From: lublagg Date: Wed, 4 Oct 2023 15:22:59 -0400 Subject: [PATCH 4/5] If user selects a crop and no unit is selected, auto-select Yield --- src/components/options.tsx | 4 ++++ src/constants/constants.ts | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/options.tsx b/src/components/options.tsx index ab6ef7c..a707342 100644 --- a/src/components/options.tsx +++ b/src/components/options.tsx @@ -37,6 +37,10 @@ export const Options: React.FC = (props) => { if (optionKey === "farmDemographics" && !newArray.includes("Total Farms")) { newSelection.farmDemographics.push("Total Farms"); } + // If user selects a crop and no unit is selected, auto-select Yield + if (optionKey === "crops" && !selectedOptions.cropUnits) { + newSelection.cropUnits = "Yield"; + } // If user selects a state, de-select "All States" if (optionKey === "states" && newArray.includes("All States")) { newSelection.states = newArray.filter((state) => state !== "All States"); diff --git a/src/constants/constants.ts b/src/constants/constants.ts index f23e8c9..a0cd53e 100644 --- a/src/constants/constants.ts +++ b/src/constants/constants.ts @@ -93,7 +93,7 @@ const cropUnitOptions: IAttrOptions = { key: "cropUnits", label: "Crop Production", options: ["Area Harvested", "Yield"], - instructions: "(Choose units)" + instructions: "(Choose unit)" }; export const cropOptions: IAttrOptions = { key: "crops", From 06e1dc7dce743e2df8d30f46320b88e96872d788 Mon Sep 17 00:00:00 2001 From: lublagg Date: Wed, 4 Oct 2023 15:34:25 -0400 Subject: [PATCH 5/5] Remove headers from attributes summary. --- src/components/summary.tsx | 25 +++---------------------- 1 file changed, 3 insertions(+), 22 deletions(-) diff --git a/src/components/summary.tsx b/src/components/summary.tsx index e362f28..52e93a5 100644 --- a/src/components/summary.tsx +++ b/src/components/summary.tsx @@ -1,6 +1,7 @@ import React from "react"; import { IStateOptions } from "../constants/types"; import { attributeOptions } from "../constants/constants"; +import { flatten } from "../scripts/utils"; interface IProps { category: string; @@ -18,28 +19,8 @@ export const Summary: React.FC = ({category, selectedOptions}) => { `${place}${colon}${states}` ); } else if (category === "Attributes") { - const resultString = attributeOptions.filter((attr) => { - const value = selectedOptions[attr.key]; - const valueIsArrayWithLength = Array.isArray(value) && value.length > 0; - const valueIsDefined = typeof value === "string" && value; - return valueIsArrayWithLength || valueIsDefined; - }).map((attr) => { - const value = selectedOptions[attr.key]; - const valueIsArrayWithLength = Array.isArray(value) && value.length > 0; - const valueIsDefined = typeof value === "string" && value; - const label = attr.label && (valueIsArrayWithLength || valueIsDefined) ? `${attr.label}: ` : ""; - - if (valueIsArrayWithLength) { - return `${label}${value.join(", ")}`; - } else if (value) { - return `${attr.label}: ${value}`; - } else { - return null; - } - }) - .filter((item) => item !== null); - const finalString = resultString.join(", "); - return finalString; + const result = flatten(attributeOptions.filter((opt) => selectedOptions[opt.key]).map((opt) => selectedOptions[opt.key])); + return result.join(", "); } else if (category === "Years") { return selectedOptions.years.join(", "); }