Migrate mui-x components to v6 (#408)

* Migrate mui-x components to v6 * Collect phrases
2025-01-31 02:21:35 +00:00 · 2023-04-03 18:38:52 +00:00 · 2023-04-03 18:38:52 +00:00 · ab617ce608
commit ab617ce608
parent 1b913e6b5f
19 changed files with 1013 additions and 732 deletions
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
--- a/frontend/package.json
+++ b/frontend/package.json
@ -48,16 +48,15 @@
  },
  "dependencies": {
    "@babel/plugin-proposal-class-properties": "^7.16.7",
-    "@date-io/date-fns": "^2.15.0",
    "@emotion/react": "^11.7.1",
    "@emotion/styled": "^11.6.0",
    "@mui/base": "^5.0.0-alpha.77",
-    "@mui/icons-material": "^5.2.5",
-    "@mui/lab": "^5.0.0-alpha.73",
-    "@mui/material": "^5.9.0",
-    "@mui/system": "^5.9.0",
-    "@mui/x-data-grid": "^5.2.2",
-    "@mui/x-date-pickers": "^5.0.1",
+    "@mui/icons-material": "^5.11.11",
+    "@mui/lab": "^5.0.0-alpha.124",
+    "@mui/material": "^5.11.15",
+    "@mui/system": "^5.11.15",
+    "@mui/x-data-grid": "^6.0.4",
+    "@mui/x-date-pickers": "^6.0.4",
    "@nivo/core": "^0.80.0",
    "@nivo/line": "^0.80.0",
    "country-flag-icons": "^1.4.25",
--- a/frontend/src/components/BookTable/index.tsx
+++ b/frontend/src/components/BookTable/index.tsx
@ -15,7 +15,12 @@ import {
  IconButton,
  Tooltip,
 } from '@mui/material';
-import { DataGrid, GridPagination } from '@mui/x-data-grid';
+import {
+  DataGrid,
+  GridColumnVisibilityModel,
+  GridPagination,
+  GridPaginationModel,
+} from '@mui/x-data-grid';
 import currencyDict from '../../../static/assets/currencies.json';
 import { PublicOrder } from '../../models';
 import { filterOrders, hexToRgb, statusBadgeColor, pn, amountToString } from '../../utils';
@ -63,7 +68,11 @@ const BookTable = ({
  const { t } = useTranslation();
  const theme = useTheme();
  const orders = orderList ?? book.orders;
-  const [pageSize, setPageSize] = useState(0);
+  const [paginationModel, setPaginationModel] = useState<GridPaginationModel>({
+    pageSize: 0,
+    page: 0,
+  });
+  const [columnVisibilityModel, setColumnVisibilityModel] = useState<GridColumnVisibilityModel>({});
  const [fullscreen, setFullscreen] = useState(defaultFullscreen);
  const [paymentMethods, setPaymentMethods] = useState<string[]>([]);

@ -82,12 +91,12 @@ const BookTable = ({
    return [fontSize, defaultPageSize, height];
  }, [theme.typography.fontSize, maxHeight, fullscreen, fullHeight, showControls, showFooter]);

-  const [useDefaultPageSize, setUseDefaultPageSize] = useState(true);
  useEffect(() => {
-    if (useDefaultPageSize) {
-      setPageSize(defaultPageSize);
-    }
-  });
+    setPaginationModel({
+      pageSize: book.loading && orders.length == 0 ? 0 : defaultPageSize,
+      page: paginationModel.page,
+    });
+  }, [book.loading, orders, defaultPageSize]);

  const premiumColor = function (baseColor: string, accentColor: string, point: number) {
    const baseRGB = hexToRgb(baseColor);
@ -141,6 +150,7 @@ const BookTable = ({
    filterValueFalse: t('false'),
    columnMenuLabel: t('Menu'),
    columnMenuShowColumns: t('Show columns'),
+    columnMenuManageColumns: t('Manage columns'),
    columnMenuFilter: t('Filter'),
    columnMenuHideColumn: t('Hide'),
    columnMenuUnsort: t('Unsort'),
@ -152,9 +162,8 @@ const BookTable = ({
    booleanCellFalseLabel: t('no'),
  };

-  const robotObj = function (width: number, hide: boolean) {
+  const robotObj = function (width: number) {
    return {
-      hide,
      field: 'maker_nick',
      headerName: t('Robot'),
      width: width * fontSize,
@ -180,9 +189,8 @@ const BookTable = ({
    };
  };

-  const robotSmallObj = function (width: number, hide: boolean) {
+  const robotSmallObj = function (width: number) {
    return {
-      hide,
      field: 'maker_nick',
      headerName: t('Robot'),
      width: width * fontSize,
@ -207,9 +215,8 @@ const BookTable = ({
    };
  };

-  const typeObj = function (width: number, hide: boolean) {
+  const typeObj = function (width: number) {
    return {
-      hide,
      field: 'type',
      headerName: t('Is'),
      width: width * fontSize,
@ -220,9 +227,8 @@ const BookTable = ({
    };
  };

-  const amountObj = function (width: number, hide: boolean) {
+  const amountObj = function (width: number) {
    return {
-      hide,
      field: 'amount',
      headerName: t('Amount'),
      type: 'number',
@ -269,9 +275,8 @@ const BookTable = ({
    };
  };

-  const paymentObj = function (width: number, hide: boolean) {
+  const paymentObj = function (width: number) {
    return {
-      hide,
      field: 'payment_method',
      headerName: fav.mode === 'fiat' ? t('Payment Method') : t('Destination'),
      width: width * fontSize,
@ -290,10 +295,9 @@ const BookTable = ({
    };
  };

-  const paymentSmallObj = function (width: number, hide: boolean) {
+  const paymentSmallObj = function (width: number) {
    return {
-      hide,
-      field: 'payment_icons',
+      field: 'payment_method',
      headerName: t('Pay'),
      width: width * fontSize,
      renderCell: (params: any) => {
@ -316,9 +320,8 @@ const BookTable = ({
    };
  };

-  const priceObj = function (width: number, hide: boolean) {
+  const priceObj = function (width: number) {
    return {
-      hide,
      field: 'price',
      headerName: t('Price'),
      type: 'number',
@ -332,14 +335,13 @@ const BookTable = ({
    };
  };

-  const premiumObj = function (width: number, hide: boolean) {
+  const premiumObj = function (width: number) {
    // coloring premium texts based on 4 params:
    // Hardcoded: a sell order at 0% is an outstanding premium
    // Hardcoded: a buy order at 10% is an outstanding premium
    const sellStandardPremium = 10;
    const buyOutstandingPremium = 10;
    return {
-      hide,
      field: 'premium',
      headerName: t('Premium'),
      type: 'number',
@ -382,9 +384,8 @@ const BookTable = ({
    };
  };

-  const timerObj = function (width: number, hide: boolean) {
+  const timerObj = function (width: number) {
    return {
-      hide,
      field: 'escrow_duration',
      headerName: t('Timer'),
      type: 'number',
@ -397,9 +398,8 @@ const BookTable = ({
    };
  };

-  const expiryObj = function (width: number, hide: boolean) {
+  const expiryObj = function (width: number) {
    return {
-      hide,
      field: 'expires_at',
      headerName: t('Expiry'),
      type: 'string',
@ -441,9 +441,8 @@ const BookTable = ({
    };
  };

-  const satoshisObj = function (width: number, hide: boolean) {
+  const satoshisObj = function (width: number) {
    return {
-      hide,
      field: 'satoshis_now',
      headerName: t('Sats now'),
      type: 'number',
@ -460,9 +459,8 @@ const BookTable = ({
    };
  };

-  const idObj = function (width: number, hide: boolean) {
+  const idObj = function (width: number) {
    return {
-      hide,
      field: 'id',
      headerName: 'Order ID',
      width: width * fontSize,
@ -478,9 +476,8 @@ const BookTable = ({
    };
  };

-  const bondObj = function (width: number, hide: boolean) {
+  const bondObj = function (width: number) {
    return {
-      hide,
      field: 'bond_size',
      headerName: t('Bond'),
      type: 'number',
@ -516,7 +513,7 @@ const BookTable = ({
        object: premiumObj,
      },
    },
-    paymentMethod: {
+    payment_method: {
      priority: 4,
      order: 6,
      normal: {
@ -528,7 +525,7 @@ const BookTable = ({
        object: paymentSmallObj,
      },
    },
-    robot: {
+    maker_nick: {
      priority: 5,
      order: 1,
      normal: {
@ -564,7 +561,7 @@ const BookTable = ({
        object: timerObj,
      },
    },
-    satoshisNow: {
+    satoshis_now: {
      priority: 9,
      order: 9,
      normal: {
@ -580,7 +577,7 @@ const BookTable = ({
        object: typeObj,
      },
    },
-    bond: {
+    bond_size: {
      priority: 11,
      order: 10,
      normal: {
@ -601,6 +598,7 @@ const BookTable = ({
  const filteredColumns = function (maxWidth: number) {
    const useSmall = maxWidth < 70;
    const selectedColumns: object[] = [];
+    let columnVisibilityModel: GridColumnVisibilityModel = {};
    let width: number = 0;

    for (const [key, value] of Object.entries(columnSpecs)) {
@ -609,9 +607,11 @@ const BookTable = ({

      if (width + colWidth < maxWidth || selectedColumns.length < 2) {
        width = width + colWidth;
-        selectedColumns.push([colObject(colWidth, false), value.order]);
+        selectedColumns.push([colObject(colWidth), value.order]);
+        columnVisibilityModel[key] = true;
      } else {
-        selectedColumns.push([colObject(colWidth, true), value.order]);
+        selectedColumns.push([colObject(colWidth), value.order]);
+        columnVisibilityModel[key] = false;
      }
    }

@ -624,6 +624,7 @@ const BookTable = ({
      return item[0];
    });

+    setColumnVisibilityModel(columnVisibilityModel);
    return [columns, width * 0.875 + 0.15];
  };

@ -740,6 +741,10 @@ const BookTable = ({
          rows={filteredOrders}
          loading={book.loading}
          columns={columns}
+          columnVisibilityModel={columnVisibilityModel}
+          onColumnVisibilityModelChange={(newColumnVisibilityModel) =>
+            setColumnVisibilityModel(newColumnVisibilityModel)
+          }
          hideFooter={!showFooter}
          components={gridComponents}
          componentsProps={{
@ -751,11 +756,10 @@ const BookTable = ({
              setPaymentMethods,
            },
          }}
-          pageSize={book.loading && orders.length == 0 ? 0 : pageSize}
-          rowsPerPageOptions={width < 22 ? [] : [0, pageSize, defaultPageSize * 2, 50, 100]}
-          onPageSizeChange={(newPageSize) => {
-            setPageSize(newPageSize);
-            setUseDefaultPageSize(false);
+          paginationModel={paginationModel}
+          pageSizeOptions={width < 22 ? [] : [0, defaultPageSize, defaultPageSize * 2, 50, 100]}
+          onPaginationModelChange={(newPaginationModel) => {
+            setPaginationModel(newPaginationModel);
          }}
          onRowClick={(params: any) => onOrderClicked(params.row.id)}
        />
@ -774,6 +778,10 @@ const BookTable = ({
            columns={columns}
            hideFooter={!showFooter}
            components={gridComponents}
+            columnVisibilityModel={columnVisibilityModel}
+            onColumnVisibilityModelChange={(newColumnVisibilityModel) =>
+              setColumnVisibilityModel(newColumnVisibilityModel)
+            }
            componentsProps={{
              toolbar: {
                width,
@ -783,11 +791,10 @@ const BookTable = ({
                setPaymentMethods,
              },
            }}
-            pageSize={book.loading && orders.length == 0 ? 0 : pageSize}
-            rowsPerPageOptions={[0, pageSize, defaultPageSize * 2, 50, 100]}
-            onPageSizeChange={(newPageSize) => {
-              setPageSize(newPageSize);
-              setUseDefaultPageSize(false);
+            paginationModel={paginationModel}
+            pageSizeOptions={width < 22 ? [] : [0, defaultPageSize, defaultPageSize * 2, 50, 100]}
+            onPaginationModelChange={(newPaginationModel) => {
+              setPaginationModel(newPaginationModel);
            }}
            onRowClick={(params: any) => onOrderClicked(params.row.id)}
          />
--- a/frontend/src/components/MakerForm/MakerForm.tsx
+++ b/frontend/src/components/MakerForm/MakerForm.tsx
@ -27,8 +27,8 @@ import {

 import { LimitList, defaultMaker } from '../../models';

-import { LocalizationProvider, TimePicker } from '@mui/x-date-pickers';
-import DateFnsUtils from '@date-io/date-fns';
+import { LocalizationProvider, MobileTimePicker } from '@mui/x-date-pickers';
+import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { ConfirmationDialog } from '../Dialogs';
 import { apiClient } from '../../services/api';

@ -812,28 +812,29 @@ const MakerForm = ({
            <Collapse in={maker.advancedOptions}>
              <Grid container spacing={1}>
                <Grid item xs={12}>
-                  <LocalizationProvider dateAdapter={DateFnsUtils}>
-                    <TimePicker
+                  <LocalizationProvider dateAdapter={AdapterDateFns}>
+                    <MobileTimePicker
                      ampm={false}
+                      localeText={{ timePickerToolbarTitle: t('Public order length') }}
                      openTo='hours'
                      views={['hours', 'minutes']}
                      inputFormat='HH:mm'
                      mask='__:__'
-                      components={{
-                        OpenPickerIcon: HourglassTop,
-                      }}
-                      InputProps={{
-                        endAdornment: (
-                          <InputAdornment position='end'>
-                            <HourglassTop />
-                          </InputAdornment>
-                        ),
-                        style: {
-                          backgroundColor: theme.palette.background.paper,
-                          borderRadius: '4px',
+                      componentsProps={{
+                        textField: {
+                          InputProps: {
+                            style: {
+                              backgroundColor: theme.palette.background.paper,
+                              borderRadius: '4px',
+                            },
+                            endAdornment: (
+                              <InputAdornment position='end'>
+                                <HourglassTop />
+                              </InputAdornment>
+                            ),
+                          },
                        },
                      }}
-                      renderInput={(props) => <TextField {...props} />}
                      label={t('Public Duration (HH:mm)')}
                      value={maker.publicExpiryTime}
                      onChange={handleChangePublicDuration}
@ -844,28 +845,29 @@ const MakerForm = ({
                </Grid>

                <Grid item xs={12}>
-                  <LocalizationProvider dateAdapter={DateFnsUtils}>
-                    <TimePicker
+                  <LocalizationProvider dateAdapter={AdapterDateFns}>
+                    <MobileTimePicker
                      ampm={false}
+                      localeText={{ timePickerToolbarTitle: t('Escrow/invoice step length') }}
                      openTo='hours'
                      views={['hours', 'minutes']}
                      inputFormat='HH:mm'
                      mask='__:__'
-                      components={{
-                        OpenPickerIcon: HourglassTop,
-                      }}
-                      InputProps={{
-                        endAdornment: (
-                          <InputAdornment position='end'>
-                            <HourglassTop />
-                          </InputAdornment>
-                        ),
-                        style: {
-                          backgroundColor: theme.palette.background.paper,
-                          borderRadius: '4px',
+                      componentsProps={{
+                        textField: {
+                          InputProps: {
+                            style: {
+                              backgroundColor: theme.palette.background.paper,
+                              borderRadius: '4px',
+                            },
+                            endAdornment: (
+                              <InputAdornment position='end'>
+                                <HourglassTop />
+                              </InputAdornment>
+                            ),
+                          },
                        },
                      }}
-                      renderInput={(props) => <TextField {...props} />}
                      label={t('Escrow/Invoice Timer (HH:mm)')}
                      value={maker.escrowExpiryTime}
                      onChange={handleChangeEscrowDuration}
--- a/frontend/static/locales/ca.json
+++ b/frontend/static/locales/ca.json
@ -296,7 +296,9 @@
  "Exact": "Exacte",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Prima sobre el mercat (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Duració pública (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Temporitzador Dipòsit/Factura(HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Estableix la implicació requerida (augmentar per a més seguretat)",
  "Fidelity Bond Size": "Grandària de la fiança",
@ -355,6 +357,7 @@
  "false": "fals",
  "Menu": "Menú",
  "Show columns": "Mostrar columnes",
+  "Manage columns": "Manage columns",
  "Filter": "Filtrar",
  "Unsort": "Desordenar",
  "Sort by ASC": "Ordenar ascendent",
--- a/frontend/static/locales/cs.json
+++ b/frontend/static/locales/cs.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshi",
  "Premium over Market (%)": "Prémium vůči tržní ceně (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Doba zveřejnění (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Nastavení kauce, zvyš pro vyšší bezpečnost ",
  "Fidelity Bond Size": "Velikost kauce",
@ -355,6 +357,7 @@
  "false": "nesprávný",
  "Menu": "Menu",
  "Show columns": "Ukázat sloupce",
+  "Manage columns": "Manage columns",
  "Filter": "Filtrovat",
  "Unsort": "Zrušení řazení",
  "Sort by ASC": "Řazení podle ASC",
--- a/frontend/static/locales/de.json
+++ b/frontend/static/locales/de.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Marktpreis Aufschlag (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Angebotslaufzeit (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Lege die Kaution fest, erhöhen für mehr Sicherheit",
  "Fidelity Bond Size": "Höhe der Kaution",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/en.json
+++ b/frontend/static/locales/en.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Premium over Market (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Public Duration (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Set the skin-in-the-game, increase for higher safety assurance",
  "Fidelity Bond Size": "Fidelity Bond Size",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/es.json
+++ b/frontend/static/locales/es.json
@ -296,7 +296,9 @@
  "Exact": "Exacto",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Prima sobre el mercado (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Duración pública (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Plazo depósito/factura (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Establece la implicación requerida (aumentar para mayor seguridad)",
  "Fidelity Bond Size": "Tamaño de la fianza",
@ -355,6 +357,7 @@
  "false": "falso",
  "Menu": "Menu",
  "Show columns": "Mostrar columnas",
+  "Manage columns": "Manage columns",
  "Filter": "Filtrar",
  "Unsort": "Desordenar",
  "Sort by ASC": "Orden ascendente",
--- a/frontend/static/locales/eu.json
+++ b/frontend/static/locales/eu.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshiak",
  "Premium over Market (%)": "Merkatuarekiko Prima (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Iraupen publikoa (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Inplikazio maila finkatu, handitu segurtasun gehiago izateko",
  "Fidelity Bond Size": "Fidantzaren tamaina",
@ -355,6 +357,7 @@
  "false": "gezurra",
  "Menu": "Menua",
  "Show columns": "Zutabeak erakutsi",
+  "Manage columns": "Manage columns",
  "Filter": "Iragazkia",
  "Unsort": "Desordenatu",
  "Sort by ASC": "Ordenatu - ASC",
--- a/frontend/static/locales/fr.json
+++ b/frontend/static/locales/fr.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Prime sur le marché (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Durée publique (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Définissez la peau en jeu, augmentez pour une meilleure assurance de sécurité",
  "Fidelity Bond Size": "Taille de la garantie de fidélité",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/it.json
+++ b/frontend/static/locales/it.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshi",
  "Premium over Market (%)": "Premio sul prezzo di mercato (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Durata pubblica (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Stabilisci la posta in gioco, aumenta per una sicurezza maggiore",
  "Fidelity Bond Size": "Ammontare della cauzione",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/pl.json
+++ b/frontend/static/locales/pl.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Premia nad rynkiem (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Czas trwania publicznego (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Ustaw skin-in-the-game, zwiększ, aby zapewnić większe bezpieczeństwo",
  "Fidelity Bond Size": "Rozmiar obligacji wierności",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/pt.json
+++ b/frontend/static/locales/pt.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "Prêmio sobre o mercado (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Duração Pública (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Defina a skin-in-the-game(pele em risco), aumente para maior garantia de segurança",
  "Fidelity Bond Size": "Tamanho do título de fidelidade",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/ru.json
+++ b/frontend/static/locales/ru.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Сатоши",
  "Premium over Market (%)": "Наценка по сравнению с рынком (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Публичная продолжительность (ЧЧ: мм)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Установите залог, увеличьте для большей безопасности.",
  "Fidelity Bond Size": "Размер залога",
@ -355,6 +357,7 @@
  "false": "ложный",
  "Menu": "Меню",
  "Show columns": "Показать столбцы",
+  "Manage columns": "Manage columns",
  "Filter": "Фильтр",
  "Unsort": "Несортировать",
  "Sort by ASC": "Сортировать по ВОСХ",
--- a/frontend/static/locales/sv.json
+++ b/frontend/static/locales/sv.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Sats",
  "Premium over Market (%)": "Premium över marknaden (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "Publikt tidsspann (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "Ange skin-in-the-game, öka för högre säkerhet",
  "Fidelity Bond Size": "Storlek på fidelity bond",
@ -355,6 +357,7 @@
  "false": "false",
  "Menu": "Menu",
  "Show columns": "Show columns",
+  "Manage columns": "Manage columns",
  "Filter": "Filter",
  "Unsort": "Unsort",
  "Sort by ASC": "Sort by ASC",
--- a/frontend/static/locales/th.json
+++ b/frontend/static/locales/th.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "Satoshis",
  "Premium over Market (%)": "ค่าพรีเมี่ยมจากท้องตลาด (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "ประกาศรายการซื้อขายมีอายุ (ชม:นาที)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "Escrow/Invoice Timer (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "การวางหลักประกันเยอะขึ้นจะช่วยลดแรงจูงใจของคนที่คิดจะโกง",
  "Fidelity Bond Size": "วงเงินหลักประกันความเสียหาย (bond)",
@ -355,6 +357,7 @@
  "false": "เท็จ",
  "Menu": "รายการเลือก",
  "Show columns": "แสดงแถว",
+  "Manage columns": "Manage columns",
  "Filter": "ตัวกรอง",
  "Unsort": "เลิกจัดเรียง",
  "Sort by ASC": "เรียงจากล่างขึ้นบน",
--- a/frontend/static/locales/zh-SI.json
+++ b/frontend/static/locales/zh-SI.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "聪",
  "Premium over Market (%)": "市场溢价（%）",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "公开时间 (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "托管存款/发票倒计时 (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "设定风险共担，以提高安全保障",
  "Fidelity Bond Size": "保证金大小",
@ -355,6 +357,7 @@
  "false": "虚",
  "Menu": "菜单",
  "Show columns": "显示列",
+  "Manage columns": "Manage columns",
  "Filter": "筛选",
  "Unsort": "取消排序",
  "Sort by ASC": "按升序排序",
--- a/frontend/static/locales/zh-TR.json
+++ b/frontend/static/locales/zh-TR.json
@ -296,7 +296,9 @@
  "Exact": "Exact",
  "Satoshis": "聰",
  "Premium over Market (%)": "市場溢價 (%)",
+  "Public order length": "Public order length",
  "Public Duration (HH:mm)": "公開時間 (HH:mm)",
+  "Escrow/invoice step length": "Escrow/invoice step length",
  "Escrow/Invoice Timer (HH:mm)": "託管存款/發票倒計時 (HH:mm)",
  "Set the skin-in-the-game, increase for higher safety assurance": "設定風險共擔, 以提高安全保障",
  "Fidelity Bond Size": "保證金大小",
@ -355,6 +357,7 @@
  "false": "虛",
  "Menu": "菜單",
  "Show columns": "顯示列",
+  "Manage columns": "Manage columns",
  "Filter": "篩選",
  "Unsort": "取消排序",
  "Sort by ASC": "按升序排序",