hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Transform logs into array in store

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2020-10-15 14:04:16 +03:00
parent 237ee74cfa
commit e85f975e4b
2 changed files with 28 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/renderer/components/dock/pod-logs.store.ts
View File

@ -5,7 +5,6 @@ import { DockTabStore } from "./dock-tab.store";
import { dockStore, IDockTab, TabKind } from "./dock.store"; import { dockStore, IDockTab, TabKind } from "./dock.store";
import { t } from "@lingui/macro"; import { t } from "@lingui/macro";
import { _i18n } from "../../i18n"; import { _i18n } from "../../i18n";
import { Notifications } from "../notifications";
import { isDevelopment } from "../../../common/vars"; import { isDevelopment } from "../../../common/vars";
export interface IPodLogsData { export interface IPodLogsData {
@ -18,7 +17,7 @@ export interface IPodLogsData {
} }
type TabId = string; type TabId = string;
type PodLogs = string; type PodLogLine = string;
// Number for log lines to load // Number for log lines to load
export const logRange = isDevelopment ? 100 : 1000; export const logRange = isDevelopment ? 100 : 1000;
@ -31,7 +30,7 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
this.loadMore(id) this.loadMore(id)
}); });
@observable logs = observable.map<TabId, PodLogs>(); @observable logs = observable.map<TabId, PodLogLine[]>();
@observable newLogSince = observable.map<TabId, string>(); // Timestamp after which all logs are considered to be new @observable newLogSince = observable.map<TabId, string>(); // Timestamp after which all logs are considered to be new
constructor() { constructor() {
@ -64,13 +63,13 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
const logs = await this.loadLogs(tabId, { const logs = await this.loadLogs(tabId, {
tailLines: this.lines + logRange tailLines: this.lines + logRange
}); });
if (!this.refresher.isRunning) this.refresher.start(); this.refresher.start();
this.logs.set(tabId, logs); this.logs.set(tabId, logs);
} catch ({error}) { } catch ({error}) {
const message = [ const message = [
_i18n._(t`Failed to load logs: ${error.message}`), _i18n._(t`Failed to load logs: ${error.message}`),
_i18n._(t`Reason: ${error.reason} (${error.code})`) _i18n._(t`Reason: ${error.reason} (${error.code})`)
].join("\n"); ];
this.refresher.stop(); this.refresher.stop();
this.logs.set(tabId, message); this.logs.set(tabId, message);
} }
@ -88,7 +87,7 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
sinceTime: this.getLastSinceTime(tabId) sinceTime: this.getLastSinceTime(tabId)
}); });
// Add newly received logs to bottom // Add newly received logs to bottom
this.logs.set(tabId, oldLogs + logs); this.logs.set(tabId, [...oldLogs, ...logs]);
} }
/** /**
@ -104,11 +103,15 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
const pod = new Pod(data.pod); const pod = new Pod(data.pod);
const namespace = pod.getNs(); const namespace = pod.getNs();
const name = pod.getName(); const name = pod.getName();
return await podsApi.getLogs({ namespace, name }, { return podsApi.getLogs({ namespace, name }, {
...params, ...params,
timestamps: true, // Always setting timestampt to separate old logs from new ones timestamps: true, // Always setting timestampt to separate old logs from new ones
container: selectedContainer.name, container: selectedContainer.name,
previous previous
}).then(result => {
const logs = [...result.split("\n")]; // Transform them into array
logs.pop(); // Remove last empty element
return logs;
}); });
} }
@ -130,7 +133,7 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
get lines() { get lines() {
const id = dockStore.selectedTabId; const id = dockStore.selectedTabId;
const logs = this.logs.get(id); const logs = this.logs.get(id);
return logs ? logs.split("\n").length : 0; return logs ? logs.length : 0;
} }
/** /**
@ -139,7 +142,7 @@ export class PodLogsStore extends DockTabStore<IPodLogsData> {
* @param tabId * @param tabId
*/ */
getLastSinceTime(tabId: TabId) { getLastSinceTime(tabId: TabId) {
const timestamps = this.getTimestamps(this.logs.get(tabId)); const timestamps = this.getTimestamps(this.logs.get(tabId).join("\n"));
let stamp = new Date(0); let stamp = new Date(0);
if (timestamps) { if (timestamps) {
stamp = new Date(timestamps.slice(-1)[0]); stamp = new Date(timestamps.slice(-1)[0]);

30
src/renderer/components/dock/pod-logs.tsx
View File

@ -80,7 +80,7 @@ export class PodLogs extends React.Component<Props> {
* scrolling position * scrolling position
* @param scrollHeight previous scrollHeight position before adding new lines * @param scrollHeight previous scrollHeight position before adding new lines
*/ */
preload = async (scrollHeight: number) => { loadMore = async (scrollHeight: number) => {
if (podLogsStore.lines < logRange) return; if (podLogsStore.lines < logRange) return;
this.preloading = true; this.preloading = true;
await podLogsStore.load(this.tabId).then(() => this.preloading = false); await podLogsStore.load(this.tabId).then(() => this.preloading = false);
@ -101,19 +101,21 @@ export class PodLogs extends React.Component<Props> {
const logs = podLogsStore.logs.get(this.tabId); const logs = podLogsStore.logs.get(this.tabId);
const { getData, removeTimestamps, newLogSince } = podLogsStore; const { getData, removeTimestamps, newLogSince } = podLogsStore;
const { showTimestamps } = getData(this.tabId); const { showTimestamps } = getData(this.tabId);
let oldLogs = logs; let oldLogs: string[] = logs;
let newLogs = ""; let newLogs: string[] = [];
if (newLogSince.has(this.tabId)) { if (newLogSince.has(this.tabId)) {
// Finding separator timestamp in logs // Finding separator timestamp in logs
const index = logs.indexOf(newLogSince.get(this.tabId)); const index = logs.findIndex(item => item.includes(newLogSince.get(this.tabId)));
if (index !== -1) { if (index !== -1) {
// Splitting logs to old and new ones // Splitting logs to old and new ones
oldLogs = logs.substring(0, index); oldLogs = logs.slice(0, index);
newLogs = logs.substring(index); newLogs = logs.slice(index);
} }
} }
if (!showTimestamps) { if (!showTimestamps) {
return [removeTimestamps(oldLogs), removeTimestamps(newLogs)]; return [oldLogs, newLogs].map(logs => logs.map(item => removeTimestamps(item)))
} }
return [oldLogs, newLogs]; return [oldLogs, newLogs];
} }
@ -135,7 +137,7 @@ export class PodLogs extends React.Component<Props> {
const toBottomOffset = 100 * 16; // 100 lines * 16px (height of each line) const toBottomOffset = 100 * 16; // 100 lines * 16px (height of each line)
const { scrollHeight, clientHeight, scrollTop } = logsArea; const { scrollHeight, clientHeight, scrollTop } = logsArea;
if (scrollTop === 0) { if (scrollTop === 0) {
this.preload(scrollHeight); this.loadMore(scrollHeight);
} }
if (scrollHeight - scrollTop > toBottomOffset) { if (scrollHeight - scrollTop > toBottomOffset) {
this.showJumpToBottom = true; this.showJumpToBottom = true;
@ -149,7 +151,7 @@ export class PodLogs extends React.Component<Props> {
const { pod, selectedContainer } = this.tabData; const { pod, selectedContainer } = this.tabData;
const fileName = selectedContainer ? selectedContainer.name : pod.getName(); const fileName = selectedContainer ? selectedContainer.name : pod.getName();
const [oldLogs, newLogs] = this.logs; const [oldLogs, newLogs] = this.logs;
downloadFile(fileName + ".log", oldLogs + newLogs, "text/plain"); downloadFile(fileName + ".log", [...oldLogs, ...newLogs].join("\n"), "text/plain");
} }
onContainerChange = (option: SelectOption) => { onContainerChange = (option: SelectOption) => {
@ -208,7 +210,7 @@ export class PodLogs extends React.Component<Props> {
renderControls() { renderControls() {
if (!this.ready) return null; if (!this.ready) return null;
const { selectedContainer, showTimestamps, previous } = this.tabData; const { selectedContainer, showTimestamps, previous } = this.tabData;
const timestamps = podLogsStore.getTimestamps(podLogsStore.logs.get(this.tabId)); const timestamps = podLogsStore.getTimestamps(podLogsStore.logs.get(this.tabId).join("\n"));
return ( return (
<div className="controls flex gaps align-center"> <div className="controls flex gaps align-center">
<span><Trans>Container</Trans></span> <span><Trans>Container</Trans></span>
@ -255,7 +257,7 @@ export class PodLogs extends React.Component<Props> {
if (!this.ready) { if (!this.ready) {
return <Spinner center/>; return <Spinner center/>;
} }
if (!oldLogs && !newLogs) { if (!oldLogs.length && !newLogs.length) {
return ( return (
<div className="flex align-center justify-center"> <div className="flex align-center justify-center">
<Trans>There are no logs available for container.</Trans> <Trans>There are no logs available for container.</Trans>
@ -269,11 +271,11 @@ export class PodLogs extends React.Component<Props> {
<Spinner /> <Spinner />
</div> </div>
)} )}
<div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(this.colorConverter.ansi_to_html(oldLogs))}} /> <div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(this.colorConverter.ansi_to_html(oldLogs.join("\n"))) }} />
{newLogs && ( {newLogs.length > 0 && (
<> <>
<p className="new-logs-sep" title={_i18n._(t`New logs since opening the dialog`)}/> <p className="new-logs-sep" title={_i18n._(t`New logs since opening the dialog`)}/>
<div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(this.colorConverter.ansi_to_html(newLogs))}} /> <div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(this.colorConverter.ansi_to_html(newLogs.join("\n"))) }} />
</> </>
)} )}
</> </>