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

Improve logs scrolling experience

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2020-10-22 13:22:48 +03:00
parent e3a3fb42eb
commit 01e485d0e4
3 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -21,7 +21,7 @@ type TabId = string;
type PodLogLine = 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 = 1000;
@autobind() @autobind()
export class PodLogsStore extends DockTabStore<IPodLogsData> { export class PodLogsStore extends DockTabStore<IPodLogsData> {

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

@ -140,18 +140,27 @@ export class PodLogs extends React.Component<Props> {
} }
onScroll = debounce((props: ListOnScrollProps) => { onScroll = debounce((props: ListOnScrollProps) => {
if (!this.logsElement.current) return;
const toBottomOffset = 100 * lineHeight; // 100 lines * 18px (height of each line) const toBottomOffset = 100 * lineHeight; // 100 lines * 18px (height of each line)
const { scrollHeight, clientHeight, scrollTop } = this.logsElement.current; const { scrollHeight, clientHeight } = this.logsElement.current;
// Trigger loading only if scrolled by user const { scrollDirection, scrollOffset, scrollUpdateWasRequested } = props;
if (scrollTop === 0 && !props.scrollUpdateWasRequested) { if (scrollDirection == "forward") {
this.loadMore(); if (scrollHeight - scrollOffset < toBottomOffset) {
} this.showJumpToBottom = false;
if (scrollHeight - scrollTop > toBottomOffset) { }
this.showJumpToBottom = true; if (clientHeight + scrollOffset === scrollHeight) {
this.lastLineIsShown = true;
}
} else { } else {
this.showJumpToBottom = false; this.lastLineIsShown = false;
// Trigger loading only if scrolled by user
if (scrollOffset === 0 && !scrollUpdateWasRequested) {
this.loadMore();
}
if (scrollHeight - scrollOffset > toBottomOffset) {
this.showJumpToBottom = true;
}
} }
this.lastLineIsShown = clientHeight + scrollTop === scrollHeight;
}, 300); // Debouncing to let virtual list do its internal works }, 300); // Debouncing to let virtual list do its internal works
/** /**

1
src/renderer/components/dock/search.store.ts
View File

@ -34,6 +34,7 @@ export class SearchStore {
* @returns {Array} Array of line indexes [0, 0, 14, 17, 17, 17, 20...] * @returns {Array} Array of line indexes [0, 0, 14, 17, 17, 17, 20...]
*/ */
findOccurencies(text: string[], query: string) { findOccurencies(text: string[], query: string) {
if (!text) return;
const occurences: number[] = []; const occurences: number[] = [];
text.forEach((line, index) => { text.forEach((line, index) => {
const regex = new RegExp(this.escapeRegex(query), "gi"); const regex = new RegExp(this.escapeRegex(query), "gi");