New: Add translations for columns

2025-04-24 05:47:22 -04:00 · 2023-08-03 17:17:10 +03:00 · 2023-08-03 17:17:10 +03:00 · 7e4980b855
commit 7e4980b855
parent 419ef4b3bf
22 changed files with 199 additions and 140 deletions
--- a/frontend/src/Components/FileBrowser/FileBrowserModalContent.js
+++ b/frontend/src/Components/FileBrowser/FileBrowserModalContent.js
@ -20,12 +20,12 @@ import styles from './FileBrowserModalContent.css';
 const columns = [
  {
    name: 'type',
-    label: translate('Type'),
+    label: () => translate('Type'),
    isVisible: true
  },
  {
    name: 'name',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isVisible: true
  }
 ];
--- a/frontend/src/Components/Page/Sidebar/PageSidebar.js
+++ b/frontend/src/Components/Page/Sidebar/PageSidebar.js
@ -20,12 +20,12 @@ const SIDEBAR_WIDTH = parseInt(dimensions.sidebarWidth);
 const links = [
  {
    iconName: icons.MOVIE_CONTINUING,
-    title: translate('Indexers'),
+    title: () => translate('Indexers'),
    to: '/',
    alias: '/indexers',
    children: [
      {
-        title: translate('Stats'),
+        title: () => translate('Stats'),
        to: '/indexers/stats'
      }
    ]
@ -33,47 +33,47 @@ const links = [

  {
    iconName: icons.SEARCH,
-    title: translate('Search'),
+    title: () => translate('Search'),
    to: '/search'
  },

  {
    iconName: icons.ACTIVITY,
-    title: translate('History'),
+    title: () => translate('History'),
    to: '/history'
  },

  {
    iconName: icons.SETTINGS,
-    title: translate('Settings'),
+    title: () => translate('Settings'),
    to: '/settings',
    children: [
      {
-        title: translate('Indexers'),
+        title: () => translate('Indexers'),
        to: '/settings/indexers'
      },
      {
-        title: translate('Apps'),
+        title: () => translate('Apps'),
        to: '/settings/applications'
      },
      {
-        title: translate('DownloadClients'),
+        title: () => translate('DownloadClients'),
        to: '/settings/downloadclients'
      },
      {
-        title: translate('Connect'),
+        title: () => translate('Connect'),
        to: '/settings/connect'
      },
      {
-        title: translate('Tags'),
+        title: () => translate('Tags'),
        to: '/settings/tags'
      },
      {
-        title: translate('General'),
+        title: () => translate('General'),
        to: '/settings/general'
      },
      {
-        title: translate('UI'),
+        title: () => translate('UI'),
        to: '/settings/ui'
      }
    ]
@ -81,32 +81,32 @@ const links = [

  {
    iconName: icons.SYSTEM,
-    title: translate('System'),
+    title: () => translate('System'),
    to: '/system/status',
    children: [
      {
-        title: translate('Status'),
+        title: () => translate('Status'),
        to: '/system/status',
        statusComponent: HealthStatusConnector
      },
      {
-        title: translate('Tasks'),
+        title: () => translate('Tasks'),
        to: '/system/tasks'
      },
      {
-        title: translate('Backup'),
+        title: () => translate('Backup'),
        to: '/system/backup'
      },
      {
-        title: translate('Updates'),
+        title: () => translate('Updates'),
        to: '/system/updates'
      },
      {
-        title: translate('Events'),
+        title: () => translate('Events'),
        to: '/system/events'
      },
      {
-        title: translate('LogFiles'),
+        title: () => translate('LogFiles'),
        to: '/system/logs/files'
      }
    ]
--- a/frontend/src/Components/Page/Sidebar/PageSidebarItem.js
+++ b/frontend/src/Components/Page/Sidebar/PageSidebarItem.js
@ -64,7 +64,7 @@ class PageSidebarItem extends Component {
          }

          <span className={isChildItem ? styles.noIcon : null}>
-            {title}
+            {typeof title === 'function' ? title() : title}
          </span>

          {
@ -88,7 +88,7 @@ class PageSidebarItem extends Component {

 PageSidebarItem.propTypes = {
  iconName: PropTypes.object,
-  title: PropTypes.string.isRequired,
+  title: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).isRequired,
  to: PropTypes.string.isRequired,
  isActive: PropTypes.bool,
  isActiveParent: PropTypes.bool,
--- a/frontend/src/Indexer/Add/AddIndexerModalContent.js
+++ b/frontend/src/Indexer/Add/AddIndexerModalContent.js
@ -22,31 +22,31 @@ import styles from './AddIndexerModalContent.css';
 const columns = [
  {
    name: 'protocol',
-    label: translate('Protocol'),
+    label: () => translate('Protocol'),
    isSortable: true,
    isVisible: true
  },
  {
    name: 'sortName',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isSortable: true,
    isVisible: true
  },
  {
    name: 'language',
-    label: translate('Language'),
+    label: () => translate('Language'),
    isSortable: true,
    isVisible: true
  },
  {
    name: 'description',
-    label: translate('Description'),
+    label: () => translate('Description'),
    isSortable: false,
    isVisible: true
  },
  {
    name: 'privacy',
-    label: translate('Privacy'),
+    label: () => translate('Privacy'),
    isSortable: true,
    isVisible: true
  }
@ -66,15 +66,21 @@ const protocols = [
 const privacyLevels = [
  {
    key: 'private',
-    value: translate('Private')
+    get value() {
+      return translate('Private');
+    }
  },
  {
    key: 'semiPrivate',
-    value: translate('SemiPrivate')
+    get value() {
+      return translate('SemiPrivate');
+    }
  },
  {
    key: 'public',
-    value: translate('Public')
+    get value() {
+      return translate('Public');
+    }
  }
 ];

--- a/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx
+++ b/frontend/src/Indexer/Index/Select/Edit/EditIndexerModalContent.tsx
@ -30,9 +30,25 @@ interface EditIndexerModalContentProps {
 const NO_CHANGE = 'noChange';

 const enableOptions = [
-  { key: NO_CHANGE, value: translate('NoChange'), disabled: true },
-  { key: 'true', value: translate('Enabled') },
-  { key: 'false', value: translate('Disabled') },
+  {
+    key: NO_CHANGE,
+    get value() {
+      return translate('NoChange');
+    },
+    disabled: true,
+  },
+  {
+    key: 'true',
+    get value() {
+      return translate('Enabled');
+    },
+  },
+  {
+    key: 'false',
+    get value() {
+      return translate('Disabled');
+    },
+  },
 ];

 function EditIndexerModalContent(props: EditIndexerModalContentProps) {
--- a/frontend/src/Search/Table/SearchIndexHeader.js
+++ b/frontend/src/Search/Table/SearchIndexHeader.js
@ -96,7 +96,7 @@ class SearchIndexHeader extends Component {
                isSortable={isSortable}
                {...otherProps}
              >
-                {label}
+                {typeof label === 'function' ? label() : label}
              </VirtualTableHeaderCell>
            );
          })
--- a/frontend/src/Settings/Applications/Applications/Manage/Edit/ManageApplicationsEditModalContent.tsx
+++ b/frontend/src/Settings/Applications/Applications/Manage/Edit/ManageApplicationsEditModalContent.tsx
@ -25,10 +25,31 @@ interface ManageApplicationsEditModalContentProps {
 const NO_CHANGE = 'noChange';

 const syncLevelOptions = [
-  { key: NO_CHANGE, value: translate('NoChange'), disabled: true },
-  { key: ApplicationSyncLevel.Disabled, value: translate('Disabled') },
-  { key: ApplicationSyncLevel.AddOnly, value: translate('AddOnly') },
-  { key: ApplicationSyncLevel.FullSync, value: translate('FullSync') },
+  {
+    key: NO_CHANGE,
+    get value() {
+      return translate('NoChange');
+    },
+    disabled: true,
+  },
+  {
+    key: ApplicationSyncLevel.Disabled,
+    get value() {
+      return translate('Disabled');
+    },
+  },
+  {
+    key: ApplicationSyncLevel.AddOnly,
+    get value() {
+      return translate('AddOnly');
+    },
+  },
+  {
+    key: ApplicationSyncLevel.FullSync,
+    get value() {
+      return translate('FullSync');
+    },
+  },
 ];

 function ManageApplicationsEditModalContent(
--- a/frontend/src/Settings/Applications/Applications/Manage/ManageApplicationsModalContent.tsx
+++ b/frontend/src/Settings/Applications/Applications/Manage/ManageApplicationsModalContent.tsx
@ -36,25 +36,25 @@ type OnSelectedChangeCallback = React.ComponentProps<
 const COLUMNS = [
  {
    name: 'name',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'implementation',
-    label: translate('Implementation'),
+    label: () => translate('Implementation'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'syncLevel',
-    label: translate('SyncLevel'),
+    label: () => translate('SyncLevel'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'tags',
-    label: translate('Tags'),
+    label: () => translate('Tags'),
    isSortable: true,
    isVisible: true,
  },
--- a/frontend/src/Settings/DownloadClients/DownloadClients/Manage/Edit/ManageDownloadClientsEditModalContent.tsx
+++ b/frontend/src/Settings/DownloadClients/DownloadClients/Manage/Edit/ManageDownloadClientsEditModalContent.tsx
@ -25,9 +25,25 @@ interface ManageDownloadClientsEditModalContentProps {
 const NO_CHANGE = 'noChange';

 const enableOptions = [
-  { key: NO_CHANGE, value: translate('NoChange'), disabled: true },
-  { key: 'enabled', value: translate('Enabled') },
-  { key: 'disabled', value: translate('Disabled') },
+  {
+    key: NO_CHANGE,
+    get value() {
+      return translate('NoChange');
+    },
+    disabled: true,
+  },
+  {
+    key: 'enabled',
+    get value() {
+      return translate('Enabled');
+    },
+  },
+  {
+    key: 'disabled',
+    get value() {
+      return translate('Disabled');
+    },
+  },
 ];

 function ManageDownloadClientsEditModalContent(
--- a/frontend/src/Settings/DownloadClients/DownloadClients/Manage/ManageDownloadClientsModalContent.tsx
+++ b/frontend/src/Settings/DownloadClients/DownloadClients/Manage/ManageDownloadClientsModalContent.tsx
@ -35,25 +35,25 @@ type OnSelectedChangeCallback = React.ComponentProps<
 const COLUMNS = [
  {
    name: 'name',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'implementation',
-    label: translate('Implementation'),
+    label: () => translate('Implementation'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'enable',
-    label: translate('Enabled'),
+    label: () => translate('Enabled'),
    isSortable: true,
    isVisible: true,
  },
  {
    name: 'priority',
-    label: translate('ClientPriority'),
+    label: () => translate('ClientPriority'),
    isSortable: true,
    isVisible: true,
  },
--- a/frontend/src/Store/Actions/historyActions.js
+++ b/frontend/src/Store/Actions/historyActions.js
@ -30,67 +30,67 @@ export const defaultState = {
  columns: [
    {
      name: 'eventType',
-      columnLabel: translate('EventType'),
+      columnLabel: () => translate('EventType'),
      isVisible: true,
      isModifiable: false
    },
    {
      name: 'indexer',
-      label: translate('Indexer'),
+      label: () => translate('Indexer'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'query',
-      label: translate('Query'),
+      label: () => translate('Query'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'parameters',
-      label: translate('Parameters'),
+      label: () => translate('Parameters'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'grabTitle',
-      label: translate('GrabTitle'),
+      label: () => translate('GrabTitle'),
      isSortable: false,
      isVisible: false
    },
    {
      name: 'queryType',
-      label: translate('QueryType'),
+      label: () => translate('QueryType'),
      isSortable: false,
      isVisible: false
    },
    {
      name: 'categories',
-      label: translate('Categories'),
+      label: () => translate('Categories'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'date',
-      label: translate('Date'),
+      label: () => translate('Date'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'source',
-      label: translate('Source'),
+      label: () => translate('Source'),
      isSortable: false,
      isVisible: false
    },
    {
      name: 'elapsedTime',
-      label: translate('ElapsedTime'),
+      label: () => translate('ElapsedTime'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'details',
-      columnLabel: translate('Details'),
+      columnLabel: () => translate('Details'),
      isVisible: true,
      isModifiable: false
    }
@ -101,12 +101,12 @@ export const defaultState = {
  filters: [
    {
      key: 'all',
-      label: translate('All'),
+      label: () => translate('All'),
      filters: []
    },
    {
      key: 'releaseGrabbed',
-      label: translate('Grabbed'),
+      label: () => translate('Grabbed'),
      filters: [
        {
          key: 'eventType',
@ -117,7 +117,7 @@ export const defaultState = {
    },
    {
      key: 'indexerRss',
-      label: translate('IndexerRss'),
+      label: () => translate('IndexerRss'),
      filters: [
        {
          key: 'eventType',
@ -128,7 +128,7 @@ export const defaultState = {
    },
    {
      key: 'indexerQuery',
-      label: translate('IndexerQuery'),
+      label: () => translate('IndexerQuery'),
      filters: [
        {
          key: 'eventType',
@ -139,7 +139,7 @@ export const defaultState = {
    },
    {
      key: 'indexerAuth',
-      label: translate('IndexerAuth'),
+      label: () => translate('IndexerAuth'),
      filters: [
        {
          key: 'eventType',
@ -150,7 +150,7 @@ export const defaultState = {
    },
    {
      key: 'failed',
-      label: translate('Failed'),
+      label: () => translate('Failed'),
      filters: [
        {
          key: 'successful',
--- a/frontend/src/Store/Actions/indexerActions.js
+++ b/frontend/src/Store/Actions/indexerActions.js
@ -54,7 +54,7 @@ export const defaultState = {
 export const filters = [
  {
    key: 'all',
-    label: translate('All'),
+    label: () => translate('All'),
    filters: []
  }
 ];
--- a/frontend/src/Store/Actions/indexerIndexActions.js
+++ b/frontend/src/Store/Actions/indexerIndexActions.js
@ -32,93 +32,93 @@ export const defaultState = {
  columns: [
    {
      name: 'status',
-      columnLabel: translate('IndexerStatus'),
+      columnLabel: () => translate('IndexerStatus'),
      isSortable: true,
      isVisible: true,
      isModifiable: false
    },
    {
      name: 'sortName',
-      label: translate('IndexerName'),
+      label: () => translate('IndexerName'),
      isSortable: true,
      isVisible: true,
      isModifiable: false
    },
    {
      name: 'protocol',
-      label: translate('Protocol'),
+      label: () => translate('Protocol'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'privacy',
-      label: translate('Privacy'),
+      label: () => translate('Privacy'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'priority',
-      label: translate('Priority'),
+      label: () => translate('Priority'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'appProfileId',
-      label: translate('SyncProfile'),
+      label: () => translate('SyncProfile'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'added',
-      label: translate('Added'),
+      label: () => translate('Added'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'vipExpiration',
-      label: translate('VipExpiration'),
+      label: () => translate('VipExpiration'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'capabilities',
-      label: translate('Categories'),
+      label: () => translate('Categories'),
      isSortable: false,
      isVisible: true
    },
    {
      name: 'minimumSeeders',
-      label: translate('MinimumSeeders'),
+      label: () => translate('MinimumSeeders'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'seedRatio',
-      label: translate('SeedRatio'),
+      label: () => translate('SeedRatio'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'seedTime',
-      label: translate('SeedTime'),
+      label: () => translate('SeedTime'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'packSeedTime',
-      label: translate('PackSeedTime'),
+      label: () => translate('PackSeedTime'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'tags',
-      label: translate('Tags'),
+      label: () => translate('Tags'),
      isSortable: false,
      isVisible: false
    },
    {
      name: 'actions',
-      columnLabel: translate('Actions'),
+      columnLabel: () => translate('Actions'),
      isVisible: true,
      isModifiable: false
    }
@ -136,53 +136,53 @@ export const defaultState = {
  filterBuilderProps: [
    {
      name: 'name',
-      label: translate('IndexerName'),
+      label: () => translate('IndexerName'),
      type: filterBuilderTypes.STRING
    },
    {
      name: 'enable',
-      label: translate('Enabled'),
+      label: () => translate('Enabled'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.BOOL
    },
    {
      name: 'added',
-      label: translate('Added'),
+      label: () => translate('Added'),
      type: filterBuilderTypes.DATE,
      valueType: filterBuilderValueTypes.DATE
    },
    {
      name: 'vipExpiration',
-      label: translate('VipExpiration'),
+      label: () => translate('VipExpiration'),
      type: filterBuilderTypes.DATE,
      valueType: filterBuilderValueTypes.DATE
    },
    {
      name: 'priority',
-      label: translate('Priority'),
+      label: () => translate('Priority'),
      type: filterBuilderTypes.NUMBER
    },
    {
      name: 'protocol',
-      label: translate('Protocol'),
+      label: () => translate('Protocol'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.PROTOCOL
    },
    {
      name: 'privacy',
-      label: translate('Privacy'),
+      label: () => translate('Privacy'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.PRIVACY
    },
    {
      name: 'appProfileId',
-      label: translate('SyncProfile'),
+      label: () => translate('SyncProfile'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.APP_PROFILE
    },
    {
      name: 'tags',
-      label: translate('Tags'),
+      label: () => translate('Tags'),
      type: filterBuilderTypes.ARRAY,
      valueType: filterBuilderValueTypes.TAG
    }
--- a/frontend/src/Store/Actions/indexerStatsActions.js
+++ b/frontend/src/Store/Actions/indexerStatsActions.js
@ -33,7 +33,7 @@ export const defaultState = {
  filters: [
    {
      key: 'all',
-      label: translate('All'),
+      label: () => translate('All'),
      filters: []
    },
    {
--- a/frontend/src/Store/Actions/oAuthActions.js
+++ b/frontend/src/Store/Actions/oAuthActions.js
@ -60,7 +60,7 @@ function showOAuthWindow(url, payload) {
      responseJSON: [
        {
          propertyName: payload.name,
-          errorMessage: translate('OAuthPopupMessage')
+          errorMessage: () => translate('OAuthPopupMessage')
        }
      ]
    };
--- a/frontend/src/Store/Actions/releaseActions.js
+++ b/frontend/src/Store/Actions/releaseActions.js
@ -56,55 +56,55 @@ export const defaultState = {
    },
    {
      name: 'protocol',
-      label: translate('Protocol'),
+      label: () => translate('Protocol'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'age',
-      label: translate('Age'),
+      label: () => translate('Age'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'sortTitle',
-      label: translate('Title'),
+      label: () => translate('Title'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'indexer',
-      label: translate('Indexer'),
+      label: () => translate('Indexer'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'size',
-      label: translate('Size'),
+      label: () => translate('Size'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'files',
-      label: translate('Files'),
+      label: () => translate('Files'),
      isSortable: true,
      isVisible: false
    },
    {
      name: 'grabs',
-      label: translate('Grabs'),
+      label: () => translate('Grabs'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'peers',
-      label: translate('Peers'),
+      label: () => translate('Peers'),
      isSortable: true,
      isVisible: true
    },
    {
      name: 'category',
-      label: translate('Category'),
+      label: () => translate('Category'),
      isSortable: true,
      isVisible: true
    },
@ -116,7 +116,7 @@ export const defaultState = {
    },
    {
      name: 'actions',
-      columnLabel: translate('Actions'),
+      columnLabel: () => translate('Actions'),
      isVisible: true,
      isModifiable: false
    }
@ -158,7 +158,7 @@ export const defaultState = {
  filters: [
    {
      key: 'all',
-      label: translate('All'),
+      label: () => translate('All'),
      filters: []
    }
  ],
@ -166,50 +166,50 @@ export const defaultState = {
  filterBuilderProps: [
    {
      name: 'title',
-      label: translate('Title'),
+      label: () => translate('Title'),
      type: filterBuilderTypes.STRING
    },
    {
      name: 'age',
-      label: translate('Age'),
+      label: () => translate('Age'),
      type: filterBuilderTypes.NUMBER
    },
    {
      name: 'protocol',
-      label: translate('Protocol'),
+      label: () => translate('Protocol'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.PROTOCOL
    },
    {
      name: 'indexerId',
-      label: translate('Indexer'),
+      label: () => translate('Indexer'),
      type: filterBuilderTypes.EXACT,
      valueType: filterBuilderValueTypes.INDEXER
    },
    {
      name: 'size',
-      label: translate('Size'),
+      label: () => translate('Size'),
      type: filterBuilderTypes.NUMBER,
      valueType: filterBuilderValueTypes.BYTES
    },
    {
      name: 'files',
-      label: translate('Files'),
+      label: () => translate('Files'),
      type: filterBuilderTypes.NUMBER
    },
    {
      name: 'grabs',
-      label: translate('Grabs'),
+      label: () => translate('Grabs'),
      type: filterBuilderTypes.NUMBER
    },
    {
      name: 'seeders',
-      label: translate('Seeders'),
+      label: () => translate('Seeders'),
      type: filterBuilderTypes.NUMBER
    },
    {
      name: 'peers',
-      label: translate('Peers'),
+      label: () => translate('Peers'),
      type: filterBuilderTypes.NUMBER
    }
  ],
--- a/frontend/src/Store/Actions/systemActions.js
+++ b/frontend/src/Store/Actions/systemActions.js
@ -82,34 +82,34 @@ export const defaultState = {
    columns: [
      {
        name: 'level',
-        columnLabel: translate('Level'),
+        columnLabel: () => translate('Level'),
        isSortable: false,
        isVisible: true,
        isModifiable: false
      },
      {
        name: 'time',
-        label: translate('Time'),
+        label: () => translate('Time'),
        isSortable: true,
        isVisible: true,
        isModifiable: false
      },
      {
        name: 'logger',
-        label: translate('Component'),
+        label: () => translate('Component'),
        isSortable: false,
        isVisible: true,
        isModifiable: false
      },
      {
        name: 'message',
-        label: translate('Message'),
+        label: () => translate('Message'),
        isVisible: true,
        isModifiable: false
      },
      {
        name: 'actions',
-        columnLabel: translate('Actions'),
+        columnLabel: () => translate('Actions'),
        isSortable: true,
        isVisible: true,
        isModifiable: false
@ -121,12 +121,12 @@ export const defaultState = {
    filters: [
      {
        key: 'all',
-        label: translate('All'),
+        label: () => translate('All'),
        filters: []
      },
      {
        key: 'info',
-        label: translate('Info'),
+        label: () => translate('Info'),
        filters: [
          {
            key: 'level',
@ -137,7 +137,7 @@ export const defaultState = {
      },
      {
        key: 'warn',
-        label: translate('Warn'),
+        label: () => translate('Warn'),
        filters: [
          {
            key: 'level',
@ -148,7 +148,7 @@ export const defaultState = {
      },
      {
        key: 'error',
-        label: translate('Error'),
+        label: () => translate('Error'),
        filters: [
          {
            key: 'level',
--- a/frontend/src/System/Backup/Backups.js
+++ b/frontend/src/System/Backup/Backups.js
@ -21,17 +21,17 @@ const columns = [
  },
  {
    name: 'name',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isVisible: true
  },
  {
    name: 'size',
-    label: translate('Size'),
+    label: () => translate('Size'),
    isVisible: true
  },
  {
    name: 'time',
-    label: translate('Time'),
+    label: () => translate('Time'),
    isVisible: true
  },
  {
--- a/frontend/src/System/Logs/Files/LogFiles.js
+++ b/frontend/src/System/Logs/Files/LogFiles.js
@ -19,12 +19,12 @@ import LogFilesTableRow from './LogFilesTableRow';
 const columns = [
  {
    name: 'filename',
-    label: translate('Filename'),
+    label: () => translate('Filename'),
    isVisible: true
  },
  {
    name: 'lastWriteTime',
-    label: translate('LastWriteTime'),
+    label: () => translate('LastWriteTime'),
    isVisible: true
  },
  {
--- a/frontend/src/System/Status/Health/Health.js
+++ b/frontend/src/System/Status/Health/Health.js
@ -66,12 +66,12 @@ const columns = [
  },
  {
    name: 'message',
-    label: translate('Message'),
+    label: () => translate('Message'),
    isVisible: true
  },
  {
    name: 'actions',
-    label: translate('Actions'),
+    label: () => translate('Actions'),
    isVisible: true
  }
 ];
--- a/frontend/src/System/Tasks/Queued/QueuedTasks.js
+++ b/frontend/src/System/Tasks/Queued/QueuedTasks.js
@ -15,27 +15,27 @@ const columns = [
  },
  {
    name: 'commandName',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isVisible: true
  },
  {
    name: 'queued',
-    label: translate('Queued'),
+    label: () => translate('Queued'),
    isVisible: true
  },
  {
    name: 'started',
-    label: translate('Started'),
+    label: () => translate('Started'),
    isVisible: true
  },
  {
    name: 'ended',
-    label: translate('Ended'),
+    label: () => translate('Ended'),
    isVisible: true
  },
  {
    name: 'duration',
-    label: translate('Duration'),
+    label: () => translate('Duration'),
    isVisible: true
  },
  {
--- a/frontend/src/System/Tasks/Scheduled/ScheduledTasks.js
+++ b/frontend/src/System/Tasks/Scheduled/ScheduledTasks.js
@ -10,27 +10,27 @@ import ScheduledTaskRowConnector from './ScheduledTaskRowConnector';
 const columns = [
  {
    name: 'name',
-    label: translate('Name'),
+    label: () => translate('Name'),
    isVisible: true
  },
  {
    name: 'interval',
-    label: translate('Interval'),
+    label: () => translate('Interval'),
    isVisible: true
  },
  {
    name: 'lastExecution',
-    label: translate('LastExecution'),
+    label: () => translate('LastExecution'),
    isVisible: true
  },
  {
    name: 'lastDuration',
-    label: translate('LastDuration'),
+    label: () => translate('LastDuration'),
    isVisible: true
  },
  {
    name: 'nextExecution',
-    label: translate('NextExecution'),
+    label: () => translate('NextExecution'),
    isVisible: true
  },
  {