improve market ta ui

This commit is contained in:
Olivier Gagnon 2021-10-14 18:05:17 -04:00
parent 139ccd11ff
commit 542b2d6b8a
3 changed files with 51 additions and 52 deletions

@ -20,7 +20,7 @@ export function IndustryProductEquation(props: IProps): React.ReactElement {
return ( return (
<MathJaxContext> <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> </MathJaxContext>
); );
} }

@ -76,11 +76,6 @@ function MarketTA2(props: IMarketTA2Props): React.ReactElement {
</Tooltip> </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 // Create a popup that lets the player use the Market TA research for Materials
export function MaterialMarketTaModal(props: IProps): React.ReactElement { export function MaterialMarketTaModal(props: IProps): React.ReactElement {
const division = useDivision();
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
function rerender(): void { function rerender(): void {
setRerender((old) => !old); setRerender((old) => !old);
@ -106,11 +102,13 @@ export function MaterialMarketTaModal(props: IProps): React.ReactElement {
return ( return (
<Modal open={props.open} onClose={props.onClose}> <Modal open={props.open} onClose={props.onClose}>
{!division.hasResearch("Market-TA.II") && (
<>
<Typography variant="h4">Market-TA.I</Typography> <Typography variant="h4">Market-TA.I</Typography>
<Typography> <Typography>
The maximum sale price you can mark this up to is {numeralWrapper.formatMoney(props.mat.bCost + markupLimit)}. The maximum sale price you can mark this up to is{" "}
This means that if you set the sale price higher than this, you will begin to experience a loss in number of {numeralWrapper.formatMoney(props.mat.bCost + markupLimit)}. This means that if you set the sale price
sales higher than this, you will begin to experience a loss in number of sales
</Typography> </Typography>
<FormControlLabel <FormControlLabel
@ -119,8 +117,8 @@ export function MaterialMarketTaModal(props: IProps): React.ReactElement {
<Tooltip <Tooltip
title={ title={
<Typography> <Typography>
If this is enabled, then this Material will automatically be sold at the price identified by Market-TA.I If this is enabled, then this Material will automatically be sold at the price identified by
(i.e. the price shown above) Market-TA.I (i.e. the price shown above)
</Typography> </Typography>
} }
> >
@ -128,6 +126,8 @@ export function MaterialMarketTaModal(props: IProps): React.ReactElement {
</Tooltip> </Tooltip>
} }
/> />
</>
)}
<MarketTA2 mat={props.mat} /> <MarketTA2 mat={props.mat} />
</Modal> </Modal>
); );

@ -66,11 +66,6 @@ function MarketTA2(props: ITa2Props): React.ReactElement {
</Tooltip> </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 // Create a popup that lets the player use the Market TA research for Products
export function ProductMarketTaModal(props: IProps): React.ReactElement { export function ProductMarketTaModal(props: IProps): React.ReactElement {
const division = useDivision();
const markupLimit = props.product.rat / props.product.mku; const markupLimit = props.product.rat / props.product.mku;
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
function rerender(): void { function rerender(): void {
@ -96,6 +92,8 @@ export function ProductMarketTaModal(props: IProps): React.ReactElement {
return ( return (
<Modal open={props.open} onClose={props.onClose}> <Modal open={props.open} onClose={props.onClose}>
{!division.hasResearch("Market-TA.II") && (
<>
<Typography variant="h4">Market-TA.I</Typography> <Typography variant="h4">Market-TA.I</Typography>
<Typography> <Typography>
The maximum sale price you can mark this up to is{" "} The maximum sale price you can mark this up to is{" "}
@ -109,8 +107,8 @@ export function ProductMarketTaModal(props: IProps): React.ReactElement {
<Tooltip <Tooltip
title={ title={
<Typography> <Typography>
If this is enabled, then this Material will automatically be sold at the price identified by Market-TA.I If this is enabled, then this Material will automatically be sold at the price identified by
(i.e. the price shown above) Market-TA.I (i.e. the price shown above)
</Typography> </Typography>
} }
> >
@ -118,7 +116,8 @@ export function ProductMarketTaModal(props: IProps): React.ReactElement {
</Tooltip> </Tooltip>
} }
/> />
</>
)}
<MarketTA2 product={props.product} /> <MarketTA2 product={props.product} />
</Modal> </Modal>
); );