From 691dfee4f858e3135710ffea53fd72cdff08bfe7 Mon Sep 17 00:00:00 2001
From: VakarisZ <vakarisz@yahoo.com>
Date: Tue, 1 Jun 2021 10:13:40 +0300
Subject: [PATCH] Added an upload status icon (checkmark if successful, red x
if error)
---
.../ui-components/UploadStatusIcon.tsx | 23 +++++++++++++++++++
.../cc/ui/src/styles/components/Icons.scss | 10 +++++++-
2 files changed, 32 insertions(+), 1 deletion(-)
create mode 100644 monkey/monkey_island/cc/ui/src/components/ui-components/UploadStatusIcon.tsx
diff --git a/monkey/monkey_island/cc/ui/src/components/ui-components/UploadStatusIcon.tsx b/monkey/monkey_island/cc/ui/src/components/ui-components/UploadStatusIcon.tsx
new file mode 100644
index 000000000..5db4790cb
--- /dev/null
+++ b/monkey/monkey_island/cc/ui/src/components/ui-components/UploadStatusIcon.tsx
@@ -0,0 +1,23 @@
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faCheck, faTimes} from '@fortawesome/free-solid-svg-icons';
+import React from 'react';
+
+
+export const UploadStatuses = {
+ clean: 'clean',
+ success: 'success',
+ error: 'error'
+}
+
+const UploadStatusIcon = (props: { status: string }) => {
+ switch (props.status) {
+ case UploadStatuses.success:
+ return (<FontAwesomeIcon icon={faCheck} className={'upload-status-icon-success'}/>);
+ case UploadStatuses.error:
+ return (<FontAwesomeIcon icon={faTimes} className={'upload-status-icon-error'}/>);
+ default:
+ return null;
+ }
+}
+
+export default UploadStatusIcon;
diff --git a/monkey/monkey_island/cc/ui/src/styles/components/Icons.scss b/monkey/monkey_island/cc/ui/src/styles/components/Icons.scss
index 2da5087b6..9d89a7e48 100644
--- a/monkey/monkey_island/cc/ui/src/styles/components/Icons.scss
+++ b/monkey/monkey_island/cc/ui/src/styles/components/Icons.scss
@@ -11,7 +11,7 @@
}
.icon-success {
- color: $success
+ color: $success;
}
.icon-failed {
@@ -26,3 +26,11 @@
transform: rotate(359deg);
}
}
+
+.upload-status-icon-success {
+ color: $success;
+}
+
+.upload-status-icon-error {
+ color: $danger;
+}