From 542b2d6b8afe2effda192e5196b5663cf840a10a Mon Sep 17 00:00:00 2001
From: Olivier Gagnon <oli.gagnon4418@gmail.com>
Date: Thu, 14 Oct 2021 18:05:17 -0400
Subject: [PATCH] improve market ta ui

---
 .../ui/IndustryProductEquation.tsx            |  2 +-
 src/Corporation/ui/MaterialMarketTaModal.tsx  | 50 +++++++++---------
 src/Corporation/ui/ProductMarketTaModal.tsx   | 51 +++++++++----------
 3 files changed, 51 insertions(+), 52 deletions(-)

diff --git a/src/Corporation/ui/IndustryProductEquation.tsx b/src/Corporation/ui/IndustryProductEquation.tsx
index e641148c6..b738cbc75 100644
--- a/src/Corporation/ui/IndustryProductEquation.tsx
+++ b/src/Corporation/ui/IndustryProductEquation.tsx
@@ -20,7 +20,7 @@ export function IndustryProductEquation(props: IProps): React.ReactElement {
 
   return (
     <MathJaxContext>
-      <MathJax>{"\\(" + reqs.join("+") + `\\Rightarrow` + prod.map((p) => `1\\text{ }${p}`).join("+") + "\\)"}</MathJax>
+      <MathJax>{"\\(" + reqs.join("+") + `\\Rightarrow` + prod.map((p) => `1 \\text{${p}}`).join("+") + "\\)"}</MathJax>
     </MathJaxContext>
   );
 }
diff --git a/src/Corporation/ui/MaterialMarketTaModal.tsx b/src/Corporation/ui/MaterialMarketTaModal.tsx
index 79bb652ff..ca2e5d2cf 100644
--- a/src/Corporation/ui/MaterialMarketTaModal.tsx
+++ b/src/Corporation/ui/MaterialMarketTaModal.tsx
@@ -76,11 +76,6 @@ function MarketTA2(props: IMarketTA2Props): React.ReactElement {
           </Tooltip>
         }
       />
-
-      <Typography>
-        Note that Market-TA.II overrides Market-TA.I. This means that if both are enabled, then Market-TA.II will take
-        effect, not Market-TA.I
-      </Typography>
     </>
   );
 }
@@ -93,6 +88,7 @@ interface IProps {
 
 // Create a popup that lets the player use the Market TA research for Materials
 export function MaterialMarketTaModal(props: IProps): React.ReactElement {
+  const division = useDivision();
   const setRerender = useState(false)[1];
   function rerender(): void {
     setRerender((old) => !old);
@@ -106,28 +102,32 @@ export function MaterialMarketTaModal(props: IProps): React.ReactElement {
 
   return (
     <Modal open={props.open} onClose={props.onClose}>
-      <Typography variant="h4">Market-TA.I</Typography>
-      <Typography>
-        The maximum sale price you can mark this up to is {numeralWrapper.formatMoney(props.mat.bCost + markupLimit)}.
-        This means that if you set the sale price higher than this, you will begin to experience a loss in number of
-        sales
-      </Typography>
+      {!division.hasResearch("Market-TA.II") && (
+        <>
+          <Typography variant="h4">Market-TA.I</Typography>
+          <Typography>
+            The maximum sale price you can mark this up to is{" "}
+            {numeralWrapper.formatMoney(props.mat.bCost + markupLimit)}. This means that if you set the sale price
+            higher than this, you will begin to experience a loss in number of sales
+          </Typography>
 
-      <FormControlLabel
-        control={<Switch checked={props.mat.marketTa1} onChange={onMarketTA1} />}
-        label={
-          <Tooltip
-            title={
-              <Typography>
-                If this is enabled, then this Material will automatically be sold at the price identified by Market-TA.I
-                (i.e. the price shown above)
-              </Typography>
+          <FormControlLabel
+            control={<Switch checked={props.mat.marketTa1} onChange={onMarketTA1} />}
+            label={
+              <Tooltip
+                title={
+                  <Typography>
+                    If this is enabled, then this Material will automatically be sold at the price identified by
+                    Market-TA.I (i.e. the price shown above)
+                  </Typography>
+                }
+              >
+                <Typography>Use Market-TA.I for Auto-Sale Price</Typography>
+              </Tooltip>
             }
-          >
-            <Typography>Use Market-TA.I for Auto-Sale Price</Typography>
-          </Tooltip>
-        }
-      />
+          />
+        </>
+      )}
       <MarketTA2 mat={props.mat} />
     </Modal>
   );
diff --git a/src/Corporation/ui/ProductMarketTaModal.tsx b/src/Corporation/ui/ProductMarketTaModal.tsx
index fffe99bd9..eab66f3f9 100644
--- a/src/Corporation/ui/ProductMarketTaModal.tsx
+++ b/src/Corporation/ui/ProductMarketTaModal.tsx
@@ -66,11 +66,6 @@ function MarketTA2(props: ITa2Props): React.ReactElement {
           </Tooltip>
         }
       />
-
-      <Typography>
-        Note that Market-TA.II overrides Market-TA.I. This means that if both are enabled, then Market-TA.II will take
-        effect, not Market-TA.I
-      </Typography>
     </>
   );
 }
@@ -83,6 +78,7 @@ interface IProps {
 
 // Create a popup that lets the player use the Market TA research for Products
 export function ProductMarketTaModal(props: IProps): React.ReactElement {
+  const division = useDivision();
   const markupLimit = props.product.rat / props.product.mku;
   const setRerender = useState(false)[1];
   function rerender(): void {
@@ -96,29 +92,32 @@ export function ProductMarketTaModal(props: IProps): React.ReactElement {
 
   return (
     <Modal open={props.open} onClose={props.onClose}>
-      <Typography variant="h4">Market-TA.I</Typography>
-      <Typography>
-        The maximum sale price you can mark this up to is{" "}
-        {numeralWrapper.formatMoney(props.product.pCost + markupLimit)}. This means that if you set the sale price
-        higher than this, you will begin to experience a loss in number of sales
-      </Typography>
+      {!division.hasResearch("Market-TA.II") && (
+        <>
+          <Typography variant="h4">Market-TA.I</Typography>
+          <Typography>
+            The maximum sale price you can mark this up to is{" "}
+            {numeralWrapper.formatMoney(props.product.pCost + markupLimit)}. This means that if you set the sale price
+            higher than this, you will begin to experience a loss in number of sales
+          </Typography>
 
-      <FormControlLabel
-        control={<Switch checked={props.product.marketTa1} onChange={onChange} />}
-        label={
-          <Tooltip
-            title={
-              <Typography>
-                If this is enabled, then this Material will automatically be sold at the price identified by Market-TA.I
-                (i.e. the price shown above)
-              </Typography>
+          <FormControlLabel
+            control={<Switch checked={props.product.marketTa1} onChange={onChange} />}
+            label={
+              <Tooltip
+                title={
+                  <Typography>
+                    If this is enabled, then this Material will automatically be sold at the price identified by
+                    Market-TA.I (i.e. the price shown above)
+                  </Typography>
+                }
+              >
+                <Typography>Use Market-TA.I for Auto-Sale Price</Typography>
+              </Tooltip>
             }
-          >
-            <Typography>Use Market-TA.I for Auto-Sale Price</Typography>
-          </Tooltip>
-        }
-      />
-
+          />
+        </>
+      )}
       <MarketTA2 product={props.product} />
     </Modal>
   );