station edit in the route edit page

src/pages/country/list.tsx

@@ -1,56 +1,82 @@
-import {type GridColDef} from '@mui/x-data-grid'
-import {CustomDataGrid} from '../../components/CustomDataGrid'
-import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui'
-import React from 'react'
+import { type GridColDef } from "@mui/x-data-grid";
+import { CustomDataGrid } from "../../components/CustomDataGrid";
+import {
+  DeleteButton,
+  EditButton,
+  List,
+  ShowButton,
+  useDataGrid,
+} from "@refinedev/mui";
+import React from "react";
+import { languageStore } from "../../store/LanguageStore";
+import { observer } from "mobx-react-lite";
 
-export const CountryList = () => {
-  const {dataGridProps} = useDataGrid({})
+export const CountryList = observer(() => {
+  const { language } = languageStore;
+
+  const { dataGridProps } = useDataGrid({
+    resource: "country",
+    meta: {
+      headers: {
+        "Accept-Language": language,
+      },
+    },
+  });
 
   const columns = React.useMemo<GridColDef[]>(
     () => [
       {
-        field: 'code',
-        headerName: 'Код',
-        type: 'string',
+        field: "code",
+        headerName: "Код",
+        type: "string",
         minWidth: 150,
-        align: 'left',
-        headerAlign: 'left',
+        align: "left",
+        headerAlign: "left",
       },
       {
-        field: 'name',
-        headerName: 'Название',
-        type: 'string',
+        field: "name",
+        headerName: "Название",
+        type: "string",
         minWidth: 150,
         flex: 1,
       },
       {
-        field: 'actions',
-        headerName: 'Действия',
-        cellClassName: 'country-actions',
+        field: "actions",
+        headerName: "Действия",
+        cellClassName: "country-actions",
         minWidth: 120,
-        display: 'flex',
-        align: 'right',
-        headerAlign: 'center',
+        display: "flex",
+        align: "right",
+        headerAlign: "center",
         sortable: false,
         filterable: false,
         disableColumnMenu: true,
-        renderCell: function render({row}) {
+        renderCell: function render({ row }) {
           return (
             <>
               <EditButton hideText recordItemId={row.code} />
               <ShowButton hideText recordItemId={row.code} />
-              <DeleteButton hideText confirmTitle="Вы уверены?" recordItemId={row.code} />
+              <DeleteButton
+                hideText
+                confirmTitle="Вы уверены?"
+                recordItemId={row.code}
+              />
             </>
-          )
+          );
         },
       },
     ],
-    [],
-  )
+    []
+  );
 
   return (
     <List>
-      <CustomDataGrid {...dataGridProps} columns={columns} getRowId={(row: any) => row.code} />
+      <CustomDataGrid
+        {...dataGridProps}
+        languageEnabled
+        columns={columns}
+        getRowId={(row: any) => row.code}
+      />
     </List>
-  )
-}
+  );
+});