Setting a refresher

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/dock/pod-logs.scss

@@ -14,6 +14,7 @@
     font-family: $font-monospace;
     font-size: smaller;
     white-space: pre;
+    flex-grow: 1;
 
     > div {
      // Provides font better readability on large screens
@@ -35,7 +36,7 @@
       content: 'new';
       background: $primary;
       color: white;
-      padding: $padding / 3 $padding /2;
+      padding: $padding / 3;
       border-radius: $radius;
     }
   }

src/renderer/components/dock/pod-logs.store.ts

@@ -1,6 +1,6 @@
-import { observable } from "mobx";
+import { autorun, observable } from "mobx";
 import { Pod, IPodContainer, podsApi } from "../../api/endpoints";
-import { autobind } from "../../utils";
+import { autobind, interval } from "../../utils";
 import { DockTabStore } from "./dock-tab.store";
 import { dockStore, IDockTab, TabKind } from "./dock.store";
 import { t } from "@lingui/macro";
@@ -24,12 +24,22 @@ interface PodLogs {
 
 @autobind()
 export class PodLogsStore extends DockTabStore<IPodLogsData> {
+  private refresher = interval(10, () => this.load(dockStore.selectedTabId));
+
   @observable logs = observable.map<TabId, PodLogs>();
 
   constructor() {
     super({
       storageName: "pod_logs"
     });
+    autorun(() => {
+      const { selectedTab, isOpen } = dockStore;
+      if (isPodLogsTab(selectedTab) && isOpen) {
+        this.refresher.start();
+      } else {
+        this.refresher.stop();
+      }
+    }, { delay: 500 });
   }
 
   load = async (tabId: TabId) => {
@@ -89,6 +99,11 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
   clearLogs(tabId: TabId) {
     this.logs.delete(tabId);
   }
+
+  clearData(tabId: TabId) {
+    this.data.delete(tabId);
+    this.clearLogs(tabId);
+  }
 }
 
 export const podLogsStore = new PodLogsStore();

src/renderer/components/dock/pod-logs.tsx

@@ -33,12 +33,17 @@ export class PodLogs extends React.Component<Props> {
     { label: 100000, value: 100000 },
   ];
 
-  @disposeOnUnmount
-  updateLogsTabChange = reaction(() => this.props.tab.id, async () => {
-    this.ready = false;
-    await podLogsStore.load(this.tabId);
-    this.ready = true;
-  }, { fireImmediately: true });
+  async componentDidMount() {
+    disposeOnUnmount(this,
+      reaction(() => this.props.tab.id, async () => {
+        if (podLogsStore.logs.has(this.tabId)) {
+          this.ready = true;
+          return;
+        }
+        await this.load();
+      }, { fireImmediately: true })
+    );
+  }
 
   componentDidUpdate() {
     // scroll logs only when it's already in the end,
@@ -61,15 +66,18 @@ export class PodLogs extends React.Component<Props> {
     podLogsStore.setData(this.tabId, { ...this.tabData, ...data });
   }
 
-  reload = async () => {
-    const { clearLogs, load } = podLogsStore;
-    this.lastLineIsShown = true;
+  load = async () => {
     this.ready = false;
-    clearLogs(this.tabId);
-    await load(this.tabId);
+    await podLogsStore.load(this.tabId);
     this.ready = true;
   }
 
+  reload = async () => {
+    podLogsStore.clearLogs(this.tabId);
+    this.lastLineIsShown = true;
+    await this.load();
+  }
+
   @computed
   get logs() {
     if (!podLogsStore.logs.has(this.tabId)) return;