Refactored target percentage to use redux and only be calculated once per job.

src/components/molecules/jobs-targets-stats/jobs-targets-stats.molecule.jsx

@@ -1,10 +1,27 @@
 import { Skeleton, Statistic } from "antd";
 import Dinero from "dinero.js";
 import React, { useMemo } from "react";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectSelectedJobTargetPc } from "../../../redux/application/application.selectors";
 import ErrorResultAtom from "../../atoms/error-result/error-result.atom";
-import TargetPriceDiffPcAtom from "../../atoms/target-price-diff/target-price-diff-pc.atom";
 
-export default function JobsTargetsStatsMolecule({ loading, job }) {
+const mapStateToProps = createStructuredSelector({
+  selectedJobTargetPc: selectSelectedJobTargetPc,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JobsTargetsStatsMolecule);
+
+export function JobsTargetsStatsMolecule({
+  loading,
+  job,
+  selectedJobTargetPc,
+}) {
   const currentRpsDollars = useMemo(() => {
     if (!job) {
       return 0;
@@ -44,8 +61,20 @@ export default function JobsTargetsStatsMolecule({ loading, job }) {
         marginBottom: "1rem",
       }}
     >
-      <TargetPriceDiffPcAtom v_age={job.v_age} group={job.group} />
-      <Statistic title="Current RPS %" value={currentRpsPc} suffix="%" />
+      <Statistic
+        title="Target RPS %"
+        value={(selectedJobTargetPc * 100).toFixed(1)}
+        suffix="%"
+      />
+      <Statistic
+        title="Current RPS %"
+        valueStyle={{
+          color:
+            selectedJobTargetPc * 100 > currentRpsPc ? "tomato" : "seagreen",
+        }}
+        value={currentRpsPc}
+        suffix="%"
+      />
       <Statistic title="Current RPS $" value={currentRpsDollars.toFormat()} />
     </div>
   );