From 8ea1e23d82ab5c3c00e4e01768d4dd87f9de6d4c Mon Sep 17 00:00:00 2001 From: Davide Valleri <146823822+dvalleri@users.noreply.github.com> Date: Mon, 18 Nov 2024 17:24:06 +0100 Subject: [PATCH] feat(ui): improve accessibility (#198) * feat(ui): improve accessibility * feat(ui): add title property to filter button * feat(ui): add C Button * remove tailwind margin on title column * add new version of rds, add align right in variables column and output column * add faC icon * feat(ui): restore my-4 margin inlist --- ui/package.json | 2 +- .../charts/predicted-actual-chart/options.js | 3 + .../current/data-drift/list/index.jsx | 2 +- .../data-drift/search-filter/index.jsx | 2 + .../data-point-distribution/index.jsx | 8 +- .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 8 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 2 + .../current/imports/columns.jsx | 2 +- .../overview/outputs-tab/columns.jsx | 7 +- .../overview/variables-tab/columns.jsx | 52 +- .../data-point-distribution/index.jsx | 6 +- .../data-point-distribution/options.js | 1 - .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 11 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 5 +- .../reference/imports/columns.jsx | 2 +- ui/src/container/models/Details/header.jsx | 13 +- .../current/data-drift/list/index.jsx | 2 +- .../data-drift/search-filter/index.jsx | 2 + .../data-point-distribution/index.jsx | 4 +- .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 8 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 3 +- .../current/imports/columns.jsx | 2 +- .../overview/outputs-tab/columns.jsx | 7 +- .../overview/variables-tab/columns.jsx | 12 +- .../data-point-distribution/index.jsx | 6 +- .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 9 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 3 +- .../reference/imports/columns.jsx | 2 +- .../current/data-drift/list/index.jsx | 3 +- .../data-drift/search-filter/index.jsx | 2 + .../data-point-distribution/index.jsx | 8 +- .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 7 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 3 +- .../regression/current/imports/columns.jsx | 2 +- .../overview/outputs-tab/columns.jsx | 7 +- .../overview/variables-tab/columns.jsx | 12 +- .../data-point-distribution/index.jsx | 6 +- .../categorical/left-table/columns.jsx | 4 +- .../data-quality/data-quality-list/index.jsx | 9 +- .../numerical/table/columns.jsx | 4 +- .../data-quality/search-filter/index.jsx | 4 +- .../regression/reference/imports/columns.jsx | 2 +- .../Details/secondary-column/header.jsx | 21 +- ui/yarn.lock | 1207 ++++++++--------- 54 files changed, 760 insertions(+), 767 deletions(-) diff --git a/ui/package.json b/ui/package.json index b6ad5a3c..57c161fa 100644 --- a/ui/package.json +++ b/ui/package.json @@ -17,7 +17,7 @@ "@fortawesome/free-solid-svg-icons": "^6.5.2", "@grafana/faro-react": "^1.8.2", "@radicalbit/formbit": "1.0.0", - "@radicalbit/radicalbit-design-system": "^1.5.0", + "@radicalbit/radicalbit-design-system": "^1.6.0", "@reduxjs/toolkit": "^2.2.4", "@vitejs/plugin-react": "^4.2.1", "ace-builds": "^1.33.2", diff --git a/ui/src/components/charts/predicted-actual-chart/options.js b/ui/src/components/charts/predicted-actual-chart/options.js index 016e41b7..6858b9dd 100644 --- a/ui/src/components/charts/predicted-actual-chart/options.js +++ b/ui/src/components/charts/predicted-actual-chart/options.js @@ -43,6 +43,9 @@ export default function chartOptions(dataset, xAxisLabel, yAxisLabel, color) { ], legend: { show: true, + textStyle: { + color: CHART_COLOR.REFERENCE_LIGHT, + }, right: 0, }, }; diff --git a/ui/src/container/models/Details/binary-classification/current/data-drift/list/index.jsx b/ui/src/container/models/Details/binary-classification/current/data-drift/list/index.jsx index cfe531c9..a05ac4aa 100644 --- a/ui/src/container/models/Details/binary-classification/current/data-drift/list/index.jsx +++ b/ui/src/container/models/Details/binary-classification/current/data-drift/list/index.jsx @@ -4,7 +4,6 @@ import { DRIFT_FEATURE_TYPE_ENUM, DRIFT_TEST_ENUM_LABEL, numberFormatter, } from '@Src/constants'; -import { fa1, faC } from '@fortawesome/free-solid-svg-icons'; import { Board, Button, @@ -16,6 +15,7 @@ import { Tag, } from '@radicalbit/radicalbit-design-system'; import { Virtuoso } from 'react-virtuoso'; +import { fa1, faC } from '@fortawesome/free-solid-svg-icons'; import useGetFilteredFeatures from '../use-get-filtered-features'; function DataDriftList() { diff --git a/ui/src/container/models/Details/binary-classification/current/data-drift/search-filter/index.jsx b/ui/src/container/models/Details/binary-classification/current/data-drift/search-filter/index.jsx index d2b3c7ff..d3d08066 100644 --- a/ui/src/container/models/Details/binary-classification/current/data-drift/search-filter/index.jsx +++ b/ui/src/container/models/Details/binary-classification/current/data-drift/search-filter/index.jsx @@ -69,6 +69,7 @@ function NumericalFilter() {