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

Use classnames from a scss module

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-08-30 11:01:26 +03:00
parent 82975856a8
commit c80d7ebce3
1 changed files with 6 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/renderer/components/layout/sidebar-item.tsx
View File

@ -3,7 +3,7 @@
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import "./sidebar-item.scss";
import styles from "./sidebar-items.module.scss";
import React from "react";
import { computed, makeObservable } from "mobx";
@ -70,7 +70,7 @@ class NonInjectedSidebarItem extends React.Component<
}
return (
<ul className={cssNames("sub-menu", { active: this.isActive })}>
<ul className={cssNames(styles.subMenu, { [styles.active]: this.isActive })}>
{this.props.item.children.map(item => <SidebarItem key={item.registration.id} item={item} />)}
</ul>
);
@ -79,7 +79,7 @@ class NonInjectedSidebarItem extends React.Component<
render() {
return (
<div
className={cssNames("SidebarItem")}
className={styles.SidebarItem}
data-testid={`sidebar-item-${this.id}`}
data-is-active-test={this.isActive}
data-parent-id-test={this.registration.parentId}
@ -87,11 +87,7 @@ class NonInjectedSidebarItem extends React.Component<
<NavLink
to={""}
isActive={() => this.isActive}
className={cssNames("nav-item flex gaps align-center", {
expandable: this.isExpandable,
})}
className={styles.navItem}
onClick={(event) => {
event.preventDefault();
event.stopPropagation();
@ -105,10 +101,10 @@ class NonInjectedSidebarItem extends React.Component<
data-testid={`sidebar-item-link-for-${this.id}`}
>
{this.registration.getIcon?.()}
<span className="link-text box grow">{this.registration.title}</span>
<span>{this.registration.title}</span>
{this.isExpandable && (
<Icon
className="expand-icon box right"
className={styles.expandIcon}
material={
this.expanded ? "keyboard_arrow_up" : "keyboard_arrow_down"
}