diff --git a/src/Hooks/useInput.jsx b/src/Hooks/useInput.jsx index 346c9a470..e5f4abd0c 100644 --- a/src/Hooks/useInput.jsx +++ b/src/Hooks/useInput.jsx @@ -25,12 +25,11 @@ export const useLoading = (action) => { export const loadImageSize = (resultData, cols) => { return new Promise((resolve, reject) => { setTimeout(() => { - let height = 0; let colsWidth = 1180 / cols; if (Array.isArray(resultData) && resultData.length) { - var img = new Image(); + let img = new Image(); img.src = resultData[0]; - height = (colsWidth * img.height) / img.width; + const height = (colsWidth * img.height) / img.width; if (img.width !== 0 && img.height !== 0) { resolve(height); } diff --git a/src/components/NavItems/tools/Deepfake/Hooks/useGetDeepfake.jsx b/src/components/NavItems/tools/Deepfake/Hooks/useGetDeepfake.jsx index 1112ad592..cf46f9b23 100644 --- a/src/components/NavItems/tools/Deepfake/Hooks/useGetDeepfake.jsx +++ b/src/components/NavItems/tools/Deepfake/Hooks/useGetDeepfake.jsx @@ -9,6 +9,7 @@ import { } from "../../../../../redux/actions/tools/deepfakeVideoActions"; import { setError } from "redux/reducers/errorReducer"; import { isValidUrl } from "../../../../Shared/Utils/URLUtils"; +import { ROLES } from "../../../../../constants/roles"; async function UseGetDeepfake( keyword, @@ -37,7 +38,7 @@ async function UseGetDeepfake( modeURL = "videos/"; // services = "deepfake_video,ftcn,face_reenact"; services = "deepfake_video"; - if (role.includes("EXTRA_FEATURE")) services += ",ftcn"; + if (role.includes(ROLES.EXTRA_FEATURE)) services += ",ftcn"; } if (!modeURL) { diff --git a/src/components/NavItems/tools/Deepfake/Results/DeepfakeResultsVideo.jsx b/src/components/NavItems/tools/Deepfake/Results/DeepfakeResultsVideo.jsx index 69c1b9ac2..bf9743845 100644 --- a/src/components/NavItems/tools/Deepfake/Results/DeepfakeResultsVideo.jsx +++ b/src/components/NavItems/tools/Deepfake/Results/DeepfakeResultsVideo.jsx @@ -23,7 +23,8 @@ const DeepfakeResultsVideo = (props) => { class DeepfakeResult { constructor(methodName, predictionScore) { - (this.methodName = methodName), (this.predictionScore = predictionScore); + this.methodName = methodName; + this.predictionScore = predictionScore; } } @@ -93,8 +94,8 @@ const DeepfakeResultsVideo = (props) => { ); useEffect(() => { - var prediction = results.deepfake_video_report.prediction; - var shot = -1; + const prediction = results.deepfake_video_report.prediction; + let shot = -1; if ( !results || @@ -158,9 +159,9 @@ const DeepfakeResultsVideo = (props) => { ); } - setDeepfakeScores(res); - res = res.sort((a, b) => b.predictionScore - a.predictionScore); + + setDeepfakeScores(res); }, [results]); //console.log("Rectangles: ", rectangles); @@ -325,7 +326,7 @@ const DeepfakeResultsVideo = (props) => { {keyword("deepfake_no_face_detection")} )} - {deepfakeScores && deepfakeScores.length != 0 && ( + {deepfakeScores && deepfakeScores.length !== 0 && ( { boxShadow: "0px 2px 1px -1px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 1px 3px 0px rgb(0 0 0 / 12%)", maxHeight: "60vh", - maxWidth: "60vw", + maxWidth: "100%", }} > { }; //SHOULD BE REWRITE - const filtersProp = role.includes("EXTRA_FEATURE") - ? extraFeaturesFilterProps - : defaultFilterProps; + const filtersProp = + role.includes(ROLES.EXTRA_FEATURE) || role.includes(ROLES.EVALUATION) + ? extraFeaturesFilterProps + : defaultFilterProps; const filters = useRef( filtersProp.filtersIDs.map((value) => { diff --git a/src/components/NavItems/tools/Loccus/loccusResults.jsx b/src/components/NavItems/tools/Loccus/loccusResults.jsx index ae8a2171c..1990ddc3c 100644 --- a/src/components/NavItems/tools/Loccus/loccusResults.jsx +++ b/src/components/NavItems/tools/Loccus/loccusResults.jsx @@ -40,6 +40,7 @@ import dayjs from "dayjs"; import duration from "dayjs/plugin/duration"; import { exportReactElementAsJpg } from "../../../Shared/Utils/htmlUtils"; import GaugeChartModalExplanation from "../../../Shared/GaugeChartResults/GaugeChartModalExplanation"; +import { ROLES } from "../../../../constants/roles"; const LoccusResults = (props) => { dayjs.extend(duration); @@ -436,7 +437,7 @@ const LoccusResults = (props) => { - {role.includes("EXTRA_FEATURE") && ( + {role.includes(ROLES.EXTRA_FEATURE) && ( <> diff --git a/src/components/NavItems/tools/SyntheticImageDetection/SyntheticImageDetectionAlgorithms.jsx b/src/components/NavItems/tools/SyntheticImageDetection/SyntheticImageDetectionAlgorithms.jsx index 7bd1ec673..d44951228 100644 --- a/src/components/NavItems/tools/SyntheticImageDetection/SyntheticImageDetectionAlgorithms.jsx +++ b/src/components/NavItems/tools/SyntheticImageDetection/SyntheticImageDetectionAlgorithms.jsx @@ -21,13 +21,13 @@ export class SyntheticImageDetectionAlgorithm { * @param apiServiceName {string} The service parameter for the API call * @param name {string} The algorithm name key * @param description {string} The algorithm description key - * @param roleNeeded {?Roles} Role needed to get the detection results for the algorithm + * @param rolesNeeded {?[Roles]} Role needed to get the detection results for the algorithm. If more than one role specified, either roles are authorized. */ - constructor(apiServiceName, name, description, roleNeeded) { + constructor(apiServiceName, name, description, rolesNeeded) { this.apiServiceName = apiServiceName; this.name = name; this.description = description; - this.roleNeeded = roleNeeded; + this.rolesNeeded = rolesNeeded; } } @@ -35,67 +35,67 @@ export const ganR50Mever = new SyntheticImageDetectionAlgorithm( "gan_r50_mever", "synthetic_image_detection_gan_name", "synthetic_image_detection_gan_description", - ROLES.BETA_TESTER, + [ROLES.BETA_TESTER], ); export const proGanR50Grip = new SyntheticImageDetectionAlgorithm( "progan_r50_grip", "synthetic_image_detection_progan_name", "synthetic_image_detection_progan_description", - ROLES.BETA_TESTER, + [ROLES.BETA_TESTER], ); export const ldmR50Grip = new SyntheticImageDetectionAlgorithm( "ldm_r50_grip", "synthetic_image_detection_diffusion_name", "synthetic_image_detection_diffusion_description", - ROLES.BETA_TESTER, + [ROLES.BETA_TESTER], ); export const proGanWebpR50Grip = new SyntheticImageDetectionAlgorithm( "progan-webp_r50_grip", "synthetic_image_detection_progan-webp_r50_grip_name", "synthetic_image_detection_progan-webp_r50_grip_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const ldmWebpR50Grip = new SyntheticImageDetectionAlgorithm( "ldm-webp_r50_grip", "synthetic_image_detection_ldm-webp_r50_grip_name", "synthetic_image_detection_ldm-webp_r50_grip_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const gigaGanWebpR50Grip = new SyntheticImageDetectionAlgorithm( "gigagan-webp_r50_grip", "synthetic_image_detection_gigagan-webp_r50_grip_name", "synthetic_image_detection_gigagan-webp_r50_grip_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const admR50Grip = new SyntheticImageDetectionAlgorithm( "adm_r50_grip", "synthetic_image_detection_adm_name", "synthetic_image_detection_adm_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const proGanRineMever = new SyntheticImageDetectionAlgorithm( "progan_rine_mever", "synthetic_image_detection_progan_rine_mever_name", "synthetic_image_detection_progan_rine_mever_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const ldmRineMever = new SyntheticImageDetectionAlgorithm( "ldm_rine_mever", "synthetic_image_detection_ldm_rine_mever_name", "synthetic_image_detection_ldm_rine_mever_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); export const ldmR50Mever = new SyntheticImageDetectionAlgorithm( "ldm_r50_mever", "synthetic_image_detection_ldm_r50_mever_name", "synthetic_image_detection_ldm_r50_mever_description", - ROLES.EXTRA_FEATURE, + [ROLES.EVALUATION, ROLES.EXTRA_FEATURE], ); /** @@ -116,6 +116,16 @@ export const syntheticImageDetectionAlgorithms = [ ldmRineMever, ]; +/** + * + * @param roles {?Array} + * @param algorithm {SyntheticImageDetectionAlgorithm} + * @returns {*} + */ +export const canUserDisplayAlgorithmResults = (roles, algorithm) => { + return roles.some((role) => algorithm.rolesNeeded.includes(role)); +}; + /** * Returns a list of algorithms that can be used by a user according to their roles * @param roles {?Array} @@ -123,7 +133,7 @@ export const syntheticImageDetectionAlgorithms = [ */ export const getSyntheticImageDetectionAlgorithmsForRoles = (roles) => { return syntheticImageDetectionAlgorithms.filter((algorithm) => - roles.includes(algorithm.roleNeeded), + roles.some((role) => algorithm.rolesNeeded.includes(role)), ); }; diff --git a/src/components/NavItems/tools/SyntheticImageDetection/index.jsx b/src/components/NavItems/tools/SyntheticImageDetection/index.jsx index b0fddb8bc..54423fee0 100644 --- a/src/components/NavItems/tools/SyntheticImageDetection/index.jsx +++ b/src/components/NavItems/tools/SyntheticImageDetection/index.jsx @@ -13,9 +13,9 @@ import { Box, Card, CardHeader, - Grid2, FormControlLabel, FormGroup, + Grid2, LinearProgress, Stack, Switch, @@ -413,21 +413,22 @@ const SyntheticImageDetection = () => { /> - {role.includes(ROLES.EXTRA_FEATURE) && ( - - - } - label="Auto-Resize" - /> - - )} + {role.includes(ROLES.EXTRA_FEATURE) || + (role.includes(ROLES.EVALUATION) && ( + + + } + label="Auto-Resize" + /> + + ))} {isLoading && ( diff --git a/src/components/NavItems/tools/SyntheticImageDetection/syntheticImageDetectionResults.jsx b/src/components/NavItems/tools/SyntheticImageDetection/syntheticImageDetectionResults.jsx index 75b077dbf..e6330a058 100644 --- a/src/components/NavItems/tools/SyntheticImageDetection/syntheticImageDetectionResults.jsx +++ b/src/components/NavItems/tools/SyntheticImageDetection/syntheticImageDetectionResults.jsx @@ -24,6 +24,7 @@ import Tooltip from "@mui/material/Tooltip"; import { exportReactElementAsJpg } from "../../../Shared/Utils/htmlUtils"; import NddDatagrid from "./NddDatagrid"; import { + canUserDisplayAlgorithmResults, DETECTION_THRESHOLDS, getSyntheticImageDetectionAlgorithmFromApiName, gigaGanWebpR50Grip, @@ -129,7 +130,7 @@ const SyntheticImageDetectionResults = ({ syntheticImageDetectionAlgorithm.apiServiceName, syntheticImageDetectionAlgorithm.name, syntheticImageDetectionAlgorithm.description, - syntheticImageDetectionAlgorithm.roleNeeded, + syntheticImageDetectionAlgorithm.rolesNeeded, ); this.predictionScore = predictionScore; this.isError = isError; @@ -153,12 +154,7 @@ const SyntheticImageDetectionResults = ({ let res = []; for (const algorithm of syntheticImageDetectionAlgorithms) { - if ( - !role.includes(algorithm.roleNeeded) && - algorithm.roleNeeded.length > 0 - ) { - continue; - } + if (!canUserDisplayAlgorithmResults(role, algorithm)) continue; const algorithmReport = results[algorithm.apiServiceName + "_report"]; @@ -302,9 +298,7 @@ const SyntheticImageDetectionResults = ({ ); // Display iff the user has the permissions to see the content - if (d.roleNeeded && !role.includes(d.roleNeeded)) { - continue; - } + if (!canUserDisplayAlgorithmResults(role, d)) continue; if ( imageType && diff --git a/src/components/Shared/Utils/fileUtils.jsx b/src/components/Shared/Utils/fileUtils.jsx index c2cf3b365..86acca401 100644 --- a/src/components/Shared/Utils/fileUtils.jsx +++ b/src/components/Shared/Utils/fileUtils.jsx @@ -3,6 +3,7 @@ import { MAX_IMAGE_FILE_SIZE, MAX_VIDEO_FILE_SIZE, } from "../../../config"; +import { ROLES } from "../../../constants/roles"; export const FILE_TYPES = { image: "image", @@ -22,7 +23,7 @@ export const isImageFileTooLarge = (imageFile, userRole) => { } return ( - (!userRole || !userRole.includes("EXTRA_FEATURE")) && + (!userRole || !userRole.includes(ROLES.EXTRA_FEATURE)) && imageFile.size >= MAX_IMAGE_FILE_SIZE ); }; @@ -39,7 +40,7 @@ export const isVideoFileTooLarge = (videoFile, userRole) => { } return ( - (!userRole || !userRole.includes("EXTRA_FEATURE")) && + (!userRole || !userRole.includes(ROLES.EXTRA_FEATURE)) && videoFile.size >= MAX_VIDEO_FILE_SIZE ); }; @@ -56,7 +57,7 @@ export const isAudioFileTooLarge = (audioFile, userRole) => { } return ( - (!userRole || !userRole.includes("EXTRA_FEATURE")) && + (!userRole || !userRole.includes(ROLES.EXTRA_FEATURE)) && audioFile.size >= MAX_AUDIO_FILE_SIZE ); }; diff --git a/src/constants/roles.jsx b/src/constants/roles.jsx index c3dc42f18..c6a4cdef1 100644 --- a/src/constants/roles.jsx +++ b/src/constants/roles.jsx @@ -7,5 +7,6 @@ export const ROLES = { ARCHIVE: "ARCHIVE", BETA_TESTER: "BETA_TESTER", LOCK: "lock", + EVALUATION: "EVALUATION", EXTRA_FEATURE: "EXTRA_FEATURE", };