UI: Correct behavior of "back" button on faction augs page

Plus router refactoring

src/BitNode/ui/BitFlumeModal.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from "react";
 import { Modal } from "../../ui/React/Modal";
 import { Router } from "../../ui/GameRoot";
+import { Page } from "../../ui/Router";
 import { EventEmitter } from "../../utils/EventEmitter";
 import Typography from "@mui/material/Typography";
 import Button from "@mui/material/Button";
@@ -10,7 +11,7 @@ export const BitFlumeEvent = new EventEmitter<[]>();
 export function BitFlumeModal(): React.ReactElement {
   const [open, setOpen] = useState(false);
   function flume(): void {
-    Router.toBitVerse(true, false);
+    Router.toPage(Page.BitVerse, { flume: true, quick: false });
     setOpen(false);
   }
 

src/Bladeburner/ui/BlackOpPage.tsx

@@ -4,6 +4,7 @@ import { BlackOperationName, FactionName } from "@enums";
 import { BlackOpList } from "./BlackOpList";
 import { Bladeburner } from "../Bladeburner";
 import { Router } from "../../ui/GameRoot";
+import { Page } from "../../ui/Router";
 import { CorruptableText } from "../../ui/React/CorruptableText";
 
 interface IProps {
@@ -28,7 +29,7 @@ export function BlackOpPage(props: IProps): React.ReactElement {
         losses.
       </Typography>
       {props.bladeburner.blackops[BlackOperationName.OperationDaedalus] ? (
-        <Button sx={{ my: 1, p: 1 }} onClick={() => Router.toBitVerse(false, false)}>
+        <Button sx={{ my: 1, p: 1 }} onClick={() => Router.toPage(Page.BitVerse, { flume: false, quick: false })}>
           <CorruptableText content="Destroy w0rld_d34mon"></CorruptableText>
         </Button>
       ) : (

src/Bladeburner/ui/Stats.tsx

@@ -8,6 +8,7 @@ import { Money } from "../../ui/React/Money";
 import { formatNumberNoSuffix, formatPopulation, formatBigNumber } from "../../ui/formatNumber";
 import { Factions } from "../../Faction/Factions";
 import { Router } from "../../ui/GameRoot";
+import { Page } from "../../ui/Router";
 import { joinFaction } from "../../Faction/FactionHelpers";
 import { Bladeburner } from "../Bladeburner";
 
@@ -34,7 +35,7 @@ export function Stats(props: IProps): React.ReactElement {
       joinFaction(faction);
     }
 
-    Router.toFaction(faction);
+    Router.toPage(Page.Faction, { faction });
   }
 
   return (

src/DevMenu/ui/General.tsx

@@ -16,6 +16,7 @@ import { Player } from "@player";
 import { FactionName } from "@enums";
 import { Money } from "../../ui/React/Money";
 import { Router } from "../../ui/GameRoot";
+import { Page } from "../../ui/Router";
 import { Bladeburner } from "../../Bladeburner/Bladeburner";
 import { GangConstants } from "../../Gang/data/Constants";
 import { checkForMessagesToSend } from "../../Message/MessageHelpers";
@@ -37,10 +38,10 @@ export function General(): React.ReactElement {
   const upgradeRam = () => (Player.getHomeComputer().maxRam *= 2);
 
   // Node-clearing functions
-  const quickB1tFlum3 = () => Router.toBitVerse(true, true);
-  const b1tflum3 = () => Router.toBitVerse(true, false);
-  const quickHackW0r1dD43m0n = () => Router.toBitVerse(false, true);
-  const hackW0r1dD43m0n = () => Router.toBitVerse(false, false);
+  const quickB1tFlum3 = () => Router.toPage(Page.BitVerse, { flume: true, quick: true });
+  const b1tflum3 = () => Router.toPage(Page.BitVerse, { flume: true, quick: false });
+  const quickHackW0r1dD43m0n = () => Router.toPage(Page.BitVerse, { flume: false, quick: true });
+  const hackW0r1dD43m0n = () => Router.toPage(Page.BitVerse, { flume: false, quick: false });
 
   // Corp functions
   const createCorporation = () => {

src/Electron.tsx

@@ -1,5 +1,6 @@
 import { Player } from "@player";
 import { Router } from "./ui/GameRoot";
+import { Page } from "./ui/Router";
 import { Terminal } from "./Terminal";
 import { SnackbarEvents } from "./ui/React/Snackbar";
 import { ToastVariant } from "@enums";
@@ -28,8 +29,8 @@ declare global {
       triggerGameExport: () => void;
       triggerScriptsExport: () => void;
       getSaveData: () => { save: string; fileName: string };
-      getSaveInfo: (base64save: string) => Promise<ImportPlayerData | undefined>;
-      pushSaveData: (base64save: string, automatic?: boolean) => void;
+      getSaveInfo: (base64Save: string) => Promise<ImportPlayerData | undefined>;
+      pushSaveData: (base64Save: string, automatic?: boolean) => void;
     };
     electronBridge: {
       send: (channel: string, data?: unknown) => void;
@@ -137,16 +138,17 @@ function initSaveFunctions(): void {
         fileName: saveObject.getSaveFileName(),
       };
     },
-    getSaveInfo: async (base64save: string): Promise<ImportPlayerData | undefined> => {
+    getSaveInfo: async (base64Save: string): Promise<ImportPlayerData | undefined> => {
       try {
-        const data = await saveObject.getImportDataFromString(base64save);
+        const data = await saveObject.getImportDataFromString(base64Save);
         return data.playerData;
       } catch (error) {
         console.error(error);
         return;
       }
     },
-    pushSaveData: (base64save: string, automatic = false): void => Router.toImportSave(base64save, automatic),
+    pushSaveData: (base64Save: string, automatic = false): void =>
+      Router.toPage(Page.ImportSave, { base64Save, automatic }),
   };
 
   // Will be consumed by the electron wrapper.

src/Faction/ui/AugmentationsPage.tsx

@@ -1,5 +1,5 @@
-import { Box, Button, Tooltip, Typography, Paper, Container } from "@mui/material";
 import React from "react";
+import { Box, Button, Tooltip, Typography, Paper, Container } from "@mui/material";
 
 import { Augmentations } from "../../Augmentation/Augmentations";
 import { getAugCost, getGenericAugmentationPriceMultiplier } from "../../Augmentation/AugmentationHelpers";
@@ -11,22 +11,18 @@ import { Player } from "@player";
 import { formatBigNumber } from "../../ui/formatNumber";
 import { Favor } from "../../ui/React/Favor";
 import { Reputation } from "../../ui/React/Reputation";
+import { Router } from "../../ui/GameRoot";
 import { Faction } from "../Faction";
 import { getFactionAugmentationsFiltered, hasAugmentationPrereqs, purchaseAugmentation } from "../FactionHelpers";
 import { CONSTANTS } from "../../Constants";
 import { useRerender } from "../../ui/React/hooks";
 
-interface IProps {
-  faction: Faction;
-  routeToMainPage: () => void;
-}
-
 /** Root React Component for displaying a faction's "Purchase Augmentations" page */
-export function AugmentationsPage(props: IProps): React.ReactElement {
+export function AugmentationsPage({ faction }: { faction: Faction }): React.ReactElement {
   const rerender = useRerender();
 
   function getAugs(): AugmentationName[] {
-    return getFactionAugmentationsFiltered(props.faction);
+    return getFactionAugmentationsFiltered(faction);
   }
 
   function getAugsSorted(): AugmentationName[] {
@@ -66,7 +62,7 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
       const aug = Augmentations[augName];
       const augCosts = getAugCost(aug);
       const repCost = augCosts.repCost;
-      const hasReq = props.faction.playerReputation >= repCost;
+      const hasReq = faction.playerReputation >= repCost;
       const hasRep = hasAugmentationPrereqs(aug);
       const hasCost = augCosts.moneyCost !== 0 && Player.money > augCosts.moneyCost;
       return hasCost && hasReq && hasRep;
@@ -126,7 +122,7 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
   const owned = augs.filter((aug) => !purchasable.includes(aug));
 
   const multiplierComponent =
-    props.faction.name !== FactionName.ShadowsOfAnarchy ? (
+    faction.name !== FactionName.ShadowsOfAnarchy ? (
       <Tooltip
         title={
           <Typography>
@@ -171,27 +167,27 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
   return (
     <>
       <Container disableGutters maxWidth="lg" sx={{ mx: 0 }}>
-        <Button onClick={props.routeToMainPage}>Back</Button>
-        <Typography variant="h4">Faction Augmentations - {props.faction.name}</Typography>
+        <Button onClick={() => Router.back()}>Back</Button>
+        <Typography variant="h4">Faction Augmentations - {faction.name}</Typography>
         <Paper sx={{ p: 1, mb: 1 }}>
           <Typography>
-            These are all of the Augmentations that are available to purchase from <b>{props.faction.name}</b>.
-            Augmentations are powerful upgrades that will enhance your abilities.
+            These are all of the Augmentations that are available to purchase from <b>{faction.name}</b>. Augmentations
+            are powerful upgrades that will enhance your abilities.
             <br />
           </Typography>
           <Box
             sx={{
               display: "grid",
-              gridTemplateColumns: `repeat(${props.faction.name === FactionName.ShadowsOfAnarchy ? "2" : "3"}, 1fr)`,
+              gridTemplateColumns: `repeat(${faction.name === FactionName.ShadowsOfAnarchy ? "2" : "3"}, 1fr)`,
               justifyItems: "center",
               my: 1,
             }}
           >
             <>{multiplierComponent}</>
             <Typography>
-              <b>Reputation:</b> <Reputation reputation={props.faction.playerReputation} />
+              <b>Reputation:</b> <Reputation reputation={faction.playerReputation} />
               <br />
-              <b>Favor:</b> <Favor favor={Math.floor(props.faction.favor)} />
+              <b>Favor:</b> <Favor favor={Math.floor(faction.favor)} />
             </Typography>
           </Box>
           <Box sx={{ display: "grid", gridTemplateColumns: "repeat(4, 1fr)" }}>
@@ -216,20 +212,20 @@ export function AugmentationsPage(props: IProps): React.ReactElement {
           const costs = getAugCost(aug);
           return (
             hasAugmentationPrereqs(aug) &&
-            props.faction.playerReputation >= costs.repCost &&
+            faction.playerReputation >= costs.repCost &&
             (costs.moneyCost === 0 || Player.money > costs.moneyCost)
           );
         }}
         purchaseAugmentation={(aug, showModal) => {
           if (!Settings.SuppressBuyAugmentationConfirmation) {
             showModal(true);
           } else {
-            purchaseAugmentation(aug, props.faction);
+            purchaseAugmentation(aug, faction);
             rerender();
           }
         }}
-        rep={props.faction.playerReputation}
-        faction={props.faction}
+        rep={faction.playerReputation}
+        faction={faction}
       />
     </>
   );

src/Faction/ui/FactionRoot.tsx

@@ -5,7 +5,6 @@
  */
 import React, { useState } from "react";
 
-import { AugmentationsPage } from "./AugmentationsPage";
 import { DonateOption } from "./DonateOption";
 import { Info } from "./Info";
 import { Option } from "./Option";
@@ -24,10 +23,9 @@ import { FactionWork } from "../../Work/FactionWork";
 import { useRerender } from "../../ui/React/hooks";
 import { repNeededToDonate } from "../formulas/donation";
 
-interface IProps {
+type FactionRootProps = {
   faction: Faction;
-  augPage: boolean;
-}
+};
 
 // Info text for all options on the UI
 const hackingContractsInfo =
@@ -148,11 +146,8 @@ function MainPage({ faction, rerender, onAugmentations }: IMainProps): React.Rea
   );
 }
 
-export function FactionRoot(props: IProps): React.ReactElement {
+export function FactionRoot({ faction }: FactionRootProps): React.ReactElement {
   const rerender = useRerender(200);
-  const [purchasingAugs, setPurchasingAugs] = useState(props.augPage);
-
-  const faction = props.faction;
 
   if (!Player.factions.includes(faction.name)) {
     return (
@@ -165,9 +160,11 @@ export function FactionRoot(props: IProps): React.ReactElement {
     );
   }
 
-  return purchasingAugs ? (
-    <AugmentationsPage faction={faction} routeToMainPage={() => setPurchasingAugs(false)} />
-  ) : (
-    <MainPage rerender={rerender} faction={faction} onAugmentations={() => setPurchasingAugs(true)} />
+  return (
+    <MainPage
+      rerender={rerender}
+      faction={faction}
+      onAugmentations={() => Router.toPage(Page.FactionAugmentations, { faction })}
+    />
   );
 }

src/Faction/ui/FactionsRoot.tsx

@@ -1,16 +1,18 @@
-import type { Faction } from "../Faction";
-
 import React, { useEffect } from "react";
 import { Explore, Info, LastPage, LocalPolice, NewReleases, Report, SportsMma } from "@mui/icons-material";
 import { Box, Button, Container, Paper, Tooltip, Typography, useTheme } from "@mui/material";
+
 import { Player } from "@player";
+import { FactionName } from "@enums";
+
 import { Settings } from "../../Settings/Settings";
 import { formatFavor, formatReputation } from "../../ui/formatNumber";
 import { Router } from "../../ui/GameRoot";
-import { FactionName } from "@enums";
+import { Page } from "../../ui/Router";
+import { useRerender } from "../../ui/React/hooks";
+import { Faction } from "../Faction";
 import { getFactionAugmentationsFiltered, joinFaction } from "../FactionHelpers";
 import { Factions } from "../Factions";
-import { useRerender } from "../../ui/React/hooks";
 
 export const InvitationsSeen: string[] = [];
 
@@ -53,11 +55,11 @@ const FactionElement = (props: FactionElementProps): React.ReactElement => {
   const augsLeft = getFactionAugmentationsFiltered(props.faction).filter((aug) => !Player.hasAugmentation(aug)).length;
 
   function openFaction(faction: Faction): void {
-    Router.toFaction(faction);
+    Router.toPage(Page.Faction, { faction });
   }
 
   function openFactionAugPage(faction: Faction): void {
-    Router.toFaction(faction, true);
+    Router.toPage(Page.FactionAugmentations, { faction });
   }
 
   function acceptInvitation(event: React.MouseEvent<HTMLButtonElement>, faction: FactionName): void {

src/GameOptions/ui/GameOptionsSidebar.tsx

@@ -95,7 +95,7 @@ export const GameOptionsSidebar = (props: IProps): React.ReactElement => {
 
   function compareSaveGame(): void {
     if (!importData) return;
-    Router.toImportSave(importData.base64);
+    Router.toPage(Page.ImportSave, { base64Save: importData.base64 });
     setImportSaveOpen(false);
     setImportData(null);
   }

src/Locations/ui/City.tsx

@@ -43,7 +43,7 @@ function toLocation(location: Location): void {
   } else if (location.name === LocationName.WorldStockExchange) {
     Router.toPage(Page.StockMarket);
   } else {
-    Router.toLocation(location);
+    Router.toPage(Page.Location, { location });
   }
 }
 

src/Locations/ui/CompanyLocation.tsx

@@ -151,11 +151,10 @@ export function CompanyLocation(props: IProps): React.ReactElement {
     if (!e.isTrusted) {
       return;
     }
-    const loc = location;
-    if (!loc.infiltrationData)
+    if (!location.infiltrationData)
       throw new Error(`trying to start infiltration at ${props.locName} but the infiltrationData is null`);
 
-    Router.toInfiltration(loc);
+    Router.toPage(Page.Infiltration, { location });
   }
 
   function work(e: React.MouseEvent<HTMLElement>): void {

src/NetscriptFunctions/Singularity.ts

@@ -23,8 +23,8 @@ import { findCrime } from "../Crime/CrimeHelpers";
 import { CompanyPositions } from "../Company/CompanyPositions";
 import { DarkWebItems } from "../DarkWeb/DarkWebItems";
 import { Router } from "../ui/GameRoot";
-import { SpecialServers } from "../Server/data/SpecialServers";
 import { Page } from "../ui/Router";
+import { SpecialServers } from "../Server/data/SpecialServers";
 import { Locations } from "../Locations/Locations";
 import { GetServer } from "../Server/AllServers";
 import { Programs } from "../Programs/Programs";
@@ -231,7 +231,7 @@ export function NetscriptSingularity(): InternalAPI<ISingularity> {
       } else if (location.name === LocationName.WorldStockExchange) {
         Router.toPage(Page.StockMarket);
       } else {
-        Router.toLocation(location);
+        Router.toPage(Page.Location, { location });
       }
       Player.gainIntelligenceExp(CONSTANTS.IntelligenceSingFnBaseExpGain / 50000);
       return true;
@@ -559,7 +559,7 @@ export function NetscriptSingularity(): InternalAPI<ISingularity> {
         server.backdoorInstalled = true;
 
         if (SpecialServers.WorldDaemon === server.hostname) {
-          return Router.toBitVerse(false, false);
+          return Router.toPage(Page.BitVerse, { flume: false, quick: false });
         }
         // Manunally check for faction invites
         Engine.Counters.checkFactionInvitations = 0;

src/PersonObjects/Grafting/ui/GraftingRoot.tsx

@@ -1,7 +1,7 @@
 import type { Augmentation } from "../../../Augmentation/Augmentation";
 
 import { Player } from "@player";
-import { AugmentationName, LocationName } from "@enums";
+import { AugmentationName } from "@enums";
 
 import React, { useState } from "react";
 import { CheckBox, CheckBoxOutlineBlank, Construction } from "@mui/icons-material";
@@ -11,7 +11,6 @@ import { GraftingWork } from "../../../Work/GraftingWork";
 import { Augmentations } from "../../../Augmentation/Augmentations";
 import { CONSTANTS } from "../../../Constants";
 import { hasAugmentationPrereqs } from "../../../Faction/FactionHelpers";
-import { Locations } from "../../../Locations/Locations";
 import { PurchaseAugmentationsOrderSetting } from "../../../Settings/SettingEnums";
 import { Settings } from "../../../Settings/Settings";
 import { Router } from "../../../ui/GameRoot";
@@ -87,7 +86,7 @@ export const GraftingRoot = (): React.ReactElement => {
 
   return (
     <Container disableGutters maxWidth="lg" sx={{ mx: 0 }}>
-      <Button onClick={() => Router.toLocation(Locations[LocationName.NewTokyoVitaLife])}>Back</Button>
+      <Button onClick={() => Router.back()}>Back</Button>
       <Typography variant="h4">Grafting Laboratory</Typography>
       <Typography>
         You find yourself in a secret laboratory, owned by a mysterious researcher.