diff --git a/src/Corporation/IDivision.ts b/src/Corporation/IDivision.ts
new file mode 100644
index 000000000..603d9b538
--- /dev/null
+++ b/src/Corporation/IDivision.ts
@@ -0,0 +1,5 @@
+
+export interface IDivision {
+    name: string;
+    offices: IMap<IOfficeSpace>;
+}
diff --git a/src/Corporation/IOfficeSpace.ts b/src/Corporation/IOfficeSpace.ts
new file mode 100644
index 000000000..2138e5e19
--- /dev/null
+++ b/src/Corporation/IOfficeSpace.ts
@@ -0,0 +1,15 @@
+export interface IOfficeSpace {
+    loc: string;
+    cost: number;
+    size: number;
+    comf: number;
+    beau: number;
+    tier: any;
+    minEne: number;
+    maxEne: number;
+    minHap: number;
+    maxHap: number;
+    maxMor: number;
+    employees: any;
+    employeeProd: any;
+}
diff --git a/src/Corporation/ui/HeaderTab.tsx b/src/Corporation/ui/HeaderTab.tsx
index c7317e2f0..d31f34271 100644
--- a/src/Corporation/ui/HeaderTab.tsx
+++ b/src/Corporation/ui/HeaderTab.tsx
@@ -6,7 +6,7 @@ interface IProps {
     onClick: () => void;
 }
 
-export function HeaderTab(props: IProps) {
+export function HeaderTab(props: IProps): React.ReactElement {
     let className = "cmpy-mgmt-header-tab";
     if (props.current) {
         className += " current";
diff --git a/src/Corporation/ui/HeaderTabs.jsx b/src/Corporation/ui/HeaderTabs.jsx
deleted file mode 100644
index aefcf8de1..000000000
--- a/src/Corporation/ui/HeaderTabs.jsx
+++ /dev/null
@@ -1,66 +0,0 @@
-// React Components for the Corporation UI's navigation tabs
-// These are the tabs at the top of the UI that let you switch to different
-// divisions, see an overview of your corporation, or create a new industry
-import React from "react";
-import { BaseReactComponent } from "./BaseReactComponent";
-import { HeaderTab } from "./HeaderTab";
-
-export class HeaderTabs extends BaseReactComponent {
-    renderTab(props) {
-        return (
-            <HeaderTab
-                current={props.current}
-                key={props.key}
-                onClick={props.onClick}
-                text={props.text}
-            />
-        )
-    }
-
-    render() {
-        const overviewOnClick = () => {
-            this.routing().routeToOverviewPage();
-            this.corp().rerender();
-        }
-
-        const divisionOnClicks = {};
-        for (const division of this.corp().divisions) {
-            const name = division.name;
-            const onClick = () => {
-                this.routing().routeTo(name);
-                this.corp().rerender();
-            }
-
-            divisionOnClicks[name] = onClick;
-        }
-
-        return (
-            <div>
-                {
-                    this.renderTab({
-                        current: this.routing().isOnOverviewPage(),
-                        key: "overview",
-                        onClick: overviewOnClick,
-                        text: this.corp().name,
-                    })
-                }
-                {
-                    this.corp().divisions.map((division) => {
-                        return this.renderTab({
-                            current: this.routing().isOn(division.name),
-                            key: division.name,
-                            onClick: divisionOnClicks[division.name],
-                            text: division.name,
-                        });
-                    })
-                }
-                {
-                    this.renderTab({
-                        onClick: this.eventHandler().createNewIndustryPopup.bind(this.eventHandler()),
-                        text: "Expand into new Industry",
-                    })
-                }
-            </div>
-        )
-    }
-}
diff --git a/src/Corporation/ui/HeaderTabs.tsx b/src/Corporation/ui/HeaderTabs.tsx
new file mode 100644
index 000000000..75f41b4ef
--- /dev/null
+++ b/src/Corporation/ui/HeaderTabs.tsx
@@ -0,0 +1,49 @@
+// React Components for the Corporation UI's navigation tabs
+// These are the tabs at the top of the UI that let you switch to different
+// divisions, see an overview of your corporation, or create a new industry
+import React from "react";
+import { HeaderTab } from "./HeaderTab";
+import { IDivision } from "../IDivision";
+
+interface IProps {
+    corp: any;
+    eventHandler: any;
+    routing: any;
+}
+
+export function HeaderTabs(props: IProps): React.ReactElement {
+    console.log(props);
+    function overviewOnClick() {
+        props.routing.routeToOverviewPage();
+        props.corp.rerender();
+    }
+
+    return (
+        <div>
+            <HeaderTab
+                current={props.routing.isOnOverviewPage()}
+                key={"overview"}
+                onClick={overviewOnClick}
+                text={props.corp.name}
+            />
+            {
+                props.corp.divisions.map((division: IDivision) => 
+                    <HeaderTab
+                        current={props.routing.isOn(division.name)}
+                        key={division.name}
+                        onClick={() => {
+                            props.routing.routeTo(division.name);
+                            props.corp.rerender();
+                        }}
+                        text={division.name}
+                    />)
+            }
+            <HeaderTab
+                current={false}
+                onClick={props.eventHandler.createNewIndustryPopup}
+                text={"Expand into new Industry"}
+            />
+        </div>
+    )
+
+}
diff --git a/src/Corporation/ui/Root.jsx b/src/Corporation/ui/Root.jsx
index f393de20e..b9071646a 100644
--- a/src/Corporation/ui/Root.jsx
+++ b/src/Corporation/ui/Root.jsx
@@ -9,7 +9,7 @@ export class CorporationRoot extends BaseReactComponent {
     render() {
         return (
             <div>
-                <HeaderTabs {...this.props} />
+                <HeaderTabs corp={this.props.corp} eventHandler={this.props.eventHandler} routing={this.props.routing} />
                 <MainPanel {...this.props} />
             </div>
         )