change number format

src/components/expense.js

@@ -53,7 +53,7 @@ const Expense = props => {
           </div>
           <div className="p-2 bd-highlight">
             <div className="h4 cHeader">
-              <strong>{props.total}$</strong>
+              <strong>${props.total}</strong>
             </div>
           </div>
         </div>

src/components/income.js

@@ -53,7 +53,7 @@ const Income = props => {
           </div>
           <div className="p-2 bd-highlight">
             <div className="h4 cHeader">
-              <strong>{props.total}$</strong>
+              <strong>${props.total}</strong>
             </div>
           </div>
         </div>

src/components/stats.js

@@ -2,24 +2,25 @@ import React from "react";
 import { connect } from "react-redux";
 
 const Stats = props => {
-  function amtLeft() {
+  const amtLeft = () => {
     let income = props.income;
     let expense = props.expense;
-    return income - expense;
-  }
+    let amtLeft = income - expense;
+    return amtLeft.toFixed(2);
+  };
   return (
     <div className="d-flex justify-content-center text-center">
       <div className="m-2">
         <strong>Total Income</strong>
-        <p>{props.income}$</p>
+        <p>${props.income}</p>
       </div>
       <div className="m-2">
         <strong>Total Expenses</strong>
-        <p>{props.expense}$</p>
+        <p>${props.expense}</p>
       </div>
       <div className="m-2">
         <strong>Amount Left</strong>
-        <p>{amtLeft()}$</p>
+        <p>${amtLeft()}</p>
       </div>
     </div>
   );

src/components/table/row.js

@@ -45,7 +45,7 @@ const Row = props => {
            */}
         </div>
       </td>
-      <td className="d-flex justify-content-end">{props.value}$</td>
+      <td className="d-flex justify-content-end">${props.value}</td>
     </tr>
   );
 };