Skip to content
This repository has been archived by the owner on Sep 16, 2024. It is now read-only.

bug: Bb 353 custom fertilizer not loading on calculate nutrient #354

Merged
merged 12 commits into from
Aug 15, 2024
Merged

bug: Bb 353 custom fertilizer not loading on calculate nutrient #354

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
7673d2d
Density units for liquids showing up
GDamaso Aug 14, 2024
7e5953d
Almost there
GDamaso Aug 14, 2024
562dbaf
Fixed blank ;abel for custom ferts
GDamaso Aug 15, 2024
fab9adc
Improved fert and general loading
GDamaso Aug 15, 2024
f1e4e37
Add uuids for keys to get rid of warning
GDamaso Aug 15, 2024
e4d5571
Fix export page warning
GDamaso Aug 15, 2024
6fdef8f
Avoid fert duplication on page refresh
GDamaso Aug 15, 2024
bc9d8c2
Some keys matter
GDamaso Aug 15, 2024
00a0355
This was not the fix
GDamaso Aug 15, 2024
1274b8f
This is better
GDamaso Aug 15, 2024
d21e028
Remove console log
GDamaso Aug 15, 2024
ab9b4a6
Cleanup
GDamaso Aug 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions frontend/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 2 additions & 0 deletions frontend/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@
"@fortawesome/react-fontawesome": "^0.2.2",
"@testing-library/jest-dom": "^6.4.5",
"@testing-library/react": "^16.0.0",
"@types/uuid": "^10.0.0",
"@vitejs/plugin-react": "^4.3.0",
"@vitejs/plugin-react-swc": "^3.5.0",
"axios": "^1.7.2",
Expand All @@ -33,6 +34,7 @@
"react-bootstrap": "^2.10.2",
"react-dom": "^18.2.0",
"react-router-dom": "^6.23.1",
"uuid": "^10.0.0",
"vite": "^5.2.0",
"vite-plugin-pwa": "^0.20.0",
"vitest": "^1.6.0",
Expand Down
36 changes: 24 additions & 12 deletions frontend/src/Commons/Forms/InputModules/CalculateNutrients/CalculateNutrients.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,12 +78,24 @@ const CalculateNutrientsComponent: FC<InputModuleProps> = ({
label: field.FieldName,
}));

const fertilizerOption: OptionInterface[] = fertilizersDetails.map((fertilizer) => ({
value: fertilizer.fertilizerId,
label: getFertilizerOption(fertilizer.fertilizerId)?.label ?? fertilizer.fertilizerId,
}));
const fertilizerOption: OptionInterface[] = fertilizersDetails.map((fertilizer) => {
if (fertilizer.fertilizerId === '2')
return {
value: fertilizer.fertilizerId,
label: `Custom Dry (${fertilizer.customN}-${fertilizer.customP2o5}-${fertilizer.customK2o})`,
};
if (fertilizer.fertilizerId === '4')
return {
value: fertilizer.fertilizerId,
label: `Custom Liquid (${fertilizer.customN}-${fertilizer.customP2o5}-${fertilizer.customK2o})`,
};
return {
value: fertilizer.fertilizerId,
label: getFertilizerOption(fertilizer.fertilizerId)?.label ?? fertilizer.fertilizerId,
};
});

const isLiquid = fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('Liquid');
const isLiquid = ['3', '4'].includes(fertilizersDetails[selectedIndex]?.fertilizerTypeId);

const validationSchema = Yup.object().shape({
FieldName: Yup.string().required('Required'),
Expand Down Expand Up @@ -243,7 +255,7 @@ const CalculateNutrientsComponent: FC<InputModuleProps> = ({

// Default density unit is lb/imp. gall
// This checks and adjust if necessary
if (fert.fertilizerTypeId.includes('Liquid Fertilizer')) {
if (fert.fertilizerTypeId.includes('3') || fert.fertilizerTypeId.includes('4')) {
switch (densityUnits) {
case 'kg/US Gallon':
// kg to lb
Expand Down Expand Up @@ -285,13 +297,13 @@ const CalculateNutrientsComponent: FC<InputModuleProps> = ({
};

const displayFertilizerOption = (): OptionInterface[] => {
if (fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('1')) {
if (
fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('1') ||
fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('2')
) {
return DryApplicationUnits;
}
if (fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('3')) {
return LiquidApplicationUnits;
}
return [];
return LiquidApplicationUnits;
};

const removeFertFromField = (field: FieldDetailInterface, fertilizer: FertilizerInterface) => {
Expand Down Expand Up @@ -379,7 +391,7 @@ const CalculateNutrientsComponent: FC<InputModuleProps> = ({
/>
</StyledSmallFormGroup>

{fertilizersDetails[selectedIndex]?.fertilizerTypeId.includes('Liquid') && (
{isLiquid && (
<StyledSmallFormGroup>
<CustomField
label="Density"
Expand Down
129 changes: 61 additions & 68 deletions frontend/src/Commons/Forms/InputModules/CalculateNutrients/CalculateNutrientsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { FC } from 'react';
import { v4 as uuidv4 } from 'uuid';
import CropsDetailsInterface from '@Interface/CropsDetailsInterface';
import FertilizerInterface from '@Interface/FertilizerInterface';
import {
Expand Down Expand Up @@ -73,8 +74,7 @@ const CalculationList: FC<CalculationListProps> = ({

<tbody>
{field.Crops.map((crop: CropsDetailsInterface, index: number) => (
// eslint-disable-next-line react/no-array-index-key
<tr key={`${crop}-${index}`}>
<tr key={uuidv4()}>
<td>
<p className="col1">{crop.cropId === '75' ? 'Blueberry' : 'Raspberry'}</p>
</td>
Expand Down Expand Up @@ -104,38 +104,35 @@ const CalculationList: FC<CalculationListProps> = ({
</td>
</tr>

{field.Nutrients?.nutrientFertilizers.map(
(fertilizer: FertilizerInterface, idx: number) => (
// eslint-disable-next-line react/no-array-index-key
<tr key={`${fertilizer.fertilizerId}-${idx}`}>
<td>
<p className="col1">
{getFertilizerOption(fertilizer.fertilizerId?.toString())?.label ??
fertilizer.fertilizerId}
</p>
</td>
<td>
<p>{fertilizer.fertN}</p>
</td>
<td>
<p>{fertilizer.fertP2o5}</p>
</td>
<td>
<p>{fertilizer.fertK2o}</p>
</td>
<td>
<button
type="button"
onClick={() => removeFert(field, fertilizer)}
style={{ border: 'none', background: 'none' }}
aria-label="Delete button"
>
<FontAwesomeIcon icon={faTrashCan} />
</button>
</td>
</tr>
),
)}
{field.Nutrients?.nutrientFertilizers.map((fertilizer: FertilizerInterface) => (
<tr key={uuidv4()}>
<td>
<p className="col1">
{getFertilizerOption(fertilizer.fertilizerId?.toString())?.label ??
fertilizer.fertilizerId}
</p>
</td>
<td>
<p>{fertilizer.fertN}</p>
</td>
<td>
<p>{fertilizer.fertP2o5}</p>
</td>
<td>
<p>{fertilizer.fertK2o}</p>
</td>
<td>
<button
type="button"
onClick={() => removeFert(field, fertilizer)}
style={{ border: 'none', background: 'none' }}
aria-label="Delete button"
>
<FontAwesomeIcon icon={faTrashCan} />
</button>
</td>
</tr>
))}
</>
)}

Expand Down Expand Up @@ -226,8 +223,7 @@ const CalculationList: FC<CalculationListProps> = ({

<tbody>
{field.Crops.map((crop: CropsDetailsInterface, index: number) => (
// eslint-disable-next-line react/no-array-index-key
<tr key={`removal-${crop}-${index}`}>
<tr key={uuidv4()}>
<td>
<p className="cropRemovalCol1 col1">
{crop.cropId === '75' ? 'Blueberry' : 'Raspberry'}
Expand Down Expand Up @@ -259,38 +255,35 @@ const CalculationList: FC<CalculationListProps> = ({
</td>
</tr>

{field.Nutrients?.nutrientFertilizers.map(
(fertilizer: FertilizerInterface, idx: number) => (
// eslint-disable-next-line react/no-array-index-key
<tr key={`${fertilizer.fertilizerId}-${idx}`}>
<td>
<p className="cropRemovalCol1 col1">
{getFertilizerOption(fertilizer.fertilizerId?.toString())?.label ??
fertilizer.fertilizerId}
</p>
</td>
<td>
<p>{fertilizer.fertN}</p>
</td>
<td>
<p>{fertilizer.fertP2o5}</p>
</td>
<td>
<p>{fertilizer.fertK2o}</p>
</td>
<td>
<button
type="button"
onClick={() => removeFert(field, fertilizer)}
style={{ border: 'none', background: 'none' }}
aria-label="Delete fertilizer from field"
>
<FontAwesomeIcon icon={faTrashCan} />
</button>
</td>
</tr>
),
)}
{field.Nutrients?.nutrientFertilizers.map((fertilizer: FertilizerInterface) => (
<tr key={uuidv4()}>
<td>
<p className="cropRemovalCol1 col1">
{getFertilizerOption(fertilizer.fertilizerId?.toString())?.label ??
fertilizer.fertilizerId}
</p>
</td>
<td>
<p>{fertilizer.fertN}</p>
</td>
<td>
<p>{fertilizer.fertP2o5}</p>
</td>
<td>
<p>{fertilizer.fertK2o}</p>
</td>
<td>
<button
type="button"
onClick={() => removeFert(field, fertilizer)}
style={{ border: 'none', background: 'none' }}
aria-label="Delete fertilizer from field"
>
<FontAwesomeIcon icon={faTrashCan} />
</button>
</td>
</tr>
))}
</>
)}

Expand Down
1 change: 0 additions & 1 deletion frontend/src/Commons/Forms/InputModules/Crops/CropsInfo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -315,7 +315,6 @@ const CropsInfoComponent: FC<InputModuleProps> = ({
mobileWidth="137px"
onChange={(e) => {
handleChange(e, setFieldValue);
console.log(e.target.name, e.target.value);
}}
/>
{((values.willPlantsBePruned &&
Expand Down
19 changes: 10 additions & 9 deletions frontend/src/Commons/Forms/InputModules/Fertilizers/Fertilizers.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,10 +71,12 @@ const FertilizersInfo: FC<InputModuleProps> = ({
let fertP2o5Value = 0;
let fertK20Value = 0;

if (values.fertilizerTypeId.includes('Dry Fertilizer (Custom)')) {
tempFertilizerId = `Dry Fertilizer Custom (${values.customN}-${values.customP2o5}-${values.customK2o})`;
} else if (values.fertilizerTypeId.includes('Liquid Fertilizer (Custom)')) {
tempFertilizerId = `Liquid Fertilizer Custom (${values.customN}-${values.customP2o5}-${values.customK2o})`;
if (values.fertilizerTypeId.includes('2')) {
// tempFertilizerId = `Dry Fertilizer Custom (${values.customN}-${values.customP2o5}-${values.customK2o})`;
tempFertilizerId = `2`;
} else if (values.fertilizerTypeId.includes('4')) {
// tempFertilizerId = `Liquid Fertilizer Custom (${values.customN}-${values.customP2o5}-${values.customK2o})`;
tempFertilizerId = `4`;
}

const defaultValues = { N: 0, P: 0, K: 0 };
Expand All @@ -88,9 +90,10 @@ const FertilizersInfo: FC<InputModuleProps> = ({
const newFertilizer: FertilizerInterface = {
id: fertDetails.length,
fertilizerTypeId: values.fertilizerTypeId,
fertilizerId: values.fertilizerTypeId.includes('(Custom)')
? tempFertilizerId
: values.fertilizerId,
fertilizerId:
values.fertilizerTypeId.includes('2') || values.fertilizerTypeId.includes('4')
? tempFertilizerId
: values.fertilizerId,
applRate: values.applRate,
applDate: '',
applUnitId: '',
Expand Down Expand Up @@ -123,8 +126,6 @@ const FertilizersInfo: FC<InputModuleProps> = ({

updatedFerts.splice(fertIdx, 1);
setFertDetails([...updatedFerts]);
console.log(fertilizersDetails);
console.log(fertDetails);
};

return (
Expand Down
18 changes: 9 additions & 9 deletions frontend/src/Commons/Forms/InputModules/Fertilizers/FertilizersListComponent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { FC } from 'react';
import { v4 as uuidv4 } from 'uuid';
import { faTrashCan } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import FertilizerInterface from '@Interface/FertilizerInterface';
Expand All @@ -25,7 +26,7 @@ interface FertilizerProps {
const FertilizersListComponent: FC<FertilizerProps> = ({ fertilizerDetails, removeFert }) => (
<StyledFieldInfoList>
{fertilizerDetails.map((fertilizer: FertilizerInterface, index: number) => (
<div key={fertilizer.id}>
<div key={uuidv4()}>
<StyledListContainer hasBorderTop={index !== 0}>
<FertilizerTypeAndFontAwesomeContainer>
<StyledListItem
Expand All @@ -34,11 +35,9 @@ const FertilizersListComponent: FC<FertilizerProps> = ({ fertilizerDetails, remo
>
<h2>Fertilizer Type</h2>
<p>
{
FertilizerTypeOptions.find(
(option) => option.value.toString() === fertilizer.fertilizerTypeId,
)?.label
}
{FertilizerTypeOptions.find(
(option) => option.value.toString() === fertilizer.fertilizerTypeId,
)?.label ?? fertilizer.fertilizerTypeId}
</p>
</StyledListItem>
<DesktopFertilizerGroup>
Expand Down Expand Up @@ -69,7 +68,9 @@ const FertilizersListComponent: FC<FertilizerProps> = ({ fertilizerDetails, remo
) : (
<StyledListItem desktopWidth="300px">
<h2> Fertilizer Name</h2>
<p>{getFertilizerOption(fertilizer.fertilizerId)?.label}</p>
<p>
{getFertilizerOption(fertilizer.fertilizerId)?.label ?? fertilizer.fertilizerId}
</p>
</StyledListItem>
)}
</DesktopFertilizerGroup>
Expand All @@ -86,8 +87,7 @@ const FertilizersListComponent: FC<FertilizerProps> = ({ fertilizerDetails, remo
</FertilizerTypeAndFontAwesomeContainer>

<MobileFertilizerGroup>
{fertilizer.fertilizerTypeId === 'Dry Fertilizer (Custom)' ||
fertilizer.fertilizerTypeId === 'Liquid Fertilizer (Custom)' ? (
{fertilizer.fertilizerTypeId === '2' || fertilizer.fertilizerTypeId === '4' ? (
<StyledCustomFertilizerGroup>
<StyledListItem
desktopWidth="80px"
Expand Down
Loading
Loading