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

Set rating elements

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-02-09 12:47:39 +03:00
parent 282c090f97
commit 5b2c233d24
2 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/renderer/components/+preferences/extension-card.module.scss
View File

@ -40,6 +40,9 @@
font-weight: bolder; font-weight: bolder;
color: #d7dae0; color: #d7dae0;
font-size: larger; font-size: larger;
display: flex;
align-items: center;
gap: 8px;
} }
.version { .version {

37
src/renderer/components/+preferences/extension-card.tsx
View File

@ -6,6 +6,7 @@ import styles from "./extension-card.module.scss";
import { withInjectables } from "@ogre-tools/injectable-react"; import { withInjectables } from "@ogre-tools/injectable-react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import Rating from "@material-ui/lab/Rating";
import installFromInputInjectable from "../+extensions/install-from-input/install-from-input.injectable"; import installFromInputInjectable from "../+extensions/install-from-input/install-from-input.injectable";
import { Button } from "../button"; import { Button } from "../button";
@ -40,15 +41,16 @@ function NonInjectedExtensionCard({
extensionInstallationStateStore: store, extensionInstallationStateStore: store,
installFromInput, installFromInput,
onClick, onClick,
confirmUninstallExtension, // confirmUninstallExtension,
enableExtension, // enableExtension,
disableExtension, // disableExtension,
// userExtensions, // userExtensions,
}: Props & Dependencies) { }: Props & Dependencies) {
const { name, version, totalNumberOfInstallations, shortDescription, publisher, githubRepositoryUrl, appIconUrl } = extension; const { name, version, totalNumberOfInstallations, shortDescription, publisher, githubRepositoryUrl, appIconUrl } = extension;
// const installedExtension = userExtensions.get().find(installed => installed.manifest.name == name); // const installedExtension = userExtensions.get().find(installed => installed.manifest.name == name);
const [waiting, setWaiting] = useState(false); const [waiting, setWaiting] = useState(false);
const installed = true; const installed = true;
const rating = name.toLowerCase().includes("space") ? 5 : Math.floor(Math.random() * 5) + 1;
useEffect(() => { useEffect(() => {
if (!store.anyPreInstallingOrInstalling) { if (!store.anyPreInstallingOrInstalling) {
@ -62,20 +64,20 @@ function NonInjectedExtensionCard({
installFromInput(extension.binaryUrl); installFromInput(extension.binaryUrl);
} }
function onUninstall(evt: React.MouseEvent, extension: InstalledExtension) { // function onUninstall(evt: React.MouseEvent, extension: InstalledExtension) {
evt.stopPropagation(); // evt.stopPropagation();
confirmUninstallExtension(extension); // confirmUninstallExtension(extension);
} // }
function onStatusToggle(evt: React.MouseEvent, extension: InstalledExtension) { // function onStatusToggle(evt: React.MouseEvent, extension: InstalledExtension) {
evt.stopPropagation(); // evt.stopPropagation();
if (extension.isEnabled) { // if (extension.isEnabled) {
disableExtension(extension.id); // disableExtension(extension.id);
} else { // } else {
enableExtension(extension.id); // enableExtension(extension.id);
} // }
} // }
return ( return (
<div className={styles.extensionCard} onClick={onClick}> <div className={styles.extensionCard} onClick={onClick}>
@ -83,7 +85,10 @@ function NonInjectedExtensionCard({
<div className={styles.contents}> <div className={styles.contents}>
<div className={styles.head}> <div className={styles.head}>
<div className={styles.nameAndVersion}> <div className={styles.nameAndVersion}>
<div className={styles.name}>{name}</div> <div className={styles.name}>
{name}
<Rating name="read-only" value={rating} readOnly />
</div>
<div className={styles.version}>{version}</div> <div className={styles.version}>{version}</div>
</div> </div>