UI: Improvements to Create Program tab (#449)

* Progress indicator for programs that are in progress
* Button for a program that is currently being worked (unfocused) is just a refocus button
This commit is contained in:
Minzenkatze 2023-03-28 17:23:36 +02:00 committed by GitHub
parent dadf42bfe8
commit a1441b31f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -86,7 +86,22 @@ export function ProgramsRoot(): React.ReactElement {
(create.req() && <Create sx={{ mr: 1 }} />) || <Lock sx={{ mr: 1 }} />}
{program.name}
</Typography>
{!Player.hasProgram(program.name) && create.req() && (
{!Player.hasProgram(program.name) &&
create.req() &&
(isCreateProgramWork(Player.currentWork) && Player.currentWork?.programName === program.name ? (
//Button if the program is currently being worked on
<Button
sx={{ my: 1, width: "100%" }}
onClick={(event) => {
if (!event.isTrusted) return;
Player.startFocusing();
Router.toPage(Page.Work);
}}
>
Resume focus
</Button>
) : (
//Button if the program is not currently worked on
<Button
sx={{ my: 1, width: "100%" }}
onClick={(event) => {
@ -101,7 +116,7 @@ export function ProgramsRoot(): React.ReactElement {
>
Create program
</Button>
)}
))}
{Player.hasProgram(program.name) || getHackingLevelRemaining(create.level) === 0 || (
<Typography color={Settings.theme.hack}>
<b>Unlocks in:</b> {getHackingLevelRemaining(create.level)} hacking levels
@ -112,6 +127,13 @@ export function ProgramsRoot(): React.ReactElement {
<b>Current completion:</b> {curCompletion}%
</Typography>
)}
{/*Displays the current completion of the program currently being created*/}
{isCreateProgramWork(Player.currentWork) && Player.currentWork?.programName === program.name && (
<Typography color={Settings.theme.infolight}>
<b>Current completion:</b>{" "}
{((100 * Player.currentWork.unitCompleted) / Player.currentWork.unitNeeded()).toFixed(2)}%
</Typography>
)}
<Typography>{create.tooltip}</Typography>
</>
</Box>