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

Using 1 topbar component for all views

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-08-29 12:33:30 +03:00
parent 56705c9600
commit 37567b024e
7 changed files with 7 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/renderer/components/+catalog/catalog.tsx
View File

@ -43,7 +43,7 @@ import { catalogURL, CatalogViewRouteParam } from "../../../common/routes";
import { CatalogMenu } from "./catalog-menu";
import { HotbarIcon } from "../hotbar/hotbar-icon";
import { RenderDelay } from "../render-delay/render-delay";
import { CatalogTopbar } from "../cluster-manager/catalog-topbar";
import { TopBar } from "../layout/topbar";
export const previousActiveTab = createAppStorage("catalog-previous-active-tab", "");
@ -247,7 +247,7 @@ export class Catalog extends React.Component<Props> {
return (
<>
<CatalogTopbar/>
<TopBar/>
<MainLayout sidebar={this.renderNavigation()}>
<div className="p-6 h-full">
{ this.renderList() }

4
src/renderer/components/+welcome/welcome.tsx
View File

@ -26,8 +26,8 @@ import Carousel from "react-material-ui-carousel";
import { Icon } from "../icon";
import { productName, slackUrl } from "../../../common/vars";
import { WelcomeMenuRegistry } from "../../../extensions/registries";
import { WelcomeTopbar } from "../cluster-manager/welcome-topbar";
import { WelcomeBannerRegistry } from "../../../extensions/registries";
import { TopBar } from "../layout/topbar";
export const defaultWidth = 320;
@ -49,7 +49,7 @@ export class Welcome extends React.Component {
return (
<>
<WelcomeTopbar/>
<TopBar/>
<div className="flex justify-center Welcome align-center">
<div style={{ width: `${maxWidth}px` }} data-testid="welcome-banner-container">
{welcomeBanner.length > 0 ? (

41
src/renderer/components/cluster-manager/catalog-topbar.tsx
View File

@ -1,41 +0,0 @@
/**
* 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 { welcomeURL } from "../../../common/routes";
import { navigate } from "../../navigation";
import { Icon } from "../icon";
import { TopBar } from "../layout/topbar";
export function CatalogTopbar() {
return (
<TopBar label="Catalog">
<div>
<Icon
style={{ cursor: "default" }}
material="close"
onClick={() => navigate(welcomeURL())}
tooltip="Close Catalog"
/>
</div>
</TopBar>
);
}

61
src/renderer/components/cluster-manager/cluster-topbar.tsx
View File

@ -1,61 +0,0 @@
/**
* 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 { observer } from "mobx-react";
import React from "react";
import { previousActiveTab } from "../+catalog";
import { ClusterStore } from "../../../common/cluster-store";
import { catalogURL } from "../../../common/routes";
import { navigate } from "../../navigation";
import { Icon } from "../icon";
import { TopBar } from "../layout/topbar";
import type { RouteComponentProps } from "react-router";
import type { ClusterViewRouteParams } from "../../../common/routes";
import type { Cluster } from "../../../main/cluster";
import { TooltipPosition } from "../tooltip";
interface Props extends RouteComponentProps<ClusterViewRouteParams> {
}
export const ClusterTopbar = observer((props: Props) => {
const getCluster = (): Cluster | undefined => {
return ClusterStore.getInstance().getById(props.match.params.clusterId);
};
return (
<TopBar label={getCluster()?.name}>
<div>
<Icon
style={{ cursor: "default" }}
material="close"
onClick={() => {
navigate(`${catalogURL()}/${previousActiveTab.get()}`);
}}
tooltip={{
preferredPositions: TooltipPosition.BOTTOM_RIGHT,
children: "Back to Catalog"
}}
/>
</div>
</TopBar>
);
});

4
src/renderer/components/cluster-manager/cluster-view.tsx
View File

@ -34,7 +34,7 @@ import { catalogEntityRegistry } from "../../api/catalog-entity-registry";
import { navigate } from "../../navigation";
import { catalogURL, ClusterViewRouteParams } from "../../../common/routes";
import { previousActiveTab } from "../+catalog";
import { ClusterTopbar } from "./cluster-topbar";
import { TopBar } from "../layout/topbar";
interface Props extends RouteComponentProps<ClusterViewRouteParams> {
}
@ -105,7 +105,7 @@ export class ClusterView extends React.Component<Props> {
render() {
return (
<div className="ClusterView flex column align-center">
<ClusterTopbar {...this.props}/>
<TopBar/>
{this.renderStatus()}
</div>
);

30
src/renderer/components/cluster-manager/welcome-topbar.tsx
View File

@ -1,30 +0,0 @@
/**
* 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 { TopBar } from "../layout/topbar";
export function WelcomeTopbar() {
return (
<TopBar label="Welcome">
</TopBar>
);
}

3
src/renderer/components/layout/topbar.tsx
View File

@ -30,7 +30,6 @@ import { ipcRendererOn } from "../../../common/ipc";
import { watchHistoryState } from "../../remote-helpers/history-updater";
interface Props extends React.HTMLAttributes<any> {
label: React.ReactNode;
}
const prevEnabled = observable.box(false);
@ -44,7 +43,7 @@ ipcRendererOn("history:can-go-forward", (event, state: boolean) => {
nextEnabled.set(state);
});
export const TopBar = observer(({ label, children, ...rest }: Props) => {
export const TopBar = observer(({ children, ...rest }: Props) => {
const renderRegisteredItems = () => {
const items = TopBarRegistry.getInstance().getItems();