diff --git a/src/renderer/components/dock/pod-logs.scss b/src/renderer/components/dock/pod-logs.scss index 307e05cf9f..73c6f523fb 100644 --- a/src/renderer/components/dock/pod-logs.scss +++ b/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; } } diff --git a/src/renderer/components/dock/pod-logs.store.ts b/src/renderer/components/dock/pod-logs.store.ts index 610e6628bb..0aa09cd97b 100644 --- a/src/renderer/components/dock/pod-logs.store.ts +++ b/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 { + private refresher = interval(10, () => this.load(dockStore.selectedTabId)); + @observable logs = observable.map(); 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 { clearLogs(tabId: TabId) { this.logs.delete(tabId); } + + clearData(tabId: TabId) { + this.data.delete(tabId); + this.clearLogs(tabId); + } } export const podLogsStore = new PodLogsStore(); diff --git a/src/renderer/components/dock/pod-logs.tsx b/src/renderer/components/dock/pod-logs.tsx index 2353b11559..bdb0de480f 100644 --- a/src/renderer/components/dock/pod-logs.tsx +++ b/src/renderer/components/dock/pod-logs.tsx @@ -33,12 +33,17 @@ export class PodLogs extends React.Component { { 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 { 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;