expand new city and new industry dont appear if you cant

src/Corporation/ui/CityTabs.tsx

@@ -10,6 +10,38 @@ 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) {
+  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 (
+    <CityTab
+      current={false}
+      key={"Expand into new City"}
+      name={"Expand into new City"}
+      onClick={openExpandNewCityModal}
+    />
+  );
+}
+
 interface IProps {
   city: string;
   division: IIndustry;
@@ -20,16 +52,6 @@ interface IProps {
 export function CityTabs(props: IProps): React.ReactElement {
   const [city, setCity] = useState(props.city);
 
-  function openExpandNewCityModal(): void {
-    const popupId = "cmpy-mgmt-expand-city-popup";
-    createPopup(popupId, ExpandNewCityPopup, {
-      popupId: popupId,
-      corp: props.corp,
-      division: props.division,
-      cityStateSetter: setCity,
-    });
-  }
-
   const office = props.division.offices[city];
   if (office === 0) {
     setCity("Sector-12");
@@ -39,7 +61,8 @@ export function CityTabs(props: IProps): React.ReactElement {
   return (
     <>
       {Object.values(props.division.offices).map(
-        (office: OfficeSpace | 0) => office !== 0 && (
+        (office: OfficeSpace | 0) =>
+          office !== 0 && (
             <CityTab
               current={city === office.loc}
               key={office.loc}
@@ -48,11 +71,10 @@ export function CityTabs(props: IProps): React.ReactElement {
             />
           ),
       )}
-      <CityTab
+      <ExpandButton
-        current={false}
+        corp={props.corp}
-        key={"Expand into new City"}
+        division={props.division}
-        name={"Expand into new City"}
+        setCity={setCity}
-        onClick={openExpandNewCityModal}
       />
       <Industry
         corp={props.corp}

src/Corporation/ui/HeaderTabs.tsx

@@ -9,6 +9,42 @@ import { createPopup } from "../../ui/React/createPopup";
 import { ICorporation } from "../ICorporation";
 import { IPlayer } from "../../PersonObjects/IPlayer";
 import { MainPanel } from "./MainPanel";
+import { Industries } from "../IndustryData";
+
+interface IExpandButtonProps {
+  corp: ICorporation;
+  setDivisionName: (name: string) => void;
+}
+
+function ExpandButton(props: IExpandButtonProps): React.ReactElement {
+  const allIndustries = Object.keys(Industries).sort();
+  const possibleIndustries = allIndustries
+    .filter(
+      (industryType: string) =>
+        props.corp.divisions.find(
+          (division: IIndustry) => division.type === industryType,
+        ) === undefined,
+    )
+    .sort();
+  if (possibleIndustries.length === 0) return <></>;
+
+  function openNewIndustryPopup(): void {
+    const popupId = "cmpy-mgmt-expand-industry-popup";
+    createPopup(popupId, NewIndustryPopup, {
+      corp: props.corp,
+      setDivisionName: props.setDivisionName,
+      popupId: popupId,
+    });
+  }
+
+  return (
+    <HeaderTab
+      current={false}
+      onClick={openNewIndustryPopup}
+      text={"Expand into new Industry"}
+    />
+  );
+}
 
 interface IProps {
   corp: ICorporation;
@@ -18,15 +54,6 @@ interface IProps {
 export function HeaderTabs(props: IProps): React.ReactElement {
   const [divisionName, setDivisionName] = useState("Overview");
 
-  function openNewIndustryPopup(): void {
-    const popupId = "cmpy-mgmt-expand-industry-popup";
-    createPopup(popupId, NewIndustryPopup, {
-      corp: props.corp,
-      setDivisionName: setDivisionName,
-      popupId: popupId,
-    });
-  }
-
   return (
     <>
       <div>
@@ -44,11 +71,7 @@ export function HeaderTabs(props: IProps): React.ReactElement {
             text={division.name}
           />
         ))}
-        <HeaderTab
+        <ExpandButton corp={props.corp} setDivisionName={setDivisionName} />
-          current={false}
-          onClick={openNewIndustryPopup}
-          text={"Expand into new Industry"}
-        />
       </div>
       <MainPanel
         corp={props.corp}