Make buying inputs possibly undefined

kacan98 · Apr 16, 2024 · 962efb1 · 962efb1
1 parent afe5cfb
commit 962efb1
Show file tree

Hide file tree

Showing 15 changed files with 61 additions and 54 deletions.
diff --git a/public/i18n/cz/translation.json b/public/i18n/cz/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Náklady na koupi a prodej",
   "Buying and selling details": "Detaily koupě a prodeje",
   "Total ownership costs": "Celkové náklady na vlastnictví",
-  "Simply ownership cost over the time of staying": "Jednoduše náklady na vlastnictví během doby pobytu",
   "Capital from selling": "Kapitál z prodeje",
   "Capital from selling details": "Detaily kapitálu z prodeje",
   "Currency": "Měna",
@@ -71,5 +70,6 @@
   "Auto": "Automatický",
   "Light": "Světlý",
   "Dark": "Tmavý",
-  "Mortgage vs Renting value": "Hodnota hypotéky vs nájem"
+  "Mortgage vs Renting value": "Hodnota hypotéky vs nájem",
+  "Buying and renting is equally expensive": "Koupě a nájem jsou stejně drahé"
 }
diff --git a/public/i18n/de/translation.json b/public/i18n/de/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Kauf- und Verkaufskosten",
   "Buying and selling details": "Details zu Kauf und Verkauf",
   "Total ownership costs": "Gesamte Besitzkosten",
-  "Simply ownership cost over the time of staying": "Einfache Besitzkosten über die Zeit des Aufenthalts",
   "Capital from selling": "Kapital aus dem Verkauf",
   "Capital from selling details": "Details zum Kapital aus dem Verkauf",
   "Currency": "Währung",
@@ -71,5 +70,6 @@
   "Auto": "Auto",
   "Light": "Hell",
   "Dark": "Dunkel",
-  "Mortgage vs Renting value": "Hypothek vs Mietwert"
+  "Mortgage vs Renting value": "Hypothek vs Mietwert",
+  "Buying and renting is equally expensive": "Kaufen und Mieten ist gleich teuer"
 }
diff --git a/public/i18n/dk/translation.json b/public/i18n/dk/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Købs- og salgsomkostninger",
   "Buying and selling details": "Detaljer om køb og salg",
   "Total ownership costs": "Samlede ejerskabsomkostninger",
-  "Simply ownership cost over the time of staying": "Enkle ejerskabsomkostninger over opholdstiden",
   "Capital from selling": "Kapital fra salg",
   "Capital from selling details": "Detaljer om kapital fra salg",
   "Currency": "Valuta",
@@ -71,5 +70,6 @@
   "Auto": "Auto",
   "Light": "Lys",
   "Dark": "Mørk",
-  "Mortgage vs Renting value": "Pant kontra lejeværdi"
+  "Mortgage vs Renting value": "Pant kontra lejeværdi",
+  "Buying and renting is equally expensive": "Køb og leje er lige dyrt"
 }
diff --git a/public/i18n/en/translation.json b/public/i18n/en/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Buying and Selling Costs",
   "Buying and selling details": "Buying and Selling Details",
   "Total ownership costs": "Total Ownership Costs",
-  "Simply ownership cost over the time of staying": "Simply Ownership Cost over the Time of Staying",
   "Capital from selling": "Capital from Selling",
   "Capital from selling details": "Details of Capital from Selling",
   "Currency": "Currency",
@@ -71,5 +70,6 @@
   "Auto": "Auto",
   "Light": "Light",
   "Dark": "Dark",
-  "Mortgage vs Renting value": "Mortgage vs Renting Value"
+  "Mortgage vs Renting value": "Mortgage vs Renting Value",
+  "Buying and renting is equally expensive": "Buying and renting is equally expensive"
 }
diff --git a/public/i18n/ro/translation.json b/public/i18n/ro/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Costuri de cumpărare și vânzare",
   "Buying and selling details": "Detalii despre cumpărare și vânzare",
   "Total ownership costs": "Costuri totale de proprietate",
-  "Simply ownership cost over the time of staying": "Simplu cost de proprietate pe durata șederii",
   "Capital from selling": "Capital din vânzare",
   "Capital from selling details": "Detalii capital din vânzare",
   "Currency": "Monedă",
@@ -71,5 +70,6 @@
   "Auto": "Auto",
   "Light": "Luminos",
   "Dark": "Întunecat",
-  "Mortgage vs Renting value": "Valoarea ipotecii vs închiriere"
+  "Mortgage vs Renting value": "Valoarea ipotecii vs închiriere",
+  "Buying and renting is equally expensive": "Cumpărarea și închirierea sunt la fel de scumpe"
 }
diff --git a/public/i18n/se/translation.json b/public/i18n/se/translation.json
@@ -56,7 +56,6 @@
   "Buying and selling costs": "Kostnader för köp och försäljning",
   "Buying and selling details": "Detaljer om köp och försäljning",
   "Total ownership costs": "Totala ägandekostnader",
-  "Simply ownership cost over the time of staying": "Enkla ägandekostnader över tiden för vistelsen",
   "Capital from selling": "Kapital från försäljning",
   "Capital from selling details": "Detaljer om kapital från försäljning",
   "Currency": "Valuta",
@@ -71,5 +70,6 @@
   "Auto": "Auto",
   "Light": "Ljus",
   "Dark": "Mörk",
-  "Mortgage vs Renting value": "Bolån vs Hyra värde"
+  "Mortgage vs Renting value": "Bolån vs Hyra värde",
+  "Buying and renting is equally expensive": "Köp och hyra är lika dyrt"
 }
diff --git a/src/components/inputs/blocks/buying.tsx b/src/components/inputs/blocks/buying.tsx
@@ -21,15 +21,17 @@ function Buying() {
     useCalculatorSlice("buying");
 
   const {
-    propertyPrice,
+    propertyPrice: price,
     propertyValueGrowthPercentage,
     loanTerm,
     interestRate,
     buyingCostsPercentage,
     sellingCostsPercentage,
     yearlyOwnershipCost,
-    depositPercentage,
+    depositPercentage: depositPct,
   } = buyingState;
+  const propertyPrice = price || 0;
+  const depositPercentage = depositPct || 0;
 
   const formatAsCurrency: (value: number) => string =
     useLocaleCurrencyFormatter();
@@ -50,16 +52,16 @@ function Buying() {
   const { totalPrincipalPaid, totalInterestPaid } = simulateTimePassage({
     initialPropertyValue: propertyPrice,
     depositPercentage,
-    yearlyOwnershipCost,
+    yearlyOwnershipCost: yearlyOwnershipCost || 0,
 
-    yearsStaying,
-    loanTerm,
+    yearsStaying: yearsStaying || 0,
+    loanTerm: loanTerm || 0,
 
-    interestRate,
-    loanAmount,
-    propertyValueGrowthPercentage,
-    buyingCostsPercentage,
-    sellingCostsPercentage,
+    interestRate: interestRate || 0,
+    loanAmount: loanAmount || 0,
+    propertyValueGrowthPercentage: propertyValueGrowthPercentage || 0,
+    buyingCostsPercentage: buyingCostsPercentage || 0,
+    sellingCostsPercentage: sellingCostsPercentage || 0,
 
     mortgagePerMonth,
   });

diff --git a/src/components/inputs/blocks/renting.tsx b/src/components/inputs/blocks/renting.tsx
@@ -59,7 +59,7 @@ const Renting = () => {
   const monthlyDifference = mortgagePerMonth - (rentingState.monthlyRent || 0);
 
   const differenceBetweenRentAndMortgageDeposit =
-    mortgageDeposit - rentingState.initialInvestment;
+    mortgageDeposit - (rentingState.initialInvestment || 0);
 
   return (
     <>

diff --git a/src/components/result/blocks/buyingResultBlock.tsx b/src/components/result/blocks/buyingResultBlock.tsx
@@ -46,7 +46,7 @@ function BuyingResultBlock() {
       chart={<BuyingChart graphData={yearValueChanges} />}
       heading={t("labelForYears", {
         rentingOrBuying: t("Buying"),
-        yearsNumber: yearsStaying,
+        yearsNumber: yearsStaying || 0,
         yearOrYears: yearsStaying !== 1 ? t("yearsPlural") : t("yearSingular"),
       })}
       rows={[
@@ -86,9 +86,6 @@ function BuyingResultBlock() {
         {
           label: t("Total ownership costs"),
           value: -1 * totalOwnershipCosts,
-          tooltip: (
-            <div>{t("Simply ownership cost over the time of staying")}</div>
-          ),
         },
         {
           label: t("Capital from selling"),

diff --git a/src/components/result/blocks/rentingResultBlock.tsx b/src/components/result/blocks/rentingResultBlock.tsx
@@ -12,9 +12,10 @@ function RentingResultBlock() {
   const { yearsStaying }: FuturePredictionsState = useSelector(
     (state: RootState) => state.calculator.futurePredictions,
   );
-  const { initialInvestment: rentDeposit }: RentingState = useSelector(
+  const { initialInvestment: deposit }: RentingState = useSelector(
     (state: RootState) => state.calculator.renting,
   );
+  const rentDeposit = deposit || 0;
   const { totalRenting, rentTotal } = useRentDetails();
 
   const alternativeInvestment = useAlternativeInvestmentReturns();
@@ -23,7 +24,7 @@ function RentingResultBlock() {
     <BuyingOrSellingResultWrapper
       heading={t("labelForYears", {
         rentingOrBuying: t("Renting"),
-        yearsNumber: yearsStaying,
+        yearsNumber: yearsStaying || 0,
         yearOrYears: yearsStaying !== 1 ? t("yearsPlural") : t("yearSingular"),
       })}
       rows={[

diff --git a/src/components/result/blocks/resultBlock.tsx b/src/components/result/blocks/resultBlock.tsx
@@ -24,12 +24,19 @@ function ResultBlock() {
         textAlign: "left",
       }}
     >
-      <Typography variant={"h3"} gutterBottom>
-        {t("Buying/renting is cheaper by", {
-          buyingOrRenting: t(buyingIsBetter ? "Buying" : "Renting"),
-          difference: formatAsCurrency(Math.abs(difference)),
-        })}
-      </Typography>
+      {difference !== 0 ? (
+        <Typography variant={"h3"} gutterBottom>
+          {t("Buying/renting is cheaper by", {
+            buyingOrRenting: t(buyingIsBetter ? "Buying" : "Renting"),
+            difference: formatAsCurrency(Math.abs(difference)),
+          })}
+        </Typography>
+      ) : (
+        <Typography variant={"h3"} gutterBottom>
+          {t("Buying and renting is equally expensive")}
+        </Typography>
+      )}
+
       <ResultChart />
     </Box>
   );

diff --git a/src/services/buying/useMortgageDetails.ts b/src/services/buying/useMortgageDetails.ts
@@ -22,14 +22,14 @@ export function useMortgageDetails(): MortgageDetails {
   }: BuyingState = useSelector((state: RootState) => state.calculator.buying);
 
   return calculateMortgageDetails({
-    yearsStaying,
-    depositPercentage,
-    initialPropertyValue: propertyPrice,
-    yearlyOwnershipCost,
-    loanTerm,
-    interestRate,
-    propertyValueGrowthPercentage,
-    buyingCostsPercentage,
-    sellingCostsPercentage,
+    yearsStaying: yearsStaying || 0,
+    depositPercentage: depositPercentage || 0,
+    initialPropertyValue: propertyPrice || 0,
+    yearlyOwnershipCost: yearlyOwnershipCost || 0,
+    loanTerm: loanTerm || 0,
+    interestRate: interestRate || 0,
+    propertyValueGrowthPercentage: propertyValueGrowthPercentage || 0,
+    buyingCostsPercentage: buyingCostsPercentage || 0,
+    sellingCostsPercentage: sellingCostsPercentage || 0,
   });
 }
diff --git a/src/services/useAlternativeInvestment.ts b/src/services/useAlternativeInvestment.ts
@@ -40,7 +40,7 @@ export function useAlternativeInvestmentReturns() {
     calculateInvestmentReturns({
       initialInvestment: initialCash,
       investmentPerPeriod: moneyAvailablePerMonth * 12,
-      numberOfPeriods: yearsStaying,
+      numberOfPeriods: yearsStaying || 0,
       appreciationRate: (alternativeInvestmentReturnPercentage || 0) / 100,
     });
 

diff --git a/store/calculatorSlices/buying.ts b/store/calculatorSlices/buying.ts
@@ -1,14 +1,14 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 
 export interface BuyingState {
-  propertyPrice: number;
-  depositPercentage: number;
-  yearlyOwnershipCost: number;
-  loanTerm: number;
-  interestRate: number;
-  buyingCostsPercentage: number;
-  sellingCostsPercentage: number;
-  propertyValueGrowthPercentage: number;
+  propertyPrice?: number;
+  depositPercentage?: number;
+  yearlyOwnershipCost?: number;
+  loanTerm?: number;
+  interestRate?: number;
+  buyingCostsPercentage?: number;
+  sellingCostsPercentage?: number;
+  propertyValueGrowthPercentage?: number;
 }
 
 const initialState: BuyingState = {

diff --git a/store/calculatorSlices/futurePreditions.ts b/store/calculatorSlices/futurePreditions.ts
@@ -1,7 +1,7 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 
 export interface FuturePredictionsState {
-  yearsStaying: number;
+  yearsStaying?: number;
 }
 
 const initialState: FuturePredictionsState = {