Translate table headers

app/pages/home/Table.js

@@ -1,10 +1,11 @@
 import { Component } from 'react'
 import { DataGrid } from '@mui/x-data-grid'
 import { Link, Typography, Box } from '@mui/material'
+import { withTranslation } from 'react-i18next'
 import Moment from 'react-moment'
 
-export default class Table extends Component {
-  constructor ({ scanResults }) {
+class Table extends Component {
+  constructor ({ scanResults, t }) {
     super()
     this.scanResults = scanResults.map(row => ({
       ...row,
@@ -13,7 +14,7 @@ export default class Table extends Component {
     this.columns = [
       {
         field: 'name',
-        headerName: 'Name',
+        headerName: t('name'),
         flex: 2,
         renderCell: (cellValues) => {
           return (
@@ -43,17 +44,17 @@ export default class Table extends Component {
       },
       {
         field: 'partsPrice',
-        headerName: 'Parts Price',
+        headerName: t('parts_price'),
         flex: 1
       },
       {
         field: 'setPrice',
-        headerName: 'Set Price',
+        headerName: t('set_price'),
         flex: 1
       },
       {
         field: 'difference',
-        headerName: 'Difference',
+        headerName: t('difference'),
         flex: 1
       }
     ]
@@ -91,3 +92,5 @@ export default class Table extends Component {
     )
   }
 }
+
+export default withTranslation('home')(Table)

app/public/locales/en/home.json

@@ -1,3 +1,7 @@
 {
-  "description": "Find a profitable difference between the price of the set and the price of the sum of it's parts."
+  "description": "Find a profitable difference between the price of the set and the price of the sum of it's parts.",
+  "name": "Name",
+  "parts_price": "Parts Price",
+  "set_price": "Set Price",
+  "difference": "Difference"
 }

app/public/locales/ru/home.json

@@ -1,3 +1,7 @@
 {
-  "description": "Находи выгодную разницу между ценой набора и ценой его частей по отдельности."
+  "description": "Находи выгодную разницу между ценой набора и ценой его частей по отдельности.",
+  "name": "Наименование",
+  "parts_price": "Цена частей",
+  "set_price": "Цена набора",
+  "difference": "Разница"
 }