Added internationalization to dataset detail pages

openml · Jan 30, 2024 · be8eb7c · be8eb7c
1 parent 2b5c7bf
commit be8eb7c
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 14 deletions.
diff --git a/app/public/locales/en/common.yml b/app/public/locales/en/common.yml
@@ -761,8 +761,12 @@ tips:
     Flow issues: "The number of issues reported for this flow."
     Flow downloads: "The number of times the flow was downloaded."
     Flow runs: "The number of times this flow was evaluated."
-
-
-
-
-
+tableheader:
+    feature: "Feature name"
+    distribution: "Distribution"
+    missing: "Missing"
+    type: "Type"
+    distinct: "Distinct"
+tabletitle:
+    features: "Features"
+    qualities: "Qualities (meta-features)"
diff --git a/app/src/components/data/FeatureTable.js b/app/src/components/data/FeatureTable.js
@@ -3,6 +3,7 @@ import Box from "@mui/material/Box";
 import { DataGrid as MuiDataGrid } from "@mui/x-data-grid";
 import { Card, CardContent, Typography } from "@mui/material";
 import styled from "@emotion/styled";
+import { useTranslation } from "next-i18next";
 
 import StackedBarChart from "../charts/StackedBarChart";
 import HorizontalBoxPlot from "../charts/HorizontalBoxPlot";
@@ -23,6 +24,7 @@ const DataGrid = styled(MuiDataGrid)`
 `;
 
 const FeatureTable = ({ data }) => {
+  const { t } = useTranslation();
   // Check for targets
   let targets = [];
   // Define the rows for the grid
@@ -44,7 +46,7 @@ const FeatureTable = ({ data }) => {
     //{ field: "id", headerName: "Index", type: "number", width: 90 },
     {
       field: "name",
-      headerName: "Feature Name",
+      headerName: t("tableheader.feature"),
       width: 200,
       editable: true,
       valueGetter: (params) =>
@@ -56,7 +58,7 @@ const FeatureTable = ({ data }) => {
     },
     {
       field: "distr",
-      headerName: "Distribution",
+      headerName: t("tableheader.distribution"),
       width: 280,
       renderCell: (params) => {
         const chartId = `chart-${params.row.id}`; // Assuming each row has a unique 'id'
@@ -84,21 +86,21 @@ const FeatureTable = ({ data }) => {
     },
     {
       field: "type",
-      headerName: "Type",
+      headerName: t("tableheader.type"),
       width: 90,
       editable: true,
       align: "right",
     },
     {
       field: "distinct",
-      headerName: "Distinct values",
+      headerName: t("tableheader.distinct"),
       type: "number",
       width: 110,
       editable: true,
     },
     {
       field: "missing",
-      headerName: "Missing values",
+      headerName: t("tableheader.missing"),
       type: "number",
       width: 110,
       editable: true,
@@ -109,7 +111,7 @@ const FeatureTable = ({ data }) => {
     <Card>
       <CardContent>
         <Typography variant="h4" mb={6}>
-          {data.length + " Features"}
+          {data.length + t("tabletitle.features")}
         </Typography>
         <Box sx={{ width: "100%" }}>
           <DataGrid

diff --git a/app/src/pages/f/index.js b/app/src/pages/f/index.js
@@ -4,7 +4,6 @@ import { Typography } from "@mui/material";
 import DashboardLayout from "../../layouts/Dashboard";
 
 // Server-side translation
-import { useTranslation } from "next-i18next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 export async function getStaticProps({ locale }) {
   return {

diff --git a/app/src/pages/r/index.js b/app/src/pages/r/index.js
@@ -4,7 +4,6 @@ import { Typography } from "@mui/material";
 import DashboardLayout from "../../layouts/Dashboard";
 
 // Server-side translation
-import { useTranslation } from "next-i18next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 export async function getStaticProps({ locale }) {
   return {

diff --git a/app/src/pages/t/index.js b/app/src/pages/t/index.js
@@ -4,7 +4,6 @@ import { Typography } from "@mui/material";
 import DashboardLayout from "../../layouts/Dashboard";
 
 // Server-side translation
-import { useTranslation } from "next-i18next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 export async function getStaticProps({ locale }) {
   return {