Merge branch 'main' into client-version

client/src/components/common/styledValue.jsx

@@ -6,26 +6,42 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import getCommaSepNum from "../../utils/getCommaSepNum";
 
+function getChevron(percentChange) {
+  const chevron = isNaN(percentChange)
+    ? null
+    : percentChange > 0
+    ? faChevronUp
+    : percentChange < 0
+    ? faChevronDown
+    : faMinus;
+
+  return chevron;
+}
+
+// checks for values
+function checkValidation(value) {
+  const valid =
+    isFinite(value) && !isNaN(value) && value !== null && value !== 0 && true;
+  return valid;
+}
+
 function StyledValue({ value, percentChange, change = "" }) {
-  const chevron =
-    percentChange > 0
-      ? faChevronUp
-      : percentChange < 0
-      ? faChevronDown
-      : faMinus;
+  const chevron = getChevron(percentChange);
   const color =
     percentChange > 0 ? "green" : percentChange < 0 ? "red" : "black";
 
   return (
     <div className="styled-value" style={{ color }}>
       <span className="symbol">
-        <FontAwesomeIcon icon={chevron} />
+        {chevron && <FontAwesomeIcon icon={chevron} />}
       </span>
       <span className="value">{getCommaSepNum(value)}</span>
-      {percentChange !== 0 && !isNaN(percentChange) && (
+      {checkValidation(percentChange) && (
         <span className="percent">({percentChange})</span>
       )}
-      {change !== 0 && <span className="change">{getCommaSepNum(change)}</span>}
+      {checkValidation(change) && (
+        <span className="change">{getCommaSepNum(change)}</span>
+      )}
     </div>
   );
 }

client/src/components/portfolio/portfolioHistory.jsx

@@ -1,8 +1,8 @@
 import _ from "lodash";
 import React, { useState, useEffect } from "react";
-import { saveOverallHistory } from "../../services/historyService";
 import { updateHistoryRecord } from "../../actions";
 import Table from "../tables/table/table";
+import { saveOverallHistory } from "../../services/historyService";
 import TableContainer from "../tables/assetsTable/tableContainer";
 import TimeFrameSelect from "../common/timeFrameSelect";
 import ResultsNumSelect from "./resultsNumSelect";

client/src/components/tables/table/table.jsx

@@ -24,8 +24,9 @@ function Table({
     [sortCol.col, extraSortField].filter(Boolean).join("."),
     sortCol.dir
   );
+
   const styledData = styleFunction
-    ? styleFunction(sortedData).reverse()
+    ? styleFunction(sortedData, ["id"]).reverse()
     : sortedData;
 
   // if no pageSize is provided then pagination will be off

client/src/components/tables/table/tableBody.jsx

@@ -3,10 +3,13 @@ import { getCommaSepNum } from "../../../utils";
 
 function getCellContent(column, row, rowIndex) {
   let cellContent = row[column.name];
+
   if (column.name === "rowNum") {
     cellContent = rowIndex + 1;
   } else if (typeof +cellContent === "number" && !isNaN(+cellContent)) {
     cellContent = getCommaSepNum(row[column.name]);
+  } else if (cellContent === undefined) {
+    return 0;
   }
 
   return cellContent;

client/src/utils/getCommaSepNum.js

@@ -1,5 +1,6 @@
 function getCommaSepNum(num) {
   const inputType = typeof num;
+
   if (inputType === "string" || inputType === "number") {
     return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
   }

client/src/utils/getDateId.js

@@ -1,15 +1,14 @@
 import { utils } from "react-modern-calendar-datepicker";
 
 // returns date id by persian format
-function getDateId() {
+function getDateId(date = utils("fa").getToday()) {
   //adding zero to the beggining for consistency in dates
   const lengthOfNumbers = { year: 4, month: 2, day: 2 };
-  const today = utils("fa").getToday();
-  for (let key in today) {
-    today[key] = String(today[key]).padStart(lengthOfNumbers[key], "0");
+  for (let key in date) {
+    date[key] = String(date[key]).padStart(lengthOfNumbers[key], "0");
   }
 
-  return Object.values(today).join("-");
+  return Object.values(date).join("-");
 }
 
 export default getDateId;

client/src/utils/getStyledData.js

@@ -1,7 +1,7 @@
-import StyledValue from "./styledValue";
+import StyledValue from "../components/common/styledValue";
 
 // returns styled data for table cells
-export function getStyledData(dataWithChanges, nuetralCols = []) {
+export default function getStyledData(dataWithChanges, nuetralCols = []) {
   return dataWithChanges.map(({ ...row }) => {
     for (let key in row) {
       // check for columns with no change

client/src/utils/index.js

@@ -6,6 +6,6 @@ export { default as getDataWithChange } from "./getDataWithChange";
 export { default as getPercentChange } from "./getPercentChange";
 export { default as getMarketPriceData } from "./getMarketPrice";
 export { default as getPaginatedData } from "./getPaginatedData";
-export { default as getStyledData } from "./getPaginatedData";
+export { default as getStyledData } from "./getStyledData";
 
 export { default as columns } from "./columns";