From c5713fa6d88c7bae63adca7e54a3d7510eddc9b5 Mon Sep 17 00:00:00 2001 From: Olivier Gagnon Date: Wed, 29 Sep 2021 01:49:22 -0400 Subject: [PATCH] learned and implemented default props --- src/Bladeburner/ui/ActionLevel.tsx | 10 +-- src/Bladeburner/ui/Console.tsx | 1 - src/Bladeburner/ui/KillIcon.tsx | 6 +- src/Bladeburner/ui/Stats.tsx | 7 +- src/Bladeburner/ui/StealthIcon.tsx | 6 +- src/Bladeburner/ui/TeamSizeModal.tsx | 9 +- src/Corporation/ui/BribeFactionModal.tsx | 6 +- src/Corporation/ui/CityTab.tsx | 20 ----- src/Corporation/ui/CityTabs.tsx | 84 +++++-------------- src/Corporation/ui/Context.ts | 4 + src/Corporation/ui/CorporationRoot.tsx | 26 +++--- src/Corporation/ui/CreateCorporationModal.tsx | 2 +- src/Corporation/ui/ExpandIndustryTab.tsx | 11 +-- ...pandNewCityPopup.tsx => ExpandNewCity.tsx} | 45 +++++----- src/Corporation/ui/GoPublicModal.tsx | 1 - src/Corporation/ui/Industry.tsx | 29 ++++--- src/Corporation/ui/IssueDividendsModal.tsx | 1 - src/Corporation/ui/IssueNewSharesModal.tsx | 2 +- src/Corporation/ui/MainPanel.tsx | 11 +-- src/Corporation/ui/Overview.tsx | 16 +--- src/DevMenu/ui/Companies.tsx | 2 +- src/DevMenu/ui/Factions.tsx | 1 - src/DevMenu/ui/Servers.tsx | 2 +- src/Faction/ui/DonateOption.tsx | 1 - src/Faction/ui/PurchaseableAugmentation.tsx | 8 +- src/Locations/ui/ApplyToJobButton.tsx | 5 +- src/Locations/ui/CompanyLocation.tsx | 2 - src/Locations/ui/SlumsLocation.tsx | 24 +++--- .../Sleeve/ui/CovenantSleeveMemoryUpgrade.tsx | 2 +- .../Sleeve/ui/SleeveAugmentationsModal.tsx | 4 +- src/PersonObjects/Sleeve/ui/SleeveElem.tsx | 6 +- src/PersonObjects/Sleeve/ui/TaskSelector.tsx | 6 +- src/Programs/ui/ProgramsRoot.tsx | 2 +- src/ScriptEditor/ui/OptionsModal.tsx | 7 +- src/ScriptEditor/ui/Root.tsx | 2 +- src/Terminal/ui/TerminalInput.tsx | 1 - src/ui/ActiveScripts/ServerAccordions.tsx | 2 - src/ui/React/GameOptionsRoot.tsx | 29 +------ src/ui/React/ServerDropdown.tsx | 2 +- src/ui/React/Theme.tsx | 11 +++ src/ui/React/ThemeEditorModal.tsx | 1 - 41 files changed, 137 insertions(+), 280 deletions(-) delete mode 100644 src/Corporation/ui/CityTab.tsx rename src/Corporation/ui/{ExpandNewCityPopup.tsx => ExpandNewCity.tsx} (50%) diff --git a/src/Bladeburner/ui/ActionLevel.tsx b/src/Bladeburner/ui/ActionLevel.tsx index deab6d4d5..a4ffdaa8a 100644 --- a/src/Bladeburner/ui/ActionLevel.tsx +++ b/src/Bladeburner/ui/ActionLevel.tsx @@ -54,18 +54,12 @@ export function ActionLevel({ action, isActive, bladeburner, rerender }: IProps) - WARNING: changing the level will restart the Operation : ""} - > + WARNING: changing the level will restart the Operation : ""}> - WARNING: changing the level will restart the Operation : ""} - > + WARNING: changing the level will restart the Operation : ""}> diff --git a/src/Bladeburner/ui/Console.tsx b/src/Bladeburner/ui/Console.tsx index eadab9dfd..48ca32bc1 100644 --- a/src/Bladeburner/ui/Console.tsx +++ b/src/Bladeburner/ui/Console.tsx @@ -148,7 +148,6 @@ export function Console(props: IProps): React.ReactElement { This action involves retirement}> - {killIcon} - - ); + return This action involves retirement}>{killIcon}; } diff --git a/src/Bladeburner/ui/Stats.tsx b/src/Bladeburner/ui/Stats.tsx index 8e0e1ad50..4b38c62f2 100644 --- a/src/Bladeburner/ui/Stats.tsx +++ b/src/Bladeburner/ui/Stats.tsx @@ -46,14 +46,13 @@ export function Stats(props: IProps): React.ReactElement { return ( - Your rank within the Bladeburner division.}> + Your rank within the Bladeburner division.}> Rank: {formatNumber(props.bladeburner.rank, 2)}
Performing actions will use up your stamina. @@ -97,7 +96,6 @@ export function Stats(props: IProps): React.ReactElement { Current City: {props.bladeburner.city} This is your Bladeburner division's estimate of how many Synthoids exist in your current city. An accurate @@ -113,7 +111,6 @@ export function Stats(props: IProps): React.ReactElement {
This is your Bladeburner divison's estimate of how many Synthoid communities exist in your current city. @@ -128,7 +125,6 @@ export function Stats(props: IProps): React.ReactElement {
The city's chaos level due to tensions and conflicts between humans and Synthoids. Having too high of a @@ -144,7 +140,6 @@ export function Stats(props: IProps): React.ReactElement { <> You gain bonus time while offline or when the game is inactive (e.g. when the tab is throttled by diff --git a/src/Bladeburner/ui/StealthIcon.tsx b/src/Bladeburner/ui/StealthIcon.tsx index 19029b82d..d0613cc8e 100644 --- a/src/Bladeburner/ui/StealthIcon.tsx +++ b/src/Bladeburner/ui/StealthIcon.tsx @@ -5,9 +5,5 @@ import Typography from "@mui/material/Typography"; import Tooltip from "@mui/material/Tooltip"; export function StealthIcon(): React.ReactElement { - return ( - This action involves stealth}> - {stealthIcon} - - ); + return This action involves stealth}>{stealthIcon}; } diff --git a/src/Bladeburner/ui/TeamSizeModal.tsx b/src/Bladeburner/ui/TeamSizeModal.tsx index af832f23a..743f864aa 100644 --- a/src/Bladeburner/ui/TeamSizeModal.tsx +++ b/src/Bladeburner/ui/TeamSizeModal.tsx @@ -40,14 +40,7 @@ export function TeamSizeModal(props: IProps): React.ReactElement { Enter the amount of team members you would like to take on this Op. If you do not have the specified number of team members, then as many as possible will be used. Note that team members may be lost during operations. - + diff --git a/src/Corporation/ui/BribeFactionModal.tsx b/src/Corporation/ui/BribeFactionModal.tsx index 4844d3368..c91f3ec89 100644 --- a/src/Corporation/ui/BribeFactionModal.tsx +++ b/src/Corporation/ui/BribeFactionModal.tsx @@ -89,7 +89,7 @@ export function BribeFactionModal(props: IProps): React.ReactElement { Faction: - {player.factions.map((name: string) => { const info = Factions[name].getInfo(); if (!info.offersWork()) return; @@ -102,8 +102,8 @@ export function BribeFactionModal(props: IProps): React.ReactElement { {getRepText(money ? money : 0, stock ? stock : 0)} - - + + diff --git a/src/Corporation/ui/CityTab.tsx b/src/Corporation/ui/CityTab.tsx deleted file mode 100644 index 4fb9ecac0..000000000 --- a/src/Corporation/ui/CityTab.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from "react"; - -interface IProps { - onClick: () => void; - name: string; - current: boolean; -} - -export function CityTab(props: IProps): React.ReactElement { - let className = "cmpy-mgmt-city-tab"; - if (props.current) { - className += " current"; - } - - return ( - - ); -} diff --git a/src/Corporation/ui/CityTabs.tsx b/src/Corporation/ui/CityTabs.tsx index 66bde1f0b..7712fca07 100644 --- a/src/Corporation/ui/CityTabs.tsx +++ b/src/Corporation/ui/CityTabs.tsx @@ -1,87 +1,47 @@ // React Components for the Corporation UI's City navigation tabs // These allow player to navigate between different cities for each industry import React, { useState } from "react"; -import { CityTab } from "./CityTab"; -import { ExpandNewCityPopup } from "./ExpandNewCityPopup"; -import { createPopup } from "../../ui/React/createPopup"; -import { ICorporation } from "../ICorporation"; -import { IIndustry } from "../IIndustry"; import { OfficeSpace } from "../OfficeSpace"; import { Industry } from "./Industry"; -import { IPlayer } from "../../PersonObjects/IPlayer"; - -interface IExpandButtonProps { - corp: ICorporation; - division: IIndustry; - setCity: (name: string) => void; -} - -function ExpandButton(props: IExpandButtonProps): React.ReactElement { - function openExpandNewCityModal(): void { - const popupId = "cmpy-mgmt-expand-city-popup"; - createPopup(popupId, ExpandNewCityPopup, { - popupId: popupId, - corp: props.corp, - division: props.division, - cityStateSetter: props.setCity, - }); - } - - const possibleCities = Object.keys(props.division.offices).filter( - (cityName: string) => props.division.offices[cityName] === 0, - ); - if (possibleCities.length === 0) return <>; - - return ( - - ); -} +import { ExpandNewCity } from "./ExpandNewCity"; +import { useDivision } from "./Context"; +import Tabs from "@mui/material/Tabs"; +import Tab from "@mui/material/Tab"; interface IProps { city: string; - division: IIndustry; - corp: ICorporation; - player: IPlayer; rerender: () => void; } export function CityTabs(props: IProps): React.ReactElement { + const division = useDivision(); const [city, setCity] = useState(props.city); - const office = props.division.offices[city]; + const office = division.offices[city]; if (office === 0) { setCity("Sector-12"); return <>; } + const canExpand = + Object.keys(division.offices).filter((cityName: string) => division.offices[cityName] === 0).length > 0; + function handleChange(event: React.SyntheticEvent, tab: string): void { + setCity(tab); + } return ( <> - {Object.values(props.division.offices).map( - (office: OfficeSpace | 0) => - office !== 0 && ( - setCity(office.loc)} - /> - ), + + {Object.values(division.offices).map( + (office: OfficeSpace | 0) => office !== 0 && , + )} + {canExpand && } + + + {city !== "Expand" ? ( + + ) : ( + )} - - ); } diff --git a/src/Corporation/ui/Context.ts b/src/Corporation/ui/Context.ts index 6fe5720be..59d5a7802 100644 --- a/src/Corporation/ui/Context.ts +++ b/src/Corporation/ui/Context.ts @@ -1,10 +1,14 @@ import React, { useContext } from "react"; import { ICorporation } from "../ICorporation"; +import { IIndustry } from "../IIndustry"; export const Context: { Corporation: React.Context; + Division: React.Context; } = { Corporation: React.createContext({} as ICorporation), + Division: React.createContext({} as IIndustry), }; export const useCorporation = () => useContext(Context.Corporation); +export const useDivision = () => useContext(Context.Division); diff --git a/src/Corporation/ui/CorporationRoot.tsx b/src/Corporation/ui/CorporationRoot.tsx index c3538ff75..7f446753d 100644 --- a/src/Corporation/ui/CorporationRoot.tsx +++ b/src/Corporation/ui/CorporationRoot.tsx @@ -38,20 +38,18 @@ export function CorporationRoot(): React.ReactElement { return ( -
- - - {corporation.divisions.map((div) => ( - - ))} - {canExpand && } - - {divisionName === "Overview" && } - {divisionName === -1 && } - {typeof divisionName === "string" && divisionName !== "Overview" && ( - - )} -
+ + + {corporation.divisions.map((div) => ( + + ))} + {canExpand && } + + {divisionName === "Overview" && } + {divisionName === -1 && } + {typeof divisionName === "string" && divisionName !== "Overview" && ( + + )} ); } diff --git a/src/Corporation/ui/CreateCorporationModal.tsx b/src/Corporation/ui/CreateCorporationModal.tsx index 272b7d90c..928c0b9b7 100644 --- a/src/Corporation/ui/CreateCorporationModal.tsx +++ b/src/Corporation/ui/CreateCorporationModal.tsx @@ -63,7 +63,7 @@ export function CreateCorporationModal(props: IProps): React.ReactElement {
If you would like to start one, please enter a name for your corporation below: - + diff --git a/src/Corporation/ui/ExpandIndustryTab.tsx b/src/Corporation/ui/ExpandIndustryTab.tsx index 2f63a2b3f..61e6f0f5f 100644 --- a/src/Corporation/ui/ExpandIndustryTab.tsx +++ b/src/Corporation/ui/ExpandIndustryTab.tsx @@ -59,7 +59,7 @@ export function ExpandIndustryTab(props: IProps): React.ReactElement { return ( <> Create a new division to expand into a new industry: - {possibleIndustries.map((industry: string) => ( {industry} @@ -73,14 +73,7 @@ export function ExpandIndustryTab(props: IProps): React.ReactElement { Division name: - + diff --git a/src/Corporation/ui/ExpandNewCityPopup.tsx b/src/Corporation/ui/ExpandNewCity.tsx similarity index 50% rename from src/Corporation/ui/ExpandNewCityPopup.tsx rename to src/Corporation/ui/ExpandNewCity.tsx index 6e846c3c0..80336360f 100644 --- a/src/Corporation/ui/ExpandNewCityPopup.tsx +++ b/src/Corporation/ui/ExpandNewCity.tsx @@ -1,26 +1,27 @@ import React, { useRef } from "react"; -import { IIndustry } from "../IIndustry"; import { CorporationConstants } from "../data/Constants"; -import { removePopup } from "../../ui/React/createPopup"; import { dialogBoxCreate } from "../../ui/React/DialogBox"; -import { ICorporation } from "../ICorporation"; import { NewCity } from "../Actions"; import { MoneyCost } from "./MoneyCost"; +import { useCorporation, useDivision } from "./Context"; +import Typography from "@mui/material/Typography"; +import MenuItem from "@mui/material/MenuItem"; +import Select, { SelectChangeEvent } from "@mui/material/Select"; +import Button from "@mui/material/Button"; interface IProps { - popupId: string; - corp: ICorporation; - division: IIndustry; cityStateSetter: (city: string) => void; } -export function ExpandNewCityPopup(props: IProps): React.ReactElement { +export function ExpandNewCity(props: IProps): React.ReactElement { + const corp = useCorporation(); + const division = useDivision(); const dropdown = useRef(null); function expand(): void { if (dropdown.current === null) return; try { - NewCity(props.corp, props.division, dropdown.current.value); + NewCity(corp, division, dropdown.current.value); } catch (err) { dialogBoxCreate(err + ""); return; @@ -29,31 +30,25 @@ export function ExpandNewCityPopup(props: IProps): React.ReactElement { dialogBoxCreate(`Opened a new office in ${dropdown.current.value}!`); props.cityStateSetter(dropdown.current.value); - removePopup(props.popupId); } return ( <> -

+ Would you like to expand into a new city by opening an office? This would cost{" "} - -

- + {Object.keys(division.offices) + .filter((cityName: string) => division.offices[cityName] === 0) .map((cityName: string) => ( - + ))} - - + ); } diff --git a/src/Corporation/ui/GoPublicModal.tsx b/src/Corporation/ui/GoPublicModal.tsx index 7ec482ad7..e2bf55333 100644 --- a/src/Corporation/ui/GoPublicModal.tsx +++ b/src/Corporation/ui/GoPublicModal.tsx @@ -64,7 +64,6 @@ export function GoPublicModal(props: IProps): React.ReactElement { void; } export function Industry(props: IProps): React.ReactElement { + const player = use.Player(); + const corp = useCorporation(); + const division = useDivision(); return (
diff --git a/src/Corporation/ui/IssueDividendsModal.tsx b/src/Corporation/ui/IssueDividendsModal.tsx index c5ce67c39..37dcac400 100644 --- a/src/Corporation/ui/IssueDividendsModal.tsx +++ b/src/Corporation/ui/IssueDividendsModal.tsx @@ -69,7 +69,6 @@ export function IssueDividendsModal(props: IProps): React.ReactElement { per second before taxes. - + diff --git a/src/Corporation/ui/MainPanel.tsx b/src/Corporation/ui/MainPanel.tsx index 4e548d080..a1f0aac20 100644 --- a/src/Corporation/ui/MainPanel.tsx +++ b/src/Corporation/ui/MainPanel.tsx @@ -6,7 +6,7 @@ import React from "react"; import { CityTabs } from "./CityTabs"; import { IIndustry } from "../IIndustry"; import { useCorporation } from "./Context"; -import { use } from "../../ui/Context"; +import { Context } from "./Context"; import { CityName } from "../../Locations/data/CityNames"; @@ -16,7 +16,6 @@ interface IProps { } export function MainPanel(props: IProps): React.ReactElement { - const player = use.Player(); const corp = useCorporation(); const division = props.divisionName !== "Overview" @@ -25,8 +24,10 @@ export function MainPanel(props: IProps): React.ReactElement { if (division === undefined) throw new Error("Cannot find division"); return ( -
- -
+ +
+ +
+ ); } diff --git a/src/Corporation/ui/Overview.tsx b/src/Corporation/ui/Overview.tsx index b8f13be1b..4ddbcedab 100644 --- a/src/Corporation/ui/Overview.tsx +++ b/src/Corporation/ui/Overview.tsx @@ -51,7 +51,6 @@ export function Overview({ rerender }: IProps): React.ReactElement {
Outstanding Shares: {numeralWrapper.format(corp.issuedShares, "0.000a")} @@ -79,7 +78,6 @@ export function Overview({ rerender }: IProps): React.ReactElement {
Get a copy of and read 'The Complete Handbook for Creating a Successful Corporation.' This is a .lit file @@ -116,13 +114,12 @@ function PrivateButtons({ rerender }: IPrivateButtonsProps): React.ReactElement return ( <> - {findInvestorsTooltip}}> + {findInvestorsTooltip}}> Become a publicly traded and owned entity. Going public involves issuing shares for an IPO. Once you are a @@ -195,28 +192,24 @@ function PublicButtons({ rerender }: IPublicButtonsProps): React.ReactElement { return ( <> - {sellSharesTooltip}}> + {sellSharesTooltip}}> setSellSharesOpen(false)} rerender={rerender} /> - Buy back shares you that previously issued or sold at market price.} - > + Buy back shares you that previously issued or sold at market price.}> setBuybackSharesOpen(false)} rerender={rerender} />
- {issueNewSharesTooltip}}> + {issueNewSharesTooltip}}> setIssueNewSharesOpen(false)} /> Manage the dividends that are paid out to shareholders (including yourself)} > @@ -243,7 +236,6 @@ function BribeButton(): React.ReactElement { return ( <> Company: - {Object.values(AllCompanies).map((company) => ( {company.name} diff --git a/src/DevMenu/ui/Factions.tsx b/src/DevMenu/ui/Factions.tsx index f2f8002ef..02b678e6a 100644 --- a/src/DevMenu/ui/Factions.tsx +++ b/src/DevMenu/ui/Factions.tsx @@ -114,7 +114,6 @@ export function Factions(props: IProps): React.ReactElement { + + + + setTheme(event.target.value)} - defaultValue={props.options.theme} - > + diff --git a/src/ScriptEditor/ui/Root.tsx b/src/ScriptEditor/ui/Root.tsx index 71b06e3b1..d14f689f2 100644 --- a/src/ScriptEditor/ui/Root.tsx +++ b/src/ScriptEditor/ui/Root.tsx @@ -296,7 +296,7 @@ export function Root(props: IProps): React.ReactElement { <> Script name: - + setOptionsOpen(true)}> <> diff --git a/src/Terminal/ui/TerminalInput.tsx b/src/Terminal/ui/TerminalInput.tsx index 3324f9132..6b40648a3 100644 --- a/src/Terminal/ui/TerminalInput.tsx +++ b/src/Terminal/ui/TerminalInput.tsx @@ -341,7 +341,6 @@ export function TerminalInput({ terminal, router, player }: IProps): React.React )} , spellCheck: false, diff --git a/src/ui/React/GameOptionsRoot.tsx b/src/ui/React/GameOptionsRoot.tsx index 9f7f2fb48..53def414d 100644 --- a/src/ui/React/GameOptionsRoot.tsx +++ b/src/ui/React/GameOptionsRoot.tsx @@ -211,7 +211,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { The minimum number of milliseconds it takes to execute an operation in Netscript. Setting this too @@ -232,7 +231,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { The maximum number of lines a script's logs can hold. Setting this too high can cause the game to @@ -253,7 +251,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { The maximum number of entries that can be written to a port using Netscript's write() function. @@ -274,7 +271,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { The maximum number of entries that can be written to a the terminal. Setting this too high can cause @@ -296,7 +292,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { The time (in seconds) between each autosave. Set to 0 to disable autosave. } @@ -318,7 +313,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ If this is set, then any messages you receive will not appear as popups on the screen. They will @@ -337,7 +331,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ If this is set, then any faction invites you receive will not appear as popups on the screen. @@ -357,7 +350,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { } label={ If this is set, the confirmation message before traveling will not show up. You will @@ -380,7 +372,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { } label={ If this is set, the confirmation message before buying augmentation will not show up. @@ -399,7 +390,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { } label={ If this is set, a popup message will no longer be shown when you are hospitalized after taking @@ -420,7 +410,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { } label={ If this is set, then having your Bladeburner actions interrupted by being busy with something @@ -439,7 +428,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ If this is set, then most hotkeys (keyboard shortcuts) in the game are disabled. This includes @@ -457,10 +445,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { } label={ - If this is set all ASCII art will be disabled.} - > + If this is set all ASCII art will be disabled.}> Disable ascii art } @@ -471,7 +456,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ If this is set, text effects will not be displayed. This can help if text is difficult to read @@ -490,7 +474,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ Improved Bash emulation mode. Setting this to 1 enables several new Terminal shortcuts and @@ -509,7 +492,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { control={} label={ Terminal commands and log entries will be timestamped. The timestamp will have the format: M/D @@ -524,7 +506,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement { - Sets the locale for displaying numbers.}> + Sets the locale for displaying numbers.}> Locale  + ); diff --git a/src/ui/React/Theme.tsx b/src/ui/React/Theme.tsx index d0156426c..0349fd4a8 100644 --- a/src/ui/React/Theme.tsx +++ b/src/ui/React/Theme.tsx @@ -150,6 +150,14 @@ export function refreshTheme(): void { color: Settings.theme.primary, }, }, + defaultProps: { + variant: "standard", + }, + }, + MuiTextField: { + defaultProps: { + variant: "standard", + }, }, MuiMenu: { styleOverrides: { @@ -197,6 +205,9 @@ export function refreshTheme(): void { maxWidth: "100vh", }, }, + defaultProps: { + disableInteractive: true, + }, }, MuiSlider: { styleOverrides: { diff --git a/src/ui/React/ThemeEditorModal.tsx b/src/ui/React/ThemeEditorModal.tsx index 8d7650c73..3de184fe3 100644 --- a/src/ui/React/ThemeEditorModal.tsx +++ b/src/ui/React/ThemeEditorModal.tsx @@ -33,7 +33,6 @@ function ColorEditor({ name, onColorChange, color, defaultColor }: IColorEditorP sx={{ mx: 1 }} label={name} value={color} - variant="standard" InputProps={{ startAdornment: ( <>