Replace use of legacy globals with injectables

Signed-off-by: Sebastian Malton <sebastian@malton.name>

src/renderer/components/+workloads-cronjobs/cronjobs.tsx

@@ -7,14 +7,18 @@ import "./cronjobs.scss";
 
 import React from "react";
 import { observer } from "mobx-react";
-import { cronJobStore } from "./legacy-store";
-import { jobStore } from "../+workloads-jobs/legacy-store";
-import { eventStore } from "../+events/legacy-store";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
 import moment from "moment";
 import { SiblingsInTabLayout } from "../layout/siblings-in-tab-layout";
 import { KubeObjectAge } from "../kube-object/age";
+import type { CronJobStore } from "./store";
+import type { JobStore } from "../+workloads-jobs/store";
+import type { EventStore } from "../+events/store";
+import { withInjectables } from "@ogre-tools/injectable-react";
+import cronJobStoreInjectable from "./store.injectable";
+import jobStoreInjectable from "../+workloads-jobs/store.injectable";
+import eventStoreInjectable from "../+events/store.injectable";
 
 enum columnId {
   name = "name",
@@ -26,9 +30,21 @@ enum columnId {
   age = "age",
 }
 
+interface Dependencies {
+  cronJobStore: CronJobStore;
+  jobStore: JobStore;
+  eventStore: EventStore;
+}
+
 @observer
-export class CronJobs extends React.Component {
+class NonInjectedCronJobs extends React.Component<Dependencies>{
   render() {
+    const {
+      cronJobStore,
+      eventStore,
+      jobStore,
+    } = this.props;
+
     return (
       <SiblingsInTabLayout>
         <KubeObjectListLayout
@@ -80,3 +96,11 @@ export class CronJobs extends React.Component {
   }
 }
 
+export const CronJobs = withInjectables<Dependencies>(NonInjectedCronJobs, {
+  getProps: (di, props) => ({
+    cronJobStore: di.inject(cronJobStoreInjectable),
+    eventStore: di.inject(eventStoreInjectable),
+    jobStore: di.inject(jobStoreInjectable),
+    ...props,
+  }),
+});