diff --git a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table-file.js b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table-file.js index 7c4219d1..f318bca4 100644 --- a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table-file.js +++ b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table-file.js @@ -1,3 +1,4 @@ +import {capitalize} from '@mui/material'; import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter'; import {Box} from "@mui/system"; @@ -12,10 +13,12 @@ import TableHead from '@mui/material/TableHead'; import CheckIcon from "@mui/icons-material/Check"; import CloseIcon from "@mui/icons-material/Close"; import Typography from '@mui/material/Typography'; +import validationColor from '../mapping-package/state/validation-color'; +import {ValueChip} from '../xpath-validation-report/utils'; -import {resultColor} from "./utils"; +import {ResultChip, resultColor} from "./utils"; import {Scrollbar} from 'src/components/scrollbar'; -import TablePagination from "src/sections/components/table-pagination"; +import TablePagination from "src/sections/components/table-pagination-pages"; import TableSorterHeader from "src/sections/components/table-sorter-header"; import PropTypes from "prop-types"; @@ -43,7 +46,7 @@ export const ListTableFile = (props) => { sectionApi } = props; - const syntaxHightligterTheme = useHighlighterTheme() + const syntaxHighlighterTheme = useHighlighterTheme() const SorterHeader = (props) => { const direction = props.fieldName === sort.column && sort.direction === 'desc' ? 'asc' : 'desc'; @@ -126,7 +129,11 @@ export const ListTableFile = (props) => { { { - + + {capitalize(item.result)} + diff --git a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table.js b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table.js index 48c0c0a6..7f8bd530 100644 --- a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table.js +++ b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/list-table.js @@ -30,7 +30,6 @@ import TablePagination from "src/sections/components/table-pagination-pages"; import {TableFilterHeader} from "src/layouts/app/table-filter-header/table-filter-header"; const ResultCell = ({item, onClick}) => { - console.log(item) const title = item.title return { wrapLines style={syntaxHighlighterTheme} customStyle={{borderRadius: 12, border: '1px solid #E4E7EC'}} - lineProps={{ style: { overflowWrap: 'break-word', diff --git a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/sparql_validation_report_file.js b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/sparql_validation_report_file.js index cce2cf78..f6654f80 100644 --- a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/sparql_validation_report_file.js +++ b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/sparql_validation_report_file.js @@ -1,7 +1,9 @@ import {useEffect, useState} from "react"; +import Stack from '@mui/material/Stack'; import Paper from '@mui/material/Paper'; import Grid from '@mui/material/Unstable_Grid2'; +import Typography from '@mui/material/Typography'; import {ListTableFile} from "./list-table-file"; import {ResultFilter, TableLoadWrapper} from "./utils"; @@ -64,8 +66,15 @@ const SparqlFileReport = ({sid, suiteId, testId, handleExport}) => { - + + Assertions + + { const [dataState, setDataState] = useState({load: false, error: false}) const itemsSearch = useItemsSearch(validationReport, sectionApi); + const handleResultFilterChange = e => itemsSearch.handleFiltersChange({result: e.target.value}) return ( <> diff --git a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/utils.js b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/utils.js index f11c2fe0..15f445e0 100644 --- a/mapping_workbench/frontend/src/sections/app/sparql-validation-report/utils.js +++ b/mapping_workbench/frontend/src/sections/app/sparql-validation-report/utils.js @@ -1,15 +1,17 @@ import {Box} from "@mui/system"; -import Chip from "@mui/material/Chip"; import Stack from "@mui/material/Stack"; -import Paper from "@mui/material/Paper"; import Radio from "@mui/material/Radio"; import Alert from "@mui/material/Alert"; import Tooltip from "@mui/material/Tooltip"; import Skeleton from "@mui/material/Skeleton"; import Typography from "@mui/material/Typography"; import RadioGroup from "@mui/material/RadioGroup"; +import FormControl from '@mui/material/FormControl'; import TableSortLabel from "@mui/material/TableSortLabel"; import FormControlLabel from "@mui/material/FormControlLabel"; +import validationColor from '../mapping-package/state/validation-color'; + +export const capitalize = (value) => `${value[0].toUpperCase()}${value.slice(1)}` export const resultColor = (result) => { switch (result.toLowerCase()) { @@ -26,10 +28,10 @@ export const resultColor = (result) => { } } -export const ResultChip = ({label, color, fontColor, onClick}) => { - const hover = onClick ? {'&:hover': {filter: 'brightness(85%)'}, cursor: 'pointer'} : {} +export const ResultChip = ({label, color, fontColor, onClick, clickable, children}) => { + const hover = onClick ?? clickable ? {'&:hover': {filter: 'brightness(85%)'}, cursor: 'pointer'} : {} return ( - {label ?? children} @@ -47,12 +49,15 @@ export const ResultFilter = ({currentState, onStateChange}) => { checked={currentState === (value ?? label.toLowerCase())} label={( - - - + + + + )} value={value ?? label.toLowerCase()} @@ -60,37 +65,22 @@ export const ResultFilter = ({currentState, onStateChange}) => { } return ( - + - - - Filter Results: - - - {reportValues.map(value => - )} - - - + + {reportValues.map(value => + )} - + ) } diff --git a/mapping_workbench/frontend/src/sections/app/xpath-validation-report/utils.js b/mapping_workbench/frontend/src/sections/app/xpath-validation-report/utils.js index bec92c11..dd05427c 100644 --- a/mapping_workbench/frontend/src/sections/app/xpath-validation-report/utils.js +++ b/mapping_workbench/frontend/src/sections/app/xpath-validation-report/utils.js @@ -1,4 +1,3 @@ -import Box from "@mui/material/Box"; import Radio from "@mui/material/Radio"; import Stack from "@mui/material/Stack"; import Alert from "@mui/material/Alert";