From 25e75d155b46e846c7ecfb7e908743d6ffaa8c86 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 14:55:22 +0300 Subject: [PATCH 01/56] [SPT-767] Added Data preset tab --- .../actionCreators/ServiceTrainingActions.js | 28 ++++- .../DataPreset/DatasetUploader/index.js | 103 ++++++++++++++++++ .../DataPreset/DatasetUploader/styles.js | 22 ++++ .../ServiceDetails/DataPreset/index.js | 33 ++++++ .../ServiceDetails/DataPreset/styles.js | 1 + .../CreateModel/Data/Upload/index.js | 4 +- src/components/ServiceDetails/index.js | 21 +++- src/components/common/SNETFileUpload/index.js | 16 +-- .../common/SNETFileUpload/styles.js | 4 + 9 files changed, 213 insertions(+), 19 deletions(-) create mode 100644 src/components/ServiceDetails/DataPreset/DatasetUploader/index.js create mode 100644 src/components/ServiceDetails/DataPreset/DatasetUploader/styles.js create mode 100644 src/components/ServiceDetails/DataPreset/index.js create mode 100644 src/components/ServiceDetails/DataPreset/styles.js diff --git a/src/Redux/actionCreators/ServiceTrainingActions.js b/src/Redux/actionCreators/ServiceTrainingActions.js index 9644a735e..2fa028a4e 100644 --- a/src/Redux/actionCreators/ServiceTrainingActions.js +++ b/src/Redux/actionCreators/ServiceTrainingActions.js @@ -189,20 +189,40 @@ const modelStatusByNumber = { 4: "DELETED", }; -export const publishDatasetToS3 = async (fileBlob, name) => { +export const publishDatasetForTraining = async (fileBlob, name) => { + const linkToDataset = await publishDatasetToS3( + fileBlob, + name, + "https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default", + "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7" + ); + return linkToDataset; +}; + +export const publishDatasetForImproving = async (fileBlob, name) => { + const linkToDataset = await publishDatasetToS3( + fileBlob, + name, + "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com", + "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH" + ); + return linkToDataset; +}; + +export const publishDatasetToS3 = async (fileBlob, name, baseUrl, authToken) => { try { const fileKey = Date.now() + "_" + name; - const url = `https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default/upload?key=${fileKey}`; + const url = `${baseUrl}/upload?key=${fileKey}`; let instance = axios.create({ headers: { - Authorization: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", + Authorization: authToken, }, }); const response = await instance.get(url); await axios.put(response.data.uploadURL, fileBlob); - return `https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default/download?key=${fileKey}`; + return `${baseUrl}/download?key=${fileKey}`; } catch (err) { throw new Error(err); } diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js new file mode 100644 index 000000000..8f7342d85 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -0,0 +1,103 @@ +import { useState } from "react"; +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; +import { publishDatasetForImproving } from "../../../../Redux/actionCreators/ServiceTrainingActions"; +import SNETFileUpload from "../../../common/SNETFileUpload"; +import { isEmpty } from "lodash"; + +const examplesDatasets = [ + { id: 1, tag: "Text", name: "Dataset 1", link: "link/to/s3/1" }, + { id: 2, tag: "Text", name: "Dataset 2", link: "link/to/s3/2" }, + { id: 3, tag: "Text", name: "Dataset 3", link: "link/to/s3/3" }, + { id: 4, tag: "Text", name: "Dataset 4", link: "link/to/s3/4" }, +]; + +const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; + +const DatasetUploader = ({ classes, setDatasetLink }) => { + // const [uploadedDataset, setUploadedDataset] = useState() + const [trainingDataFileName, setTrainingDataFileName] = useState(""); + const [trainingDataFileSize, setTrainingDataFileSize] = useState(""); + + // const setDataset = async (datasetBlob) => { + // const linkToDataset = await publishDatasetForImproving(datasetBlob); //sentToS3(datasetBlob); + // setUploadedDataset(datasetBlob); + // setDatasetLink(linkToDataset); + // }; + + const ExampleDataset = ({ name, link, tag }) => { + return ( +
setDatasetLink(link)} className={classes.exampleDataset}> +
{name}
+
{tag}
+
+ ); + }; + + const ExampleFiles = () => { + return ( +
+ {examplesDatasets.map((exampleDataset) => ( + + ))} +
+ ); + }; + + const handleDrop = async (acceptedFiles, rejectedFiles) => { + if (!isEmpty(rejectedFiles)) { + console.log("rejectedFiles: ", rejectedFiles); + return; + } + if (!isEmpty(acceptedFiles)) { + try { + const fileBlob = acceptedFiles[0]; + const { name, size } = fileBlob; + + setTrainingDataFileName(name); + setTrainingDataFileSize(size); + const url = await publishDatasetForImproving(fileBlob, name); + setDatasetLink(url); + } catch (error) { + console.log("error: ", error); + + // setAlert({ type: alertTypes.ERROR, message: error.message }); + } + } + }; + + return ( +
+
+

Drag & Drop or Select File

+ +

* Package must be under 50mb

+

* Make sure the extension is .zip

+ + } + fileName={trainingDataFileName} + fileSize={trainingDataFileSize} + uploadSuccess={Boolean(trainingDataFileName)} + isFileStatsDisplay={false} + /> +
+
+ Select exemple dataset + +
+
+ ); +}; + +export default withStyles(useStyles)(DatasetUploader); diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/styles.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/styles.js new file mode 100644 index 000000000..8d2ce5c57 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/styles.js @@ -0,0 +1,22 @@ +export const useStyles = (theme) => ({ + datasetUploader: { + display: "flex", + flexDirection: "column", + gap: 16, + }, + examplesContainer: { + display: "flex", + flexDirection: "column", + gap: 16, + }, + exampleDataset: { + display: "flex", + padding: "8px 12px", + alignItems: "center", + gap: 8, + alignSelf: "stretch", + borderRadius: 8, + background: theme.palette.text.gray, + cursor: "pointer", + }, +}); diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js new file mode 100644 index 000000000..a189fda5b --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -0,0 +1,33 @@ +import React, { useState } from "react"; +import Card from "../../common/Card"; +import { Grid } from "@mui/material"; +import DatasetUploader from "./DatasetUploader"; + +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +const DataPreset = ({ classes }) => { + const [datasetLink, setDatasetLink] = useState(); + + console.log("datasetLink: ", datasetLink); + + const DataPresetContainer = () => { + return ( +
+

Upload Your Dataset

+ + + + + + + + +
+ ); + }; + + return } />; +}; + +export default withStyles(useStyles)(DataPreset); diff --git a/src/components/ServiceDetails/DataPreset/styles.js b/src/components/ServiceDetails/DataPreset/styles.js new file mode 100644 index 000000000..67868c7be --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/styles.js @@ -0,0 +1 @@ +export const useStyles = (theme) => ({}); diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index 52afbe3e5..3fa7997fb 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import { publishDatasetToS3 } from "../../../../../../Redux/actionCreators/ServiceTrainingActions"; +import { publishDatasetForTraining } from "../../../../../../Redux/actionCreators/ServiceTrainingActions"; import AlertBox, { alertTypes } from "../../../../../common/AlertBox"; import { isEmpty } from "lodash"; import SNETFileUpload from "../../../../../common/SNETFileUpload"; @@ -29,7 +29,7 @@ const Data = ({ classes, trainingDataLink, setTrainingDataLink }) => { setTrainingDataFileName(name); setTrainingDataFileSize(size); - const url = await publishDatasetToS3(fileBlob, name); + const url = await publishDatasetForTraining(fileBlob, name); setTrainingDataLink(url); } catch (error) { diff --git a/src/components/ServiceDetails/index.js b/src/components/ServiceDetails/index.js index e35f7c625..3d57486bf 100644 --- a/src/components/ServiceDetails/index.js +++ b/src/components/ServiceDetails/index.js @@ -32,6 +32,7 @@ import SeoMetadata from "../common/SeoMetadata"; import Routes from "../../utility/constants/Routes"; import CardImg from "../../assets/images/SnetDefaultServiceImage.png"; import TrainingModels from "./TrainingModels"; +import DataPreset from "./DataPreset"; export const HERO_IMG = "hero_image"; @@ -119,12 +120,20 @@ const ServiceDetails = ({ classes }) => { ]; if (isTrainingAvailable) { - tabs.push({ - name: "Models", - tabId: "serviceTraining", - activeIndex: 2, - component: , - }); + tabs.push( + { + name: "Data preset", + tabId: "dataPreset", + activeIndex: 2, + component: , + }, + { + name: "Models", + tabId: "serviceTraining", + activeIndex: 3, + component: , + } + ); } const seoURL = `${process.env.REACT_APP_BASE_URL}/servicedetails/org/${orgId}/service/${serviceId}`; diff --git a/src/components/common/SNETFileUpload/index.js b/src/components/common/SNETFileUpload/index.js index 58c9db010..3977e14eb 100644 --- a/src/components/common/SNETFileUpload/index.js +++ b/src/components/common/SNETFileUpload/index.js @@ -2,11 +2,11 @@ import React from "react"; import { useDropzone } from "react-dropzone"; import CloudUpload from "@mui/icons-material/Backup"; import PropTypes from "prop-types"; -import Grid from "@mui/material/Grid"; import Typography from "@mui/material/Typography"; import { useStyles } from "./styles"; import FileStats from "./FileStats"; +import { Box } from "@mui/material"; const SNETFileUpload = (props) => { const { @@ -24,6 +24,7 @@ const SNETFileUpload = (props) => { uploadSuccess, error, helperText, + isFileStatsDisplay = true, } = props; const classes = useStyles(); @@ -40,9 +41,9 @@ const SNETFileUpload = (props) => { }); return ( - + - + Drag and drop image here or click @@ -52,8 +53,8 @@ const SNETFileUpload = (props) => { ) : ( helperText )} - - + + {isFileStatsDisplay && ( { uploadSuccess={uploadSuccess} error={error} /> - - + )} + ); }; SNETFileUpload.prototypes = { disabled: PropTypes.disabled, + isFileStatsDisplay: PropTypes.bool, onFileSelect: PropTypes.func, minSize: PropTypes.number, maxSize: PropTypes.number, diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 86b597b63..7cb07c841 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -1,6 +1,10 @@ import { makeStyles } from "@mui/styles"; export const useStyles = makeStyles((MUITheme) => ({ + fileUploaderContainer: { + display: "flex", + gap: 20, + }, grayBox: { padding: "50px 45px !important", borderWidth: 1, From 31cc122733807fc17d1e43784c628a1a8b407b73 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:26:50 +0300 Subject: [PATCH 02/56] [SPT-767] Added Snet Dialog component --- src/components/common/SNETDialog/index.js | 76 +++++++++++++++++++ .../common/SNETDialog/mobileDialog.js | 21 +++++ src/components/common/SNETDialog/styles.js | 34 +++++++++ 3 files changed, 131 insertions(+) create mode 100644 src/components/common/SNETDialog/index.js create mode 100644 src/components/common/SNETDialog/mobileDialog.js create mode 100644 src/components/common/SNETDialog/styles.js diff --git a/src/components/common/SNETDialog/index.js b/src/components/common/SNETDialog/index.js new file mode 100644 index 000000000..5016ad012 --- /dev/null +++ b/src/components/common/SNETDialog/index.js @@ -0,0 +1,76 @@ +import React from "react"; +import propTypes from "prop-types"; +import CloseIcon from "@mui/icons-material/Close"; +import MobileDialog from "./mobileDialog"; +import { useStyles } from "./styles"; +import { withStyles } from "@mui/styles"; +import { Typography, Box, DialogContent, Dialog, IconButton } from "@mui/material"; + +const SnetDialog = ({ + classes, + isDialogOpen, + title, + children, + disableBackdropClick, + disableEscapeKeyDown, + contentClass, + onDialogClose, + showCloseButton = true, + ...props +}) => { + const isMobile = window.screen.width <= 550; //px + + // eslint-disable-next-line no-unused-vars + const handleDialogClose = (event, reason) => { + if (disableBackdropClick && reason === "backdropClick") { + return false; + } + + if (disableEscapeKeyDown && reason === "escapeKeyDown") { + return false; + } + onDialogClose(); + }; + + if (isMobile) { + return ; + } + + return ( + handleDialogClose(event, reason)} + aria-labelledby="snet-dialog-title" + open={isDialogOpen} + {...props} + > + {title || + (showCloseButton && ( + + {title} + {showCloseButton && ( + + + + )} + + ))} + + {children} + + + ); +}; + +SnetDialog.propTypes = { + isDialogOpen: propTypes.bool.isRequired, + onDialogClose: propTypes.func, + title: propTypes.string, + children: propTypes.node, + showCloseButton: propTypes.bool, + disableBackdropClick: propTypes.bool, + disableEscapeKeyDown: propTypes.bool, + contentClass: propTypes.string, +}; + +export default withStyles(useStyles)(SnetDialog); diff --git a/src/components/common/SNETDialog/mobileDialog.js b/src/components/common/SNETDialog/mobileDialog.js new file mode 100644 index 000000000..1bbe36c29 --- /dev/null +++ b/src/components/common/SNETDialog/mobileDialog.js @@ -0,0 +1,21 @@ +import React from "react"; +import { Typography, Box, Modal } from "@mui/material"; +import { useStyles } from "./styles"; +import { withStyles } from "@mui/styles"; + +const MobileDialog = ({ classes, isDialogOpen, onDialogClose, title, children }) => { + return ( + + {title} + {children} + + } + /> + ); +}; + +export default withStyles(useStyles)(MobileDialog); diff --git a/src/components/common/SNETDialog/styles.js b/src/components/common/SNETDialog/styles.js new file mode 100644 index 000000000..b6e232984 --- /dev/null +++ b/src/components/common/SNETDialog/styles.js @@ -0,0 +1,34 @@ +export const useStyles = (MUITheme) => ({ + dialogTitle: { + padding: "16px 24px !important", + color: MUITheme.palette.blue, + display: "flex", + alignItems: "center", + gap: 5, + justifyContent: "space-between", + flexWrap: "nowrap", + }, + titleText: { + fontSize: 20, + fontWeight: 400, + lineHeight: "24px", + }, + iconButton: { + padding: "0 !important", + "& svg": { fontSize: 24 }, + }, + dailogContent: { + padding: "0 !important", + }, + mobileDialog: { + position: "absolute", + borderRadius: "10px 10px 0 0", + bottom: 0, + right: 0, + width: "100%", + }, + titleMobileText: { + padding: 10, + borderBottom: `1px solid ${MUITheme.palette.text.gray}`, + }, +}); From adc275087663182a66ac0be4db9fe468d4615bc3 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:27:16 +0300 Subject: [PATCH 03/56] [SPT-767] Updated file uploader component --- src/components/common/SNETFileUpload/index.js | 18 ++++++++++++++---- src/components/common/SNETFileUpload/styles.js | 3 ++- 2 files changed, 16 insertions(+), 5 deletions(-) diff --git a/src/components/common/SNETFileUpload/index.js b/src/components/common/SNETFileUpload/index.js index 3977e14eb..a9cd33020 100644 --- a/src/components/common/SNETFileUpload/index.js +++ b/src/components/common/SNETFileUpload/index.js @@ -3,6 +3,7 @@ import { useDropzone } from "react-dropzone"; import CloudUpload from "@mui/icons-material/Backup"; import PropTypes from "prop-types"; import Typography from "@mui/material/Typography"; +import TaskIcon from "@mui/icons-material/Task"; import { useStyles } from "./styles"; import FileStats from "./FileStats"; @@ -44,10 +45,19 @@ const SNETFileUpload = (props) => { - - - Drag and drop image here or click - + {uploadSuccess ? ( + <> + + {fileName} + + ) : ( + <> + + + Drag and drop image here or click + + + )} {helperText === null ? ( (Package must be under {maxSize}mb. Make sure the extension is .zip or .tar) ) : ( diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 7cb07c841..27b8b4ec8 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -6,6 +6,7 @@ export const useStyles = makeStyles((MUITheme) => ({ gap: 20, }, grayBox: { + width: "100%", padding: "50px 45px !important", borderWidth: 1, borderStyle: "dashed", @@ -15,7 +16,6 @@ export const useStyles = makeStyles((MUITheme) => ({ flexDirection: "column", alignItems: "center", justifyContent: "center", - backgroundColor: "#F8F8F8", cursor: "pointer", textAlign: "center", "& svg": { @@ -61,6 +61,7 @@ export const useStyles = makeStyles((MUITheme) => ({ color: "rgba(0,0,0,0.25)", fontSize: 18, lineHeight: "23px", + whiteSpace: "nowrap", }, }, successfullUpload: { From b5851534991c5dd5818f5e102717972e41e0d78a Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:27:41 +0300 Subject: [PATCH 04/56] [SPT-767] Added gradient button type --- src/components/common/StyledButton/index.js | 2 +- src/components/common/StyledButton/styles.js | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/common/StyledButton/index.js b/src/components/common/StyledButton/index.js index a66c8f042..53ef256a2 100644 --- a/src/components/common/StyledButton/index.js +++ b/src/components/common/StyledButton/index.js @@ -51,7 +51,7 @@ StyledButton.propTypes = { "whiteBorder", ]), btnType: PropTypes.oneOf(["submit", "reset", "button"]), - btnText: PropTypes.string, + btnText: PropTypes.oneOfType([PropTypes.string, PropTypes.object]), disabled: PropTypes.bool, onClick: PropTypes.func, iconClass: PropTypes.string, diff --git a/src/components/common/StyledButton/styles.js b/src/components/common/StyledButton/styles.js index 1fd2ff7d3..6a9351ead 100644 --- a/src/components/common/StyledButton/styles.js +++ b/src/components/common/StyledButton/styles.js @@ -85,4 +85,7 @@ export const useStyles = makeStyles((theme) => ({ backgroundColor: "rgba(241,241,241,0.15)", }, }, + gradientBg: { + background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", + }, })); From 51a01dee7f44629da6a9c3f4ef4e4c4345bd9f12 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:27:58 +0300 Subject: [PATCH 05/56] [SPT-767] Added dataset info --- .../DataPreset/DatasetInfo/index.js | 41 +++++++++++ .../DataPreset/DatasetInfo/styles.js | 69 +++++++++++++++++++ 2 files changed, 110 insertions(+) create mode 100644 src/components/ServiceDetails/DataPreset/DatasetInfo/index.js create mode 100644 src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js new file mode 100644 index 000000000..0467490d4 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js @@ -0,0 +1,41 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; +import HelpOutline from "@mui/icons-material/HelpOutline"; + +const DatasetInfo = ({ classes, datasetParameters }) => { + const DatasetRateInfo = ({ additionalInfo }) => { + return ( + + {additionalInfo.map((additionalField) => ( +
+ {additionalField.value} + {additionalField.title} +
+ ))} + + ); + }; + return ( +
+

Dataset info

+
+ {datasetParameters.map((datasetParameter) => ( +
+
+

{datasetParameter.title}

+ {datasetParameter?.additionalInfo && ( + <> + + + + )} +
+

{datasetParameter.value}

+
+ ))} +
+
+ ); +}; + +export default withStyles(useStyles)(DatasetInfo); diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js new file mode 100644 index 000000000..891d4e33b --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js @@ -0,0 +1,69 @@ +export const useStyles = (theme) => ({ + datasetParameter: { + minWidth: "100px", + display: "flex", + padding: "14px 10px", + flexDirection: "column", + justifyContent: "center", + alignItems: "flex-start", + gap: 6, + borderRadius: 4, + border: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, + }, + parametersContainer: { + display: "flex", + alignItems: "center", + gap: 20, + }, + additionalInfoContainer: { + display: "none", + position: "absolute", + zIndex: 1, + right: "-120px", + top: "-15px", + borderRadius: 4, + padding: "10px 25px", + background: theme.palette.text.cardBackground, + boxShadow: "0px 0px 6.5px 0px rgba(46, 46, 46, 0.25)", + }, + additionalFieldRaw: { + display: "flex", + gap: 6, + }, + additionalFieldValue: { + fontWeight: 700, + background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", + backgroundClip: "text", + "-webkit-background-clip": "text", + "-webkit-text-fill-color": "transparent", + }, + parameterTitleContainer: { + display: "flex", + justifyContent: "space-between", + alignItems: "center", + width: "100%", + cursor: "pointer", + position: "relative", + color: theme.palette.text.mediumShadeGray, + "& svg": { + width: 20, + height: 20, + color: theme.palette.text.primary, + }, + "&:hover": { + "& span": { + display: "block", + }, + }, + }, + parameterTitle: { + margin: 0, + fontSize: 17, + fontWeight: 700, + }, + parameterValue: { + margin: 0, + fontSize: 28, + fontWeight: 700, + }, +}); From 811f794b1392a85284a02aad530eb336767ae808 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:28:17 +0300 Subject: [PATCH 06/56] [SPT-767] Added example datasets --- .../DataPreset/ExampleDatasets/index.js | 38 +++++++++++++++++++ .../DataPreset/ExampleDatasets/styles.js | 17 +++++++++ 2 files changed, 55 insertions(+) create mode 100644 src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js create mode 100644 src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js diff --git a/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js b/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js new file mode 100644 index 000000000..642e75726 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js @@ -0,0 +1,38 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +const examplesDatasets = [ + { id: 1, tag: "Text", name: "Dataset 1", link: "link/to/s3/1" }, + { id: 2, tag: "Text", name: "Dataset 2", link: "link/to/s3/2" }, + { id: 3, tag: "Text", name: "Dataset 3", link: "link/to/s3/3" }, + { id: 4, tag: "Text", name: "Dataset 4", link: "link/to/s3/4" }, +]; + +const ExampleDatasets = ({ classes, setDatasetInfo }) => { + const ExampleDataset = ({ name, link, tag }) => { + return ( +
setDatasetInfo({ link, name })} className={classes.exampleDataset}> +
{name}
+
{tag}
+
+ ); + }; + + return ( +
+ Select exemple dataset +
+ {examplesDatasets.map((exampleDataset) => ( + + ))} +
+
+ ); +}; + +export default withStyles(useStyles)(ExampleDatasets); diff --git a/src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js b/src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js new file mode 100644 index 000000000..751b84b43 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js @@ -0,0 +1,17 @@ +export const useStyles = (theme) => ({ + examplesContainer: { + display: "flex", + flexDirection: "column", + gap: 16, + }, + exampleDataset: { + display: "flex", + padding: "8px 12px", + alignItems: "center", + gap: 8, + alignSelf: "stretch", + borderRadius: 8, + background: theme.palette.text.gray, + cursor: "pointer", + }, +}); From d5a74eeaa85ab8522ecfc4c75bfb884c6af05082 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:29:14 +0300 Subject: [PATCH 07/56] [SPT-767] Added merge button and empty second uploader state --- .../DataPreset/DatasetUploader/index.js | 110 +++++++++--------- .../ServiceDetails/DataPreset/index.js | 50 +++++--- .../ServiceDetails/DataPreset/styles.js | 50 +++++++- 3 files changed, 143 insertions(+), 67 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 8f7342d85..2cbe3ae83 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -4,50 +4,33 @@ import { useStyles } from "./styles"; import { publishDatasetForImproving } from "../../../../Redux/actionCreators/ServiceTrainingActions"; import SNETFileUpload from "../../../common/SNETFileUpload"; import { isEmpty } from "lodash"; +import { Typography } from "@mui/material"; +import ExampleDatasets from "../ExampleDatasets"; +import DatasetInfo from "../DatasetInfo"; +import StyledButton from "../../../common/StyledButton"; +import DashboardModal from "../DashboardModal"; -const examplesDatasets = [ - { id: 1, tag: "Text", name: "Dataset 1", link: "link/to/s3/1" }, - { id: 2, tag: "Text", name: "Dataset 2", link: "link/to/s3/2" }, - { id: 3, tag: "Text", name: "Dataset 3", link: "link/to/s3/3" }, - { id: 4, tag: "Text", name: "Dataset 4", link: "link/to/s3/4" }, -]; +// import TaskIcon from "@mui/icons-material/Task"; const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; - -const DatasetUploader = ({ classes, setDatasetLink }) => { - // const [uploadedDataset, setUploadedDataset] = useState() - const [trainingDataFileName, setTrainingDataFileName] = useState(""); - const [trainingDataFileSize, setTrainingDataFileSize] = useState(""); - - // const setDataset = async (datasetBlob) => { - // const linkToDataset = await publishDatasetForImproving(datasetBlob); //sentToS3(datasetBlob); - // setUploadedDataset(datasetBlob); - // setDatasetLink(linkToDataset); - // }; - - const ExampleDataset = ({ name, link, tag }) => { - return ( -
setDatasetLink(link)} className={classes.exampleDataset}> -
{name}
-
{tag}
-
- ); - }; - - const ExampleFiles = () => { - return ( -
- {examplesDatasets.map((exampleDataset) => ( - - ))} -
- ); - }; +const datasetParameters = [ + { title: "Size", value: "11.2Mb" }, + { title: "Format", value: "TXT" }, + { + title: "Rate", + value: "5.5/10", + additionalInfo: [ + { value: "11", title: "Outlier filtering1" }, + { value: "11", title: "Outlier filtering2" }, + { value: "11", title: "Outlier filtering3" }, + { value: "11", title: "Outlier filtering4" }, + ], + }, +]; +const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo }) => { + const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); + const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); + const [isDashbordOpen, setIsDashbordOpen] = useState(false); const handleDrop = async (acceptedFiles, rejectedFiles) => { if (!isEmpty(rejectedFiles)) { @@ -62,7 +45,7 @@ const DatasetUploader = ({ classes, setDatasetLink }) => { setTrainingDataFileName(name); setTrainingDataFileSize(size); const url = await publishDatasetForImproving(fileBlob, name); - setDatasetLink(url); + setDatasetInfo({ link: url, name }); } catch (error) { console.log("error: ", error); @@ -71,6 +54,27 @@ const DatasetUploader = ({ classes, setDatasetLink }) => { } }; + const Helpertext = () => { + return ( + isEmpty(datasetInfo) && ( + <> + Package must be under 50mb + Make sure the extension is .zip + + ) + ); + }; + + const openDashbordModal = () => { + console.log("openDashbordModal"); + + setIsDashbordOpen(true); + }; + + const closeDashbordModal = () => { + setIsDashbordOpen(false); + }; + return (
@@ -80,22 +84,22 @@ const DatasetUploader = ({ classes, setDatasetLink }) => { accept={acceptedFileTypes} multiple={false} showFileDetails - helperText={ - <> -

* Package must be under 50mb

-

* Make sure the extension is .zip

- - } + helperText={} fileName={trainingDataFileName} fileSize={trainingDataFileSize} - uploadSuccess={Boolean(trainingDataFileName)} + uploadSuccess={Boolean(trainingDataFileName || datasetInfo)} isFileStatsDisplay={false} />
-
- Select exemple dataset - -
+ {isEmpty(datasetInfo) ? ( + + ) : ( + <> + + + + )} + {isDashbordOpen && }
); }; diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index a189fda5b..11a077125 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -1,28 +1,52 @@ import React, { useState } from "react"; import Card from "../../common/Card"; -import { Grid } from "@mui/material"; import DatasetUploader from "./DatasetUploader"; +import MergeIcon from "@mui/icons-material/CallMerge"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; +import AddIcon from "@mui/icons-material/Add"; +import StyledButton from "../../common/StyledButton"; +import clsx from "clsx"; const DataPreset = ({ classes }) => { - const [datasetLink, setDatasetLink] = useState(); - - console.log("datasetLink: ", datasetLink); + const [datasetInfo, setDatasetInfo] = useState(); + const [datasetForMergeInfo, setDatasetForMergeInfo] = useState(); const DataPresetContainer = () => { return ( -
+

Upload Your Dataset

- - - - - - - - +
+
+ +
+ {datasetForMergeInfo && ( +
+ + Merge + +
+ } + /> +
+ )} +
+ {datasetInfo ? ( + + ) : ( +
+ +

Add one more file for merge this

+
+ )} +
+
+
+ +
); }; diff --git a/src/components/ServiceDetails/DataPreset/styles.js b/src/components/ServiceDetails/DataPreset/styles.js index 67868c7be..12a19a31e 100644 --- a/src/components/ServiceDetails/DataPreset/styles.js +++ b/src/components/ServiceDetails/DataPreset/styles.js @@ -1 +1,49 @@ -export const useStyles = (theme) => ({}); +export const useStyles = (theme) => ({ + dataPresetContainer: { + display: "flex", + flexDirection: "column", + gap: 30, + }, + datasetUploaderContainer: { + display: "flex", + justifyContent: "space-between", + gap: 30, + }, + fineTuneBatton: { + textAlign: "right", + }, + verticalCentered: { + alignItems: "center", + }, + fileZone: { + width: "100%", + }, + mergeButtonContainer: { + "& button": { + minWidth: "auto", + }, + }, + mergeButton: { + display: "flex", + flexDirection: "column", + alignItems: "center", + "& svg": { + transform: "rotate(180deg)", + }, + }, + emptyFirstDataset: { + minHeight: 500, + width: "100%", + display: "flex", + flexDirection: "column", + justifyContent: "center", + alignItems: "center", + fontSize: 24, + textAlign: "center", + color: theme.palette.text.lightShadedGray, + "& svg": { + width: 60, + height: 60, + }, + }, +}); From 270863c36e415a53034415e451fc8aaca89f14e6 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 19:29:33 +0300 Subject: [PATCH 08/56] [SPT-767] Added dashboard dialog --- .../ServiceDetails/DataPreset/DashboardModal/index.js | 11 +++++++++++ 1 file changed, 11 insertions(+) create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/index.js diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js new file mode 100644 index 000000000..503ec20b4 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -0,0 +1,11 @@ +import SNETDialog from "../../../common/SNETDialog"; + +const DashboardModal = ({ onClose, isShow }) => { + return ( + +

Quality check of the dataset

+ + ); +}; + +export default DashboardModal; From 3e3a8bb7c37761684d5d7830bf0f5b36abc5b1ad Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 20:20:53 +0300 Subject: [PATCH 09/56] [SPT-767] Added dataset client --- src/config/DatasetClient.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 src/config/DatasetClient.js diff --git a/src/config/DatasetClient.js b/src/config/DatasetClient.js new file mode 100644 index 000000000..c57c47124 --- /dev/null +++ b/src/config/DatasetClient.js @@ -0,0 +1,15 @@ +import axios from "axios"; + +export const DatasetClient = axios.create({ + baseURL: "https://datafactory.singularitynet.io", + headers: { + Authorization: "jzWEbCCJ1434P2mSm3e9Ugs5u387yAf1bv1DCapfomLLg6V57Ht6BjXvFMa9260a", + }, +}); + +export const endpoints = { + VALIDATE_AND_ANALIZE: "/api/get-stat", + IMPROVE: "/api/post-improve-dataset", + VALIDATE_MERGE: "api/post-validate-merge", + MERGE: "/api/post-merge-dataset", +}; From 0aa39b02d156c77453b6ea7f61db9e2ff7da08ae Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 21:24:55 +0300 Subject: [PATCH 10/56] [SPT-767] Added dashboard parameters --- .../DashboardModal/ImprovementParameter.js | 24 ++++++ .../DataPreset/DashboardModal/index.js | 79 ++++++++++++++++++- .../DataPreset/DashboardModal/styles.js | 58 ++++++++++++++ src/components/common/StyledButton/index.js | 2 + src/components/common/StyledButton/styles.js | 4 + 5 files changed, 164 insertions(+), 3 deletions(-) create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/styles.js diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js new file mode 100644 index 000000000..73b645753 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js @@ -0,0 +1,24 @@ +import { Checkbox, FormControlLabel } from "@mui/material"; +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +const ImprovementParameter = ({ classes, parameter }) => { + return ( +
+
+ } label={parameter.title} /> +
+ {parameter.listOfImprovements.map((improvement) => ( +
+ {improvement.value} + {improvement.label} +
+ ))} +
+
+
{parameter.status}
+
+ ); +}; + +export default withStyles(useStyles)(ImprovementParameter); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 503ec20b4..7184bd8fd 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -1,11 +1,84 @@ import SNETDialog from "../../../common/SNETDialog"; +import ImprovementParameter from "./ImprovementParameter"; -const DashboardModal = ({ onClose, isShow }) => { +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; +import StyledButton from "../../../common/StyledButton"; + +const parameters = [ + { + title: "Outlier filtering", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + ], + }, + { + title: "Outlier filtering 2", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + ], + }, + { + title: "Outlier filtering 3", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + ], + }, + { + title: "Outlier filtering 4", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + ], + }, + { + title: "Outlier filtering 3", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + ], + }, + { + title: "Normalising punctuation", + status: "Good", + listOfImprovements: [ + { value: "55", label: "Too short/long lines 1" }, + { value: "55", label: "Too short/long lines 2" }, + { value: "55", label: "Too short/long lines 3" }, + { value: "55", label: "Too short/long lines 4" }, + ], + }, +]; + +const DashboardModal = ({ classes, onClose, isShow }) => { return ( -

Quality check of the dataset

+
+

Quality check of the dataset

+
+ {parameters.map((parameter) => ( + + ))} +
+
+ +
+
); }; -export default DashboardModal; +export default withStyles(useStyles)(DashboardModal); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js new file mode 100644 index 000000000..c7c8f4d3a --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js @@ -0,0 +1,58 @@ +export const useStyles = (theme) => ({ + dasbordModalContainer: { + display: "flex", + flexDirection: "column", + gap: 25, + }, + parameters: { + display: "flex", + flexWrap: "wrap", + gap: 25, + }, + improveButtonContainer: { + textAlign: "right", + }, + + // PARAMETER CARD + parameterContainer: { + flex: 1, + padding: 20, + borderRadius: 4, + border: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, + display: "flex", + flexDirection: "column", + justifyContent: "space-between", + gap: 10, + }, + checkbox: { + "& .Mui-checked": { color: "black" }, + "& .MuiFormControlLabel-label": { + fontSize: 17, + fontWeight: 700, + color: "black", + }, + }, + improvementRaw: { + display: "flex", + gap: 6, + whiteSpace: "nowrap", + }, + improvementValue: { + fontWeight: 700, + background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", + backgroundClip: "text", + "-webkit-background-clip": "text", + "-webkit-text-fill-color": "transparent", + }, + listOfImprovementsContainer: { + display: "flex", + flexWrap: "wrap", + justifyContent: "space-between", + }, + status: { + color: "#449CEE", + textAlign: "right", + fontSize: 14, + fontWeight: 700, + }, +}); diff --git a/src/components/common/StyledButton/index.js b/src/components/common/StyledButton/index.js index 53ef256a2..8134c6160 100644 --- a/src/components/common/StyledButton/index.js +++ b/src/components/common/StyledButton/index.js @@ -9,6 +9,7 @@ import { useStyles } from "./styles"; const buttonColor = { blue: "blueBg", gradient: "gradientBg", + gradientAccent: "gradientAccentBg", black: "blackBg", transparent: "transparentBg", transparentBlueBorder: "transparentBlueBorder", @@ -42,6 +43,7 @@ StyledButton.propTypes = { type: PropTypes.oneOf([ "blue", "gradient", + "gradientAccent", "black", "transparent", "red", diff --git a/src/components/common/StyledButton/styles.js b/src/components/common/StyledButton/styles.js index 6a9351ead..e999e0579 100644 --- a/src/components/common/StyledButton/styles.js +++ b/src/components/common/StyledButton/styles.js @@ -88,4 +88,8 @@ export const useStyles = makeStyles((theme) => ({ gradientBg: { background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", }, + gradientAccentBg: { + border: "none", + background: "linear-gradient(90deg, #D479FE 0%, #449CEE 45.5%, #4DE 100%)", + }, })); From 06aa0b8c828afe5c298bbe73574966b18005dde4 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 26 Nov 2024 21:25:35 +0300 Subject: [PATCH 11/56] [SPT-767] Added disable state for fime-tune button --- src/components/ServiceDetails/DataPreset/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 11a077125..2139c591a 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -8,6 +8,7 @@ import { useStyles } from "./styles"; import AddIcon from "@mui/icons-material/Add"; import StyledButton from "../../common/StyledButton"; import clsx from "clsx"; +import { isEmpty } from "lodash"; const DataPreset = ({ classes }) => { const [datasetInfo, setDatasetInfo] = useState(); @@ -45,7 +46,7 @@ const DataPreset = ({ classes }) => {
- +
); From b6500562105eaeb0df107b6ddd2f68242b6d71c6 Mon Sep 17 00:00:00 2001 From: Nikolay Terekhin Date: Wed, 27 Nov 2024 10:10:48 +0300 Subject: [PATCH 12/56] [SPT-767] Added storage data --- src/Redux/actionCreators/DatasetActions.js | 46 ++++++++++++++++++++++ src/Redux/actionCreators/index.js | 2 + src/Redux/reducers/DatasetReducer.js | 29 ++++++++++++++ 3 files changed, 77 insertions(+) create mode 100644 src/Redux/actionCreators/DatasetActions.js create mode 100644 src/Redux/reducers/DatasetReducer.js diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js new file mode 100644 index 000000000..2fd5f2db5 --- /dev/null +++ b/src/Redux/actionCreators/DatasetActions.js @@ -0,0 +1,46 @@ +export const SET_MAIN_DATASET = "SET_MAIN_DATASET"; +export const SET_MERGE_DATASET = "SET_MERGE_DATASET"; +export const SET_EXAMPLE_DATASETS = "SET_EXAMPLE_DATASETS"; +export const CLEAR_EXAMPLE_DATASETS = "CLEAR_EXAMPLE_DATASETS"; +export const ADD_RECENT_DATASET = "ADD_RECENT_DATASET"; +export const CLEAR_RECENT_DATASETS = "CLEAR_RECENT_DATASETS"; + +export const setMainDataset = (dataset) => (dispatch) => { + dispatch({ + type: SET_MAIN_DATASET, + payload: dataset, + }); +}; + +export const setMergeDataset = (dataset) => (dispatch) => { + dispatch({ + type: SET_MERGE_DATASET, + payload: dataset, + }); +}; + +export const setExampleDatasets = (datasetList) => (dispatch) => { + dispatch({ + type: SET_EXAMPLE_DATASETS, + payload: datasetList, + }); +}; + +export const clearExampleDatasets = () => (dispatch) => { + dispatch({ + type: CLEAR_EXAMPLE_DATASETS, + }); +}; + +export const addRecentDataset = (dataset) => (dispatch) => { + dispatch({ + type: ADD_RECENT_DATASET, + payload: dataset, + }); +}; + +export const clearRecentDatasets = () => (dispatch) => { + dispatch({ + type: CLEAR_RECENT_DATASETS, + }); +}; diff --git a/src/Redux/actionCreators/index.js b/src/Redux/actionCreators/index.js index 70d354a53..c59269693 100644 --- a/src/Redux/actionCreators/index.js +++ b/src/Redux/actionCreators/index.js @@ -8,6 +8,7 @@ import * as stylesActions from "./StylesActions"; import * as paymentActions from "./PaymentActions"; import * as uiContentActions from "./UiContentActions"; import * as sdkActions from "./SDKActions"; +import * as datasetActions from "./DatasetActions"; export { sdkActions, @@ -20,4 +21,5 @@ export { stylesActions, paymentActions, uiContentActions, + datasetActions, }; diff --git a/src/Redux/reducers/DatasetReducer.js b/src/Redux/reducers/DatasetReducer.js new file mode 100644 index 000000000..20fe3b089 --- /dev/null +++ b/src/Redux/reducers/DatasetReducer.js @@ -0,0 +1,29 @@ +import { datasetActions } from "../actionCreators"; + +const initialState = { + mainDataset: null, + mergeDataset: null, + exampleDatasets: [], + recentDatasets: [], +}; + +const datasetReducer = (state = initialState, action) => { + switch (action.type) { + case datasetActions.SET_MAIN_DATASET: + return { ...state, mainDataset: action.payload }; + case datasetActions.SET_MERGE_DATASET: + return { ...state, mergeDataset: action.payload }; + case datasetActions.SET_EXAMPLE_DATASETS: + return { ...state, exampleDatasets: action.payload }; + case datasetActions.CLEAR_EXAMPLE_DATASETS: + return { ...state, exampleDatasets: [] }; + case datasetActions.ADD_RECENT_DATASET: + return { ...state, recentDatasets: [...state.recentDatasets, action.payload] }; + case datasetActions.CLEAR_RECENT_DATASETS: + return { ...state, recentDatasets: [] }; + default: + return state; + } +}; + +export default datasetReducer; \ No newline at end of file From bbb7fd256372173d6eea02f79a69c3f04353f5a6 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 16:11:08 +0300 Subject: [PATCH 13/56] [SPT-767] Added removing datasets from uploader --- .../DataPreset/DatasetUploader/index.js | 12 ++++++++---- .../ServiceDetails/DataPreset/index.js | 17 +++++++++++++++-- src/components/common/SNETFileUpload/index.js | 14 +++++++++++++- src/components/common/SNETFileUpload/styles.js | 11 +++++++++++ 4 files changed, 47 insertions(+), 7 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 2cbe3ae83..f69a880dc 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -27,14 +27,13 @@ const datasetParameters = [ ], }, ]; -const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo }) => { +const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); const [isDashbordOpen, setIsDashbordOpen] = useState(false); const handleDrop = async (acceptedFiles, rejectedFiles) => { if (!isEmpty(rejectedFiles)) { - console.log("rejectedFiles: ", rejectedFiles); return; } if (!isEmpty(acceptedFiles)) { @@ -66,8 +65,6 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo }) => { }; const openDashbordModal = () => { - console.log("openDashbordModal"); - setIsDashbordOpen(true); }; @@ -75,6 +72,12 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo }) => { setIsDashbordOpen(false); }; + const cleanCurrentDataset = () => { + cleanDatasetInfo(); + setTrainingDataFileName(); + setTrainingDataFileSize(); + }; + return (
@@ -88,6 +91,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo }) => { fileName={trainingDataFileName} fileSize={trainingDataFileSize} uploadSuccess={Boolean(trainingDataFileName || datasetInfo)} + cleanCurrentFile={cleanCurrentDataset} isFileStatsDisplay={false} />
diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 2139c591a..79b5a11d3 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -14,13 +14,22 @@ const DataPreset = ({ classes }) => { const [datasetInfo, setDatasetInfo] = useState(); const [datasetForMergeInfo, setDatasetForMergeInfo] = useState(); + const cleanMainDataset = () => { + setDatasetInfo(datasetForMergeInfo); + setDatasetForMergeInfo(); + }; + const DataPresetContainer = () => { return (

Upload Your Dataset

- +
{datasetForMergeInfo && (
@@ -36,7 +45,11 @@ const DataPreset = ({ classes }) => { )}
{datasetInfo ? ( - + setDatasetForMergeInfo()} + /> ) : (
diff --git a/src/components/common/SNETFileUpload/index.js b/src/components/common/SNETFileUpload/index.js index a9cd33020..3d82d554e 100644 --- a/src/components/common/SNETFileUpload/index.js +++ b/src/components/common/SNETFileUpload/index.js @@ -7,7 +7,8 @@ import TaskIcon from "@mui/icons-material/Task"; import { useStyles } from "./styles"; import FileStats from "./FileStats"; -import { Box } from "@mui/material"; +import { Box, IconButton } from "@mui/material"; +import { Close } from "@mui/icons-material"; const SNETFileUpload = (props) => { const { @@ -25,6 +26,7 @@ const SNETFileUpload = (props) => { uploadSuccess, error, helperText, + cleanCurrentFile, isFileStatsDisplay = true, } = props; const classes = useStyles(); @@ -41,12 +43,22 @@ const SNETFileUpload = (props) => { onDropRejected, }); + const handleFileClean = (e) => { + e.stopPropagation(); + cleanCurrentFile(); + }; + return ( {uploadSuccess ? ( <> + {cleanCurrentFile && ( + handleFileClean(event)}> + + + )} {fileName} diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 27b8b4ec8..2e2d5fcd5 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -6,6 +6,7 @@ export const useStyles = makeStyles((MUITheme) => ({ gap: 20, }, grayBox: { + position: "relative", width: "100%", padding: "50px 45px !important", borderWidth: 1, @@ -34,6 +35,16 @@ export const useStyles = makeStyles((MUITheme) => ({ }, }, }, + cleanButton: { + position: "absolute", + right: 0, + top: 0, + "& svg": { + width: 25, + height: 25, + fill: MUITheme.palette.text.mediumShadeGray, + }, + }, title: { color: MUITheme.palette.text.lightGrey, fontSize: 14, From ec73d9c4fb25490288d1b7298f08c279777ed3af Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 16:30:49 +0300 Subject: [PATCH 14/56] [SPT-767] Added graphs --- package.json | 1 + .../DataPreset/DashboardModal/Graphs.js | 122 ++++++++++++++ .../DataPreset/DashboardModal/index.js | 155 +++++++++++------- .../DataPreset/DashboardModal/styles.js | 8 + 4 files changed, 227 insertions(+), 59 deletions(-) create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js diff --git a/package.json b/package.json index c083b1041..34293406e 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,7 @@ "react-slick": "^0.30.2", "react-star-rating-component": "^1.4.1", "react-swipeable-views": "^0.14.0", + "recharts": "^2.13.3", "redux": "^5.0.1", "redux-thunk": "^3.1.0", "singularitynet-platform-contracts": "^1.0.4", diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js new file mode 100644 index 000000000..418a7c31a --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js @@ -0,0 +1,122 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +import { ComposedChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, PieChart, Pie, Treemap } from "recharts"; + +const Graphs = ({ classes, name, type, data }) => { + const dataKeys = Object.keys(data[0]); + const labelKey = dataKeys[0]; + const valueKey = dataKeys[1]; + + const RADIAN = Math.PI / 180; + const renderCustomizedPieLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, percent, index }) => { + const radius = innerRadius + (outerRadius - innerRadius) * 0.5; + + const x = cx + radius * Math.cos(midAngle * RADIAN) - percent; + const y = cy + radius * Math.sin(-midAngle * RADIAN); + return ( + cx ? "start" : "end"} dominantBaseline="central"> + {data[index][labelKey]} + + ); + }; + + const PieGraph = () => { + return ( + + + + ); + }; + + const COLORS = ["#8889DD", "#9597E4", "#8DC77B", "#A5D297", "#E2CF45", "#F8C12D"]; + + const CustomizedContent = (props) => { + const { root, depth, x, y, width, height, index, colors } = props; + const label = props[labelKey]; + + return ( + + + {depth === 1 && ( + + {label} + + )} + + ); + }; + + const WordCloudGraph = () => { + return ( + } + /> + ); + }; + + const HistogramGraph = () => { + return ( + + + + + + + + + ); + }; + + const graphTypes = { + histogram: , + pie: , + word_cloud: , + }; + + return ( +
+

{name}

+ {graphTypes[type]} +
+ ); +}; + +export default withStyles(useStyles)(Graphs); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 7184bd8fd..60e3c989a 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -4,64 +4,95 @@ import ImprovementParameter from "./ImprovementParameter"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import StyledButton from "../../../common/StyledButton"; +import Graphs from "./Graphs"; -const parameters = [ - { - title: "Outlier filtering", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - ], - }, - { - title: "Outlier filtering 2", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - ], - }, - { - title: "Outlier filtering 3", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - ], - }, - { - title: "Outlier filtering 4", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - ], - }, - { - title: "Outlier filtering 3", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - ], - }, - { - title: "Normalising punctuation", - status: "Good", - listOfImprovements: [ - { value: "55", label: "Too short/long lines 1" }, - { value: "55", label: "Too short/long lines 2" }, - { value: "55", label: "Too short/long lines 3" }, - { value: "55", label: "Too short/long lines 4" }, - ], - }, -]; +const analizeAnswer = { + overall_score: 8, + overall_score_range: [0, 10], + cases_count: 537, + cases_fraction: 0.537, + total_samples: 1000, + feature_groups: [ + { + displayed_name: "Text Noise", + key_name: "text_noise", + group_score: 7, + group_score_range: [0, 10], + cases_count: 150, + cases_fraction: 0.15, + }, + { + displayed_name: "Punctuation Issues", + key_name: "punctuation_issues", + group_score: 9, + group_score_range: [0, 10], + cases_count: 255, + cases_fraction: 0.255, + }, + { + displayed_name: "Capitalization Issues", + key_name: "capitalization_issues", + group_score: 6, + group_score_range: [0, 10], + cases_count: 125, + cases_fraction: 0.125, + }, + { + displayed_name: "Statistical Outliers", + key_name: "statistical_outliers", + group_score: 8, + group_score_range: [0, 10], + cases_count: 45, + cases_fraction: 0.045, + }, + { + displayed_name: "Language Consistency", + key_name: "language_consistency", + group_score: 7, + group_score_range: [0, 10], + cases_count: 60, + cases_fraction: 0.06, + }, + ], + graphs: [ + { + key_name: "text_length_distribution", + displayed_name: "Text Length Distribution", + type: "histogram", + data: [ + { bin: "0-10", count: 150 }, + { bin: "11-20", count: 300 }, + { bin: "21-30", count: 450 }, + { bin: "31-40", count: 200 }, + { bin: "41-50", count: 100 }, + { bin: "51+", count: 50 }, + ], + }, + { + key_name: "language_distribution", + displayed_name: "Language Distribution", + type: "pie", + data: [ + { label: "English", value: 70 }, + { label: "Spanish", value: 15 }, + { label: "French", value: 10 }, + { label: "Other", value: 5 }, + ], + }, + { + key_name: "word_frequency", + displayed_name: "Most Frequent Words", + type: "word_cloud", + data: [ + { word: "data", frequency: 120 }, + { word: "text", frequency: 1100 }, + { word: "analysis", frequency: 900 }, + { word: "error", frequency: 850 }, + { word: "model", frequency: 800 }, + ], + }, + ], +}; const DashboardModal = ({ classes, onClose, isShow }) => { return ( @@ -69,14 +100,20 @@ const DashboardModal = ({ classes, onClose, isShow }) => {

Quality check of the dataset

- {parameters.map((parameter) => ( - + {analizeAnswer.feature_groups.map((parameter) => ( + ))}
+

Quality of the dataset

+
+ {analizeAnswer.graphs.map((graph) => ( + + ))} +
); }; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js index c7c8f4d3a..e7d58e966 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js @@ -9,6 +9,11 @@ export const useStyles = (theme) => ({ flexWrap: "wrap", gap: 25, }, + graphs: { + display: "flex", + flexWrap: "wrap", + gap: 25, + }, improveButtonContainer: { textAlign: "right", }, @@ -30,6 +35,7 @@ export const useStyles = (theme) => ({ fontSize: 17, fontWeight: 700, color: "black", + whiteSpace: "nowrap", }, }, improvementRaw: { @@ -55,4 +61,6 @@ export const useStyles = (theme) => ({ fontSize: 14, fontWeight: 700, }, + + // GRAPHS }); From 3e19f025babc5049ac270fcb50f97306b072a5c1 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 16:31:41 +0300 Subject: [PATCH 15/56] [SPT-767] updated parameters for dashboard --- .../DashboardModal/ImprovementParameter.js | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js index 73b645753..b4b69715b 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js @@ -6,14 +6,12 @@ const ImprovementParameter = ({ classes, parameter }) => { return (
- } label={parameter.title} /> + } label={parameter.displayed_name} />
- {parameter.listOfImprovements.map((improvement) => ( -
- {improvement.value} - {improvement.label} -
- ))} +
+ {parameter.cases_count} + Issues detected +
{parameter.status}
From d78e068203080a3af12997b7434ad771bcc97870 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 16:52:38 +0300 Subject: [PATCH 16/56] [SPT-767] added tabs with recent and example datasets --- .../DataPreset/DatasetTabs/index.js | 47 +++++++++++++++++++ .../DataPreset/DatasetUploader/index.js | 7 ++- .../DataPreset/DatasetsList/index.js | 23 +++++++++ .../styles.js | 12 ++++- .../DataPreset/ExampleDatasets/index.js | 38 --------------- 5 files changed, 83 insertions(+), 44 deletions(-) create mode 100644 src/components/ServiceDetails/DataPreset/DatasetTabs/index.js create mode 100644 src/components/ServiceDetails/DataPreset/DatasetsList/index.js rename src/components/ServiceDetails/DataPreset/{ExampleDatasets => DatasetsList}/styles.js (54%) delete mode 100644 src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js diff --git a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js new file mode 100644 index 000000000..53a425dd5 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js @@ -0,0 +1,47 @@ +import { useState } from "react"; +import StyledTabs from "../../StyledTabs"; +import DatasetsList from "../DatasetsList"; + +const datasetsExamples = [ + { id: 1, tag: "Text", name: "DataSet 1: Training data for text translation", link: "link/to/s3/1" }, + { id: 2, tag: "Text", name: "DataSet 2: Training data for text translation", link: "link/to/s3/2" }, + { id: 3, tag: "Text", name: "DataSet 3: Training data for text translation", link: "link/to/s3/3" }, + { id: 4, tag: "Text", name: "DataSet 4: Training data for text translation", link: "link/to/s3/4" }, +]; + +const datasetsRecent = [ + { id: 1, tag: "Text", name: "DataSet Recent 1: Training data for text translation", link: "link/to/s3/1" }, + { id: 2, tag: "Text", name: "DataSet Recent 2: Training data for text translation", link: "link/to/s3/2" }, + { id: 3, tag: "Text", name: "DataSet Recent 3: Training data for text translation", link: "link/to/s3/3" }, + { id: 4, tag: "Text", name: "DataSet Recent 4: Training data for text translation", link: "link/to/s3/4" }, +]; + +const DatasetTabs = ({ setDatasetInfo }) => { + const [activeTab, setActiveTab] = useState(0); + + const handleTabChange = (activeTab) => { + setActiveTab(activeTab); + }; + + const tabs = [ + { + name: "Recent", + activeIndex: 0, + component: , + }, + { + name: "Examples", + activeIndex: 1, + component: , + }, + ]; + + return ( +
+

Select example or recent dataset

+ +
+ ); +}; + +export default DatasetTabs; diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index f69a880dc..7a62e1059 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -5,12 +5,10 @@ import { publishDatasetForImproving } from "../../../../Redux/actionCreators/Ser import SNETFileUpload from "../../../common/SNETFileUpload"; import { isEmpty } from "lodash"; import { Typography } from "@mui/material"; -import ExampleDatasets from "../ExampleDatasets"; import DatasetInfo from "../DatasetInfo"; import StyledButton from "../../../common/StyledButton"; import DashboardModal from "../DashboardModal"; - -// import TaskIcon from "@mui/icons-material/Task"; +import DatasetTabs from "../DatasetTabs"; const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; const datasetParameters = [ @@ -27,6 +25,7 @@ const datasetParameters = [ ], }, ]; + const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); @@ -96,7 +95,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf />
{isEmpty(datasetInfo) ? ( - + ) : ( <> diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js new file mode 100644 index 000000000..ceb3fa0af --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js @@ -0,0 +1,23 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { + const DatasetLine = ({ name, link, tag }) => { + return ( +
setDatasetInfo({ link, name })} className={classes.datasetLine}> +
{name}
+
{tag}
+
+ ); + }; + + return ( +
+ {datasets.map((dataset) => ( + + ))} +
+ ); +}; + +export default withStyles(useStyles)(DatasetsList); diff --git a/src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js b/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js similarity index 54% rename from src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js rename to src/components/ServiceDetails/DataPreset/DatasetsList/styles.js index 751b84b43..9a401b10d 100644 --- a/src/components/ServiceDetails/DataPreset/ExampleDatasets/styles.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js @@ -1,12 +1,13 @@ export const useStyles = (theme) => ({ - examplesContainer: { + datasetsContainer: { display: "flex", flexDirection: "column", gap: 16, }, - exampleDataset: { + datasetLine: { display: "flex", padding: "8px 12px", + justifyContent: "space-between", alignItems: "center", gap: 8, alignSelf: "stretch", @@ -14,4 +15,11 @@ export const useStyles = (theme) => ({ background: theme.palette.text.gray, cursor: "pointer", }, + datasetTag: { + padding: 5, + borderRadius: 6, + fontWeight: 400, + color: theme.palette.text.white, + background: "linear-gradient(90deg, #4A3FEB 0%, #44D5EE 100%)", + }, }); diff --git a/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js b/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js deleted file mode 100644 index 642e75726..000000000 --- a/src/components/ServiceDetails/DataPreset/ExampleDatasets/index.js +++ /dev/null @@ -1,38 +0,0 @@ -import { withStyles } from "@mui/styles"; -import { useStyles } from "./styles"; - -const examplesDatasets = [ - { id: 1, tag: "Text", name: "Dataset 1", link: "link/to/s3/1" }, - { id: 2, tag: "Text", name: "Dataset 2", link: "link/to/s3/2" }, - { id: 3, tag: "Text", name: "Dataset 3", link: "link/to/s3/3" }, - { id: 4, tag: "Text", name: "Dataset 4", link: "link/to/s3/4" }, -]; - -const ExampleDatasets = ({ classes, setDatasetInfo }) => { - const ExampleDataset = ({ name, link, tag }) => { - return ( -
setDatasetInfo({ link, name })} className={classes.exampleDataset}> -
{name}
-
{tag}
-
- ); - }; - - return ( -
- Select exemple dataset -
- {examplesDatasets.map((exampleDataset) => ( - - ))} -
-
- ); -}; - -export default withStyles(useStyles)(ExampleDatasets); From af402db10ef0e0bf23dbca0472cb68b0f3f3c95d Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 17:00:36 +0300 Subject: [PATCH 17/56] [SPT-737] Removed selecting of training method --- .../CreateModel/ModelInfo/index.js | 31 +++++++++---------- 1 file changed, 15 insertions(+), 16 deletions(-) diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js index b7cc4bfa8..bd8aab977 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js @@ -3,7 +3,6 @@ import { useDispatch, useSelector } from "react-redux"; // import FormControlLabel from "@mui/material/FormControlLabel"; // import Switch from "@mui/material/Switch"; -import StyledDropdown from "../../../../common/StyledDropdown"; import StyledTextField from "../../../../common/StyledTextField"; import StyledButton from "../../../../common/StyledButton"; @@ -24,20 +23,20 @@ const ModelInfo = ({ classes, cancelEditModel }) => { const { currentModel } = useSelector((state) => state.serviceTrainingReducer); const { org_id, service_id } = useSelector((state) => currentServiceDetails(state)); + // const [trainingMethod, setTrainingMethod] = useState(currentModel ? currentModel.methodName : undefined); //eslint-disable-next-line const [isRestrictAccessModel, setIsRestrictAccessModel] = useState( true // currentModel && currentModel.publicAccess ? true : false ); const [accessAddresses, setAccessAddresses] = useState(currentModel ? currentModel.addressList : []); - const [trainingMethod, setTrainingMethod] = useState(currentModel ? currentModel.methodName : undefined); const [trainingModelName, setTrainingServiceName] = useState(currentModel ? currentModel.modelName : ""); const [trainingModelDescription, setTrainingModelDescription] = useState( currentModel ? currentModel.description : "" ); const [trainingDataLink, setTrainingDataLink] = useState(currentModel ? currentModel.dataLink : ""); const [alert, setAlert] = useState({}); - + const trainingMethod = detailsTraining?.trainingMethods[0]; // const onUpdate = async () => { // const updateModelParams = { // trainingModelName, @@ -91,19 +90,19 @@ const ModelInfo = ({ classes, cancelEditModel }) => { // setIsRestrictAccessModel(!isRestrictAccessModel); // }; - const trainingModelAccess = detailsTraining?.trainingMethods || []; + // const trainingModelAccess = detailsTraining?.trainingMethods || []; - const trainingDropDownObject = trainingModelAccess.map((e) => ({ - value: e, - label: e, - })); + // const trainingDropDownObject = trainingModelAccess.map((e) => ({ + // value: e, + // label: e,d + // })); - const trainingMethodDropDownBox = (event) => { - const { value } = event.target; - if (value !== "default") { - setTrainingMethod(value); - } - }; + // const trainingMethodDropDownBox = (event) => { + // const { value } = event.target; + // if (value !== "default") { + // setTrainingMethod(value); + // } + // }; const handleModelServiceName = (event) => { setTrainingServiceName(event.target.value); @@ -131,13 +130,13 @@ const ModelInfo = ({ classes, cancelEditModel }) => {
- - Please select a method to train as a first step. + {/* Please select a method to train as a first step. */}
From ff555d7aba5959df070c9249cac395b1721a9183 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 18:01:59 +0300 Subject: [PATCH 18/56] [SPT-767] updated dataset for training data (added name and size) --- .../DataPreset/DatasetTabs/index.js | 40 +++++++++++++++---- .../DataPreset/DatasetUploader/index.js | 2 +- .../DataPreset/DatasetsList/index.js | 6 +-- .../CreateModel/Data/Upload/index.js | 10 ++--- .../TrainingModels/CreateModel/Data/index.js | 4 +- .../ModelInfo/AccessModel/index.js | 15 +++---- .../CreateModel/ModelInfo/index.js | 9 +++-- 7 files changed, 56 insertions(+), 30 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js index 53a425dd5..6e5b69f51 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js @@ -3,17 +3,41 @@ import StyledTabs from "../../StyledTabs"; import DatasetsList from "../DatasetsList"; const datasetsExamples = [ - { id: 1, tag: "Text", name: "DataSet 1: Training data for text translation", link: "link/to/s3/1" }, - { id: 2, tag: "Text", name: "DataSet 2: Training data for text translation", link: "link/to/s3/2" }, - { id: 3, tag: "Text", name: "DataSet 3: Training data for text translation", link: "link/to/s3/3" }, - { id: 4, tag: "Text", name: "DataSet 4: Training data for text translation", link: "link/to/s3/4" }, + { id: 1, tag: "Text", size: 51234, name: "DataSet 1: Training data for text translation", link: "link/to/s3/1" }, + { id: 2, tag: "Text", size: 51234, name: "DataSet 2: Training data for text translation", link: "link/to/s3/2" }, + { id: 3, tag: "Text", size: 51234, name: "DataSet 3: Training data for text translation", link: "link/to/s3/3" }, + { id: 4, tag: "Text", size: 51234, name: "DataSet 4: Training data for text translation", link: "link/to/s3/4" }, ]; const datasetsRecent = [ - { id: 1, tag: "Text", name: "DataSet Recent 1: Training data for text translation", link: "link/to/s3/1" }, - { id: 2, tag: "Text", name: "DataSet Recent 2: Training data for text translation", link: "link/to/s3/2" }, - { id: 3, tag: "Text", name: "DataSet Recent 3: Training data for text translation", link: "link/to/s3/3" }, - { id: 4, tag: "Text", name: "DataSet Recent 4: Training data for text translation", link: "link/to/s3/4" }, + { + id: 1, + tag: "Text", + size: 51234, + name: "DataSet Recent 1: Training data for text translation", + link: "link/to/s3/1", + }, + { + id: 2, + tag: "Text", + size: 51234, + name: "DataSet Recent 2: Training data for text translation", + link: "link/to/s3/2", + }, + { + id: 3, + tag: "Text", + size: 51234, + name: "DataSet Recent 3: Training data for text translation", + link: "link/to/s3/3", + }, + { + id: 4, + tag: "Text", + size: 51234, + name: "DataSet Recent 4: Training data for text translation", + link: "link/to/s3/4", + }, ]; const DatasetTabs = ({ setDatasetInfo }) => { diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 7a62e1059..3b02d3fdb 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -43,7 +43,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf setTrainingDataFileName(name); setTrainingDataFileSize(size); const url = await publishDatasetForImproving(fileBlob, name); - setDatasetInfo({ link: url, name }); + setDatasetInfo({ link: url, name, size }); } catch (error) { console.log("error: ", error); diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js index ceb3fa0af..3b2092f14 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js @@ -2,9 +2,9 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { - const DatasetLine = ({ name, link, tag }) => { + const DatasetLine = ({ name, size, link, tag }) => { return ( -
setDatasetInfo({ link, name })} className={classes.datasetLine}> +
setDatasetInfo({ link, name, size })} className={classes.datasetLine}>
{name}
{tag}
@@ -14,7 +14,7 @@ const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { return (
{datasets.map((dataset) => ( - + ))}
); diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index 3fa7997fb..519f5af72 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -9,10 +9,10 @@ import { useStyles } from "./styles"; const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; -const Data = ({ classes, trainingDataLink, setTrainingDataLink }) => { +const Data = ({ classes, trainingDataset, setTrainingDataset }) => { const [alert, setAlert] = useState({}); - const [trainingDataFileName, setTrainingDataFileName] = useState(""); - const [trainingDataFileSize, setTrainingDataFileSize] = useState(""); + const [trainingDataFileName, setTrainingDataFileName] = useState(trainingDataset ? trainingDataset?.name : ""); + const [trainingDataFileSize, setTrainingDataFileSize] = useState(trainingDataset ? trainingDataset?.size : ""); const handleDrop = async (acceptedFiles, rejectedFiles) => { setAlert({}); @@ -31,7 +31,7 @@ const Data = ({ classes, trainingDataLink, setTrainingDataLink }) => { setTrainingDataFileSize(size); const url = await publishDatasetForTraining(fileBlob, name); - setTrainingDataLink(url); + setTrainingDataset({ link: url, name, size }); } catch (error) { setAlert({ type: alertTypes.ERROR, message: error.message }); } @@ -53,7 +53,7 @@ const Data = ({ classes, trainingDataLink, setTrainingDataLink }) => { } fileName={trainingDataFileName} fileSize={trainingDataFileSize} - uploadSuccess={Boolean(trainingDataLink)} + uploadSuccess={Boolean(trainingDataset?.link)} />
diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/index.js index 706a9686e..e7eaff458 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/index.js @@ -3,7 +3,7 @@ import { withStyles } from "@mui/styles"; import Upload from "./Upload"; import { useStyles } from "./styles"; -const Dataset = ({ classes, trainingDataLink, setTrainingDataLink }) => { +const Dataset = ({ classes, trainingDataset, setTrainingDataset }) => { return (
@@ -16,7 +16,7 @@ const Dataset = ({ classes, trainingDataLink, setTrainingDataLink }) => {

Upload your dataset

- +
); diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/AccessModel/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/AccessModel/index.js index 1c210ce54..42d04ad95 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/AccessModel/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/AccessModel/index.js @@ -24,14 +24,15 @@ const AccessModel = ({ classes, accessAddresses, setAccessAddresses }) => {

Add a list of address that can access this model (Optional)

- {accessAddresses.map((address, index) => ( -
- -
- removeEthAddress(index)} /> + {accessAddresses && + accessAddresses.map((address, index) => ( +
+ +
+ removeEthAddress(index)} /> +
-
- ))} + ))}

Please add a new address that will have access to use, update and delete your model! You do not need to enter your address diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js index bd8aab977..534c3db96 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/ModelInfo/index.js @@ -34,8 +34,9 @@ const ModelInfo = ({ classes, cancelEditModel }) => { const [trainingModelDescription, setTrainingModelDescription] = useState( currentModel ? currentModel.description : "" ); - const [trainingDataLink, setTrainingDataLink] = useState(currentModel ? currentModel.dataLink : ""); + const [trainingDataset, setTrainingDataset] = useState(currentModel ? currentModel.dataset : ""); const [alert, setAlert] = useState({}); + const trainingMethod = detailsTraining?.trainingMethods[0]; // const onUpdate = async () => { // const updateModelParams = { @@ -73,7 +74,7 @@ const ModelInfo = ({ classes, cancelEditModel }) => { trainingModelDescription, accessAddresses, isRestrictAccessModel, - dataLink: trainingDataLink, + dataLink: trainingDataset.link, }; await dispatch(createModel(org_id, service_id, newModelParams)); dispatch(loaderActions.stopAppLoader()); @@ -112,7 +113,7 @@ const ModelInfo = ({ classes, cancelEditModel }) => { setTrainingModelDescription(event.target.value); }; - const isCreatingAvailable = trainingMethod && trainingModelName && trainingModelDescription && trainingDataLink; + const isCreatingAvailable = trainingMethod && trainingModelName && trainingModelDescription && trainingDataset?.link; const CreateModelButtonGroup = () => { return ; }; @@ -156,7 +157,7 @@ const ModelInfo = ({ classes, cancelEditModel }) => { />

- +
{/* Date: Wed, 27 Nov 2024 18:02:49 +0300 Subject: [PATCH 19/56] [SPT-767] added convert to file size to viewing format --- src/components/common/SNETFileUpload/FileStats.js | 15 ++++----------- src/components/common/SNETFileUpload/index.js | 6 +----- src/components/common/SNETFileUpload/styles.js | 5 +++++ src/utility/JSHelper.js | 13 +++++++++++++ 4 files changed, 23 insertions(+), 16 deletions(-) diff --git a/src/components/common/SNETFileUpload/FileStats.js b/src/components/common/SNETFileUpload/FileStats.js index 627cdf2f0..d9580b9d2 100644 --- a/src/components/common/SNETFileUpload/FileStats.js +++ b/src/components/common/SNETFileUpload/FileStats.js @@ -4,6 +4,7 @@ import FolderIcon from "@mui/icons-material/Folder"; import PropTypes from "prop-types"; import { useStyles } from "./styles"; +import { fileSizeConverter } from "../../../utility/JSHelper"; const FileStats = (props) => { const { uploadSuccess, show, fileName, fileSize, error } = props; @@ -23,21 +24,13 @@ const FileStats = (props) => {
-
+
File Name: {fileName}
-
- Items: - -
-
- Uploaded: - -
-
+
Size: - {fileSize} + {fileSizeConverter(fileSize)}
); diff --git a/src/components/common/SNETFileUpload/index.js b/src/components/common/SNETFileUpload/index.js index 3d82d554e..422a00303 100644 --- a/src/components/common/SNETFileUpload/index.js +++ b/src/components/common/SNETFileUpload/index.js @@ -25,8 +25,8 @@ const SNETFileUpload = (props) => { fileSize, uploadSuccess, error, - helperText, cleanCurrentFile, + helperText = null, isFileStatsDisplay = true, } = props; const classes = useStyles(); @@ -108,8 +108,4 @@ SNETFileUpload.prototypes = { helperText: PropTypes.any, }; -SNETFileUpload.defaultProps = { - helperText: null, -}; - export default SNETFileUpload; diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 2e2d5fcd5..33fa7da2e 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -123,4 +123,9 @@ export const useStyles = makeStyles((MUITheme) => ({ color: MUITheme.palette.error.main, }, }, + statRow: { + display: "flex", + flexWrap: "wrap", + justifyContent: "space-between", + }, })); diff --git a/src/utility/JSHelper.js b/src/utility/JSHelper.js index 004a669c6..f29c9d955 100644 --- a/src/utility/JSHelper.js +++ b/src/utility/JSHelper.js @@ -1,3 +1,16 @@ export function hasOwnDefinedProperty(object, property) { return object.hasOwnProperty(property) && typeof object[property] !== "undefined"; } + +const roundTwoDesimals = (roundingNumber) => { + return Math.round((roundingNumber + Number.EPSILON) * 100) / 100; +}; + +export function fileSizeConverter(sizeInBytes) { + const sizeInKiloBytes = roundTwoDesimals(sizeInBytes / 1024); + if (sizeInKiloBytes > 1024) { + const sizeInMBytes = roundTwoDesimals(sizeInKiloBytes / 1024); + return sizeInMBytes + "MB"; + } + return sizeInKiloBytes + "KB"; +} From 0e05737cc69c16f128c59296a3780110ffb053a4 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 18:03:25 +0300 Subject: [PATCH 20/56] [SPT-737] fixed link to models tab from about service tab --- src/components/ServiceDetails/AboutService/ServiceOverview.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/AboutService/ServiceOverview.js b/src/components/ServiceDetails/AboutService/ServiceOverview.js index 805048b57..d2f35306d 100644 --- a/src/components/ServiceDetails/AboutService/ServiceOverview.js +++ b/src/components/ServiceDetails/AboutService/ServiceOverview.js @@ -41,7 +41,7 @@ const ServiceOverview = ({ classes, description, tags, isTrainingAvailable }) =>

For this service you can create your own training model!

{/* //TODO */} - + Try now!
From 57a260e5d32fd14b08509e849099f3995f0907f1 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 18:04:16 +0300 Subject: [PATCH 21/56] [SPT-767] added navigate to training model from dataset editor --- src/components/ServiceDetails/DataPreset/index.js | 14 +++++++++++++- .../ServiceDetails/TrainingModels/index.js | 7 ++++++- 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 79b5a11d3..30ff9c9b0 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -9,8 +9,15 @@ import AddIcon from "@mui/icons-material/Add"; import StyledButton from "../../common/StyledButton"; import clsx from "clsx"; import { isEmpty } from "lodash"; +import { useLocation, useNavigate } from "react-router-dom"; +import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; +import { useDispatch } from "react-redux"; const DataPreset = ({ classes }) => { + const navigate = useNavigate(); + const location = useLocation(); + const dispatch = useDispatch(); + const [datasetInfo, setDatasetInfo] = useState(); const [datasetForMergeInfo, setDatasetForMergeInfo] = useState(); @@ -19,6 +26,11 @@ const DataPreset = ({ classes }) => { setDatasetForMergeInfo(); }; + const goToCreateModel = () => { + dispatch(setCurrentModelDetails({ dataset: datasetInfo })); + navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); + }; + const DataPresetContainer = () => { return (
@@ -59,7 +71,7 @@ const DataPreset = ({ classes }) => {
- +
); diff --git a/src/components/ServiceDetails/TrainingModels/index.js b/src/components/ServiceDetails/TrainingModels/index.js index e2a038297..4875ad565 100644 --- a/src/components/ServiceDetails/TrainingModels/index.js +++ b/src/components/ServiceDetails/TrainingModels/index.js @@ -13,9 +13,14 @@ import ExistingModel from "../ExistingModel"; import ProjectDetails from "../ProjectDetails"; import { useDispatch } from "react-redux"; import { resetCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; +import { useLocation } from "react-router-dom"; const TrainingModels = ({ classes, service }) => { - const [showCreateModel, setShowCreateModel] = useState(false); + const { state } = useLocation(); + + const [showCreateModel, setShowCreateModel] = useState( + state?.isOpenCreatingModel ? state?.isOpenCreatingModel : false + ); const dispatch = useDispatch(); const openEditModelSection = () => { From 5b3496ac6f815b29d0d4886b5bb8fb8e42c2992c Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 18:05:28 +0300 Subject: [PATCH 22/56] [SPT-737] removed excess prop for TrainingModels component --- src/components/ServiceDetails/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/index.js b/src/components/ServiceDetails/index.js index 3d57486bf..c3b266a92 100644 --- a/src/components/ServiceDetails/index.js +++ b/src/components/ServiceDetails/index.js @@ -131,7 +131,7 @@ const ServiceDetails = ({ classes }) => { name: "Models", tabId: "serviceTraining", activeIndex: 3, - component: , + component: , } ); } From ffe8654aeec25a92995c68039d6f7955489cd6c4 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 18:29:21 +0300 Subject: [PATCH 23/56] [SPT-767] updated selecting improvment parameters --- .../DashboardModal/ImprovementParameter.js | 22 ------- .../DashboardModal/ImprovementParameters.js | 61 +++++++++++++++++++ .../DataPreset/DashboardModal/index.js | 13 +--- 3 files changed, 63 insertions(+), 33 deletions(-) delete mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js deleted file mode 100644 index b4b69715b..000000000 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameter.js +++ /dev/null @@ -1,22 +0,0 @@ -import { Checkbox, FormControlLabel } from "@mui/material"; -import { withStyles } from "@mui/styles"; -import { useStyles } from "./styles"; - -const ImprovementParameter = ({ classes, parameter }) => { - return ( -
-
- } label={parameter.displayed_name} /> -
-
- {parameter.cases_count} - Issues detected -
-
-
-
{parameter.status}
-
- ); -}; - -export default withStyles(useStyles)(ImprovementParameter); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js new file mode 100644 index 000000000..4c52cc751 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js @@ -0,0 +1,61 @@ +import { useState } from "react"; +import { Checkbox, FormControlLabel } from "@mui/material"; +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; +import StyledButton from "../../../common/StyledButton"; + +const ImprovementParameters = ({ classes, parameters }) => { + const [paramsForImprove, setParamsForImprove] = useState({}); + + const isSelected = (parameterName) => { + return Object.keys(paramsForImprove).includes(parameterName); + }; + const selectForImprove = (parameterName) => { + if (isSelected(parameterName)) { + setParamsForImprove({ ...paramsForImprove, [parameterName]: false }); + return; + } + setParamsForImprove({ ...paramsForImprove, [parameterName]: true }); + }; + + const ImprovementParameter = ({ parameter }) => { + return ( +
+
+ selectForImprove(parameter.key_name)} + /> + } + label={parameter.displayed_name} + /> +
+
+ {parameter.cases_count} + Issues detected +
+
+
+
{parameter.status}
+
+ ); + }; + + return ( +
+
+ {parameters.map((parameter) => ( + + ))} +
+
+ +
+
+ ); +}; + +export default withStyles(useStyles)(ImprovementParameters); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 60e3c989a..ce464818e 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -1,10 +1,8 @@ import SNETDialog from "../../../common/SNETDialog"; -import ImprovementParameter from "./ImprovementParameter"; - import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; -import StyledButton from "../../../common/StyledButton"; import Graphs from "./Graphs"; +import ImprovementParameters from "./ImprovementParameters"; const analizeAnswer = { overall_score: 8, @@ -99,14 +97,7 @@ const DashboardModal = ({ classes, onClose, isShow }) => {

Quality check of the dataset

-
- {analizeAnswer.feature_groups.map((parameter) => ( - - ))} -
-
- -
+

Quality of the dataset

From c536b1b4dc2e2226eb8b92c3faf6810f33118712 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 19:23:42 +0300 Subject: [PATCH 24/56] [SPT-767] updated key for uploading to s3 --- .../actionCreators/ServiceTrainingActions.js | 37 +++++++++++-------- .../DataPreset/DatasetUploader/index.js | 5 ++- .../CreateModel/Data/Upload/index.js | 5 ++- 3 files changed, 30 insertions(+), 17 deletions(-) diff --git a/src/Redux/actionCreators/ServiceTrainingActions.js b/src/Redux/actionCreators/ServiceTrainingActions.js index 2fa028a4e..5bf0df115 100644 --- a/src/Redux/actionCreators/ServiceTrainingActions.js +++ b/src/Redux/actionCreators/ServiceTrainingActions.js @@ -2,8 +2,9 @@ import axios from "axios"; import { LoaderContent } from "../../utility/constants/LoaderContent"; import { startAppLoader, stopAppLoader } from "./LoaderActions"; import { getServiceClient } from "./SDKActions"; -import { updateMetamaskWallet } from "./UserActions"; +import { fetchAuthenticatedUser, updateMetamaskWallet } from "./UserActions"; import { modelStatus } from "../reducers/ServiceTrainingReducer"; +// import { userActions } from "."; export const SET_MODEL_DETAILS = "SET_MODEL_DETAILS"; export const SET_MODELS_LIST = "SET_MODELS_LIST"; export const RESET_MODEL_DETAILS = "RESET_MODEL_DETAILS"; @@ -189,29 +190,35 @@ const modelStatusByNumber = { 4: "DELETED", }; -export const publishDatasetForTraining = async (fileBlob, name) => { - const linkToDataset = await publishDatasetToS3( - fileBlob, - name, - "https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default", - "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7" +export const publishDatasetForTraining = (fileBlob, name) => async (dispatch) => { + const linkToDataset = await dispatch( + publishDatasetToS3( + fileBlob, + name, + "https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default", + "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7" + ) ); return linkToDataset; }; -export const publishDatasetForImproving = async (fileBlob, name) => { - const linkToDataset = await publishDatasetToS3( - fileBlob, - name, - "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com", - "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH" +export const publishDatasetForImproving = (fileBlob, name) => async (dispatch) => { + const linkToDataset = await dispatch( + publishDatasetToS3( + fileBlob, + name, + "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com", + "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH" + ) ); return linkToDataset; }; -export const publishDatasetToS3 = async (fileBlob, name, baseUrl, authToken) => { +export const publishDatasetToS3 = (fileBlob, name, baseUrl, authToken) => async (dispatch) => { + const { email } = await dispatch(fetchAuthenticatedUser()); + try { - const fileKey = Date.now() + "_" + name; + const fileKey = name + "_" + email + "_" + Date.now(); const url = `${baseUrl}/upload?key=${fileKey}`; let instance = axios.create({ diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 3b02d3fdb..c8a57ee3a 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -9,6 +9,7 @@ import DatasetInfo from "../DatasetInfo"; import StyledButton from "../../../common/StyledButton"; import DashboardModal from "../DashboardModal"; import DatasetTabs from "../DatasetTabs"; +import { useDispatch } from "react-redux"; const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; const datasetParameters = [ @@ -27,6 +28,8 @@ const datasetParameters = [ ]; const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { + const dispatch = useDispatch(); + const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); const [isDashbordOpen, setIsDashbordOpen] = useState(false); @@ -42,7 +45,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf setTrainingDataFileName(name); setTrainingDataFileSize(size); - const url = await publishDatasetForImproving(fileBlob, name); + const url = await dispatch(publishDatasetForImproving(fileBlob, name)); setDatasetInfo({ link: url, name, size }); } catch (error) { console.log("error: ", error); diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index 519f5af72..c033321d3 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -6,10 +6,13 @@ import SNETFileUpload from "../../../../../common/SNETFileUpload"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; +import { useDispatch } from "react-redux"; const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; const Data = ({ classes, trainingDataset, setTrainingDataset }) => { + const dispatch = useDispatch(); + const [alert, setAlert] = useState({}); const [trainingDataFileName, setTrainingDataFileName] = useState(trainingDataset ? trainingDataset?.name : ""); const [trainingDataFileSize, setTrainingDataFileSize] = useState(trainingDataset ? trainingDataset?.size : ""); @@ -29,7 +32,7 @@ const Data = ({ classes, trainingDataset, setTrainingDataset }) => { setTrainingDataFileName(name); setTrainingDataFileSize(size); - const url = await publishDatasetForTraining(fileBlob, name); + const url = await dispatch(publishDatasetForTraining(fileBlob, name)); setTrainingDataset({ link: url, name, size }); } catch (error) { From c9d9e6fac6ea2440654348136aa418911e57c380 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 19:32:36 +0300 Subject: [PATCH 25/56] [SPT-767] fixed file type for uploader --- .../TrainingModels/CreateModel/Data/Upload/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index c033321d3..f35e96223 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -8,7 +8,7 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import { useDispatch } from "react-redux"; -const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; +const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; const Data = ({ classes, trainingDataset, setTrainingDataset }) => { const dispatch = useDispatch(); From 6171a97cf72331899aaac59c48db569de96bdf0b Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 27 Nov 2024 19:33:30 +0300 Subject: [PATCH 26/56] [SPT-738] fixed warning with card header for create traininh model --- .../ServiceDetails/TrainingModels/CreateModel/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/index.js index 36788bc2c..5c1fb55c7 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/index.js @@ -42,7 +42,7 @@ const EditModel = ({ classes, cancelEditModel }) => { const CreateModelHeader = () => { if (isEmpty(modelId)) { - return

New Model Request

; + return "New Model Request"; } return ( From 5243cd5d190ad0cec5a20aacf201f7eba564dfef Mon Sep 17 00:00:00 2001 From: Nikolay Terekhin Date: Fri, 29 Nov 2024 10:55:35 +0300 Subject: [PATCH 27/56] [SPT-767] Added storage data --- src/Redux/actionCreators/DatasetActions.js | 56 +++++++++++++++ .../actionCreators/ServiceTrainingActions.js | 13 ++-- src/Redux/reducers/index.js | 2 + .../DataPreset/DatasetTabs/index.js | 5 +- .../DataPreset/DatasetUploader/index.js | 4 +- .../DataPreset/DatasetsList/index.js | 6 +- .../ServiceDetails/DataPreset/index.js | 68 ++++++++++++++----- .../CreateModel/Data/Upload/index.js | 2 +- src/config/DatasetClient.js | 6 +- 9 files changed, 130 insertions(+), 32 deletions(-) diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js index 2fd5f2db5..e197b303f 100644 --- a/src/Redux/actionCreators/DatasetActions.js +++ b/src/Redux/actionCreators/DatasetActions.js @@ -1,3 +1,5 @@ +import { DatasetClient, DatasetEndpoints } from "../../config/DatasetClient"; + export const SET_MAIN_DATASET = "SET_MAIN_DATASET"; export const SET_MERGE_DATASET = "SET_MERGE_DATASET"; export const SET_EXAMPLE_DATASETS = "SET_EXAMPLE_DATASETS"; @@ -44,3 +46,57 @@ export const clearRecentDatasets = () => (dispatch) => { type: CLEAR_RECENT_DATASETS, }); }; + +export const getDatasetStatistic = (datasetKey) => async (dispatch) => { + const params = new URLSearchParams([['dataset_key', datasetKey]]); + console.log("params", params); + return DatasetClient.get(DatasetEndpoints.VALIDATE_AND_ANALIZE, { params }) +}; + +export const improveDataset = async (datasetKey, improveOptionsList) => async (dispatch) => { + const params = { + "dataset_key": datasetKey, + "improve_options": improveOptionsList.reduce((acc, field) => { + acc[field] = true; + return acc; + }, {}) + } + return DatasetClient.post(DatasetEndpoints.IMPROVE, params) + .then(response => { + console.log('improveDataset response.data', response.data); + }) + .catch(error => { + console.error('improveDataset Error:', error); + }); +}; + +export const mergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { + const params = { + "dataset_key_base": mainDataset, + "dataset_key_additional": mergeDataset + } + return DatasetClient.post(DatasetEndpoints.VALIDATE_MERGE, params) + .then(response => { + console.log('mergeDatasets response.data', response.data); + }) + .catch(error => { + console.error('mergeDatasets Error:', error); + }); +}; + +export const validateMergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { + const params = { + "dataset_key_base": mainDataset, + "dataset_key_additional": mergeDataset + } + return DatasetClient.post(DatasetEndpoints.MERGE, params) + .then(response => { + console.log('validateMergeDatasets response.data', response.data); + }) + .catch(error => { + console.error('validateMergeDatasets Error:', error); + }); +}; + +// const res = await getDatasetStatistic("123"); +// console.log('getDatasetStatistic', res) \ No newline at end of file diff --git a/src/Redux/actionCreators/ServiceTrainingActions.js b/src/Redux/actionCreators/ServiceTrainingActions.js index 5bf0df115..0dc710371 100644 --- a/src/Redux/actionCreators/ServiceTrainingActions.js +++ b/src/Redux/actionCreators/ServiceTrainingActions.js @@ -191,7 +191,7 @@ const modelStatusByNumber = { }; export const publishDatasetForTraining = (fileBlob, name) => async (dispatch) => { - const linkToDataset = await dispatch( + const linkAndKeyDataset = await dispatch( publishDatasetToS3( fileBlob, name, @@ -199,11 +199,11 @@ export const publishDatasetForTraining = (fileBlob, name) => async (dispatch) => "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7" ) ); - return linkToDataset; + return linkAndKeyDataset; }; export const publishDatasetForImproving = (fileBlob, name) => async (dispatch) => { - const linkToDataset = await dispatch( + const linkAndKeyDataset = await dispatch( publishDatasetToS3( fileBlob, name, @@ -211,7 +211,7 @@ export const publishDatasetForImproving = (fileBlob, name) => async (dispatch) = "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH" ) ); - return linkToDataset; + return linkAndKeyDataset; }; export const publishDatasetToS3 = (fileBlob, name, baseUrl, authToken) => async (dispatch) => { @@ -229,7 +229,10 @@ export const publishDatasetToS3 = (fileBlob, name, baseUrl, authToken) => async const response = await instance.get(url); await axios.put(response.data.uploadURL, fileBlob); - return `${baseUrl}/download?key=${fileKey}`; + return { + url: `${baseUrl}/download?key=${fileKey}`, + datasetKey: fileKey + }; } catch (err) { throw new Error(err); } diff --git a/src/Redux/reducers/index.js b/src/Redux/reducers/index.js index b481343a2..23b2af416 100644 --- a/src/Redux/reducers/index.js +++ b/src/Redux/reducers/index.js @@ -9,6 +9,7 @@ import stylesReducer from "./StylesReducer"; import paymentReducer from "./PaymentReducer"; import uiContentReducer from "./UiContentReducer"; import sdkReducer from "./SDKReducer"; +import datasetReducer from "./DatasetReducer"; const rootReducer = combineReducers({ userReducer, @@ -21,6 +22,7 @@ const rootReducer = combineReducers({ paymentReducer, uiContentReducer, sdkReducer, + datasetReducer, }); export default rootReducer; diff --git a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js index 6e5b69f51..ae8978d91 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js @@ -3,7 +3,7 @@ import StyledTabs from "../../StyledTabs"; import DatasetsList from "../DatasetsList"; const datasetsExamples = [ - { id: 1, tag: "Text", size: 51234, name: "DataSet 1: Training data for text translation", link: "link/to/s3/1" }, + { id: 1, tag: "Text", size: 51234, name: "DataSet 1: Training data for text translation", link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004" }, { id: 2, tag: "Text", size: 51234, name: "DataSet 2: Training data for text translation", link: "link/to/s3/2" }, { id: 3, tag: "Text", size: 51234, name: "DataSet 3: Training data for text translation", link: "link/to/s3/3" }, { id: 4, tag: "Text", size: 51234, name: "DataSet 4: Training data for text translation", link: "link/to/s3/4" }, @@ -15,7 +15,8 @@ const datasetsRecent = [ tag: "Text", size: 51234, name: "DataSet Recent 1: Training data for text translation", - link: "link/to/s3/1", + link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", }, { id: 2, diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index c8a57ee3a..431baadb0 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -45,8 +45,8 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf setTrainingDataFileName(name); setTrainingDataFileSize(size); - const url = await dispatch(publishDatasetForImproving(fileBlob, name)); - setDatasetInfo({ link: url, name, size }); + const { url, datasetKey } = await dispatch(publishDatasetForImproving(fileBlob, name)); + dispatch(setDatasetInfo({ link: url, name, size, datasetKey })); } catch (error) { console.log("error: ", error); diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js index 3b2092f14..a32040c55 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js @@ -2,9 +2,9 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { - const DatasetLine = ({ name, size, link, tag }) => { + const DatasetLine = ({ datasetKey, name, size, link, tag }) => { return ( -
setDatasetInfo({ link, name, size })} className={classes.datasetLine}> +
setDatasetInfo({ datasetKey, link, name, size })} className={classes.datasetLine}>
{name}
{tag}
@@ -14,7 +14,7 @@ const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { return (
{datasets.map((dataset) => ( - + ))}
); diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 30ff9c9b0..a3fd00ddd 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useEffect } from "react"; import Card from "../../common/Card"; import DatasetUploader from "./DatasetUploader"; import MergeIcon from "@mui/icons-material/CallMerge"; @@ -11,39 +11,73 @@ import clsx from "clsx"; import { isEmpty } from "lodash"; import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; -import { useDispatch } from "react-redux"; +import { useDispatch, useSelector } from "react-redux"; +import { setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; +import axios from "axios"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); const location = useLocation(); const dispatch = useDispatch(); + const mainDataset = useSelector((state) => state.datasetReducer.mainDataset); + const mergeDataset = useSelector((state) => state.datasetReducer.forgotPasswordSubmit); - const [datasetInfo, setDatasetInfo] = useState(); - const [datasetForMergeInfo, setDatasetForMergeInfo] = useState(); +//TODO remove + const downloadDatasetFromS3 = async (url) => { + console.log("downloadDatasetFromS3"); + try { + let instance = axios.create({ + headers: { + Authorization: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", + }, + }); + console.log("downloadDatasetFromS3 instance", instance); + const response = await instance.get(url); + console.log("downloadDatasetFromS3 response", response); + } catch (err) { + throw new Error(err); + } + }; + + useEffect(() => { + downloadDatasetFromS3(mainDataset?.link); + // mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); + }, [mainDataset]); + + // const getStatistic = async (datasetKey) => { + // try{ + // console.log("datasetKey", datasetKey); + // const answer = await dispatch(getDatasetStatistic(datasetKey)); + // console.error("getStatistic answer", answer); + // } catch (error) { + // console.error("getStatistic errror", error); + // } + // } const cleanMainDataset = () => { - setDatasetInfo(datasetForMergeInfo); - setDatasetForMergeInfo(); + dispatch(setMainDataset(mergeDataset)); + dispatch(setMergeDataset(null)); }; const goToCreateModel = () => { - dispatch(setCurrentModelDetails({ dataset: datasetInfo })); + dispatch(setCurrentModelDetails({ dataset: mainDataset })); navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); }; - + const setMainDatasetFunction = (data) => dispatch(setMainDataset(data)); + const setMergeDatasetFunction = (data) => dispatch(setMergeDataset(data)); const DataPresetContainer = () => { return (

Upload Your Dataset

-
+
- {datasetForMergeInfo && ( + {mergeDataset && (
{
)}
- {datasetInfo ? ( + {mainDataset ? ( setDatasetForMergeInfo()} + datasetInfo={mergeDataset} + setDatasetInfo={setMergeDatasetFunction} + cleanDatasetInfo={() => dispatch(setMergeDataset(null))} /> ) : (
@@ -71,7 +105,7 @@ const DataPreset = ({ classes }) => {
- +
); diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index f35e96223..e81516c13 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -32,7 +32,7 @@ const Data = ({ classes, trainingDataset, setTrainingDataset }) => { setTrainingDataFileName(name); setTrainingDataFileSize(size); - const url = await dispatch(publishDatasetForTraining(fileBlob, name)); + const { url } = await dispatch(publishDatasetForTraining(fileBlob, name)); setTrainingDataset({ link: url, name, size }); } catch (error) { diff --git a/src/config/DatasetClient.js b/src/config/DatasetClient.js index c57c47124..a3b039126 100644 --- a/src/config/DatasetClient.js +++ b/src/config/DatasetClient.js @@ -3,11 +3,13 @@ import axios from "axios"; export const DatasetClient = axios.create({ baseURL: "https://datafactory.singularitynet.io", headers: { - Authorization: "jzWEbCCJ1434P2mSm3e9Ugs5u387yAf1bv1DCapfomLLg6V57Ht6BjXvFMa9260a", + Authorization: "Bearer jzWEbCCJ1434P2mSm3e9Ugs5u387yAf1bv1DCapfomLLg6V57Ht6BjXvFMa9260a", + "Access-Control-Allow-Headers": "*", + "Access-Control-Allow-Methods": "*", }, }); -export const endpoints = { +export const DatasetEndpoints = { VALIDATE_AND_ANALIZE: "/api/get-stat", IMPROVE: "/api/post-improve-dataset", VALIDATE_MERGE: "api/post-validate-merge", From 26ae6f5a88d7df9b5233e5da4f6e8cb183063351 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Fri, 29 Nov 2024 14:04:31 +0300 Subject: [PATCH 28/56] [SPT-767] updated dashboard structure --- src/Redux/actionCreators/DatasetActions.js | 50 +++--- .../DataPreset/DashboardModal/ButtonGroup.js | 30 ++++ .../DataPreset/DashboardModal/Graphs.js | 122 --------------- .../DashboardModal/Graphs/HistogramGraph.js | 30 ++++ .../DashboardModal/Graphs/PieGraph.js | 36 +++++ .../DashboardModal/Graphs/TreemapGraph.js | 72 +++++++++ .../DataPreset/DashboardModal/Graphs/index.js | 34 ++++ .../DashboardModal/Graphs/styles.js | 10 ++ .../index.js} | 39 ++--- .../DashboardModal/Parameters/styles.js | 68 ++++++++ .../DataPreset/DashboardModal/Table/index.js | 33 ++++ .../DataPreset/DashboardModal/Table/styles.js | 16 ++ .../DataPreset/DashboardModal/index.js | 148 +++++++++++++++--- .../DataPreset/DashboardModal/styles.js | 59 +------ .../DataPreset/DatasetUploader/index.js | 2 +- .../ServiceDetails/DataPreset/index.js | 48 +++--- src/components/common/StyledButton/styles.js | 6 +- src/utility/JSHelper.js | 8 +- 18 files changed, 542 insertions(+), 269 deletions(-) create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js delete mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/HistogramGraph.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/PieGraph.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/styles.js rename src/components/ServiceDetails/DataPreset/DashboardModal/{ImprovementParameters.js => Parameters/index.js} (56%) create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/styles.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js create mode 100644 src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js index e197b303f..75fb877fe 100644 --- a/src/Redux/actionCreators/DatasetActions.js +++ b/src/Redux/actionCreators/DatasetActions.js @@ -48,55 +48,55 @@ export const clearRecentDatasets = () => (dispatch) => { }; export const getDatasetStatistic = (datasetKey) => async (dispatch) => { - const params = new URLSearchParams([['dataset_key', datasetKey]]); + const params = new URLSearchParams([["dataset_key", datasetKey]]); console.log("params", params); - return DatasetClient.get(DatasetEndpoints.VALIDATE_AND_ANALIZE, { params }) + return DatasetClient.get(DatasetEndpoints.VALIDATE_AND_ANALIZE, { params }); }; export const improveDataset = async (datasetKey, improveOptionsList) => async (dispatch) => { const params = { - "dataset_key": datasetKey, - "improve_options": improveOptionsList.reduce((acc, field) => { + dataset_key: datasetKey, + improve_options: improveOptionsList.reduce((acc, field) => { acc[field] = true; return acc; - }, {}) - } + }, {}), + }; return DatasetClient.post(DatasetEndpoints.IMPROVE, params) - .then(response => { - console.log('improveDataset response.data', response.data); + .then((response) => { + console.log("improveDataset response.data", response.data); }) - .catch(error => { - console.error('improveDataset Error:', error); + .catch((error) => { + console.error("improveDataset Error:", error); }); }; export const mergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { const params = { - "dataset_key_base": mainDataset, - "dataset_key_additional": mergeDataset - } + dataset_key_base: mainDataset, + dataset_key_additional: mergeDataset, + }; return DatasetClient.post(DatasetEndpoints.VALIDATE_MERGE, params) - .then(response => { - console.log('mergeDatasets response.data', response.data); + .then((response) => { + console.log("mergeDatasets response.data", response.data); }) - .catch(error => { - console.error('mergeDatasets Error:', error); + .catch((error) => { + console.error("mergeDatasets Error:", error); }); }; export const validateMergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { const params = { - "dataset_key_base": mainDataset, - "dataset_key_additional": mergeDataset - } + dataset_key_base: mainDataset, + dataset_key_additional: mergeDataset, + }; return DatasetClient.post(DatasetEndpoints.MERGE, params) - .then(response => { - console.log('validateMergeDatasets response.data', response.data); + .then((response) => { + console.log("validateMergeDatasets response.data", response.data); }) - .catch(error => { - console.error('validateMergeDatasets Error:', error); + .catch((error) => { + console.error("validateMergeDatasets Error:", error); }); }; // const res = await getDatasetStatistic("123"); -// console.log('getDatasetStatistic', res) \ No newline at end of file +// console.log('getDatasetStatistic', res) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js new file mode 100644 index 000000000..9371b6eb6 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -0,0 +1,30 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; +import StyledButton from "../../../common/StyledButton"; + +const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView }) => { + const tableButtonText = isTableView ? "close tablet" : "view tablet"; + + console.log("selectedParameters: ", selectedParameters); + + const isImproveButtonDisable = !selectedParameters?.size; + console.log("isImproveButtonDisable: ", isImproveButtonDisable); + + const improveDataset = () => { + console.log("improveDataset by params: ", selectedParameters); + }; + + return ( +
+ + +
+ ); +}; + +export default withStyles(useStyles)(ButtonsGroup); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js deleted file mode 100644 index 418a7c31a..000000000 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs.js +++ /dev/null @@ -1,122 +0,0 @@ -import { withStyles } from "@mui/styles"; -import { useStyles } from "./styles"; - -import { ComposedChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, PieChart, Pie, Treemap } from "recharts"; - -const Graphs = ({ classes, name, type, data }) => { - const dataKeys = Object.keys(data[0]); - const labelKey = dataKeys[0]; - const valueKey = dataKeys[1]; - - const RADIAN = Math.PI / 180; - const renderCustomizedPieLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, percent, index }) => { - const radius = innerRadius + (outerRadius - innerRadius) * 0.5; - - const x = cx + radius * Math.cos(midAngle * RADIAN) - percent; - const y = cy + radius * Math.sin(-midAngle * RADIAN); - return ( - cx ? "start" : "end"} dominantBaseline="central"> - {data[index][labelKey]} - - ); - }; - - const PieGraph = () => { - return ( - - - - ); - }; - - const COLORS = ["#8889DD", "#9597E4", "#8DC77B", "#A5D297", "#E2CF45", "#F8C12D"]; - - const CustomizedContent = (props) => { - const { root, depth, x, y, width, height, index, colors } = props; - const label = props[labelKey]; - - return ( - - - {depth === 1 && ( - - {label} - - )} - - ); - }; - - const WordCloudGraph = () => { - return ( - } - /> - ); - }; - - const HistogramGraph = () => { - return ( - - - - - - - - - ); - }; - - const graphTypes = { - histogram: , - pie: , - word_cloud: , - }; - - return ( -
-

{name}

- {graphTypes[type]} -
- ); -}; - -export default withStyles(useStyles)(Graphs); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/HistogramGraph.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/HistogramGraph.js new file mode 100644 index 000000000..28324e6e3 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/HistogramGraph.js @@ -0,0 +1,30 @@ +import { ComposedChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend } from "recharts"; + +const HistogramGraph = ({ data }) => { + const dataKeys = Object.keys(data[0]); + const labelKey = dataKeys[0]; + const valueKey = dataKeys[1]; + + return ( + + + + + + + + + ); +}; + +export default HistogramGraph; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/PieGraph.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/PieGraph.js new file mode 100644 index 000000000..8e632cca9 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/PieGraph.js @@ -0,0 +1,36 @@ +import { Pie, PieChart } from "recharts"; + +const PieGraph = ({ data }) => { + const dataKeys = Object.keys(data[0]); + const labelKey = dataKeys[0]; + const valueKey = dataKeys[1]; + + const RADIAN = Math.PI / 180; + const renderCustomizedPieLabel = ({ cx, cy, midAngle, innerRadius, outerRadius, percent, index }) => { + const radius = innerRadius + (outerRadius - innerRadius) * 0.5; + + const x = cx + radius * Math.cos(midAngle * RADIAN) - percent; + const y = cy + radius * Math.sin(-midAngle * RADIAN); + return ( + cx ? "start" : "end"} dominantBaseline="central"> + {data[index][labelKey]} + + ); + }; + + return ( + + + + ); +}; + +export default PieGraph; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js new file mode 100644 index 000000000..cb36f4571 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js @@ -0,0 +1,72 @@ +import { Treemap } from "recharts"; +import { roundToDesimals } from "../../../../../utility/JSHelper"; + +const TreemapGraph = ({ data }) => { + const dataKeys = Object.keys(data[0]); + const labelKey = dataKeys[0]; + const valueKey = dataKeys[1]; + + const getColors = () => { + const numberOfColors = data.length; + const transparent = 1 / numberOfColors; + if (!transparent) { + return []; + } + let colors = []; + for (let i = 1; i <= numberOfColors; i++) { + const colorTransparent = roundToDesimals(i * transparent, 4); + colors.push(`rgba(68, 156, 238, ${colorTransparent})`); + } + + return colors; + }; + + const CustomizedContent = (props) => { + const { root, depth, x, y, width, height, index } = props; + const colors = getColors(); + const label = props[labelKey]; + + return ( + + + {depth === 1 && ( + + {label} + + )} + + ); + }; + + return ( + } + /> + ); +}; + +export default TreemapGraph; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js new file mode 100644 index 000000000..7038c85fa --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js @@ -0,0 +1,34 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +import HistogramGraph from "./HistogramGraph"; +import TreemapGraph from "./TreemapGraph"; +import PieGraph from "./PieGraph"; + +const Graphs = ({ classes, graphs }) => { + const graphByType = (data, type) => { + const graphsTypes = { + histogram: , + pie: , + treemap: , + }; + + return graphsTypes[type]; + }; + + return ( +
+

Quality of the dataset

+
+ {graphs.map((graph) => ( +
+

{graph.displayed_name}

+ {graphByType(graph.data, graph.type)} +
+ ))} +
+
+ ); +}; + +export default withStyles(useStyles)(Graphs); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/styles.js new file mode 100644 index 000000000..d57781734 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/styles.js @@ -0,0 +1,10 @@ +export const useStyles = () => ({ + graphs: { + display: "flex", + flexWrap: "wrap", + gap: 25, + }, + graphContainer: { + flex: 1, + }, +}); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js similarity index 56% rename from src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js rename to src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js index 4c52cc751..570d0e8d1 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ImprovementParameters.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js @@ -2,31 +2,34 @@ import { useState } from "react"; import { Checkbox, FormControlLabel } from "@mui/material"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; -import StyledButton from "../../../common/StyledButton"; +import clsx from "clsx"; -const ImprovementParameters = ({ classes, parameters }) => { - const [paramsForImprove, setParamsForImprove] = useState({}); +const ImprovementParameters = ({ classes, parameters, setSelectedParameters }) => { + const [paramsForImprove, setParamsForImprove] = useState(new Map()); + + console.log("paramsForImprove: ", paramsForImprove); - const isSelected = (parameterName) => { - return Object.keys(paramsForImprove).includes(parameterName); - }; const selectForImprove = (parameterName) => { - if (isSelected(parameterName)) { - setParamsForImprove({ ...paramsForImprove, [parameterName]: false }); - return; + let params = paramsForImprove; + if (paramsForImprove.has(parameterName)) { + params.delete(parameterName); + } else { + params = paramsForImprove.set(parameterName, true); } - setParamsForImprove({ ...paramsForImprove, [parameterName]: true }); - }; + console.log("new params: ", params); + setParamsForImprove(params); + setSelectedParameters(params); + }; const ImprovementParameter = ({ parameter }) => { return ( -
+
selectForImprove(parameter.key_name)} /> } @@ -35,25 +38,23 @@ const ImprovementParameters = ({ classes, parameters }) => {
{parameter.cases_count} - Issues detected +
Issues detected
-
{parameter.status}
+
{parameter.group_score_label}
); }; return ( -
+
+

Quality check of the dataset

{parameters.map((parameter) => ( ))}
-
- -
); }; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/styles.js new file mode 100644 index 000000000..651efc697 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/styles.js @@ -0,0 +1,68 @@ +export const useStyles = (theme) => ({ + parametersContainer: { + display: "flex", + flexDirection: "column", + gap: 35, + }, + parameters: { + display: "flex", + flexWrap: "wrap", + gap: 25, + }, + parameterContainer: { + flex: 1, + padding: 20, + borderRadius: 4, + border: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, + display: "flex", + flexDirection: "column", + justifyContent: "space-between", + gap: 10, + }, + checkbox: { + "& .Mui-checked": { color: "black" }, + "& .MuiFormControlLabel-label": { + fontSize: 17, + fontWeight: 700, + color: "black", + whiteSpace: "nowrap", + }, + }, + improvementRaw: { + display: "flex", + gap: 6, + whiteSpace: "nowrap", + }, + issuesText: { + color: "#222", + }, + improvementValue: { + fontWeight: 700, + }, + listOfImprovementsContainer: { + display: "flex", + flexWrap: "wrap", + justifyContent: "space-between", + }, + status: { + textAlign: "right", + fontSize: 14, + fontWeight: 700, + }, + Low: { + background: "linear-gradient(90deg, rgba(255, 255, 255, 0.35) 0%, rgba(208, 109, 106, 0.35) 100%)", + color: "#D06D6A", + }, + Middle: { + background: "linear-gradient(90deg, rgba(255, 255, 255, 0.25) 0%, rgba(233, 170, 52, 0.25) 100%)", + color: "#E9AA34", + }, + High: { + background: "linear-gradient(90deg, rgba(255, 255, 255, 0.25) 0%, rgba(68, 156, 238, 0.25) 100%)", + color: "#449CEE", + }, + Perfect: { + background: "linear-gradient(90deg, rgba(255, 255, 255, 0.35) 0%, rgba(166, 47, 235, 0.35) 100%)", + color: "#A62FEB", + }, +}); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js new file mode 100644 index 000000000..459e20849 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js @@ -0,0 +1,33 @@ +import { withStyles } from "@mui/styles"; +import { useStyles } from "./styles"; + +const headData = ["column1", "column2", "column3"]; + +const TableSamples = ({ classes, tableData }) => { + return ( + + + + {headData.map((cellData, index) => ( + + ))} + + + + {tableData.map((row, index) => ( + + {row.map((cellData, index) => ( + + ))} + + ))} + +
+ {cellData} +
+ {cellData} +
+ ); +}; + +export default withStyles(useStyles)(TableSamples); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js new file mode 100644 index 000000000..2d3d12e54 --- /dev/null +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js @@ -0,0 +1,16 @@ +export const useStyles = (theme) => ({ + tableHead: { + color: theme.palette.text.mediumShadeGray, + }, + tableBody: { + color: "#222", + }, + tableCeil: { + padding: 10, + margin: "5px 0", + textAlign: "left", + borderBottom: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, + fontSize: 16, + fontWeight: 500, + }, +}); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index ce464818e..485a4af81 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -2,7 +2,10 @@ import SNETDialog from "../../../common/SNETDialog"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import Graphs from "./Graphs"; -import ImprovementParameters from "./ImprovementParameters"; +import ImprovementParameters from "./Parameters"; +import TableSamples from "./Table"; +import { createContext, useState } from "react"; +import ButtonGroup from "./ButtonGroup"; const analizeAnswer = { overall_score: 8, @@ -18,6 +21,7 @@ const analizeAnswer = { group_score_range: [0, 10], cases_count: 150, cases_fraction: 0.15, + group_score_label: "High", }, { displayed_name: "Punctuation Issues", @@ -26,6 +30,7 @@ const analizeAnswer = { group_score_range: [0, 10], cases_count: 255, cases_fraction: 0.255, + group_score_label: "Perfect", }, { displayed_name: "Capitalization Issues", @@ -34,6 +39,7 @@ const analizeAnswer = { group_score_range: [0, 10], cases_count: 125, cases_fraction: 0.125, + group_score_label: "Middle", }, { displayed_name: "Statistical Outliers", @@ -42,6 +48,7 @@ const analizeAnswer = { group_score_range: [0, 10], cases_count: 45, cases_fraction: 0.045, + group_score_label: "Perfect", }, { displayed_name: "Language Consistency", @@ -50,11 +57,12 @@ const analizeAnswer = { group_score_range: [0, 10], cases_count: 60, cases_fraction: 0.06, + group_score_label: "Low", }, ], graphs: [ { - key_name: "text_length_distribution", + group_score_label: "text_length_distribution", displayed_name: "Text Length Distribution", type: "histogram", data: [ @@ -78,32 +86,136 @@ const analizeAnswer = { ], }, { - key_name: "word_frequency", - displayed_name: "Most Frequent Words", - type: "word_cloud", + key_name: "word_frequencies", + displayed_name: "Word Frequencies", + type: "treemap", data: [ - { word: "data", frequency: 120 }, - { word: "text", frequency: 1100 }, - { word: "analysis", frequency: 900 }, - { word: "error", frequency: 850 }, - { word: "model", frequency: 800 }, + { + name: "helpful", + size: 2004, + }, + { + name: "answer", + size: 2004, + }, + { + name: "safe", + size: 1014, + }, + { + name: "know", + size: 1010, + }, + { + name: "information", + size: 1010, + }, + { + name: "false", + size: 1007, + }, + { + name: "question", + size: 1005, + }, + { + name: "possible", + size: 1004, + }, + { + name: "instruction", + size: 1001, + }, + { + name: "task", + size: 1001, + }, + { + name: "describes", + size: 1000, + }, + { + name: "respectful", + size: 1000, + }, + { + name: "honest", + size: 1000, + }, + { + name: "assistant", + size: 1000, + }, + { + name: "share", + size: 1000, + }, + { + name: "following", + size: 364, + }, + { + name: "Classify", + size: 242, + }, + { + name: "string", + size: 226, + }, + { + name: "Identify", + size: 204, + }, + { + name: "percussion", + size: 188, + }, ], }, ], + datasaet_sample: [ + [ + "Which is a species of fish? Tope or Rope", + "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", + "Tope", + ], + [ + "Identify which instrument is string or percussion: Cantaro, Gudok", + "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", + "Gudok is string, Cantaro is percussion.", + ], + [ + "Which of the following is useful for transportation: a glass of wine, a lamp, a train, an iced cube tray, a plane, a bicycle, an apple and a scooter.", + "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", + "The useful objects for transportation in the list are train, plane, bicyle and scooter.", + ], + ], }; +export const DashboardActionsContext = createContext({}); + const DashboardModal = ({ classes, onClose, isShow }) => { + const [selectedParameters, setSelectedParameters] = useState(); + const [isTableView, setIsTableView] = useState(true); + + const toggleTableView = () => { + setIsTableView(!isTableView); + }; + return (
-

Quality check of the dataset

- -
-

Quality of the dataset

-
- {analizeAnswer.graphs.map((graph) => ( - - ))} + + + {isTableView && } +
); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js index e7d58e966..2e327ff5b 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/styles.js @@ -2,65 +2,12 @@ export const useStyles = (theme) => ({ dasbordModalContainer: { display: "flex", flexDirection: "column", - gap: 25, + padding: "30px 0", + gap: 35, }, - parameters: { - display: "flex", - flexWrap: "wrap", - gap: 25, - }, - graphs: { - display: "flex", - flexWrap: "wrap", - gap: 25, - }, - improveButtonContainer: { - textAlign: "right", - }, - - // PARAMETER CARD - parameterContainer: { - flex: 1, - padding: 20, - borderRadius: 4, - border: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, - display: "flex", - flexDirection: "column", - justifyContent: "space-between", - gap: 10, - }, - checkbox: { - "& .Mui-checked": { color: "black" }, - "& .MuiFormControlLabel-label": { - fontSize: 17, - fontWeight: 700, - color: "black", - whiteSpace: "nowrap", - }, - }, - improvementRaw: { - display: "flex", - gap: 6, - whiteSpace: "nowrap", - }, - improvementValue: { - fontWeight: 700, - background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", - backgroundClip: "text", - "-webkit-background-clip": "text", - "-webkit-text-fill-color": "transparent", - }, - listOfImprovementsContainer: { + buttonsContainer: { display: "flex", flexWrap: "wrap", justifyContent: "space-between", }, - status: { - color: "#449CEE", - textAlign: "right", - fontSize: 14, - fontWeight: 700, - }, - - // GRAPHS }); diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 431baadb0..196364a90 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -11,7 +11,7 @@ import DashboardModal from "../DashboardModal"; import DatasetTabs from "../DatasetTabs"; import { useDispatch } from "react-redux"; -const acceptedFileTypes = ["application/zip", "application/x-zip-compressed"]; +const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; const datasetParameters = [ { title: "Size", value: "11.2Mb" }, { title: "Format", value: "TXT" }, diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index a3fd00ddd..6cd5bf0f3 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -1,4 +1,4 @@ -import React, { useEffect } from "react"; +import React from "react"; import Card from "../../common/Card"; import DatasetUploader from "./DatasetUploader"; import MergeIcon from "@mui/icons-material/CallMerge"; @@ -13,7 +13,7 @@ import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; import { setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; -import axios from "axios"; +// import axios from "axios"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); @@ -22,27 +22,27 @@ const DataPreset = ({ classes }) => { const mainDataset = useSelector((state) => state.datasetReducer.mainDataset); const mergeDataset = useSelector((state) => state.datasetReducer.forgotPasswordSubmit); -//TODO remove - const downloadDatasetFromS3 = async (url) => { - console.log("downloadDatasetFromS3"); - try { - let instance = axios.create({ - headers: { - Authorization: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", - }, - }); - console.log("downloadDatasetFromS3 instance", instance); - const response = await instance.get(url); - console.log("downloadDatasetFromS3 response", response); - } catch (err) { - throw new Error(err); - } - }; + //TODO remove + // const downloadDatasetFromS3 = async (url) => { + // console.log("downloadDatasetFromS3"); + // try { + // let instance = axios.create({ + // headers: { + // Authorization: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", + // }, + // }); + // console.log("downloadDatasetFromS3 instance", instance); + // const response = await instance.get(url); + // console.log("downloadDatasetFromS3 response", response); + // } catch (err) { + // throw new Error(err); + // } + // }; - useEffect(() => { - downloadDatasetFromS3(mainDataset?.link); - // mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); - }, [mainDataset]); + // useEffect(() => { + // downloadDatasetFromS3(mainDataset?.link); + // // mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); + // }, [mainDataset]); // const getStatistic = async (datasetKey) => { // try{ @@ -63,8 +63,10 @@ const DataPreset = ({ classes }) => { dispatch(setCurrentModelDetails({ dataset: mainDataset })); navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); }; + const setMainDatasetFunction = (data) => dispatch(setMainDataset(data)); const setMergeDatasetFunction = (data) => dispatch(setMergeDataset(data)); + const DataPresetContainer = () => { return (
@@ -73,7 +75,7 @@ const DataPreset = ({ classes }) => {
diff --git a/src/components/common/StyledButton/styles.js b/src/components/common/StyledButton/styles.js index e999e0579..50f540502 100644 --- a/src/components/common/StyledButton/styles.js +++ b/src/components/common/StyledButton/styles.js @@ -14,7 +14,7 @@ export const useStyles = makeStyles((theme) => ({ letterSpacing: "1.25px", lineHeight: "16px", "&:disabled": { - backgroundColor: theme.palette.text.lightGray, + backgroundColor: `${theme.palette.text.lightGray} !important`, color: theme.palette.text.white, }, }, @@ -86,10 +86,14 @@ export const useStyles = makeStyles((theme) => ({ }, }, gradientBg: { + border: "none", background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", }, gradientAccentBg: { border: "none", background: "linear-gradient(90deg, #D479FE 0%, #449CEE 45.5%, #4DE 100%)", + "&:disabled": { + background: theme.palette.text.disabledBtnBg, + }, }, })); diff --git a/src/utility/JSHelper.js b/src/utility/JSHelper.js index f29c9d955..48e7e2f0a 100644 --- a/src/utility/JSHelper.js +++ b/src/utility/JSHelper.js @@ -2,14 +2,14 @@ export function hasOwnDefinedProperty(object, property) { return object.hasOwnProperty(property) && typeof object[property] !== "undefined"; } -const roundTwoDesimals = (roundingNumber) => { - return Math.round((roundingNumber + Number.EPSILON) * 100) / 100; +export const roundToDesimals = (roundingNumber, decimals = 1) => { + return Math.round((roundingNumber + Number.EPSILON) * (10 * decimals)) / (10 * decimals); }; export function fileSizeConverter(sizeInBytes) { - const sizeInKiloBytes = roundTwoDesimals(sizeInBytes / 1024); + const sizeInKiloBytes = roundToDesimals(sizeInBytes / 1024, 2); if (sizeInKiloBytes > 1024) { - const sizeInMBytes = roundTwoDesimals(sizeInKiloBytes / 1024); + const sizeInMBytes = roundToDesimals(sizeInKiloBytes / 1024, 2); return sizeInMBytes + "MB"; } return sizeInKiloBytes + "KB"; From 94ae94917b647e769e16d1cebb17ea4e4291b752 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Fri, 29 Nov 2024 14:05:02 +0300 Subject: [PATCH 29/56] [SPT-767] updated scrollbar view --- src/index.css | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/index.css b/src/index.css index 6f015559b..29d2ea196 100644 --- a/src/index.css +++ b/src/index.css @@ -26,4 +26,15 @@ h2 { display: flex; justify-content: center; align-items: center; -} \ No newline at end of file +} + +::-webkit-scrollbar { + width: 5px; + height: 5px; + background-color: #F2F2F2; +} + +::-webkit-scrollbar-thumb { + background: #999; + border-radius: 10px; +} From 76d6adca3cdfb26509dc5588ef824210af2d9e69 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Fri, 29 Nov 2024 17:15:37 +0300 Subject: [PATCH 30/56] [SPT-767] fixed selecting dasboard improvment parameters --- .../DataPreset/DashboardModal/ButtonGroup.js | 2 -- .../DataPreset/DashboardModal/Parameters/index.js | 10 ++++------ 2 files changed, 4 insertions(+), 8 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index 9371b6eb6..eb914a173 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -5,8 +5,6 @@ import StyledButton from "../../../common/StyledButton"; const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView }) => { const tableButtonText = isTableView ? "close tablet" : "view tablet"; - console.log("selectedParameters: ", selectedParameters); - const isImproveButtonDisable = !selectedParameters?.size; console.log("isImproveButtonDisable: ", isImproveButtonDisable); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js index 570d0e8d1..918373ee1 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Parameters/index.js @@ -7,20 +7,18 @@ import clsx from "clsx"; const ImprovementParameters = ({ classes, parameters, setSelectedParameters }) => { const [paramsForImprove, setParamsForImprove] = useState(new Map()); - console.log("paramsForImprove: ", paramsForImprove); - const selectForImprove = (parameterName) => { - let params = paramsForImprove; + let params = new Map(paramsForImprove); + if (paramsForImprove.has(parameterName)) { params.delete(parameterName); } else { - params = paramsForImprove.set(parameterName, true); + params.set(parameterName, true); } - console.log("new params: ", params); - setParamsForImprove(params); setSelectedParameters(params); }; + const ImprovementParameter = ({ parameter }) => { return (
From ff342c38d659f6f86ad201d1f85a823db2c9b342 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Fri, 29 Nov 2024 19:00:28 +0300 Subject: [PATCH 31/56] [SPT-767] fixed icon for styled button --- .../DataPreset/DashboardModal/ButtonGroup.js | 9 +++++++-- src/components/common/StyledButton/index.js | 16 ++++++++++++++-- 2 files changed, 21 insertions(+), 4 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index eb914a173..e0b0d5968 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -1,12 +1,12 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import StyledButton from "../../../common/StyledButton"; +import TableIcon from "@mui/icons-material/TableChartOutlined"; const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView }) => { const tableButtonText = isTableView ? "close tablet" : "view tablet"; const isImproveButtonDisable = !selectedParameters?.size; - console.log("isImproveButtonDisable: ", isImproveButtonDisable); const improveDataset = () => { console.log("improveDataset by params: ", selectedParameters); @@ -14,7 +14,12 @@ const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableVie return (
- + { +const StyledButton = ({ + disabled, + onClick, + type, + btnType, + IconComponent, + iconClass, + href, + newTab, + btnText, + ...rest +}) => { const classes = useStyles(); return ( @@ -33,7 +44,8 @@ const StyledButton = ({ disabled, onClick, type, btnType, iconClass, href, newTa rel={href && newTab ? "noopener" : ""} {...rest} > - {iconClass ? : null} + {Boolean(IconComponent) && } + {iconClass && } {btnText} ); From f4d9952fb29f2482ea74e38e03f3898531fe9de1 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Fri, 29 Nov 2024 19:01:02 +0300 Subject: [PATCH 32/56] [SPT-767] fixed table head --- .../DataPreset/DashboardModal/Table/index.js | 7 ++++--- .../DataPreset/DashboardModal/Table/styles.js | 3 ++- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js index 459e20849..a0944c6c3 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js @@ -1,9 +1,10 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; -const headData = ["column1", "column2", "column3"]; - const TableSamples = ({ classes, tableData }) => { + const headData = tableData[0]; + const bodyData = tableData.slice(0); + return ( @@ -16,7 +17,7 @@ const TableSamples = ({ classes, tableData }) => { - {tableData.map((row, index) => ( + {bodyData.map((row, index) => ( {row.map((cellData, index) => (
diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js index 2d3d12e54..ac2db6f1a 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/styles.js @@ -1,9 +1,11 @@ export const useStyles = (theme) => ({ tableHead: { color: theme.palette.text.mediumShadeGray, + fontWeight: 600, }, tableBody: { color: "#222", + fontWeight: 500, }, tableCeil: { padding: 10, @@ -11,6 +13,5 @@ export const useStyles = (theme) => ({ textAlign: "left", borderBottom: `1px solid ${theme.palette.text.verticalTabLeftBorder}`, fontSize: 16, - fontWeight: 500, }, }); From a8192c7f1e1f6594291691da84b006ed333df6c3 Mon Sep 17 00:00:00 2001 From: Nikolay Terekhin Date: Mon, 2 Dec 2024 12:05:22 +0300 Subject: [PATCH 33/56] [SPT-767] Added storage data --- src/Redux/actionCreators/DatasetActions.js | 1 - .../DataPreset/DashboardModal/ButtonGroup.js | 4 +- .../DataPreset/DashboardModal/index.js | 381 +++++++++--------- .../DataPreset/DatasetInfo/index.js | 12 +- .../DataPreset/DatasetUploader/index.js | 51 ++- .../ServiceDetails/DataPreset/index.js | 36 +- 6 files changed, 257 insertions(+), 228 deletions(-) diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js index 75fb877fe..7517b277b 100644 --- a/src/Redux/actionCreators/DatasetActions.js +++ b/src/Redux/actionCreators/DatasetActions.js @@ -49,7 +49,6 @@ export const clearRecentDatasets = () => (dispatch) => { export const getDatasetStatistic = (datasetKey) => async (dispatch) => { const params = new URLSearchParams([["dataset_key", datasetKey]]); - console.log("params", params); return DatasetClient.get(DatasetEndpoints.VALIDATE_AND_ANALIZE, { params }); }; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index e0b0d5968..a8f95cac5 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -3,11 +3,13 @@ import { useStyles } from "./styles"; import StyledButton from "../../../common/StyledButton"; import TableIcon from "@mui/icons-material/TableChartOutlined"; -const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView }) => { +const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset }) => { const tableButtonText = isTableView ? "close tablet" : "view tablet"; const isImproveButtonDisable = !selectedParameters?.size; + console.log("ButtonsGroup dataset", dataset); + const improveDataset = () => { console.log("improveDataset by params: ", selectedParameters); }; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 485a4af81..d85e7b39f 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -1,200 +1,200 @@ import SNETDialog from "../../../common/SNETDialog"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; -import Graphs from "./Graphs"; +// import Graphs from "./Graphs"; import ImprovementParameters from "./Parameters"; import TableSamples from "./Table"; import { createContext, useState } from "react"; import ButtonGroup from "./ButtonGroup"; -const analizeAnswer = { - overall_score: 8, - overall_score_range: [0, 10], - cases_count: 537, - cases_fraction: 0.537, - total_samples: 1000, - feature_groups: [ - { - displayed_name: "Text Noise", - key_name: "text_noise", - group_score: 7, - group_score_range: [0, 10], - cases_count: 150, - cases_fraction: 0.15, - group_score_label: "High", - }, - { - displayed_name: "Punctuation Issues", - key_name: "punctuation_issues", - group_score: 9, - group_score_range: [0, 10], - cases_count: 255, - cases_fraction: 0.255, - group_score_label: "Perfect", - }, - { - displayed_name: "Capitalization Issues", - key_name: "capitalization_issues", - group_score: 6, - group_score_range: [0, 10], - cases_count: 125, - cases_fraction: 0.125, - group_score_label: "Middle", - }, - { - displayed_name: "Statistical Outliers", - key_name: "statistical_outliers", - group_score: 8, - group_score_range: [0, 10], - cases_count: 45, - cases_fraction: 0.045, - group_score_label: "Perfect", - }, - { - displayed_name: "Language Consistency", - key_name: "language_consistency", - group_score: 7, - group_score_range: [0, 10], - cases_count: 60, - cases_fraction: 0.06, - group_score_label: "Low", - }, - ], - graphs: [ - { - group_score_label: "text_length_distribution", - displayed_name: "Text Length Distribution", - type: "histogram", - data: [ - { bin: "0-10", count: 150 }, - { bin: "11-20", count: 300 }, - { bin: "21-30", count: 450 }, - { bin: "31-40", count: 200 }, - { bin: "41-50", count: 100 }, - { bin: "51+", count: 50 }, - ], - }, - { - key_name: "language_distribution", - displayed_name: "Language Distribution", - type: "pie", - data: [ - { label: "English", value: 70 }, - { label: "Spanish", value: 15 }, - { label: "French", value: 10 }, - { label: "Other", value: 5 }, - ], - }, - { - key_name: "word_frequencies", - displayed_name: "Word Frequencies", - type: "treemap", - data: [ - { - name: "helpful", - size: 2004, - }, - { - name: "answer", - size: 2004, - }, - { - name: "safe", - size: 1014, - }, - { - name: "know", - size: 1010, - }, - { - name: "information", - size: 1010, - }, - { - name: "false", - size: 1007, - }, - { - name: "question", - size: 1005, - }, - { - name: "possible", - size: 1004, - }, - { - name: "instruction", - size: 1001, - }, - { - name: "task", - size: 1001, - }, - { - name: "describes", - size: 1000, - }, - { - name: "respectful", - size: 1000, - }, - { - name: "honest", - size: 1000, - }, - { - name: "assistant", - size: 1000, - }, - { - name: "share", - size: 1000, - }, - { - name: "following", - size: 364, - }, - { - name: "Classify", - size: 242, - }, - { - name: "string", - size: 226, - }, - { - name: "Identify", - size: 204, - }, - { - name: "percussion", - size: 188, - }, - ], - }, - ], - datasaet_sample: [ - [ - "Which is a species of fish? Tope or Rope", - "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", - "Tope", - ], - [ - "Identify which instrument is string or percussion: Cantaro, Gudok", - "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", - "Gudok is string, Cantaro is percussion.", - ], - [ - "Which of the following is useful for transportation: a glass of wine, a lamp, a train, an iced cube tray, a plane, a bicycle, an apple and a scooter.", - "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", - "The useful objects for transportation in the list are train, plane, bicyle and scooter.", - ], - ], -}; +// const analizeAnswer = { +// overall_score: 8, +// overall_score_range: [0, 10], +// cases_count: 537, +// cases_fraction: 0.537, +// total_samples: 1000, +// feature_groups: [ +// { +// displayed_name: "Text Noise", +// key_name: "text_noise", +// group_score: 7, +// group_score_range: [0, 10], +// cases_count: 150, +// cases_fraction: 0.15, +// group_score_label: "High", +// }, +// { +// displayed_name: "Punctuation Issues", +// key_name: "punctuation_issues", +// group_score: 9, +// group_score_range: [0, 10], +// cases_count: 255, +// cases_fraction: 0.255, +// group_score_label: "Perfect", +// }, +// { +// displayed_name: "Capitalization Issues", +// key_name: "capitalization_issues", +// group_score: 6, +// group_score_range: [0, 10], +// cases_count: 125, +// cases_fraction: 0.125, +// group_score_label: "Middle", +// }, +// { +// displayed_name: "Statistical Outliers", +// key_name: "statistical_outliers", +// group_score: 8, +// group_score_range: [0, 10], +// cases_count: 45, +// cases_fraction: 0.045, +// group_score_label: "Perfect", +// }, +// { +// displayed_name: "Language Consistency", +// key_name: "language_consistency", +// group_score: 7, +// group_score_range: [0, 10], +// cases_count: 60, +// cases_fraction: 0.06, +// group_score_label: "Low", +// }, +// ], +// graphs: [ +// { +// group_score_label: "text_length_distribution", +// displayed_name: "Text Length Distribution", +// type: "histogram", +// data: [ +// { bin: "0-10", count: 150 }, +// { bin: "11-20", count: 300 }, +// { bin: "21-30", count: 450 }, +// { bin: "31-40", count: 200 }, +// { bin: "41-50", count: 100 }, +// { bin: "51+", count: 50 }, +// ], +// }, +// { +// key_name: "language_distribution", +// displayed_name: "Language Distribution", +// type: "pie", +// data: [ +// { label: "English", value: 70 }, +// { label: "Spanish", value: 15 }, +// { label: "French", value: 10 }, +// { label: "Other", value: 5 }, +// ], +// }, +// { +// key_name: "word_frequencies", +// displayed_name: "Word Frequencies", +// type: "treemap", +// data: [ +// { +// name: "helpful", +// size: 2004, +// }, +// { +// name: "answer", +// size: 2004, +// }, +// { +// name: "safe", +// size: 1014, +// }, +// { +// name: "know", +// size: 1010, +// }, +// { +// name: "information", +// size: 1010, +// }, +// { +// name: "false", +// size: 1007, +// }, +// { +// name: "question", +// size: 1005, +// }, +// { +// name: "possible", +// size: 1004, +// }, +// { +// name: "instruction", +// size: 1001, +// }, +// { +// name: "task", +// size: 1001, +// }, +// { +// name: "describes", +// size: 1000, +// }, +// { +// name: "respectful", +// size: 1000, +// }, +// { +// name: "honest", +// size: 1000, +// }, +// { +// name: "assistant", +// size: 1000, +// }, +// { +// name: "share", +// size: 1000, +// }, +// { +// name: "following", +// size: 364, +// }, +// { +// name: "Classify", +// size: 242, +// }, +// { +// name: "string", +// size: 226, +// }, +// { +// name: "Identify", +// size: 204, +// }, +// { +// name: "percussion", +// size: 188, +// }, +// ], +// }, +// ], +// datasaet_sample: [ +// [ +// "Which is a species of fish? Tope or Rope", +// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", +// "Tope", +// ], +// [ +// "Identify which instrument is string or percussion: Cantaro, Gudok", +// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", +// "Gudok is string, Cantaro is percussion.", +// ], +// [ +// "Which of the following is useful for transportation: a glass of wine, a lamp, a train, an iced cube tray, a plane, a bicycle, an apple and a scooter.", +// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", +// "The useful objects for transportation in the list are train, plane, bicyle and scooter.", +// ], +// ], +// }; export const DashboardActionsContext = createContext({}); -const DashboardModal = ({ classes, onClose, isShow }) => { +const DashboardModal = ({ classes, onClose, isShow, dataset }) => { const [selectedParameters, setSelectedParameters] = useState(); const [isTableView, setIsTableView] = useState(true); @@ -202,20 +202,23 @@ const DashboardModal = ({ classes, onClose, isShow }) => { setIsTableView(!isTableView); }; + console.log("dataset", dataset); + return (
- {isTableView && } - + {isTableView && } + {/**/}
); diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js index 0467490d4..3f9419cfb 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js @@ -1,6 +1,9 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import HelpOutline from "@mui/icons-material/HelpOutline"; +// import InlineLoader from "../../../common/InlineLoader"; +import React from "react"; +import CircularProgress from "@material-ui/core/CircularProgress"; const DatasetInfo = ({ classes, datasetParameters }) => { const DatasetRateInfo = ({ additionalInfo }) => { @@ -15,6 +18,7 @@ const DatasetInfo = ({ classes, datasetParameters }) => { ); }; + console.log("datasetParameters", datasetParameters); return (

Dataset info

@@ -30,7 +34,13 @@ const DatasetInfo = ({ classes, datasetParameters }) => { )}
-

{datasetParameter.value}

+ {!datasetParameter?.value ? + ( + + ) : + ( +

{datasetParameter.value}

+ )} ))} diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 196364a90..457892c43 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -12,23 +12,27 @@ import DatasetTabs from "../DatasetTabs"; import { useDispatch } from "react-redux"; const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; -const datasetParameters = [ - { title: "Size", value: "11.2Mb" }, - { title: "Format", value: "TXT" }, - { - title: "Rate", - value: "5.5/10", - additionalInfo: [ - { value: "11", title: "Outlier filtering1" }, - { value: "11", title: "Outlier filtering2" }, - { value: "11", title: "Outlier filtering3" }, - { value: "11", title: "Outlier filtering4" }, - ], - }, -]; +// const datasetParameters = [ +// { title: "Size", value: "11.2Mb" }, +// { title: "Format", value: "TXT" }, +// { +// title: "Rate", +// value: "5.5/10", +// additionalInfo: [ +// { value: "11", title: "Outlier filtering1" }, +// { value: "11", title: "Outlier filtering2" }, +// { value: "11", title: "Outlier filtering3" }, +// { value: "11", title: "Outlier filtering4" }, +// ], +// }, +// ]; const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { - const dispatch = useDispatch(); + console.log('DatasetUploader classes', classes) + console.log('DatasetUploader setDatasetInfo', setDatasetInfo) + console.log('DatasetUploader datasetInfo', datasetInfo) + console.log('DatasetUploader cleanDatasetInfo', cleanDatasetInfo) +; const dispatch = useDispatch(); const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); @@ -76,10 +80,21 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf const cleanCurrentDataset = () => { cleanDatasetInfo(); - setTrainingDataFileName(); - setTrainingDataFileSize(); + setTrainingDataFileName(null); + setTrainingDataFileSize(null); }; + + const datasetParameters = !datasetInfo ? null : [ + { title: "Size", value: datasetInfo?.size }, + { title: "Format", value: "CSV" }, + { + title: "Rate", + value: !datasetInfo?.additionalInfo ? null : datasetInfo?.additionalInfo?.analysis?.overall_score + "/" + datasetInfo?.additionalInfo?.analysis?.overall_score_range[1], + additionalInfo: datasetInfo?.additionalInfo?.analysis?.feature_groups.map((element) => { return {value: element.cases_count, title: element.displayed_name} }), + }, + ]; + return (
@@ -105,7 +120,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf )} - {isDashbordOpen && } + {isDashbordOpen && }
); }; diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 6cd5bf0f3..4fd22f368 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect } from "react"; import Card from "../../common/Card"; import DatasetUploader from "./DatasetUploader"; import MergeIcon from "@mui/icons-material/CallMerge"; @@ -12,8 +12,7 @@ import { isEmpty } from "lodash"; import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; -import { setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; -// import axios from "axios"; +import { getDatasetStatistic, setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); @@ -21,6 +20,8 @@ const DataPreset = ({ classes }) => { const dispatch = useDispatch(); const mainDataset = useSelector((state) => state.datasetReducer.mainDataset); const mergeDataset = useSelector((state) => state.datasetReducer.forgotPasswordSubmit); + console.log("DataPreset mainDataset", mainDataset); + console.log("DataPreset mergeDataset", mergeDataset); //TODO remove // const downloadDatasetFromS3 = async (url) => { @@ -39,22 +40,21 @@ const DataPreset = ({ classes }) => { // } // }; - // useEffect(() => { - // downloadDatasetFromS3(mainDataset?.link); - // // mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); - // }, [mainDataset]); + useEffect(() => { + console.log("mainDataset UPDATED", mainDataset); + mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); + }, [mainDataset]); + const getStatistic = async (datasetKey) => { + try{ + const { data } = await dispatch(getDatasetStatistic(datasetKey)); + console.log('data', data); + await dispatch(setMainDataset({ ...mainDataset, additionalInfo: data })); + } catch (error) { + console.error("getStatistic error", error); + } + } - // const getStatistic = async (datasetKey) => { - // try{ - // console.log("datasetKey", datasetKey); - // const answer = await dispatch(getDatasetStatistic(datasetKey)); - // console.error("getStatistic answer", answer); - // } catch (error) { - // console.error("getStatistic errror", error); - // } - // } - - const cleanMainDataset = () => { + const cleanMainDataset = async () => { dispatch(setMainDataset(mergeDataset)); dispatch(setMergeDataset(null)); }; From 6971976d8e898a2072cc24ffc0c69c02dd2879e1 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 13:04:55 +0300 Subject: [PATCH 34/56] [SPT-767] fixed dashboard data --- .../DataPreset/DashboardModal/Graphs/TreemapGraph.js | 9 ++++++--- .../DataPreset/DashboardModal/Graphs/index.js | 2 +- .../DataPreset/DashboardModal/Table/index.js | 2 +- .../ServiceDetails/DataPreset/DashboardModal/index.js | 10 +++------- src/components/common/StyledButton/styles.js | 3 +++ 5 files changed, 14 insertions(+), 12 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js index cb36f4571..65bf664c0 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js @@ -2,9 +2,12 @@ import { Treemap } from "recharts"; import { roundToDesimals } from "../../../../../utility/JSHelper"; const TreemapGraph = ({ data }) => { - const dataKeys = Object.keys(data[0]); - const labelKey = dataKeys[0]; - const valueKey = dataKeys[1]; + console.log("data: ", data); + + // const dataKeys = Object.keys(data[0]); + + const labelKey = "name"; //dataKeys[0]; + const valueKey = "size"; //dataKeys[1]; const getColors = () => { const numberOfColors = data.length; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js index 7038c85fa..f1a46785f 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/index.js @@ -23,7 +23,7 @@ const Graphs = ({ classes, graphs }) => { {graphs.map((graph) => (

{graph.displayed_name}

- {graphByType(graph.data, graph.type)} + {graphByType(graph?.data?.children, graph.type)}
))}
diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js index a0944c6c3..36fc8423a 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js @@ -3,7 +3,7 @@ import { useStyles } from "./styles"; const TableSamples = ({ classes, tableData }) => { const headData = tableData[0]; - const bodyData = tableData.slice(0); + const bodyData = tableData.slice(1); return ( diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index d85e7b39f..207083fed 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -1,10 +1,10 @@ import SNETDialog from "../../../common/SNETDialog"; import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; -// import Graphs from "./Graphs"; +import Graphs from "./Graphs"; import ImprovementParameters from "./Parameters"; import TableSamples from "./Table"; -import { createContext, useState } from "react"; +import { useState } from "react"; import ButtonGroup from "./ButtonGroup"; // const analizeAnswer = { @@ -192,8 +192,6 @@ import ButtonGroup from "./ButtonGroup"; // ], // }; -export const DashboardActionsContext = createContext({}); - const DashboardModal = ({ classes, onClose, isShow, dataset }) => { const [selectedParameters, setSelectedParameters] = useState(); const [isTableView, setIsTableView] = useState(true); @@ -202,8 +200,6 @@ const DashboardModal = ({ classes, onClose, isShow, dataset }) => { setIsTableView(!isTableView); }; - console.log("dataset", dataset); - return (
@@ -218,7 +214,7 @@ const DashboardModal = ({ classes, onClose, isShow, dataset }) => { toggleTableView={toggleTableView} /> {isTableView && } - {/**/} +
); diff --git a/src/components/common/StyledButton/styles.js b/src/components/common/StyledButton/styles.js index 50f540502..86d250238 100644 --- a/src/components/common/StyledButton/styles.js +++ b/src/components/common/StyledButton/styles.js @@ -88,6 +88,9 @@ export const useStyles = makeStyles((theme) => ({ gradientBg: { border: "none", background: "linear-gradient(90deg, #8279FE 0%, #449CEE 100%)", + "&:disabled": { + background: theme.palette.text.disabledBtnBg, + }, }, gradientAccentBg: { border: "none", From 4a7d03e429608dd693ce2060b76970a60a8be6db Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 13:06:22 +0300 Subject: [PATCH 35/56] [SPT-767] fixed dataset info displaying --- .../DataPreset/DatasetInfo/styles.js | 1 + .../DataPreset/DatasetUploader/index.js | 45 ++++++++++++------- 2 files changed, 30 insertions(+), 16 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js index 891d4e33b..da64bef82 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js @@ -29,6 +29,7 @@ export const useStyles = (theme) => ({ additionalFieldRaw: { display: "flex", gap: 6, + textWrap: "nowrap", }, additionalFieldValue: { fontWeight: 700, diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 457892c43..6a8dbae87 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -10,6 +10,7 @@ import StyledButton from "../../../common/StyledButton"; import DashboardModal from "../DashboardModal"; import DatasetTabs from "../DatasetTabs"; import { useDispatch } from "react-redux"; +import { fileSizeConverter } from "../../../../utility/JSHelper"; const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; // const datasetParameters = [ @@ -28,11 +29,11 @@ const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compre // ]; const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { - console.log('DatasetUploader classes', classes) - console.log('DatasetUploader setDatasetInfo', setDatasetInfo) - console.log('DatasetUploader datasetInfo', datasetInfo) - console.log('DatasetUploader cleanDatasetInfo', cleanDatasetInfo) -; const dispatch = useDispatch(); + console.log("DatasetUploader classes", classes); + console.log("DatasetUploader setDatasetInfo", setDatasetInfo); + console.log("DatasetUploader datasetInfo", datasetInfo); + console.log("DatasetUploader cleanDatasetInfo", cleanDatasetInfo); + const dispatch = useDispatch(); const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); const [trainingDataFileSize, setTrainingDataFileSize] = useState(datasetInfo?.size); @@ -84,16 +85,23 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf setTrainingDataFileSize(null); }; - - const datasetParameters = !datasetInfo ? null : [ - { title: "Size", value: datasetInfo?.size }, - { title: "Format", value: "CSV" }, - { - title: "Rate", - value: !datasetInfo?.additionalInfo ? null : datasetInfo?.additionalInfo?.analysis?.overall_score + "/" + datasetInfo?.additionalInfo?.analysis?.overall_score_range[1], - additionalInfo: datasetInfo?.additionalInfo?.analysis?.feature_groups.map((element) => { return {value: element.cases_count, title: element.displayed_name} }), - }, - ]; + const datasetParameters = !datasetInfo + ? null + : [ + { title: "Size", value: fileSizeConverter(datasetInfo?.size) }, + { title: "Format", value: "CSV" }, + { + title: "Rate", + value: !datasetInfo?.additionalInfo + ? null + : datasetInfo?.additionalInfo?.analysis?.overall_score + + "/" + + datasetInfo?.additionalInfo?.analysis?.overall_score_range[1], + additionalInfo: datasetInfo?.additionalInfo?.analysis?.feature_groups.map((element) => { + return { value: element.cases_count, title: element.displayed_name }; + }), + }, + ]; return (
@@ -117,7 +125,12 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf ) : ( <> - + )} {isDashbordOpen && } From 606c5426c50fd207ddfbd48081480e7b39275319 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 13:27:54 +0300 Subject: [PATCH 36/56] [SPT-767] fixed types for upload zip --- .../ServiceDetails/DataPreset/DatasetUploader/index.js | 2 +- .../TrainingModels/CreateModel/Data/Upload/index.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 6a8dbae87..d7c6849fb 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -12,7 +12,7 @@ import DatasetTabs from "../DatasetTabs"; import { useDispatch } from "react-redux"; import { fileSizeConverter } from "../../../../utility/JSHelper"; -const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; +const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-compressed": [".zip"] }; // const datasetParameters = [ // { title: "Size", value: "11.2Mb" }, // { title: "Format", value: "TXT" }, diff --git a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js index e81516c13..3ad6196f7 100644 --- a/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js +++ b/src/components/ServiceDetails/TrainingModels/CreateModel/Data/Upload/index.js @@ -8,7 +8,7 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import { useDispatch } from "react-redux"; -const acceptedFileTypes = { "application/zip": ".zip", "application/x-zip-compressed": ".zip" }; +const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-compressed": [".zip"] }; const Data = ({ classes, trainingDataset, setTrainingDataset }) => { const dispatch = useDispatch(); @@ -32,7 +32,7 @@ const Data = ({ classes, trainingDataset, setTrainingDataset }) => { setTrainingDataFileName(name); setTrainingDataFileSize(size); - const { url } = await dispatch(publishDatasetForTraining(fileBlob, name)); + const { url } = await dispatch(publishDatasetForTraining(fileBlob, name)); setTrainingDataset({ link: url, name, size }); } catch (error) { From fc1bd032506d22b6d31a7224ceba356744a3748f Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 13:57:43 +0300 Subject: [PATCH 37/56] [SPT-767] added loader to dataset uploader --- .../ServiceDetails/DataPreset/DatasetUploader/index.js | 8 +++++--- src/utility/constants/LoaderContent.js | 8 ++++++++ 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index d7c6849fb..ad8b6bc7f 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -11,6 +11,8 @@ import DashboardModal from "../DashboardModal"; import DatasetTabs from "../DatasetTabs"; import { useDispatch } from "react-redux"; import { fileSizeConverter } from "../../../../utility/JSHelper"; +import { LoaderContent } from "../../../../utility/constants/LoaderContent"; +import { loaderActions } from "../../../../Redux/actionCreators"; const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-compressed": [".zip"] }; // const datasetParameters = [ @@ -29,10 +31,7 @@ const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-comp // ]; const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { - console.log("DatasetUploader classes", classes); - console.log("DatasetUploader setDatasetInfo", setDatasetInfo); console.log("DatasetUploader datasetInfo", datasetInfo); - console.log("DatasetUploader cleanDatasetInfo", cleanDatasetInfo); const dispatch = useDispatch(); const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); @@ -45,6 +44,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf } if (!isEmpty(acceptedFiles)) { try { + dispatch(loaderActions.startAppLoader(LoaderContent.SET_DATASET)); const fileBlob = acceptedFiles[0]; const { name, size } = fileBlob; @@ -56,6 +56,8 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf console.log("error: ", error); // setAlert({ type: alertTypes.ERROR, message: error.message }); + } finally { + dispatch(loaderActions.stopAppLoader()); } } }; diff --git a/src/utility/constants/LoaderContent.js b/src/utility/constants/LoaderContent.js index d8cd64ae1..b96b5a784 100644 --- a/src/utility/constants/LoaderContent.js +++ b/src/utility/constants/LoaderContent.js @@ -116,4 +116,12 @@ export const LoaderContent = { loaderHeader: "Updating model", loaderText: "Please wait. we're updating model", }, + SET_DATASET: { + loaderHeader: "Handling dataset", + loaderText: "Please wait while we handle the dataset", + }, + GET_DATASET_STATISTIC: { + loaderHeader: "Fetching dataset statistic", + loaderText: "Please wait while we fetch the dataset statistic", + }, }; From 7a50c34ac7d2a3baf10ddecfef2c2760f492db76 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 14:01:15 +0300 Subject: [PATCH 38/56] [SPT-767] added loader to geting dataset statistic and fix upload dataset for merge --- .../ServiceDetails/DataPreset/index.js | 25 +++++++++++++------ 1 file changed, 18 insertions(+), 7 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 4fd22f368..18a0e842d 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -13,13 +13,15 @@ import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; import { getDatasetStatistic, setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; +import { loaderActions } from "../../../Redux/actionCreators"; +import { LoaderContent } from "../../../utility/constants/LoaderContent"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); const location = useLocation(); const dispatch = useDispatch(); const mainDataset = useSelector((state) => state.datasetReducer.mainDataset); - const mergeDataset = useSelector((state) => state.datasetReducer.forgotPasswordSubmit); + const mergeDataset = useSelector((state) => state.datasetReducer.mergeDataset); console.log("DataPreset mainDataset", mainDataset); console.log("DataPreset mergeDataset", mergeDataset); @@ -42,17 +44,26 @@ const DataPreset = ({ classes }) => { useEffect(() => { console.log("mainDataset UPDATED", mainDataset); - mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey); + mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey, setMainDataset); }, [mainDataset]); - const getStatistic = async (datasetKey) => { - try{ + + useEffect(() => { + console.log("mergeDataset UPDATED", mergeDataset); + mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset?.datasetKey, setMergeDataset); + }, [mergeDataset]); + + const getStatistic = async (datasetKey, setDataset) => { + try { + dispatch(loaderActions.startAppLoader(LoaderContent.GET_DATASET_STATISTIC)); const { data } = await dispatch(getDatasetStatistic(datasetKey)); - console.log('data', data); - await dispatch(setMainDataset({ ...mainDataset, additionalInfo: data })); + dispatch(setDataset({ ...mainDataset, additionalInfo: data })); } catch (error) { console.error("getStatistic error", error); + dispatch(setDataset(null)); + } finally { + dispatch(loaderActions.stopAppLoader()); } - } + }; const cleanMainDataset = async () => { dispatch(setMainDataset(mergeDataset)); From 18e081aaa06d98c896e43ab0755a53b79bcac647 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 18:38:00 +0300 Subject: [PATCH 39/56] [SPT-767] updated file loader style --- src/components/common/SNETFileUpload/index.js | 2 +- src/components/common/SNETFileUpload/styles.js | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/common/SNETFileUpload/index.js b/src/components/common/SNETFileUpload/index.js index 422a00303..212ff9616 100644 --- a/src/components/common/SNETFileUpload/index.js +++ b/src/components/common/SNETFileUpload/index.js @@ -51,7 +51,7 @@ const SNETFileUpload = (props) => { return ( - + {uploadSuccess ? ( <> {cleanCurrentFile && ( diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 33fa7da2e..1a0bce75b 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -5,7 +5,8 @@ export const useStyles = makeStyles((MUITheme) => ({ display: "flex", gap: 20, }, - grayBox: { + fileUploaderText: { + boxSizing: "border-box", position: "relative", width: "100%", padding: "50px 45px !important", @@ -24,6 +25,10 @@ export const useStyles = makeStyles((MUITheme) => ({ fontSize: 40, }, "& p": { + whiteSpace: "wrap", + textOverflow: "ellipsis", + width: "100%", + overflow: "hidden", "&:first-of-type": { color: MUITheme.palette.text.lightGrey, fontSize: 14, From 0e8bd3662cd5a251889459b5bf4d21292fca390e Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 18:41:55 +0300 Subject: [PATCH 40/56] [SPT-767] added merge dataset functionality --- src/Redux/actionCreators/DatasetActions.js | 6 ++- .../DataPreset/DashboardModal/Table/index.js | 2 +- .../DataPreset/DashboardModal/index.js | 11 ++++- .../ServiceDetails/DataPreset/index.js | 47 +++++++++++++++---- .../ServiceDetails/DataPreset/styles.js | 2 +- src/utility/constants/LoaderContent.js | 4 ++ 6 files changed, 57 insertions(+), 15 deletions(-) diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js index 7517b277b..8a19dd333 100644 --- a/src/Redux/actionCreators/DatasetActions.js +++ b/src/Redux/actionCreators/DatasetActions.js @@ -69,7 +69,7 @@ export const improveDataset = async (datasetKey, improveOptionsList) => async (d }); }; -export const mergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { +export const mergeDatasets = (mainDataset, mergeDataset) => async (dispatch) => { const params = { dataset_key_base: mainDataset, dataset_key_additional: mergeDataset, @@ -77,13 +77,14 @@ export const mergeDatasets = async (mainDataset, mergeDataset) => async (dispatc return DatasetClient.post(DatasetEndpoints.VALIDATE_MERGE, params) .then((response) => { console.log("mergeDatasets response.data", response.data); + return response.data; }) .catch((error) => { console.error("mergeDatasets Error:", error); }); }; -export const validateMergeDatasets = async (mainDataset, mergeDataset) => async (dispatch) => { +export const validateMergeDatasets = (mainDataset, mergeDataset) => async (dispatch) => { const params = { dataset_key_base: mainDataset, dataset_key_additional: mergeDataset, @@ -91,6 +92,7 @@ export const validateMergeDatasets = async (mainDataset, mergeDataset) => async return DatasetClient.post(DatasetEndpoints.MERGE, params) .then((response) => { console.log("validateMergeDatasets response.data", response.data); + return response.data; }) .catch((error) => { console.error("validateMergeDatasets Error:", error); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js index 36fc8423a..3631f9de4 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js @@ -3,7 +3,7 @@ import { useStyles } from "./styles"; const TableSamples = ({ classes, tableData }) => { const headData = tableData[0]; - const bodyData = tableData.slice(1); + const bodyData = tableData.length >= 2 ? tableData.slice(1) : []; return (
diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 207083fed..dd4007b58 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -213,7 +213,16 @@ const DashboardModal = ({ classes, onClose, isShow, dataset }) => { isTableView={isTableView} toggleTableView={toggleTableView} /> - {isTableView && } + {isTableView && ( + + )} diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 18a0e842d..cdbb186b7 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -12,9 +12,15 @@ import { isEmpty } from "lodash"; import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; -import { getDatasetStatistic, setMainDataset, setMergeDataset } from "../../../Redux/actionCreators/DatasetActions"; +import { + getDatasetStatistic, + setMainDataset, + setMergeDataset, + validateMergeDatasets, +} from "../../../Redux/actionCreators/DatasetActions"; import { loaderActions } from "../../../Redux/actionCreators"; import { LoaderContent } from "../../../utility/constants/LoaderContent"; +import { startAppLoader, stopAppLoader } from "../../../Redux/actionCreators/LoaderActions"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); @@ -43,20 +49,18 @@ const DataPreset = ({ classes }) => { // }; useEffect(() => { - console.log("mainDataset UPDATED", mainDataset); - mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey, setMainDataset); + mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset, setMainDataset); }, [mainDataset]); useEffect(() => { - console.log("mergeDataset UPDATED", mergeDataset); - mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset?.datasetKey, setMergeDataset); + mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset, setMergeDataset); }, [mergeDataset]); - const getStatistic = async (datasetKey, setDataset) => { + const getStatistic = async (dataset, setDataset) => { try { dispatch(loaderActions.startAppLoader(LoaderContent.GET_DATASET_STATISTIC)); - const { data } = await dispatch(getDatasetStatistic(datasetKey)); - dispatch(setDataset({ ...mainDataset, additionalInfo: data })); + const { data } = await dispatch(getDatasetStatistic(dataset?.datasetKey)); + dispatch(setDataset({ ...dataset, additionalInfo: data })); } catch (error) { console.error("getStatistic error", error); dispatch(setDataset(null)); @@ -65,11 +69,15 @@ const DataPreset = ({ classes }) => { } }; - const cleanMainDataset = async () => { + const cleanMainDataset = () => { dispatch(setMainDataset(mergeDataset)); dispatch(setMergeDataset(null)); }; + const cleanMergeDataset = () => { + dispatch(setMergeDataset(null)); + }; + const goToCreateModel = () => { dispatch(setCurrentModelDetails({ dataset: mainDataset })); navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); @@ -78,6 +86,24 @@ const DataPreset = ({ classes }) => { const setMainDatasetFunction = (data) => dispatch(setMainDataset(data)); const setMergeDatasetFunction = (data) => dispatch(setMergeDataset(data)); + const onMergeDatasets = async () => { + try { + dispatch(startAppLoader(LoaderContent.MERGE_DATASETS)); + const mergedDatasets = await dispatch(validateMergeDatasets(mainDataset?.datasetKey, mergeDataset?.datasetKey)); + setMainDatasetFunction({ + additionalInfo: mergedDatasets, + name: mergedDatasets.dataset_key_merged, + datasetKey: mergedDatasets.dataset_key_merged, + size: mainDataset?.size + mergeDataset?.size, + }); + cleanMergeDataset(); + } catch (error) { + console.log("error onMergeDatasets:", error); + } finally { + dispatch(stopAppLoader()); + } + }; + const DataPresetContainer = () => { return (
@@ -99,6 +125,7 @@ const DataPreset = ({ classes }) => {
} + onClick={onMergeDatasets} /> )} @@ -107,7 +134,7 @@ const DataPreset = ({ classes }) => { dispatch(setMergeDataset(null))} + cleanDatasetInfo={cleanMergeDataset} /> ) : (
diff --git a/src/components/ServiceDetails/DataPreset/styles.js b/src/components/ServiceDetails/DataPreset/styles.js index 12a19a31e..7eecf601c 100644 --- a/src/components/ServiceDetails/DataPreset/styles.js +++ b/src/components/ServiceDetails/DataPreset/styles.js @@ -16,7 +16,7 @@ export const useStyles = (theme) => ({ alignItems: "center", }, fileZone: { - width: "100%", + width: "50%", }, mergeButtonContainer: { "& button": { diff --git a/src/utility/constants/LoaderContent.js b/src/utility/constants/LoaderContent.js index b96b5a784..a0af9c912 100644 --- a/src/utility/constants/LoaderContent.js +++ b/src/utility/constants/LoaderContent.js @@ -124,4 +124,8 @@ export const LoaderContent = { loaderHeader: "Fetching dataset statistic", loaderText: "Please wait while we fetch the dataset statistic", }, + MERGE_DATASETS: { + loaderHeader: "Merging datasets", + loaderText: "Please wait while we merge the datasets", + }, }; From 95de21b9d7b4e2de057273d6b8b1010836590ad0 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 2 Dec 2024 19:13:21 +0300 Subject: [PATCH 41/56] [SPT-767] fixed merged dataset name --- src/components/ServiceDetails/DataPreset/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index cdbb186b7..6c5fabffd 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -92,7 +92,7 @@ const DataPreset = ({ classes }) => { const mergedDatasets = await dispatch(validateMergeDatasets(mainDataset?.datasetKey, mergeDataset?.datasetKey)); setMainDatasetFunction({ additionalInfo: mergedDatasets, - name: mergedDatasets.dataset_key_merged, + name: "merged_" + mainDataset?.name + mergeDataset?.name, datasetKey: mergedDatasets.dataset_key_merged, size: mainDataset?.size + mergeDataset?.size, }); From 822f8045c96472b1e09d90cd6aa5aaa2972bfc68 Mon Sep 17 00:00:00 2001 From: Nikolay Terekhin Date: Tue, 3 Dec 2024 01:03:59 +0300 Subject: [PATCH 42/56] [SPT-767] Added storage data --- src/Redux/actionCreators/DatasetActions.js | 23 +- src/Redux/reducers/DatasetReducer.js | 70 +++++- .../DataPreset/DashboardModal/ButtonGroup.js | 39 +++- .../DataPreset/DashboardModal/index.js | 212 ++---------------- .../DataPreset/DatasetInfo/index.js | 1 - .../DataPreset/DatasetTabs/index.js | 46 +--- .../DataPreset/DatasetUploader/index.js | 5 +- .../DataPreset/DatasetsList/index.js | 12 +- .../ServiceDetails/DataPreset/index.js | 52 ++--- src/utility/constants/LoaderContent.js | 4 + 10 files changed, 167 insertions(+), 297 deletions(-) diff --git a/src/Redux/actionCreators/DatasetActions.js b/src/Redux/actionCreators/DatasetActions.js index 8a19dd333..92acfb48d 100644 --- a/src/Redux/actionCreators/DatasetActions.js +++ b/src/Redux/actionCreators/DatasetActions.js @@ -5,6 +5,7 @@ export const SET_MERGE_DATASET = "SET_MERGE_DATASET"; export const SET_EXAMPLE_DATASETS = "SET_EXAMPLE_DATASETS"; export const CLEAR_EXAMPLE_DATASETS = "CLEAR_EXAMPLE_DATASETS"; export const ADD_RECENT_DATASET = "ADD_RECENT_DATASET"; +export const UPDATE_RECENT_DATASET = "UPDATE_RECENT_DATASET"; export const CLEAR_RECENT_DATASETS = "CLEAR_RECENT_DATASETS"; export const setMainDataset = (dataset) => (dispatch) => { @@ -41,6 +42,13 @@ export const addRecentDataset = (dataset) => (dispatch) => { }); }; +export const updateRecentDataset = (datasetKey, additionalInfo) => (dispatch) => { + dispatch({ + type: UPDATE_RECENT_DATASET, + payload: { datasetKey, additionalInfo }, + }); +}; + export const clearRecentDatasets = () => (dispatch) => { dispatch({ type: CLEAR_RECENT_DATASETS, @@ -52,7 +60,7 @@ export const getDatasetStatistic = (datasetKey) => async (dispatch) => { return DatasetClient.get(DatasetEndpoints.VALIDATE_AND_ANALIZE, { params }); }; -export const improveDataset = async (datasetKey, improveOptionsList) => async (dispatch) => { +export const improveDataset = (datasetKey, improveOptionsList) => async (dispatch) => { const params = { dataset_key: datasetKey, improve_options: improveOptionsList.reduce((acc, field) => { @@ -60,13 +68,7 @@ export const improveDataset = async (datasetKey, improveOptionsList) => async (d return acc; }, {}), }; - return DatasetClient.post(DatasetEndpoints.IMPROVE, params) - .then((response) => { - console.log("improveDataset response.data", response.data); - }) - .catch((error) => { - console.error("improveDataset Error:", error); - }); + return DatasetClient.post(DatasetEndpoints.IMPROVE, params); }; export const mergeDatasets = (mainDataset, mergeDataset) => async (dispatch) => { @@ -76,7 +78,6 @@ export const mergeDatasets = (mainDataset, mergeDataset) => async (dispatch) => }; return DatasetClient.post(DatasetEndpoints.VALIDATE_MERGE, params) .then((response) => { - console.log("mergeDatasets response.data", response.data); return response.data; }) .catch((error) => { @@ -91,13 +92,9 @@ export const validateMergeDatasets = (mainDataset, mergeDataset) => async (dispa }; return DatasetClient.post(DatasetEndpoints.MERGE, params) .then((response) => { - console.log("validateMergeDatasets response.data", response.data); return response.data; }) .catch((error) => { console.error("validateMergeDatasets Error:", error); }); }; - -// const res = await getDatasetStatistic("123"); -// console.log('getDatasetStatistic', res) diff --git a/src/Redux/reducers/DatasetReducer.js b/src/Redux/reducers/DatasetReducer.js index 20fe3b089..d31d03397 100644 --- a/src/Redux/reducers/DatasetReducer.js +++ b/src/Redux/reducers/DatasetReducer.js @@ -3,8 +3,66 @@ import { datasetActions } from "../actionCreators"; const initialState = { mainDataset: null, mergeDataset: null, - exampleDatasets: [], - recentDatasets: [], + exampleDatasets: [ + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet 1: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet 2: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet 3: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet 4: Training data for text translation", + size: 51234, + tag: "Text", + }, + ], + recentDatasets: [ + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet Recent 1: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet Recent 2: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet Recent 3: Training data for text translation", + size: 51234, + tag: "Text", + }, + { + datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + name: "DataSet Recent 4: Training data for text translation", + size: 51234, + tag: "Text", + }, + ], }; const datasetReducer = (state = initialState, action) => { @@ -18,7 +76,13 @@ const datasetReducer = (state = initialState, action) => { case datasetActions.CLEAR_EXAMPLE_DATASETS: return { ...state, exampleDatasets: [] }; case datasetActions.ADD_RECENT_DATASET: - return { ...state, recentDatasets: [...state.recentDatasets, action.payload] }; + return { ...state, recentDatasets: [action.payload, ...state.recentDatasets] }; + case datasetActions.UPDATE_RECENT_DATASET: + return { ...state, recentDatasets: state.recentDatasets.map(dataset => + dataset.datasetKey === action.payload.datasetKey + ? { ...dataset, additionalInfo: action.payload.additionalInfo } // Update the matched user + : dataset + ) }; case datasetActions.CLEAR_RECENT_DATASETS: return { ...state, recentDatasets: [] }; default: diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index a8f95cac5..2efac1d44 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -2,16 +2,43 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; import StyledButton from "../../../common/StyledButton"; import TableIcon from "@mui/icons-material/TableChartOutlined"; +import { useDispatch } from "react-redux"; +import { + addRecentDataset, + improveDataset, + setMainDataset, setMergeDataset, +} from "../../../../Redux/actionCreators/DatasetActions"; +import { startAppLoader, stopAppLoader } from "../../../../Redux/actionCreators/LoaderActions"; +import { LoaderContent } from "../../../../utility/constants/LoaderContent"; + +const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset, index }) => { + const dispatch = useDispatch(); -const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset }) => { const tableButtonText = isTableView ? "close tablet" : "view tablet"; const isImproveButtonDisable = !selectedParameters?.size; - console.log("ButtonsGroup dataset", dataset); - - const improveDataset = () => { - console.log("improveDataset by params: ", selectedParameters); + const getImprovedDataset = async () => { + try{ + dispatch(startAppLoader(LoaderContent.IMPROVE_DATASET)); + const { data } = await dispatch(improveDataset(dataset.datasetKey, Array.from(selectedParameters.keys()))); + const improvedDataset = { + additionalInfo: { + analysis: data.analysis, + datasaet_sample: data.dataset_sample + }, + datasetKey: data.dataset_key_new, + name: dataset.name + "_improved_rate_" + data.analysis.overall_score, + size: dataset.size, + tag: dataset.tag, + }; + await dispatch(addRecentDataset(improvedDataset)); + !index ? await dispatch(setMainDataset(improvedDataset)) : await dispatch(setMergeDataset(improvedDataset)); + } catch (error) { + console.error("getImprovedDataset error", error); + } finally { + dispatch(stopAppLoader()); + } }; return ( @@ -26,7 +53,7 @@ const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableVie disabled={isImproveButtonDisable} type="gradientAccent" btnText="IMPROVE" - onClick={improveDataset} + onClick={getImprovedDataset} />
); diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index dd4007b58..1e3a6bac6 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -7,192 +7,7 @@ import TableSamples from "./Table"; import { useState } from "react"; import ButtonGroup from "./ButtonGroup"; -// const analizeAnswer = { -// overall_score: 8, -// overall_score_range: [0, 10], -// cases_count: 537, -// cases_fraction: 0.537, -// total_samples: 1000, -// feature_groups: [ -// { -// displayed_name: "Text Noise", -// key_name: "text_noise", -// group_score: 7, -// group_score_range: [0, 10], -// cases_count: 150, -// cases_fraction: 0.15, -// group_score_label: "High", -// }, -// { -// displayed_name: "Punctuation Issues", -// key_name: "punctuation_issues", -// group_score: 9, -// group_score_range: [0, 10], -// cases_count: 255, -// cases_fraction: 0.255, -// group_score_label: "Perfect", -// }, -// { -// displayed_name: "Capitalization Issues", -// key_name: "capitalization_issues", -// group_score: 6, -// group_score_range: [0, 10], -// cases_count: 125, -// cases_fraction: 0.125, -// group_score_label: "Middle", -// }, -// { -// displayed_name: "Statistical Outliers", -// key_name: "statistical_outliers", -// group_score: 8, -// group_score_range: [0, 10], -// cases_count: 45, -// cases_fraction: 0.045, -// group_score_label: "Perfect", -// }, -// { -// displayed_name: "Language Consistency", -// key_name: "language_consistency", -// group_score: 7, -// group_score_range: [0, 10], -// cases_count: 60, -// cases_fraction: 0.06, -// group_score_label: "Low", -// }, -// ], -// graphs: [ -// { -// group_score_label: "text_length_distribution", -// displayed_name: "Text Length Distribution", -// type: "histogram", -// data: [ -// { bin: "0-10", count: 150 }, -// { bin: "11-20", count: 300 }, -// { bin: "21-30", count: 450 }, -// { bin: "31-40", count: 200 }, -// { bin: "41-50", count: 100 }, -// { bin: "51+", count: 50 }, -// ], -// }, -// { -// key_name: "language_distribution", -// displayed_name: "Language Distribution", -// type: "pie", -// data: [ -// { label: "English", value: 70 }, -// { label: "Spanish", value: 15 }, -// { label: "French", value: 10 }, -// { label: "Other", value: 5 }, -// ], -// }, -// { -// key_name: "word_frequencies", -// displayed_name: "Word Frequencies", -// type: "treemap", -// data: [ -// { -// name: "helpful", -// size: 2004, -// }, -// { -// name: "answer", -// size: 2004, -// }, -// { -// name: "safe", -// size: 1014, -// }, -// { -// name: "know", -// size: 1010, -// }, -// { -// name: "information", -// size: 1010, -// }, -// { -// name: "false", -// size: 1007, -// }, -// { -// name: "question", -// size: 1005, -// }, -// { -// name: "possible", -// size: 1004, -// }, -// { -// name: "instruction", -// size: 1001, -// }, -// { -// name: "task", -// size: 1001, -// }, -// { -// name: "describes", -// size: 1000, -// }, -// { -// name: "respectful", -// size: 1000, -// }, -// { -// name: "honest", -// size: 1000, -// }, -// { -// name: "assistant", -// size: 1000, -// }, -// { -// name: "share", -// size: 1000, -// }, -// { -// name: "following", -// size: 364, -// }, -// { -// name: "Classify", -// size: 242, -// }, -// { -// name: "string", -// size: 226, -// }, -// { -// name: "Identify", -// size: 204, -// }, -// { -// name: "percussion", -// size: 188, -// }, -// ], -// }, -// ], -// datasaet_sample: [ -// [ -// "Which is a species of fish? Tope or Rope", -// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", -// "Tope", -// ], -// [ -// "Identify which instrument is string or percussion: Cantaro, Gudok", -// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", -// "Gudok is string, Cantaro is percussion.", -// ], -// [ -// "Which of the following is useful for transportation: a glass of wine, a lamp, a train, an iced cube tray, a plane, a bicycle, an apple and a scooter.", -// "Below is an instruction that describes a task.\nYou are a helpful, respectful and honest assistant. Always answer as helpful as possible, while being safe. If you don't know the answer to a question, please don't share false information", -// "The useful objects for transportation in the list are train, plane, bicyle and scooter.", -// ], -// ], -// }; - -const DashboardModal = ({ classes, onClose, isShow, dataset }) => { +const DashboardModal = ({ classes, onClose, isShow, dataset, index }) => { const [selectedParameters, setSelectedParameters] = useState(); const [isTableView, setIsTableView] = useState(true); @@ -212,17 +27,22 @@ const DashboardModal = ({ classes, onClose, isShow, dataset }) => { selectedParameters={selectedParameters} isTableView={isTableView} toggleTableView={toggleTableView} + index={index} /> - {isTableView && ( - - )} + { + isTableView && + (dataset?.additionalInfo?.dataset_sample || dataset?.additionalInfo?.datasaet_sample) && + ( + + ) + } diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js index 3f9419cfb..a83cefc26 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js @@ -18,7 +18,6 @@ const DatasetInfo = ({ classes, datasetParameters }) => { ); }; - console.log("datasetParameters", datasetParameters); return (

Dataset info

diff --git a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js index ae8978d91..cce82c813 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js @@ -1,47 +1,11 @@ import { useState } from "react"; import StyledTabs from "../../StyledTabs"; import DatasetsList from "../DatasetsList"; - -const datasetsExamples = [ - { id: 1, tag: "Text", size: 51234, name: "DataSet 1: Training data for text translation", link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004" }, - { id: 2, tag: "Text", size: 51234, name: "DataSet 2: Training data for text translation", link: "link/to/s3/2" }, - { id: 3, tag: "Text", size: 51234, name: "DataSet 3: Training data for text translation", link: "link/to/s3/3" }, - { id: 4, tag: "Text", size: 51234, name: "DataSet 4: Training data for text translation", link: "link/to/s3/4" }, -]; - -const datasetsRecent = [ - { - id: 1, - tag: "Text", - size: 51234, - name: "DataSet Recent 1: Training data for text translation", - link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - }, - { - id: 2, - tag: "Text", - size: 51234, - name: "DataSet Recent 2: Training data for text translation", - link: "link/to/s3/2", - }, - { - id: 3, - tag: "Text", - size: 51234, - name: "DataSet Recent 3: Training data for text translation", - link: "link/to/s3/3", - }, - { - id: 4, - tag: "Text", - size: 51234, - name: "DataSet Recent 4: Training data for text translation", - link: "link/to/s3/4", - }, -]; +import { useSelector } from "react-redux"; const DatasetTabs = ({ setDatasetInfo }) => { + const exampleDatasets = useSelector((state) => state.datasetReducer.exampleDatasets); + const recentDatasets = useSelector((state) => state.datasetReducer.recentDatasets); const [activeTab, setActiveTab] = useState(0); const handleTabChange = (activeTab) => { @@ -52,12 +16,12 @@ const DatasetTabs = ({ setDatasetInfo }) => { { name: "Recent", activeIndex: 0, - component: , + component: , }, { name: "Examples", activeIndex: 1, - component: , + component: , }, ]; diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index ad8b6bc7f..3db42d9a0 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -30,8 +30,7 @@ const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-comp // }, // ]; -const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo }) => { - console.log("DatasetUploader datasetInfo", datasetInfo); +const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo, index }) => { const dispatch = useDispatch(); const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); @@ -135,7 +134,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf /> )} - {isDashbordOpen && } + {isDashbordOpen && }
); }; diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js index a32040c55..ce30bfcea 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js @@ -2,19 +2,19 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { - const DatasetLine = ({ datasetKey, name, size, link, tag }) => { + const DatasetLine = ({dataset}) => { return ( -
setDatasetInfo({ datasetKey, link, name, size })} className={classes.datasetLine}> -
{name}
-
{tag}
+
setDatasetInfo(dataset)} className={classes.datasetLine}> +
{dataset?.name}
+
{dataset?.tag}
); }; return (
- {datasets.map((dataset) => ( - + {datasets.map((dataset, index) => ( + ))}
); diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 6c5fabffd..8484c2f31 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -13,9 +13,11 @@ import { useLocation, useNavigate } from "react-router-dom"; import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; import { + addRecentDataset, getDatasetStatistic, setMainDataset, setMergeDataset, + updateRecentDataset, validateMergeDatasets, } from "../../../Redux/actionCreators/DatasetActions"; import { loaderActions } from "../../../Redux/actionCreators"; @@ -28,39 +30,28 @@ const DataPreset = ({ classes }) => { const dispatch = useDispatch(); const mainDataset = useSelector((state) => state.datasetReducer.mainDataset); const mergeDataset = useSelector((state) => state.datasetReducer.mergeDataset); - console.log("DataPreset mainDataset", mainDataset); - console.log("DataPreset mergeDataset", mergeDataset); - - //TODO remove - // const downloadDatasetFromS3 = async (url) => { - // console.log("downloadDatasetFromS3"); - // try { - // let instance = axios.create({ - // headers: { - // Authorization: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", - // }, - // }); - // console.log("downloadDatasetFromS3 instance", instance); - // const response = await instance.get(url); - // console.log("downloadDatasetFromS3 response", response); - // } catch (err) { - // throw new Error(err); - // } - // }; + const recentDatasets = useSelector((state) => state.datasetReducer.recentDatasets); useEffect(() => { - mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset, setMainDataset); + !!mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey, setMainDataset); }, [mainDataset]); useEffect(() => { - mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset, setMergeDataset); + !!mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset?.datasetKey, setMergeDataset); }, [mergeDataset]); - const getStatistic = async (dataset, setDataset) => { + const getStatistic = async (datasetKey, setDataset) => { try { dispatch(loaderActions.startAppLoader(LoaderContent.GET_DATASET_STATISTIC)); - const { data } = await dispatch(getDatasetStatistic(dataset?.datasetKey)); - dispatch(setDataset({ ...dataset, additionalInfo: data })); + const { data } = await dispatch(getDatasetStatistic(datasetKey)); + const enrichedDataset = { ...mainDataset, additionalInfo: data }; + const actualDatasetIndexInRecent = recentDatasets.find(el => el.datasetKey === datasetKey); + if (!actualDatasetIndexInRecent) { + await dispatch(addRecentDataset(enrichedDataset)); + } else { + await dispatch(updateRecentDataset(datasetKey, data)); + } + await dispatch(setDataset(enrichedDataset)); } catch (error) { console.error("getStatistic error", error); dispatch(setDataset(null)); @@ -90,13 +81,16 @@ const DataPreset = ({ classes }) => { try { dispatch(startAppLoader(LoaderContent.MERGE_DATASETS)); const mergedDatasets = await dispatch(validateMergeDatasets(mainDataset?.datasetKey, mergeDataset?.datasetKey)); - setMainDatasetFunction({ + const mergedDataset = { additionalInfo: mergedDatasets, - name: "merged_" + mainDataset?.name + mergeDataset?.name, datasetKey: mergedDatasets.dataset_key_merged, + name: "merged_" + mainDataset?.name + "_" + mergeDataset?.name, size: mainDataset?.size + mergeDataset?.size, - }); - cleanMergeDataset(); + tag: mainDataset?.tag, + } + await dispatch(addRecentDataset(mergedDataset)); + await dispatch(setMainDataset(mergedDataset)); + await dispatch(setMergeDataset(null)); } catch (error) { console.log("error onMergeDatasets:", error); } finally { @@ -114,6 +108,7 @@ const DataPreset = ({ classes }) => { datasetInfo={mainDataset} setDatasetInfo={setMainDatasetFunction} cleanDatasetInfo={cleanMainDataset} + index={0} />
{mergeDataset && ( @@ -135,6 +130,7 @@ const DataPreset = ({ classes }) => { datasetInfo={mergeDataset} setDatasetInfo={setMergeDatasetFunction} cleanDatasetInfo={cleanMergeDataset} + index={0} /> ) : (
diff --git a/src/utility/constants/LoaderContent.js b/src/utility/constants/LoaderContent.js index a0af9c912..c858839e4 100644 --- a/src/utility/constants/LoaderContent.js +++ b/src/utility/constants/LoaderContent.js @@ -124,6 +124,10 @@ export const LoaderContent = { loaderHeader: "Fetching dataset statistic", loaderText: "Please wait while we fetch the dataset statistic", }, + IMPROVE_DATASET: { + loaderHeader: "Improving dataset", + loaderText: "Please wait while we improving the dataset", + }, MERGE_DATASETS: { loaderHeader: "Merging datasets", loaderText: "Please wait while we merge the datasets", From 67ecb1f076f40670cda2aa1b3a565f4c47d3fe05 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 10:43:44 +0300 Subject: [PATCH 43/56] [SPT-767] updated example datasets --- src/Redux/reducers/DatasetReducer.js | 21 ++++++++++----------- 1 file changed, 10 insertions(+), 11 deletions(-) diff --git a/src/Redux/reducers/DatasetReducer.js b/src/Redux/reducers/DatasetReducer.js index d31d03397..dcb5e00aa 100644 --- a/src/Redux/reducers/DatasetReducer.js +++ b/src/Redux/reducers/DatasetReducer.js @@ -5,29 +5,25 @@ const initialState = { mergeDataset: null, exampleDatasets: [ { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + datasetKey: "data_instruct_example_x0.5.zip_matrejukna@gufum.com_1733211488305", name: "DataSet 1: Training data for text translation", size: 51234, tag: "Text", }, { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + datasetKey: "data_instruct_example_x1.zip_matrejukna@gufum.com_1733211612606", name: "DataSet 2: Training data for text translation", size: 51234, tag: "Text", }, { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + datasetKey: "data_instruct_example_x2.zip_matrejukna@gufum.com_1733211645798", name: "DataSet 3: Training data for text translation", size: 51234, tag: "Text", }, { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", + datasetKey: "data_instruct_llm_1000.zip_matrejukna@gufum.com_1733211676614", name: "DataSet 4: Training data for text translation", size: 51234, tag: "Text", @@ -78,11 +74,14 @@ const datasetReducer = (state = initialState, action) => { case datasetActions.ADD_RECENT_DATASET: return { ...state, recentDatasets: [action.payload, ...state.recentDatasets] }; case datasetActions.UPDATE_RECENT_DATASET: - return { ...state, recentDatasets: state.recentDatasets.map(dataset => + return { + ...state, + recentDatasets: state.recentDatasets.map((dataset) => dataset.datasetKey === action.payload.datasetKey ? { ...dataset, additionalInfo: action.payload.additionalInfo } // Update the matched user : dataset - ) }; + ), + }; case datasetActions.CLEAR_RECENT_DATASETS: return { ...state, recentDatasets: [] }; default: @@ -90,4 +89,4 @@ const datasetReducer = (state = initialState, action) => { } }; -export default datasetReducer; \ No newline at end of file +export default datasetReducer; From 2246e7fd05d390841c1eba9a9584853d7525b066 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 11:04:57 +0300 Subject: [PATCH 44/56] [SPT-767] removed wrong prop name handler --- .../DataPreset/DashboardModal/index.js | 17 +++-------------- 1 file changed, 3 insertions(+), 14 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 1e3a6bac6..09e8a04e1 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -29,20 +29,9 @@ const DashboardModal = ({ classes, onClose, isShow, dataset, index }) => { toggleTableView={toggleTableView} index={index} /> - { - isTableView && - (dataset?.additionalInfo?.dataset_sample || dataset?.additionalInfo?.datasaet_sample) && - ( - - ) - } + {isTableView && (dataset?.additionalInfo?.dataset_sample || dataset?.additionalInfo?.datasaet_sample) && ( + + )}
From caa6ca7a15f3280b160e81c63e02bd87dcf3217b Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 13:43:54 +0300 Subject: [PATCH 45/56] [SPT-767] fixed bug on dataset uploading --- .../ServiceDetails/DataPreset/index.js | 23 +++++++++++-------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 8484c2f31..74c302c33 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -10,7 +10,7 @@ import StyledButton from "../../common/StyledButton"; import clsx from "clsx"; import { isEmpty } from "lodash"; import { useLocation, useNavigate } from "react-router-dom"; -import { setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; +import { getDatasetSizeFromS3, setCurrentModelDetails } from "../../../Redux/actionCreators/ServiceTrainingActions"; import { useDispatch, useSelector } from "react-redux"; import { addRecentDataset, @@ -23,6 +23,7 @@ import { import { loaderActions } from "../../../Redux/actionCreators"; import { LoaderContent } from "../../../utility/constants/LoaderContent"; import { startAppLoader, stopAppLoader } from "../../../Redux/actionCreators/LoaderActions"; +import { DatafactoryInstanceS3 } from "../../../config/DatasetS3Client"; const DataPreset = ({ classes }) => { const navigate = useNavigate(); @@ -33,19 +34,20 @@ const DataPreset = ({ classes }) => { const recentDatasets = useSelector((state) => state.datasetReducer.recentDatasets); useEffect(() => { - !!mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset?.datasetKey, setMainDataset); + !!mainDataset && !mainDataset?.additionalInfo && getStatistic(mainDataset, setMainDataset); }, [mainDataset]); useEffect(() => { - !!mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset?.datasetKey, setMergeDataset); + !!mergeDataset && !mergeDataset?.additionalInfo && getStatistic(mergeDataset, setMergeDataset); }, [mergeDataset]); - const getStatistic = async (datasetKey, setDataset) => { + const getStatistic = async (dataset, setDataset) => { try { dispatch(loaderActions.startAppLoader(LoaderContent.GET_DATASET_STATISTIC)); + const datasetKey = dataset?.datasetKey; const { data } = await dispatch(getDatasetStatistic(datasetKey)); - const enrichedDataset = { ...mainDataset, additionalInfo: data }; - const actualDatasetIndexInRecent = recentDatasets.find(el => el.datasetKey === datasetKey); + const enrichedDataset = { ...dataset, additionalInfo: data }; + const actualDatasetIndexInRecent = recentDatasets.find((el) => el.datasetKey === datasetKey); if (!actualDatasetIndexInRecent) { await dispatch(addRecentDataset(enrichedDataset)); } else { @@ -81,18 +83,19 @@ const DataPreset = ({ classes }) => { try { dispatch(startAppLoader(LoaderContent.MERGE_DATASETS)); const mergedDatasets = await dispatch(validateMergeDatasets(mainDataset?.datasetKey, mergeDataset?.datasetKey)); + const size = await getDatasetSizeFromS3(mergedDatasets.dataset_key_merged, DatafactoryInstanceS3); const mergedDataset = { additionalInfo: mergedDatasets, datasetKey: mergedDatasets.dataset_key_merged, name: "merged_" + mainDataset?.name + "_" + mergeDataset?.name, - size: mainDataset?.size + mergeDataset?.size, - tag: mainDataset?.tag, - } + size, + tag: mainDataset?.tag, + }; await dispatch(addRecentDataset(mergedDataset)); await dispatch(setMainDataset(mergedDataset)); await dispatch(setMergeDataset(null)); } catch (error) { - console.log("error onMergeDatasets:", error); + console.log("error on merge datasets:", error); } finally { dispatch(stopAppLoader()); } From 28d35860e9d124203440564c6e5c58de44fd4ade Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 13:45:12 +0300 Subject: [PATCH 46/56] [SPT-767] fixed console error --- .../DataPreset/DatasetUploader/index.js | 20 ++++--------------- 1 file changed, 4 insertions(+), 16 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 3db42d9a0..7939ae648 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -15,20 +15,6 @@ import { LoaderContent } from "../../../../utility/constants/LoaderContent"; import { loaderActions } from "../../../../Redux/actionCreators"; const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-compressed": [".zip"] }; -// const datasetParameters = [ -// { title: "Size", value: "11.2Mb" }, -// { title: "Format", value: "TXT" }, -// { -// title: "Rate", -// value: "5.5/10", -// additionalInfo: [ -// { value: "11", title: "Outlier filtering1" }, -// { value: "11", title: "Outlier filtering2" }, -// { value: "11", title: "Outlier filtering3" }, -// { value: "11", title: "Outlier filtering4" }, -// ], -// }, -// ]; const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo, index }) => { const dispatch = useDispatch(); @@ -50,7 +36,7 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf setTrainingDataFileName(name); setTrainingDataFileSize(size); const { url, datasetKey } = await dispatch(publishDatasetForImproving(fileBlob, name)); - dispatch(setDatasetInfo({ link: url, name, size, datasetKey })); + setDatasetInfo({ link: url, name, size, datasetKey }); } catch (error) { console.log("error: ", error); @@ -134,7 +120,9 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf /> )} - {isDashbordOpen && } + {isDashbordOpen && ( + + )} ); }; From 4718c279fff6f36d373bf56cacc06d43ce5923bc Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 13:48:59 +0300 Subject: [PATCH 47/56] [SPT-767] added getting size for datasets from s3 --- .../actionCreators/ServiceTrainingActions.js | 56 +++++++++---------- .../DataPreset/DashboardModal/ButtonGroup.js | 12 ++-- src/config/DatasetS3Client.js | 30 ++++++++++ 3 files changed, 65 insertions(+), 33 deletions(-) create mode 100644 src/config/DatasetS3Client.js diff --git a/src/Redux/actionCreators/ServiceTrainingActions.js b/src/Redux/actionCreators/ServiceTrainingActions.js index 0dc710371..916dba218 100644 --- a/src/Redux/actionCreators/ServiceTrainingActions.js +++ b/src/Redux/actionCreators/ServiceTrainingActions.js @@ -4,6 +4,7 @@ import { startAppLoader, stopAppLoader } from "./LoaderActions"; import { getServiceClient } from "./SDKActions"; import { fetchAuthenticatedUser, updateMetamaskWallet } from "./UserActions"; import { modelStatus } from "../reducers/ServiceTrainingReducer"; +import { DatafactoryInstanceS3, DatasetS3Endpoints, TrainingInstanceS3 } from "../../config/DatasetS3Client"; // import { userActions } from "."; export const SET_MODEL_DETAILS = "SET_MODEL_DETAILS"; export const SET_MODELS_LIST = "SET_MODELS_LIST"; @@ -191,49 +192,46 @@ const modelStatusByNumber = { }; export const publishDatasetForTraining = (fileBlob, name) => async (dispatch) => { - const linkAndKeyDataset = await dispatch( - publishDatasetToS3( - fileBlob, - name, - "https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default", - "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7" - ) - ); - return linkAndKeyDataset; + try { + const linkAndKeyDataset = await dispatch(publishDatasetToS3(fileBlob, name, TrainingInstanceS3)); + return linkAndKeyDataset; + } catch (error) { + console.log("publishing Dataset For Training error: ", error); + } }; export const publishDatasetForImproving = (fileBlob, name) => async (dispatch) => { - const linkAndKeyDataset = await dispatch( - publishDatasetToS3( - fileBlob, - name, - "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com", - "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH" - ) - ); - return linkAndKeyDataset; + try { + const linkAndKeyDataset = await dispatch(publishDatasetToS3(fileBlob, name, DatafactoryInstanceS3)); + return linkAndKeyDataset; + } catch (error) { + console.log("publishing Dataset For Improving error: ", error); + } }; -export const publishDatasetToS3 = (fileBlob, name, baseUrl, authToken) => async (dispatch) => { +export const publishDatasetToS3 = (fileBlob, name, S3Instance) => async (dispatch) => { const { email } = await dispatch(fetchAuthenticatedUser()); try { + const baseUrl = S3Instance.getUri(); const fileKey = name + "_" + email + "_" + Date.now(); - const url = `${baseUrl}/upload?key=${fileKey}`; - - let instance = axios.create({ - headers: { - Authorization: authToken, - }, - }); - - const response = await instance.get(url); + const response = await S3Instance.get(DatasetS3Endpoints.UPLOAD, { params: { key: fileKey } }); await axios.put(response.data.uploadURL, fileBlob); return { url: `${baseUrl}/download?key=${fileKey}`, - datasetKey: fileKey + datasetKey: fileKey, }; } catch (err) { throw new Error(err); } }; + +export const getDatasetSizeFromS3 = async (fileKey, S3instance) => { + return S3instance.get(DatasetS3Endpoints.DOWNLOAD, { params: { key: fileKey, action: "getsize" } }) + .then((response) => { + return response.data.fileSize; + }) + .catch((error) => { + console.error("mergeDatasets Error:", error); + }); +}; diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index 2efac1d44..9c93c2360 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -6,10 +6,13 @@ import { useDispatch } from "react-redux"; import { addRecentDataset, improveDataset, - setMainDataset, setMergeDataset, + setMainDataset, + setMergeDataset, } from "../../../../Redux/actionCreators/DatasetActions"; import { startAppLoader, stopAppLoader } from "../../../../Redux/actionCreators/LoaderActions"; import { LoaderContent } from "../../../../utility/constants/LoaderContent"; +import { DatafactoryInstanceS3 } from "../../../../config/DatasetS3Client"; +import { getDatasetSizeFromS3 } from "../../../../Redux/actionCreators/ServiceTrainingActions"; const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset, index }) => { const dispatch = useDispatch(); @@ -19,17 +22,18 @@ const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableVie const isImproveButtonDisable = !selectedParameters?.size; const getImprovedDataset = async () => { - try{ + try { dispatch(startAppLoader(LoaderContent.IMPROVE_DATASET)); const { data } = await dispatch(improveDataset(dataset.datasetKey, Array.from(selectedParameters.keys()))); + const size = await getDatasetSizeFromS3(data.dataset_key_new, DatafactoryInstanceS3); const improvedDataset = { additionalInfo: { analysis: data.analysis, - datasaet_sample: data.dataset_sample + datasaet_sample: data.dataset_sample, }, datasetKey: data.dataset_key_new, name: dataset.name + "_improved_rate_" + data.analysis.overall_score, - size: dataset.size, + size, tag: dataset.tag, }; await dispatch(addRecentDataset(improvedDataset)); diff --git a/src/config/DatasetS3Client.js b/src/config/DatasetS3Client.js new file mode 100644 index 000000000..457998893 --- /dev/null +++ b/src/config/DatasetS3Client.js @@ -0,0 +1,30 @@ +import axios from "axios"; + +const DATAFACTORY_S3 = { + baseUrl: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com", + authToken: "IYE2sz0hUSGhWcyLQTwXS0AbiXKq4h1eW85MZSo6uDhtYfXI8dXisTzRyXaBCImH", +}; + +const TRAINING_S3 = { + baseUrl: "https://xim5yugo7g.execute-api.us-east-1.amazonaws.com/default", + authToken: "S1kDjcub9k78JFAyrLPsfS0yQoQ4mgmmpeWKlIoVvYsk6JVq5v4HHKvKQgZ0VdI7", +}; + +export const TrainingInstanceS3 = axios.create({ + baseURL: TRAINING_S3.baseUrl, + headers: { + Authorization: TRAINING_S3.authToken, + }, +}); + +export const DatafactoryInstanceS3 = axios.create({ + baseURL: DATAFACTORY_S3.baseUrl, + headers: { + Authorization: DATAFACTORY_S3.authToken, + }, +}); + +export const DatasetS3Endpoints = { + UPLOAD: "/upload", // params: key + DOWNLOAD: "/download", // params: key +}; From 52ed2ce8276ef360544e1d6b66797889012d8e72 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 14:50:15 +0300 Subject: [PATCH 48/56] [SPT-767] updated displaying recent and examples datasets --- src/Redux/reducers/DatasetReducer.js | 37 +------------------ .../DataPreset/DatasetTabs/index.js | 31 ++++++++++------ .../DataPreset/DatasetsList/index.js | 4 +- 3 files changed, 22 insertions(+), 50 deletions(-) diff --git a/src/Redux/reducers/DatasetReducer.js b/src/Redux/reducers/DatasetReducer.js index dcb5e00aa..cbe7fcf2c 100644 --- a/src/Redux/reducers/DatasetReducer.js +++ b/src/Redux/reducers/DatasetReducer.js @@ -22,43 +22,8 @@ const initialState = { size: 51234, tag: "Text", }, - { - datasetKey: "data_instruct_llm_1000.zip_matrejukna@gufum.com_1733211676614", - name: "DataSet 4: Training data for text translation", - size: 51234, - tag: "Text", - }, - ], - recentDatasets: [ - { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - name: "DataSet Recent 1: Training data for text translation", - size: 51234, - tag: "Text", - }, - { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - name: "DataSet Recent 2: Training data for text translation", - size: 51234, - tag: "Text", - }, - { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - name: "DataSet Recent 3: Training data for text translation", - size: 51234, - tag: "Text", - }, - { - datasetKey: "data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - // link: "https://ozx0e68owf.execute-api.us-east-1.amazonaws.com/download?key=data_instruct_llm_1000.zip_training@singularitynet.io_1732864358004", - name: "DataSet Recent 4: Training data for text translation", - size: 51234, - tag: "Text", - }, ], + recentDatasets: [], }; const datasetReducer = (state = initialState, action) => { diff --git a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js index cce82c813..661ce0d22 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetTabs/index.js @@ -12,18 +12,25 @@ const DatasetTabs = ({ setDatasetInfo }) => { setActiveTab(activeTab); }; - const tabs = [ - { - name: "Recent", - activeIndex: 0, - component: , - }, - { - name: "Examples", - activeIndex: 1, - component: , - }, - ]; + const exampleTab = { + name: "Examples", + activeIndex: 0, + component: , + }; + const recentTab = { + name: "Recent", + activeIndex: 1, + component: , + }; + + const tabs = []; + if (recentDatasets.length === 0) { + tabs.push({ ...exampleTab, activeIndex: 0 }); + tabs.push({ ...recentTab, activeIndex: 1 }); + } else { + tabs.push({ ...recentTab, activeIndex: 0 }); + tabs.push({ ...exampleTab, activeIndex: 1 }); + } return (
diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js index ce30bfcea..d17c07450 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetsList/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/index.js @@ -2,11 +2,11 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; const DatasetsList = ({ classes, setDatasetInfo, datasets }) => { - const DatasetLine = ({dataset}) => { + const DatasetLine = ({ dataset }) => { return (
setDatasetInfo(dataset)} className={classes.datasetLine}>
{dataset?.name}
-
{dataset?.tag}
+
{dataset?.tag ? dataset?.tag : "Text"}
); }; From c23b2735c8a08d9af8bba188729d969139f01159 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Tue, 3 Dec 2024 17:18:50 +0300 Subject: [PATCH 49/56] [SPT-767] updated examples datasets --- src/Redux/reducers/DatasetReducer.js | 16 ++-------------- 1 file changed, 2 insertions(+), 14 deletions(-) diff --git a/src/Redux/reducers/DatasetReducer.js b/src/Redux/reducers/DatasetReducer.js index cbe7fcf2c..02f050c20 100644 --- a/src/Redux/reducers/DatasetReducer.js +++ b/src/Redux/reducers/DatasetReducer.js @@ -5,21 +5,9 @@ const initialState = { mergeDataset: null, exampleDatasets: [ { - datasetKey: "data_instruct_example_x0.5.zip_matrejukna@gufum.com_1733211488305", + datasetKey: "data_instruct_llm_1000_base_clean.zip_fospipakno@gufum.com_1733235148125", name: "DataSet 1: Training data for text translation", - size: 51234, - tag: "Text", - }, - { - datasetKey: "data_instruct_example_x1.zip_matrejukna@gufum.com_1733211612606", - name: "DataSet 2: Training data for text translation", - size: 51234, - tag: "Text", - }, - { - datasetKey: "data_instruct_example_x2.zip_matrejukna@gufum.com_1733211645798", - name: "DataSet 3: Training data for text translation", - size: 51234, + size: 287028, tag: "Text", }, ], From e49cb1346472e9d2d7d87fa0897d19d04662895d Mon Sep 17 00:00:00 2001 From: Nikolay Terekhin Date: Tue, 3 Dec 2024 21:32:13 +0300 Subject: [PATCH 50/56] [SPT-767] fix model for fine-tune --- src/components/ServiceDetails/DataPreset/index.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index 74c302c33..bdaa5543f 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -72,7 +72,17 @@ const DataPreset = ({ classes }) => { }; const goToCreateModel = () => { - dispatch(setCurrentModelDetails({ dataset: mainDataset })); + const baseUrl = DatafactoryInstanceS3.getUri(); + const link =`${baseUrl}/download?key=${mainDataset.datasetKey}` + const model = { + dataset: { + ...mainDataset, + link, + }, + modelName: mainDataset.name, + description: mainDataset.name, + } + dispatch(setCurrentModelDetails(model)); navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); }; From 4fb9355e4f967944402f1a5545ec2e336fe111ab Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 4 Dec 2024 13:23:06 +0300 Subject: [PATCH 51/56] [SPT-767] fixed styles for dataset preset tab --- .../ServiceDetails/DataPreset/DatasetInfo/styles.js | 8 ++++---- .../ServiceDetails/DataPreset/DatasetsList/styles.js | 7 +++++++ src/components/ServiceDetails/DataPreset/index.js | 8 ++++---- src/components/ServiceDetails/DataPreset/styles.js | 12 ++++++++++++ src/components/common/SNETFileUpload/styles.js | 2 +- 5 files changed, 28 insertions(+), 9 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js index da64bef82..06b27c59f 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/styles.js @@ -1,6 +1,6 @@ export const useStyles = (theme) => ({ datasetParameter: { - minWidth: "100px", + flex: 1, display: "flex", padding: "14px 10px", flexDirection: "column", @@ -60,11 +60,11 @@ export const useStyles = (theme) => ({ parameterTitle: { margin: 0, fontSize: 17, - fontWeight: 700, + fontWeight: 600, }, parameterValue: { margin: 0, - fontSize: 28, - fontWeight: 700, + fontSize: 24, + fontWeight: 600, }, }); diff --git a/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js b/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js index 9a401b10d..04b4e2eb9 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js +++ b/src/components/ServiceDetails/DataPreset/DatasetsList/styles.js @@ -5,6 +5,7 @@ export const useStyles = (theme) => ({ gap: 16, }, datasetLine: { + boxSizing: "border-box", display: "flex", padding: "8px 12px", justifyContent: "space-between", @@ -15,6 +16,12 @@ export const useStyles = (theme) => ({ background: theme.palette.text.gray, cursor: "pointer", }, + datasetName: { + whiteSpace: "wrap", + textOverflow: "ellipsis", + width: "100%", + overflow: "hidden", + }, datasetTag: { padding: 5, borderRadius: 6, diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index bdaa5543f..c2c2f8ddf 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -73,15 +73,15 @@ const DataPreset = ({ classes }) => { const goToCreateModel = () => { const baseUrl = DatafactoryInstanceS3.getUri(); - const link =`${baseUrl}/download?key=${mainDataset.datasetKey}` + const link = `${baseUrl}/download?key=${mainDataset.datasetKey}`; const model = { dataset: { - ...mainDataset, + ...mainDataset, link, }, modelName: mainDataset.name, description: mainDataset.name, - } + }; dispatch(setCurrentModelDetails(model)); navigate(location.pathname.split("tab/")[0] + "tab/" + 3, { state: { isOpenCreatingModel: true } }); }; @@ -116,7 +116,7 @@ const DataPreset = ({ classes }) => {

Upload Your Dataset

-
+
({ display: "flex", justifyContent: "space-between", gap: 30, + "@media(max-width: 1024px)": { + flexDirection: "column", + }, }, fineTuneBatton: { textAlign: "right", @@ -16,7 +19,16 @@ export const useStyles = (theme) => ({ alignItems: "center", }, fileZone: { + width: "40%", + "@media(max-width: 1024px)": { + width: "100% !important", + }, + }, + fileZoneExtended: { width: "50%", + "@media(max-width: 1024px)": { + width: "100% !important", + }, }, mergeButtonContainer: { "& button": { diff --git a/src/components/common/SNETFileUpload/styles.js b/src/components/common/SNETFileUpload/styles.js index 1a0bce75b..f75e135ec 100644 --- a/src/components/common/SNETFileUpload/styles.js +++ b/src/components/common/SNETFileUpload/styles.js @@ -9,7 +9,7 @@ export const useStyles = makeStyles((MUITheme) => ({ boxSizing: "border-box", position: "relative", width: "100%", - padding: "50px 45px !important", + padding: "50px 25px !important", borderWidth: 1, borderStyle: "dashed", borderColor: MUITheme.palette.text.darkGray, From e820f3cabf7399339ec281b58f48551d62d8ea6b Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 4 Dec 2024 13:39:22 +0300 Subject: [PATCH 52/56] [SPT-767] fixed prop name for improved dataset --- .../ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js | 2 +- .../ServiceDetails/DataPreset/DashboardModal/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index 9c93c2360..6325da277 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -29,7 +29,7 @@ const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableVie const improvedDataset = { additionalInfo: { analysis: data.analysis, - datasaet_sample: data.dataset_sample, + dataset_sample: data.dataset_sample, }, datasetKey: data.dataset_key_new, name: dataset.name + "_improved_rate_" + data.analysis.overall_score, diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 09e8a04e1..118e6eced 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -29,7 +29,7 @@ const DashboardModal = ({ classes, onClose, isShow, dataset, index }) => { toggleTableView={toggleTableView} index={index} /> - {isTableView && (dataset?.additionalInfo?.dataset_sample || dataset?.additionalInfo?.datasaet_sample) && ( + {isTableView && dataset?.additionalInfo?.dataset_sample && ( )} From 383d4d9a987d3b337235e7eaa8ee1c65592134a0 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 4 Dec 2024 13:49:37 +0300 Subject: [PATCH 53/56] [SPT-767] added a check against an empty table for the sample table --- .../ServiceDetails/DataPreset/DashboardModal/Table/index.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js index 3631f9de4..942897ef5 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Table/index.js @@ -2,6 +2,10 @@ import { withStyles } from "@mui/styles"; import { useStyles } from "./styles"; const TableSamples = ({ classes, tableData }) => { + if (tableData.length === 0) { + return null; + } + const headData = tableData[0]; const bodyData = tableData.length >= 2 ? tableData.slice(1) : []; From fa9647446200d981c33d580a41b56e0b1b2d2b74 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 4 Dec 2024 13:50:09 +0300 Subject: [PATCH 54/56] [SPT-767] removed log for treemap graph --- .../DataPreset/DashboardModal/Graphs/TreemapGraph.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js index 65bf664c0..21bb96926 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/Graphs/TreemapGraph.js @@ -2,8 +2,6 @@ import { Treemap } from "recharts"; import { roundToDesimals } from "../../../../../utility/JSHelper"; const TreemapGraph = ({ data }) => { - console.log("data: ", data); - // const dataKeys = Object.keys(data[0]); const labelKey = "name"; //dataKeys[0]; From c83dbf288ce3920c360d2ffcb4033492219f3ec8 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Mon, 9 Dec 2024 12:31:29 +0300 Subject: [PATCH 55/56] [SPT-767] fixed set dataset after improvment --- .../DataPreset/DashboardModal/ButtonGroup.js | 11 +++-------- .../ServiceDetails/DataPreset/DashboardModal/index.js | 4 ++-- .../DataPreset/DatasetUploader/index.js | 9 +++++++-- src/components/ServiceDetails/DataPreset/index.js | 2 -- 4 files changed, 12 insertions(+), 14 deletions(-) diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js index 6325da277..ccd1cdec6 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/ButtonGroup.js @@ -3,18 +3,13 @@ import { useStyles } from "./styles"; import StyledButton from "../../../common/StyledButton"; import TableIcon from "@mui/icons-material/TableChartOutlined"; import { useDispatch } from "react-redux"; -import { - addRecentDataset, - improveDataset, - setMainDataset, - setMergeDataset, -} from "../../../../Redux/actionCreators/DatasetActions"; +import { addRecentDataset, improveDataset } from "../../../../Redux/actionCreators/DatasetActions"; import { startAppLoader, stopAppLoader } from "../../../../Redux/actionCreators/LoaderActions"; import { LoaderContent } from "../../../../utility/constants/LoaderContent"; import { DatafactoryInstanceS3 } from "../../../../config/DatasetS3Client"; import { getDatasetSizeFromS3 } from "../../../../Redux/actionCreators/ServiceTrainingActions"; -const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset, index }) => { +const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableView, dataset, setDataset }) => { const dispatch = useDispatch(); const tableButtonText = isTableView ? "close tablet" : "view tablet"; @@ -37,7 +32,7 @@ const ButtonsGroup = ({ classes, selectedParameters, isTableView, toggleTableVie tag: dataset.tag, }; await dispatch(addRecentDataset(improvedDataset)); - !index ? await dispatch(setMainDataset(improvedDataset)) : await dispatch(setMergeDataset(improvedDataset)); + setDataset(improvedDataset); } catch (error) { console.error("getImprovedDataset error", error); } finally { diff --git a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js index 118e6eced..f078037dc 100644 --- a/src/components/ServiceDetails/DataPreset/DashboardModal/index.js +++ b/src/components/ServiceDetails/DataPreset/DashboardModal/index.js @@ -7,7 +7,7 @@ import TableSamples from "./Table"; import { useState } from "react"; import ButtonGroup from "./ButtonGroup"; -const DashboardModal = ({ classes, onClose, isShow, dataset, index }) => { +const DashboardModal = ({ classes, onClose, isShow, dataset, setDatasetInfo }) => { const [selectedParameters, setSelectedParameters] = useState(); const [isTableView, setIsTableView] = useState(true); @@ -27,7 +27,7 @@ const DashboardModal = ({ classes, onClose, isShow, dataset, index }) => { selectedParameters={selectedParameters} isTableView={isTableView} toggleTableView={toggleTableView} - index={index} + setDataset={setDatasetInfo} /> {isTableView && dataset?.additionalInfo?.dataset_sample && ( diff --git a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js index 7939ae648..f1429659b 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetUploader/index.js @@ -16,7 +16,7 @@ import { loaderActions } from "../../../../Redux/actionCreators"; const acceptedFileTypes = { "application/zip": [".zip"], "application/x-zip-compressed": [".zip"] }; -const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo, index }) => { +const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInfo, isMainDataset }) => { const dispatch = useDispatch(); const [trainingDataFileName, setTrainingDataFileName] = useState(datasetInfo?.name); @@ -121,7 +121,12 @@ const DatasetUploader = ({ classes, setDatasetInfo, datasetInfo, cleanDatasetInf )} {isDashbordOpen && ( - + )}
); diff --git a/src/components/ServiceDetails/DataPreset/index.js b/src/components/ServiceDetails/DataPreset/index.js index c2c2f8ddf..d5bf35fa3 100644 --- a/src/components/ServiceDetails/DataPreset/index.js +++ b/src/components/ServiceDetails/DataPreset/index.js @@ -121,7 +121,6 @@ const DataPreset = ({ classes }) => { datasetInfo={mainDataset} setDatasetInfo={setMainDatasetFunction} cleanDatasetInfo={cleanMainDataset} - index={0} />
{mergeDataset && ( @@ -143,7 +142,6 @@ const DataPreset = ({ classes }) => { datasetInfo={mergeDataset} setDatasetInfo={setMergeDatasetFunction} cleanDatasetInfo={cleanMergeDataset} - index={0} /> ) : (
From 9fc6a3304f4077a208e6d91c7fff6015f0cab932 Mon Sep 17 00:00:00 2001 From: Marina Fedyantceva Date: Wed, 25 Dec 2024 18:27:28 +0300 Subject: [PATCH 56/56] [SPT-767] fixed error in open service without training --- src/Redux/actionCreators/ServiceDetailsActions.js | 2 +- .../ServiceDetails/DataPreset/DatasetInfo/index.js | 12 +++++------- 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/src/Redux/actionCreators/ServiceDetailsActions.js b/src/Redux/actionCreators/ServiceDetailsActions.js index 747fe01f2..748950453 100644 --- a/src/Redux/actionCreators/ServiceDetailsActions.js +++ b/src/Redux/actionCreators/ServiceDetailsActions.js @@ -96,7 +96,7 @@ export const getIsTrainingAvailable = (detailsTraining, isLoggedIn) => { return false; } - if (!Object.prototype.hasOwnProperty.call(detailsTraining, "trainingMethods")) { + if (!Object.prototype.hasOwnProperty.call(detailsTraining, "trainingMethods") || !detailsTraining?.trainingMethods) { return false; } diff --git a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js index a83cefc26..88aaeedc5 100644 --- a/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js +++ b/src/components/ServiceDetails/DataPreset/DatasetInfo/index.js @@ -33,13 +33,11 @@ const DatasetInfo = ({ classes, datasetParameters }) => { )}
- {!datasetParameter?.value ? - ( - - ) : - ( -

{datasetParameter.value}

- )} + {!datasetParameter?.value ? ( + + ) : ( +

{datasetParameter.value}

+ )}
))}