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 {