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

Fix custom resource loading spinner appears above extensions' cluster menus (#2344)

Browse Source
This commit is contained in:
Sebastian Malton 2021-04-20 08:04:16 -04:00 committed by GitHub
parent bffdbcbd4c
commit ccf8928770
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/renderer/components/layout/sidebar.tsx
View File

@ -2,7 +2,6 @@ import "./sidebar.scss";
import type { TabLayoutRoute } from "./tab-layout";
import React from "react";
import { computed } from "mobx";
import { observer } from "mobx-react";
import { NavLink } from "react-router-dom";
import { cssNames } from "../../utils";
@ -45,9 +44,13 @@ export class Sidebar extends React.Component<Props> {
crdStore.reloadAll();
}
@computed get crdSubMenus(): React.ReactNode {
if (!crdStore.isLoaded && crdStore.isLoading) {
return <Spinner centerHorizontal/>;
renderCustomResources() {
if (crdStore.isLoading) {
return (
<div className="flex justify-center">
<Spinner />
</div>
);
}
return Object.entries(crdStore.groups).map(([group, crds]) => {
@ -268,7 +271,7 @@ export class Sidebar extends React.Component<Props> {
icon={<Icon material="extension"/>}
>
{this.renderTreeFromTabRoutes(CustomResources.tabRoutes)}
{this.crdSubMenus}
{this.renderCustomResources()}
</SidebarItem>
{this.renderRegisteredMenus()}
</div>

6
src/renderer/components/spinner/spinner.scss
View File

@ -34,12 +34,6 @@
margin-top: calc(var(--spinner-size) / -2);
}
&.centerHorizontal {
position: absolute;
left: 50%;
margin-left: calc(var(--spinner-size) / -2);
}
@keyframes rotate {
0% {
transform: rotate(0deg);

5
src/renderer/components/spinner/spinner.tsx
View File

@ -6,7 +6,6 @@ import { cssNames } from "../../utils";
export interface SpinnerProps extends React.HTMLProps<any> {
singleColor?: boolean;
center?: boolean;
centerHorizontal?: boolean;
}
export class Spinner extends React.Component<SpinnerProps, {}> {
@ -16,8 +15,8 @@ export class Spinner extends React.Component<SpinnerProps, {}> {
};
render() {
const { center, singleColor, centerHorizontal, className, ...props } = this.props;
const classNames = cssNames("Spinner", className, { singleColor, center, centerHorizontal });
const { center, singleColor, className, ...props } = this.props;
const classNames = cssNames("Spinner", className, { singleColor, center });
return <div {...props} className={classNames} />;
}