bitburner-src/src/ui/React/AugmentationAccordion.tsx
2021-09-13 20:37:35 -04:00

57 lines
1.3 KiB
TypeScript

/**
* React Component for displaying a single Augmentation as an accordion.
*
* The header of the accordion contains the Augmentation's name (and level, if
* applicable), and the accordion's panel contains the Augmentation's description.
*/
import * as React from "react";
import { BBAccordion } from "./BBAccordion";
import { Augmentation } from "../../Augmentation/Augmentation";
import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
type IProps = {
aug: Augmentation;
level?: number | string | null;
};
export function AugmentationAccordion(props: IProps): React.ReactElement {
let displayName = props.aug.name;
if (props.level != null) {
if (props.aug.name === AugmentationNames.NeuroFluxGovernor) {
displayName += ` - Level ${props.level}`;
}
}
if (typeof props.aug.info === "string") {
return (
<BBAccordion
headerContent={<>{displayName}</>}
panelContent={
<p>
<span dangerouslySetInnerHTML={{ __html: props.aug.info }} />
<br />
<br />
{props.aug.stats}
</p>
}
/>
);
}
return (
<BBAccordion
headerContent={<>{displayName}</>}
panelContent={
<p>
{props.aug.info}
<br />
<br />
{props.aug.stats}
</p>
}
/>
);
}