mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Merge branch 'lensapp:master' into feature/port-forward-custom-port-input
This commit is contained in:
commit
5e02caa43b
@ -1,25 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "kube-object-event-status",
|
|
||||||
"version": "0.1.0",
|
|
||||||
"description": "Adds kube object status from events",
|
|
||||||
"renderer": "dist/renderer.js",
|
|
||||||
"lens": {
|
|
||||||
"metadata": {},
|
|
||||||
"styles": []
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"build": "webpack && npm pack",
|
|
||||||
"dev": "webpack --watch",
|
|
||||||
"test": "echo NO TESTS"
|
|
||||||
},
|
|
||||||
"files": [
|
|
||||||
"dist/**/*"
|
|
||||||
],
|
|
||||||
"dependencies": {},
|
|
||||||
"devDependencies": {
|
|
||||||
"@k8slens/extensions": "file:../../src/extensions/npm/extensions",
|
|
||||||
"ts-loader": "^8.0.4",
|
|
||||||
"typescript": "^4.0.3",
|
|
||||||
"webpack": "^4.44.2"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -3,7 +3,7 @@
|
|||||||
"productName": "OpenLens",
|
"productName": "OpenLens",
|
||||||
"description": "OpenLens - Open Source IDE for Kubernetes",
|
"description": "OpenLens - Open Source IDE for Kubernetes",
|
||||||
"homepage": "https://github.com/lensapp/lens",
|
"homepage": "https://github.com/lensapp/lens",
|
||||||
"version": "5.0.2",
|
"version": "5.0.3-beta.1",
|
||||||
"main": "static/build/main.js",
|
"main": "static/build/main.js",
|
||||||
"copyright": "© 2021 OpenLens Authors",
|
"copyright": "© 2021 OpenLens Authors",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@ -62,8 +62,11 @@ export interface KubernetesClusterStatus extends CatalogEntityStatus {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export class KubernetesCluster extends CatalogEntity<CatalogEntityMetadata, KubernetesClusterStatus, KubernetesClusterSpec> {
|
export class KubernetesCluster extends CatalogEntity<CatalogEntityMetadata, KubernetesClusterStatus, KubernetesClusterSpec> {
|
||||||
public readonly apiVersion = "entity.k8slens.dev/v1alpha1";
|
public static readonly apiVersion = "entity.k8slens.dev/v1alpha1";
|
||||||
public readonly kind = "KubernetesCluster";
|
public static readonly kind = "KubernetesCluster";
|
||||||
|
|
||||||
|
public readonly apiVersion = KubernetesCluster.apiVersion;
|
||||||
|
public readonly kind = KubernetesCluster.kind;
|
||||||
|
|
||||||
async connect(): Promise<void> {
|
async connect(): Promise<void> {
|
||||||
if (app) {
|
if (app) {
|
||||||
|
|||||||
@ -20,4 +20,4 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
export * from "./user-store";
|
export * from "./user-store";
|
||||||
export type { KubeconfigSyncEntry, KubeconfigSyncValue } from "./preferences-helpers";
|
export type { KubeconfigSyncEntry, KubeconfigSyncValue, UserPreferencesModel } from "./preferences-helpers";
|
||||||
|
|||||||
@ -31,6 +31,7 @@ import path from "path";
|
|||||||
import { fileNameMigration } from "../../migrations/user-store";
|
import { fileNameMigration } from "../../migrations/user-store";
|
||||||
import { ObservableToggleSet, toJS } from "../../renderer/utils";
|
import { ObservableToggleSet, toJS } from "../../renderer/utils";
|
||||||
import { DESCRIPTORS, KubeconfigSyncValue, UserPreferencesModel } from "./preferences-helpers";
|
import { DESCRIPTORS, KubeconfigSyncValue, UserPreferencesModel } from "./preferences-helpers";
|
||||||
|
import logger from "../../main/logger";
|
||||||
|
|
||||||
export interface UserStoreModel {
|
export interface UserStoreModel {
|
||||||
lastSeenAppVersion: string;
|
lastSeenAppVersion: string;
|
||||||
@ -118,13 +119,13 @@ export class UserStore extends BaseStore<UserStoreModel> /* implements UserStore
|
|||||||
*/
|
*/
|
||||||
isTableColumnHidden(tableId: string, ...columnIds: string[]): boolean {
|
isTableColumnHidden(tableId: string, ...columnIds: string[]): boolean {
|
||||||
if (columnIds.length === 0) {
|
if (columnIds.length === 0) {
|
||||||
return true;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
const config = this.hiddenTableColumns.get(tableId);
|
const config = this.hiddenTableColumns.get(tableId);
|
||||||
|
|
||||||
if (!config) {
|
if (!config) {
|
||||||
return true;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return columnIds.some(columnId => config.has(columnId));
|
return columnIds.some(columnId => config.has(columnId));
|
||||||
@ -155,8 +156,8 @@ export class UserStore extends BaseStore<UserStoreModel> /* implements UserStore
|
|||||||
}
|
}
|
||||||
|
|
||||||
@action
|
@action
|
||||||
protected fromStore(data: Partial<UserStoreModel> = {}) {
|
protected fromStore({ lastSeenAppVersion, preferences }: Partial<UserStoreModel> = {}) {
|
||||||
const { lastSeenAppVersion, preferences } = data;
|
logger.debug("UserStore.fromStore()", { lastSeenAppVersion, preferences });
|
||||||
|
|
||||||
if (lastSeenAppVersion) {
|
if (lastSeenAppVersion) {
|
||||||
this.lastSeenAppVersion = lastSeenAppVersion;
|
this.lastSeenAppVersion = lastSeenAppVersion;
|
||||||
|
|||||||
@ -20,7 +20,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { action, computed, IComputedValue, IObservableArray, makeObservable, observable } from "mobx";
|
import { action, computed, IComputedValue, IObservableArray, makeObservable, observable } from "mobx";
|
||||||
import { CatalogCategoryRegistry, catalogCategoryRegistry, CatalogEntity } from "../../common/catalog";
|
import { CatalogCategoryRegistry, catalogCategoryRegistry, CatalogEntity, CatalogEntityKindData } from "../../common/catalog";
|
||||||
import { iter } from "../../common/utils";
|
import { iter } from "../../common/utils";
|
||||||
|
|
||||||
export class CatalogEntityRegistry {
|
export class CatalogEntityRegistry {
|
||||||
@ -62,6 +62,10 @@ export class CatalogEntityRegistry {
|
|||||||
|
|
||||||
return items as T[];
|
return items as T[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getItemsByEntityClass<T extends CatalogEntity>({ apiVersion, kind }: CatalogEntityKindData): T[] {
|
||||||
|
return this.getItemsForApiKind(apiVersion, kind);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const catalogEntityRegistry = new CatalogEntityRegistry(catalogCategoryRegistry);
|
export const catalogEntityRegistry = new CatalogEntityRegistry(catalogCategoryRegistry);
|
||||||
|
|||||||
@ -138,8 +138,8 @@ app.on("ready", async () => {
|
|||||||
|
|
||||||
logger.info("💾 Loading stores");
|
logger.info("💾 Loading stores");
|
||||||
|
|
||||||
UserStore.createInstance().startMainReactions();
|
|
||||||
ClusterStore.createInstance().provideInitialFromMain();
|
ClusterStore.createInstance().provideInitialFromMain();
|
||||||
|
UserStore.createInstance().startMainReactions();
|
||||||
HotbarStore.createInstance();
|
HotbarStore.createInstance();
|
||||||
ExtensionsStore.createInstance();
|
ExtensionsStore.createInstance();
|
||||||
FilesystemProvisionerStore.createInstance();
|
FilesystemProvisionerStore.createInstance();
|
||||||
|
|||||||
@ -20,7 +20,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import type { IpcMainInvokeEvent } from "electron";
|
import type { IpcMainInvokeEvent } from "electron";
|
||||||
import type { KubernetesCluster } from "../../common/catalog-entities";
|
import { KubernetesCluster } from "../../common/catalog-entities";
|
||||||
import { clusterFrameMap } from "../../common/cluster-frames";
|
import { clusterFrameMap } from "../../common/cluster-frames";
|
||||||
import { clusterActivateHandler, clusterSetFrameIdHandler, clusterVisibilityHandler, clusterRefreshHandler, clusterDisconnectHandler, clusterKubectlApplyAllHandler, clusterKubectlDeleteAllHandler, clusterDeleteHandler } from "../../common/cluster-ipc";
|
import { clusterActivateHandler, clusterSetFrameIdHandler, clusterVisibilityHandler, clusterRefreshHandler, clusterDisconnectHandler, clusterKubectlApplyAllHandler, clusterKubectlDeleteAllHandler, clusterDeleteHandler } from "../../common/cluster-ipc";
|
||||||
import { ClusterId, ClusterStore } from "../../common/cluster-store";
|
import { ClusterId, ClusterStore } from "../../common/cluster-store";
|
||||||
@ -50,9 +50,9 @@ export function initIpcMainHandlers() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
ipcMainHandle(clusterVisibilityHandler, (event: IpcMainInvokeEvent, clusterId: ClusterId, visible: boolean) => {
|
ipcMainHandle(clusterVisibilityHandler, (event: IpcMainInvokeEvent, clusterId: ClusterId, visible: boolean) => {
|
||||||
const entity = catalogEntityRegistry.getById<KubernetesCluster>(clusterId);
|
const entity = catalogEntityRegistry.getById(clusterId);
|
||||||
|
|
||||||
for (const kubeEntity of catalogEntityRegistry.getItemsForApiKind(entity.apiVersion, entity.kind)) {
|
for (const kubeEntity of catalogEntityRegistry.getItemsByEntityClass(KubernetesCluster)) {
|
||||||
kubeEntity.status.active = false;
|
kubeEntity.status.active = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -177,6 +177,8 @@ export class LensProxy extends Singleton {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
logger.error(`[LENS-PROXY]: http proxy errored for cluster: ${error}`, { url: req.url });
|
||||||
|
|
||||||
if (target) {
|
if (target) {
|
||||||
logger.debug(`Failed proxy to target: ${JSON.stringify(target, null, 2)}`);
|
logger.debug(`Failed proxy to target: ${JSON.stringify(target, null, 2)}`);
|
||||||
|
|
||||||
@ -196,7 +198,7 @@ export class LensProxy extends Singleton {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
res.writeHead(500).end("Oops, something went wrong.");
|
res.writeHead(500).end(`Oops, something went wrong.\n${error}`);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
logger.error(`[LENS-PROXY]: Failed to write headers: `, e);
|
logger.error(`[LENS-PROXY]: Failed to write headers: `, e);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -51,7 +51,7 @@ export class LocalShellSession extends ShellSession {
|
|||||||
case "bash":
|
case "bash":
|
||||||
return ["--init-file", path.join(await this.kubectlBinDirP, ".bash_set_path")];
|
return ["--init-file", path.join(await this.kubectlBinDirP, ".bash_set_path")];
|
||||||
case "fish":
|
case "fish":
|
||||||
return ["--login", "--init-command", `export PATH="${helmpath}:${kubectlPathDir}:$PATH"; export KUBECONFIG="${this.kubeconfigPathP}"`];
|
return ["--login", "--init-command", `export PATH="${helmpath}:${kubectlPathDir}:$PATH"; export KUBECONFIG="${await this.kubeconfigPathP}"`];
|
||||||
case "zsh":
|
case "zsh":
|
||||||
return ["--login"];
|
return ["--login"];
|
||||||
default:
|
default:
|
||||||
|
|||||||
@ -148,8 +148,8 @@ export default {
|
|||||||
|
|
||||||
store.set("hotbars", hotbars);
|
store.set("hotbars", hotbars);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (!(error.code === "ENOENT" && error.path.endsWith("lens-workspace-store.json"))) {
|
if (error.code !== "ENOENT") {
|
||||||
// ignore lens-workspace-store.json being missing
|
// ignore files being missing
|
||||||
throw error;
|
throw error;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
75
src/migrations/user-store/5.0.3-beta.1.ts
Normal file
75
src/migrations/user-store/5.0.3-beta.1.ts
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
/**
|
||||||
|
* Copyright (c) 2021 OpenLens Authors
|
||||||
|
*
|
||||||
|
* Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
* this software and associated documentation files (the "Software"), to deal in
|
||||||
|
* the Software without restriction, including without limitation the rights to
|
||||||
|
* use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||||
|
* the Software, and to permit persons to whom the Software is furnished to do so,
|
||||||
|
* subject to the following conditions:
|
||||||
|
*
|
||||||
|
* The above copyright notice and this permission notice shall be included in all
|
||||||
|
* copies or substantial portions of the Software.
|
||||||
|
*
|
||||||
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||||
|
* FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||||
|
* COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||||
|
* IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||||
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { app } from "electron";
|
||||||
|
import { existsSync, readJsonSync } from "fs-extra";
|
||||||
|
import path from "path";
|
||||||
|
import os from "os";
|
||||||
|
import { ClusterStore, ClusterStoreModel } from "../../common/cluster-store";
|
||||||
|
import type { KubeconfigSyncEntry, UserPreferencesModel } from "../../common/user-store";
|
||||||
|
import { MigrationDeclaration, migrationLog } from "../helpers";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
version: "5.0.3-beta.1",
|
||||||
|
run(store) {
|
||||||
|
try {
|
||||||
|
const { syncKubeconfigEntries = [], ...preferences }: UserPreferencesModel = store.get("preferences") ?? {};
|
||||||
|
const { clusters = [] }: ClusterStoreModel = readJsonSync(path.resolve(app.getPath("userData"), "lens-cluster-store.json")) ?? {};
|
||||||
|
const syncPaths = new Set(syncKubeconfigEntries.map(s => s.filePath));
|
||||||
|
|
||||||
|
syncPaths.add(path.join(os.homedir(), ".kube"));
|
||||||
|
|
||||||
|
for (const cluster of clusters) {
|
||||||
|
const dirOfKubeconfig = path.dirname(cluster.kubeConfigPath);
|
||||||
|
|
||||||
|
if (dirOfKubeconfig === ClusterStore.storedKubeConfigFolder) {
|
||||||
|
migrationLog(`Skipping ${cluster.id} because kubeConfigPath is under ClusterStore.storedKubeConfigFolder`);
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (syncPaths.has(cluster.kubeConfigPath) || syncPaths.has(dirOfKubeconfig)) {
|
||||||
|
migrationLog(`Skipping ${cluster.id} because kubeConfigPath is already being synced`);
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!existsSync(cluster.kubeConfigPath)) {
|
||||||
|
migrationLog(`Skipping ${cluster.id} because kubeConfigPath no longer exists`);
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
migrationLog(`Adding ${cluster.kubeConfigPath} from ${cluster.id} to sync paths`);
|
||||||
|
syncPaths.add(cluster.kubeConfigPath);
|
||||||
|
}
|
||||||
|
|
||||||
|
const updatedSyncEntries: KubeconfigSyncEntry[] = [...syncPaths].map(filePath => ({ filePath }));
|
||||||
|
|
||||||
|
migrationLog("Final list of synced paths", updatedSyncEntries);
|
||||||
|
store.set("preferences", { ...preferences, syncKubeconfigEntries: updatedSyncEntries });
|
||||||
|
} catch (error) {
|
||||||
|
console.log(error);
|
||||||
|
|
||||||
|
if (error.code !== "ENOENT") {
|
||||||
|
// ignore files being missing
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
} as MigrationDeclaration;
|
||||||
@ -25,6 +25,7 @@ import { joinMigrations } from "../helpers";
|
|||||||
|
|
||||||
import version210Beta4 from "./2.1.0-beta.4";
|
import version210Beta4 from "./2.1.0-beta.4";
|
||||||
import version500Alpha3 from "./5.0.0-alpha.3";
|
import version500Alpha3 from "./5.0.0-alpha.3";
|
||||||
|
import version503Beta1 from "./5.0.3-beta.1";
|
||||||
import { fileNameMigration } from "./file-name-migration";
|
import { fileNameMigration } from "./file-name-migration";
|
||||||
|
|
||||||
export {
|
export {
|
||||||
@ -34,4 +35,5 @@ export {
|
|||||||
export default joinMigrations(
|
export default joinMigrations(
|
||||||
version210Beta4,
|
version210Beta4,
|
||||||
version500Alpha3,
|
version500Alpha3,
|
||||||
|
version503Beta1,
|
||||||
);
|
);
|
||||||
|
|||||||
@ -59,14 +59,7 @@ describe("Extensions", () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
ExtensionInstallationStateStore.reset();
|
ExtensionInstallationStateStore.reset();
|
||||||
UserStore.resetInstance();
|
|
||||||
|
|
||||||
UserStore.createInstance();
|
|
||||||
|
|
||||||
ExtensionDiscovery.resetInstance();
|
|
||||||
ExtensionDiscovery.createInstance().uninstallExtension = jest.fn(() => Promise.resolve());
|
|
||||||
|
|
||||||
ExtensionLoader.resetInstance();
|
|
||||||
ExtensionLoader.createInstance().addExtension({
|
ExtensionLoader.createInstance().addExtension({
|
||||||
id: "extensionId",
|
id: "extensionId",
|
||||||
manifest: {
|
manifest: {
|
||||||
@ -79,10 +72,15 @@ describe("Extensions", () => {
|
|||||||
isEnabled: true,
|
isEnabled: true,
|
||||||
isCompatible: true
|
isCompatible: true
|
||||||
});
|
});
|
||||||
|
ExtensionDiscovery.createInstance().uninstallExtension = jest.fn(() => Promise.resolve());
|
||||||
|
UserStore.createInstance();
|
||||||
});
|
});
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
mockFs.restore();
|
mockFs.restore();
|
||||||
|
UserStore.resetInstance();
|
||||||
|
ExtensionDiscovery.resetInstance();
|
||||||
|
ExtensionLoader.resetInstance();
|
||||||
});
|
});
|
||||||
|
|
||||||
it("disables uninstall and disable buttons while uninstalling", async () => {
|
it("disables uninstall and disable buttons while uninstalling", async () => {
|
||||||
|
|||||||
53
src/renderer/components/dock/__test__/to-bottom.test.tsx
Normal file
53
src/renderer/components/dock/__test__/to-bottom.test.tsx
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
/**
|
||||||
|
* Copyright (c) 2021 OpenLens Authors
|
||||||
|
*
|
||||||
|
* Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
* this software and associated documentation files (the "Software"), to deal in
|
||||||
|
* the Software without restriction, including without limitation the rights to
|
||||||
|
* use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||||
|
* the Software, and to permit persons to whom the Software is furnished to do so,
|
||||||
|
* subject to the following conditions:
|
||||||
|
*
|
||||||
|
* The above copyright notice and this permission notice shall be included in all
|
||||||
|
* copies or substantial portions of the Software.
|
||||||
|
*
|
||||||
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||||
|
* FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||||
|
* COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||||
|
* IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||||
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
|
*/
|
||||||
|
import React from "react";
|
||||||
|
import "@testing-library/jest-dom/extend-expect";
|
||||||
|
import { fireEvent, render } from "@testing-library/react";
|
||||||
|
import { ToBottom } from "../to-bottom";
|
||||||
|
import { noop } from "../../../utils";
|
||||||
|
|
||||||
|
describe("<ToBottom/>", () => {
|
||||||
|
it("renders w/o errors", () => {
|
||||||
|
const { container } = render(<ToBottom onClick={noop}/>);
|
||||||
|
|
||||||
|
expect(container).toBeInstanceOf(HTMLElement);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("has 'To bottom' label", () => {
|
||||||
|
const { getByText } = render(<ToBottom onClick={noop}/>);
|
||||||
|
|
||||||
|
expect(getByText("To bottom")).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("has a arrow down icon", () => {
|
||||||
|
const { getByText } = render(<ToBottom onClick={noop}/>);
|
||||||
|
|
||||||
|
expect(getByText("expand_more")).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("fires an onclick event", () => {
|
||||||
|
const callback = jest.fn();
|
||||||
|
const { getByText } = render(<ToBottom onClick={callback}/>);
|
||||||
|
|
||||||
|
fireEvent.click(getByText("To bottom"));
|
||||||
|
expect(callback).toBeCalled();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -84,17 +84,4 @@
|
|||||||
overflow-x: hidden!important; // fixing scroll to bottom issues in PodLogs
|
overflow-x: hidden!important; // fixing scroll to bottom issues in PodLogs
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.JumpToBottom {
|
|
||||||
position: absolute;
|
|
||||||
right: 30px;
|
|
||||||
padding: 4px 9px;
|
|
||||||
border-radius: 20px;
|
|
||||||
z-index: 2;
|
|
||||||
top: 20px;
|
|
||||||
|
|
||||||
.Icon {
|
|
||||||
--size: calc(var(--unit) * 2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -25,20 +25,19 @@ import React from "react";
|
|||||||
import AnsiUp from "ansi_up";
|
import AnsiUp from "ansi_up";
|
||||||
import DOMPurify from "dompurify";
|
import DOMPurify from "dompurify";
|
||||||
import debounce from "lodash/debounce";
|
import debounce from "lodash/debounce";
|
||||||
import { action, computed, observable, makeObservable } from "mobx";
|
import { action, computed, observable, makeObservable, reaction } from "mobx";
|
||||||
import { observer } from "mobx-react";
|
import { disposeOnUnmount, observer } from "mobx-react";
|
||||||
import moment from "moment-timezone";
|
import moment from "moment-timezone";
|
||||||
import type { Align, ListOnScrollProps } from "react-window";
|
import type { Align, ListOnScrollProps } from "react-window";
|
||||||
|
|
||||||
import { SearchStore, searchStore } from "../../../common/search-store";
|
import { SearchStore, searchStore } from "../../../common/search-store";
|
||||||
import { UserStore } from "../../../common/user-store";
|
import { UserStore } from "../../../common/user-store";
|
||||||
import { cssNames } from "../../utils";
|
import { boundMethod, cssNames } from "../../utils";
|
||||||
import { Button } from "../button";
|
|
||||||
import { Icon } from "../icon";
|
|
||||||
import { Spinner } from "../spinner";
|
import { Spinner } from "../spinner";
|
||||||
import { VirtualList } from "../virtual-list";
|
import { VirtualList } from "../virtual-list";
|
||||||
import { logStore } from "./log.store";
|
import { logStore } from "./log.store";
|
||||||
import { logTabStore } from "./log-tab.store";
|
import { logTabStore } from "./log-tab.store";
|
||||||
|
import { ToBottom } from "./to-bottom";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
logs: string[]
|
logs: string[]
|
||||||
@ -64,41 +63,44 @@ export class LogList extends React.Component<Props> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
this.scrollToBottom();
|
disposeOnUnmount(this, [
|
||||||
|
reaction(() => this.props.logs, this.onLogsInitialLoad),
|
||||||
|
reaction(() => this.props.logs, this.onLogsUpdate),
|
||||||
|
reaction(() => this.props.logs, this.onUserScrolledUp)
|
||||||
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidUpdate(prevProps: Props) {
|
@boundMethod
|
||||||
const { logs, id } = this.props;
|
onLogsInitialLoad(logs: string[], prevLogs: string[]) {
|
||||||
|
if (!prevLogs.length && logs.length) {
|
||||||
if (id != prevProps.id) {
|
|
||||||
this.isLastLineVisible = true;
|
this.isLastLineVisible = true;
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (logs == prevProps.logs || !this.virtualListDiv.current) return;
|
@boundMethod
|
||||||
|
onLogsUpdate() {
|
||||||
|
if (this.isLastLineVisible) {
|
||||||
|
setTimeout(() => {
|
||||||
|
this.scrollToBottom();
|
||||||
|
}, 500); // Giving some time to VirtualList to prepare its outerRef (this.virtualListDiv) element
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const newLogsLoaded = prevProps.logs.length < logs.length;
|
@boundMethod
|
||||||
|
onUserScrolledUp(logs: string[], prevLogs: string[]) {
|
||||||
|
if (!this.virtualListDiv.current) return;
|
||||||
|
|
||||||
|
const newLogsAdded = prevLogs.length < logs.length;
|
||||||
const scrolledToBeginning = this.virtualListDiv.current.scrollTop === 0;
|
const scrolledToBeginning = this.virtualListDiv.current.scrollTop === 0;
|
||||||
|
|
||||||
if (this.isLastLineVisible || prevProps.logs.length == 0) {
|
if (newLogsAdded && scrolledToBeginning) {
|
||||||
this.scrollToBottom(); // Scroll down to keep user watching/reading experience
|
const firstLineContents = prevLogs[0];
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (scrolledToBeginning && newLogsLoaded) {
|
|
||||||
const firstLineContents = prevProps.logs[0];
|
|
||||||
const lineToScroll = this.props.logs.findIndex((value) => value == firstLineContents);
|
const lineToScroll = this.props.logs.findIndex((value) => value == firstLineContents);
|
||||||
|
|
||||||
if (lineToScroll !== -1) {
|
if (lineToScroll !== -1) {
|
||||||
this.scrollToItem(lineToScroll, "start");
|
this.scrollToItem(lineToScroll, "start");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!logs.length) {
|
|
||||||
this.isLastLineVisible = false;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -114,7 +116,7 @@ export class LogList extends React.Component<Props> {
|
|||||||
|
|
||||||
return this.props.logs
|
return this.props.logs
|
||||||
.map(log => logStore.splitOutTimestamp(log))
|
.map(log => logStore.splitOutTimestamp(log))
|
||||||
.map(([logTimestamp, log]) => (`${moment.tz(logTimestamp, UserStore.getInstance().localeTimezone).format()}${log}`));
|
.map(([logTimestamp, log]) => (`${logTimestamp && moment.tz(logTimestamp, UserStore.getInstance().localeTimezone).format()}${log}`));
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -158,7 +160,6 @@ export class LogList extends React.Component<Props> {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@action
|
|
||||||
scrollToBottom = () => {
|
scrollToBottom = () => {
|
||||||
if (!this.virtualListDiv.current) return;
|
if (!this.virtualListDiv.current) return;
|
||||||
this.virtualListDiv.current.scrollTop = this.virtualListDiv.current.scrollHeight;
|
this.virtualListDiv.current.scrollTop = this.virtualListDiv.current.scrollHeight;
|
||||||
@ -169,7 +170,6 @@ export class LogList extends React.Component<Props> {
|
|||||||
};
|
};
|
||||||
|
|
||||||
onScroll = (props: ListOnScrollProps) => {
|
onScroll = (props: ListOnScrollProps) => {
|
||||||
if (!this.virtualListDiv.current) return;
|
|
||||||
this.isLastLineVisible = false;
|
this.isLastLineVisible = false;
|
||||||
this.onScrollDebounced(props);
|
this.onScrollDebounced(props);
|
||||||
};
|
};
|
||||||
@ -264,29 +264,9 @@ export class LogList extends React.Component<Props> {
|
|||||||
className="box grow"
|
className="box grow"
|
||||||
/>
|
/>
|
||||||
{this.isJumpButtonVisible && (
|
{this.isJumpButtonVisible && (
|
||||||
<JumpToBottom onClick={this.scrollToBottom} />
|
<ToBottom onClick={this.scrollToBottom} />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
interface JumpToBottomProps {
|
|
||||||
onClick: () => void
|
|
||||||
}
|
|
||||||
|
|
||||||
const JumpToBottom = ({ onClick }: JumpToBottomProps) => {
|
|
||||||
return (
|
|
||||||
<Button
|
|
||||||
primary
|
|
||||||
className="JumpToBottom flex gaps"
|
|
||||||
onClick={evt => {
|
|
||||||
evt.currentTarget.blur();
|
|
||||||
onClick();
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Jump to bottom
|
|
||||||
<Icon material="expand_more" />
|
|
||||||
</Button>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|||||||
@ -183,7 +183,7 @@ export class LogStore {
|
|||||||
const extraction = /^(\d+\S+)(.*)/m.exec(logs);
|
const extraction = /^(\d+\S+)(.*)/m.exec(logs);
|
||||||
|
|
||||||
if (!extraction || extraction.length < 3) {
|
if (!extraction || extraction.length < 3) {
|
||||||
return ["", ""];
|
return ["", logs];
|
||||||
}
|
}
|
||||||
|
|
||||||
return [extraction[1], extraction[2]];
|
return [extraction[1], extraction[2]];
|
||||||
|
|||||||
38
src/renderer/components/dock/to-bottom.tsx
Normal file
38
src/renderer/components/dock/to-bottom.tsx
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
/**
|
||||||
|
* Copyright (c) 2021 OpenLens Authors
|
||||||
|
*
|
||||||
|
* Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
* this software and associated documentation files (the "Software"), to deal in
|
||||||
|
* the Software without restriction, including without limitation the rights to
|
||||||
|
* use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
||||||
|
* the Software, and to permit persons to whom the Software is furnished to do so,
|
||||||
|
* subject to the following conditions:
|
||||||
|
*
|
||||||
|
* The above copyright notice and this permission notice shall be included in all
|
||||||
|
* copies or substantial portions of the Software.
|
||||||
|
*
|
||||||
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
||||||
|
* FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
||||||
|
* COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
||||||
|
* IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
||||||
|
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
|
*/
|
||||||
|
import React from "react";
|
||||||
|
import { Icon } from "../icon";
|
||||||
|
|
||||||
|
export function ToBottom({ onClick }: { onClick: () => void }) {
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
className="absolute top-3 right-3 z-10 rounded-md flex align-center px-1.5 py-1.5 pl-3.5"
|
||||||
|
style={{ backgroundColor: "var(--blue)" }}
|
||||||
|
onClick={evt => {
|
||||||
|
evt.currentTarget.blur();
|
||||||
|
onClick();
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
To bottom
|
||||||
|
<Icon small material="expand_more" />
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user