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