From 693385a0a09dceb71e25494fb51dff28751e9691 Mon Sep 17 00:00:00 2001 From: Roman Date: Wed, 15 Jul 2020 16:54:40 +0300 Subject: [PATCH] added what-s-new page, fixes Signed-off-by: Roman --- src/common/user-store.ts | 4 +- src/main/window-manager.ts | 2 + .../+landing-page/landing-page.scss | 7 ---- .../components/+whats-new/whats-new.scss | 40 +++++++++++++++++++ .../components/+whats-new/whats-new.tsx | 34 +++++++++++++++- src/renderer/components/app.scss | 17 ++++---- .../cluster-manager/cluster-manager.tsx | 6 ++- src/renderer/components/layout/sidebar.tsx | 16 ++++++-- src/renderer/index.tsx | 18 ++++++--- 9 files changed, 114 insertions(+), 30 deletions(-) diff --git a/src/common/user-store.ts b/src/common/user-store.ts index 396b41c27e..c52469363b 100644 --- a/src/common/user-store.ts +++ b/src/common/user-store.ts @@ -22,7 +22,7 @@ export interface UserPreferences { export class UserStore extends BaseStore { private constructor() { super({ - configName: "lens-user-store", + // configName: "lens-user-store", // todo: migrate from default filename migrations: migrations, }); @@ -42,7 +42,7 @@ export class UserStore extends BaseStore { downloadMirror: "default", }; - get hasNewAppVersion() { + get isNewVersion() { return semver.gt(getAppVersion(), this.lastSeenAppVersion); } diff --git a/src/main/window-manager.ts b/src/main/window-manager.ts index ad4a761e1b..38b70f3780 100644 --- a/src/main/window-manager.ts +++ b/src/main/window-manager.ts @@ -5,6 +5,8 @@ import type { ClusterId } from "../common/cluster-store"; import { clusterStore } from "../common/cluster-store"; import logger from "./logger"; +// fixme: remove switching view delay on first load + export class WindowManager { protected activeView: BrowserWindow; protected views = new Map(); diff --git a/src/renderer/components/+landing-page/landing-page.scss b/src/renderer/components/+landing-page/landing-page.scss index 665527947a..6cc726f5d9 100644 --- a/src/renderer/components/+landing-page/landing-page.scss +++ b/src/renderer/components/+landing-page/landing-page.scss @@ -5,11 +5,4 @@ background-size: 85%; background-clip: content-box; text-align: center; - - h1 { - color: white; - text-align: center; - font-size: 28px; - font-weight: normal; - } } \ No newline at end of file diff --git a/src/renderer/components/+whats-new/whats-new.scss b/src/renderer/components/+whats-new/whats-new.scss index 89d12cf108..b77fa30543 100644 --- a/src/renderer/components/+whats-new/whats-new.scss +++ b/src/renderer/components/+whats-new/whats-new.scss @@ -1,3 +1,43 @@ .WhatsNew { + $spacing: $padding * 2; + background: $mainBackground url(../../components/icon/crane.svg) no-repeat; + background-position: 0 35%; + background-size: 85%; + background-clip: content-box; + + .logo { + width: 200px; + margin-bottom: $spacing; + } + + > .content { + @include custom-scrollbar; + margin-top: $spacing; + padding: $spacing * 2; + + a { + color: $colorInfo; + text-decoration: underline; + } + + ul { + list-style: disc inside; + line-height: 120%; + padding-left: $spacing * 2; + } + + code { + display: inline-block; + padding: 0.25em .5em; + vertical-align: middle; + border-radius: $radius; + } + } + + > .bottom { + text-align: center; + padding: $spacing; + background: $contentColor; + } } \ No newline at end of file diff --git a/src/renderer/components/+whats-new/whats-new.tsx b/src/renderer/components/+whats-new/whats-new.tsx index ab9069d46b..1fcd0691d9 100644 --- a/src/renderer/components/+whats-new/whats-new.tsx +++ b/src/renderer/components/+whats-new/whats-new.tsx @@ -1,13 +1,43 @@ import "./whats-new.scss" +import fs from "fs"; +import path from "path"; import React from "react"; import { observer } from "mobx-react"; +import { userStore } from "../../../common/user-store" +import { navigate } from "../../navigation"; +import { Button } from "../button"; +import { Trans } from "@lingui/macro"; +import { staticDir } from "../../../common/vars"; +import marked from "marked" @observer export class WhatsNew extends React.Component { + releaseNotes = fs.readFileSync(path.join(staticDir, "RELEASE_NOTES.md")).toString(); + + ok = () => { + navigate("/"); + userStore.saveLastSeenAppVersion(); + } + render() { + const logo = require("../../components/icon/lens-logo.svg"); + const releaseNotes = marked(this.releaseNotes); return ( -
- WhatsNew +
+
+ Lens +
+
+
+
); } diff --git a/src/renderer/components/app.scss b/src/renderer/components/app.scss index 69c6c56c27..7f3f26fc03 100755 --- a/src/renderer/components/app.scss +++ b/src/renderer/components/app.scss @@ -37,6 +37,10 @@ html, body { #app { height: 100%; min-height: 100%; + + > * { + height: inherit; + } } // fixme: doesn't work @@ -75,37 +79,34 @@ hr { } h1 { - font-size: 11.2rem; - font-weight: $font-weight-thin; + color: white; + font-size: 28px; + font-weight: 300; letter-spacing: -.010em; margin: 0; } h2 { @extend h1; - font-size: 5.6 * $unit; + font-size: 20px; } h3 { @extend h2; - font-size: 4.5 * $unit; + font-size: 17px; } h4 { @extend h2; - font-size: 3.4 * $unit; } h5 { @extend h2; - font-size: 2.6 * $unit; padding: $padding / 2 0; } h6 { @extend h2; - font-size: 2 * $unit; - font-weight: $font-weight-bold; } small { diff --git a/src/renderer/components/cluster-manager/cluster-manager.tsx b/src/renderer/components/cluster-manager/cluster-manager.tsx index f6cab716dc..6b6ebc6200 100644 --- a/src/renderer/components/cluster-manager/cluster-manager.tsx +++ b/src/renderer/components/cluster-manager/cluster-manager.tsx @@ -2,14 +2,16 @@ import "./cluster-manager.scss" import React from "react"; import { ClustersMenu } from "./clusters-menu"; import { BottomBar } from "./bottom-bar"; +import { App } from "../app"; export class ClusterManager extends React.Component { render() { - const { children: lensView } = this.props; return (
-
{lensView}
+
+ +
diff --git a/src/renderer/components/layout/sidebar.tsx b/src/renderer/components/layout/sidebar.tsx index 0939da2a82..0b742a21b3 100644 --- a/src/renderer/components/layout/sidebar.tsx +++ b/src/renderer/components/layout/sidebar.tsx @@ -6,7 +6,6 @@ import { computed, observable, reaction } from "mobx"; import { observer } from "mobx-react"; import { matchPath, NavLink } from "react-router-dom"; import { Trans } from "@lingui/macro"; -import { configStore } from "../../config.store"; import { createStorage, cssNames } from "../../utils"; import { Icon } from "../icon"; import { workloadsRoute, workloadsURL } from "../+workloads/workloads.route"; @@ -29,6 +28,7 @@ import { CrdList, crdResourcesRoute, crdRoute, crdURL } from "../+custom-resourc import { CustomResources } from "../+custom-resources/custom-resources"; import { navigation } from "../../navigation"; import { isAllowedResource } from "../../api/rbac" +import { TooltipContent } from "../tooltip"; const SidebarContext = React.createContext({ pinned: false }); type SidebarContextValue = { @@ -72,20 +72,28 @@ export class Sidebar extends React.Component { render() { const { toggle, isPinned, className } = this.props; - const { allowedResources } = configStore; const query = namespaceStore.getContextParams(); return (
-
Lens
+ +
Lens
 Compact view : Extended view} + tooltip={{ + following: false, + position: { right: true }, + children: ( + + Compact view + + ) + }} focusable={false} />
diff --git a/src/renderer/index.tsx b/src/renderer/index.tsx index fa9a118a47..0d11cb0c02 100644 --- a/src/renderer/index.tsx +++ b/src/renderer/index.tsx @@ -1,7 +1,8 @@ import "../common/system-ca" import React from "react"; import { render } from "react-dom"; -import { Router } from "react-router"; +import { Route, Router, Switch } from "react-router"; +import { observer } from "mobx-react"; import { userStore } from "../common/user-store"; import { workspaceStore } from "../common/workspace-store"; import { clusterStore } from "../common/cluster-store"; @@ -11,7 +12,10 @@ import { _i18n } from "./i18n"; import { App } from "./components/app"; import { ClusterManager } from "./components/cluster-manager"; import { ErrorBoundary } from "./components/error-boundary"; +import { WhatsNew, whatsNewRoute } from "./components/+whats-new"; +import { Preferences, preferencesRoute } from "./components/+preferences"; +@observer class LensApp extends React.Component { static async init() { await Promise.all([ @@ -28,9 +32,12 @@ class LensApp extends React.Component { - - - + + {userStore.isNewVersion && } + + + + @@ -38,4 +45,5 @@ class LensApp extends React.Component { } } -window.addEventListener("load", LensApp.init); +// run +LensApp.init();