LumeWeb
/
skynet-webportal
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(dashboard-v2): make circle around checkmark icon optional

This commit is contained in:
Michał Leszczyk 2022-03-22 13:47:08 +01:00
parent f26822900f
commit c058270a79
No known key found for this signature in database
GPG Key ID: FA123CA8BAA2FBF4
3 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/dashboard-v2/src/components/Icons/icons/CircledCheckmarkIcon.js → packages/dashboard-v2/src/components/Icons/icons/CheckmarkIcon.js
View File

@ -1,6 +1,8 @@
import PropTypes from "prop-types";
import { withIconProps } from "../withIconProps"; import { withIconProps } from "../withIconProps";
export const CircledCheckmarkIcon = withIconProps(({ size, ...props }) => ( export const CheckmarkIcon = withIconProps(({ size, circled, ...props }) => (
<svg <svg
width={size} width={size}
height={size} height={size}
@ -9,10 +11,15 @@ export const CircledCheckmarkIcon = withIconProps(({ size, ...props }) => (
shapeRendering="geometricPrecision" shapeRendering="geometricPrecision"
{...props} {...props}
> >
<circle cx="16" cy="16" r="15" fill="transparent" stroke="currentColor" strokeWidth="2" /> {circled && <circle cx="16" cy="16" r="15" fill="transparent" stroke="currentColor" strokeWidth="2" />}
<polygon <polygon
fill="currentColor" fill="currentColor"
points="22.45 11.19 23.86 12.61 14.44 22.03 9.69 17.28 11.1 15.86 14.44 19.2 22.45 11.19" points="22.45 11.19 23.86 12.61 14.44 22.03 9.69 17.28 11.1 15.86 14.44 19.2 22.45 11.19"
/> />
</svg> </svg>
)); ));
CheckmarkIcon.propTypes = {
...CheckmarkIcon.propTypes,
circled: PropTypes.bool,
};

2
packages/dashboard-v2/src/components/Icons/index.js
View File

@ -4,7 +4,7 @@ export * from "./icons/LockClosedIcon";
export * from "./icons/SkynetLogoIcon"; export * from "./icons/SkynetLogoIcon";
export * from "./icons/ArrowRightIcon"; export * from "./icons/ArrowRightIcon";
export * from "./icons/InfoIcon"; export * from "./icons/InfoIcon";
export * from "./icons/CircledCheckmarkIcon"; export * from "./icons/CheckmarkIcon";
export * from "./icons/CircledErrorIcon"; export * from "./icons/CircledErrorIcon";
export * from "./icons/CircledProgressIcon"; export * from "./icons/CircledProgressIcon";
export * from "./icons/CircledArrowUpIcon"; export * from "./icons/CircledArrowUpIcon";

4
packages/dashboard-v2/src/components/Uploader/UploaderItemIcon.js
View File

@ -1,6 +1,6 @@
import cn from "classnames"; import cn from "classnames";
import { CircledCheckmarkIcon, CircledErrorIcon, CircledProgressIcon, CircledArrowUpIcon } from "../Icons"; import { CheckmarkIcon, CircledErrorIcon, CircledProgressIcon, CircledArrowUpIcon } from "../Icons";
export default function UploaderItemIcon({ status }) { export default function UploaderItemIcon({ status }) {
switch (status) { switch (status) {
@ -11,7 +11,7 @@ export default function UploaderItemIcon({ status }) {
case "processing": case "processing":
return <CircledProgressIcon className="animate-[spin_3s_linear_infinite]" />; return <CircledProgressIcon className="animate-[spin_3s_linear_infinite]" />;
case "complete": case "complete":
return <CircledCheckmarkIcon />; return <CheckmarkIcon circled />;
case "error": case "error":
return <CircledErrorIcon className="text-error" />; return <CircledErrorIcon className="text-error" />;
default: default: