@oanda/labs-instruments-table-widget 1.0.15 → 1.0.17

package/CHANGELOG.md

@@ -3,6 +3,146 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 1.0.17 (2025-05-23)
+
+
+
+## 1.0.196 (2025-05-22)
+
+
+
+## 1.0.195 (2025-05-21)
+
+
+
+## 1.0.194 (2025-05-21)
+
+
+
+## 1.0.193 (2025-05-15)
+
+
+
+## 1.0.192 (2025-05-14)
+
+
+
+## 1.0.191 (2025-04-30)
+
+
+
+## 1.0.190 (2025-04-28)
+
+
+
+## 1.0.189 (2025-04-23)
+
+
+
+## 1.0.188 (2025-04-22)
+
+
+
+## 1.0.187 (2025-04-18)
+
+
+
+## 1.0.186 (2025-04-10)
+
+
+
+## 1.0.185 (2025-04-09)
+
+
+
+## 1.0.184 (2025-04-08)
+
+
+
+## 1.0.183 (2025-04-04)
+
+
+
+## 1.0.182 (2025-03-21)
+
+
+
+## 1.0.181 (2025-03-13)
+
+**Note:** Version bump only for package @oanda/labs-instruments-table-widget
+
+
+
+
+
+## 1.0.16 (2025-05-22)
+
+
+
+## 1.0.195 (2025-05-21)
+
+
+
+## 1.0.194 (2025-05-21)
+
+
+
+## 1.0.193 (2025-05-15)
+
+
+
+## 1.0.192 (2025-05-14)
+
+
+
+## 1.0.191 (2025-04-30)
+
+
+
+## 1.0.190 (2025-04-28)
+
+
+
+## 1.0.189 (2025-04-23)
+
+
+
+## 1.0.188 (2025-04-22)
+
+
+
+## 1.0.187 (2025-04-18)
+
+
+
+## 1.0.186 (2025-04-10)
+
+
+
+## 1.0.185 (2025-04-09)
+
+
+
+## 1.0.184 (2025-04-08)
+
+
+
+## 1.0.183 (2025-04-04)
+
+
+
+## 1.0.182 (2025-03-21)
+
+
+
+## 1.0.181 (2025-03-13)
+
+**Note:** Version bump only for package @oanda/labs-instruments-table-widget
+
+
+
+
+
 ## 1.0.15 (2025-05-21)
 
 

package/dist/main/InstrumentsTableWidget/Main.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.Main = void 0;
 var _client = require("@apollo/client");
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
+var _monoI18n = require("@oanda/mono-i18n");
 var _react = _interopRequireWildcard(require("react"));
 var _usehooksTs = require("usehooks-ts");
 var _resolveInstrumentsWithFilters = require("../gql/resolveInstrumentsWithFilters");
@@ -26,6 +27,9 @@ const Main = _ref => {
     dataSource
   } = _ref;
   const documentRef = (0, _react.useRef)(document);
+  const {
+    lang
+  } = (0, _monoI18n.useLocale)();
   const {
     target,
     setQuery,
@@ -100,7 +104,7 @@ const Main = _ref => {
   };
   (0, _usehooksTs.useEventListener)('visibilitychange', onVisibilityChange, documentRef);
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_labsWidgetCommon.TableWidget, {
-    PaginationComponent: _react.default.createElement(_labsWidgetCommon.Pagination, {
+    PaginationComponent: records.length > 0 ? _react.default.createElement(_labsWidgetCommon.Pagination, {
       currentPage: pageNumber,
       disabled: loading,
       recordsPerPage: recordsPerPage,
@@ -111,14 +115,14 @@ const Main = _ref => {
           offset: numb * recordsPerPage
         }));
       }
-    }),
+    }) : _react.default.createElement(_react.default.Fragment, null),
     TabsComponent: isInstrumentSearchEnabled || isAssetClassFilterEnabled ? _react.default.createElement(_components.Filters, {
       assetClassOptions: [{
         id: 'ALL',
-        label: 'All'
+        label: lang('all')
       }, ...(assetClasses || []).map(assetClass => ({
         id: assetClass,
-        label: assetClass.charAt(0) + assetClass.slice(1).toLowerCase()
+        label: lang(_config.assetClassLabels[assetClass])
       }))],
       isAssetClassFilterEnabled: isAssetClassFilterEnabled,
       isInstrumentSearchEnabled: isInstrumentSearchEnabled,

package/dist/main/InstrumentsTableWidget/Main.js.map

@@ -1 +1 @@
-{"version":3,"file":"Main.js","names":["_client","require","_labsWidgetCommon","_react","_interopRequireWildcard","_usehooksTs","_resolveInstrumentsWithFilters","_components","_config","_constant","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Main","_ref","instruments","division","assetClasses","paramsAssetClasses","columns","DEFAULT_COLUMNS","isAssetClassFilterEnabled","isInstrumentSearchEnabled","recordsPerPage","dataSource","documentRef","useRef","document","target","setQuery","closeQuery","useLiveRatesQuery","records","setRecords","useState","Array","fill","map","assetClass","toUpperCase","totalRecords","setTotalRecords","queryVariables","setQueryVariables","count","searchPattern","offset","pageNumber","Math","floor","data","error","loading","useQuery","resolveInstrumentsWithFilters","variables","fetchPolicy","errorPolicy","useEffect","newRecords","record","instrument","name","displayName","totalCount","instrumentsNames","_ref2","showError","onVisibilityChange","current","visibilityState","_ref3","useEventListener","createElement","Fragment","TableWidget","PaginationComponent","Pagination","currentPage","disabled","onPageChange","numb","prev","TabsComponent","Filters","assetClassOptions","id","label","charAt","slice","toLowerCase","onAssetClassChange","onSearchChange","activeColumns","hasError","headerColumns","getHeaderConfig","isLoading","testId","toolTipId","INSTRUMENT_TOOLTIP_ID","viewType","exports"],"sources":["../../../src/InstrumentsTableWidget/Main.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport type { DataRecord } from '@oanda/labs-widget-common';\nimport {\n  Pagination,\n  TableWidget,\n  useLiveRatesQuery,\n} from '@oanda/labs-widget-common';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useEventListener } from 'usehooks-ts';\n\nimport { resolveInstrumentsWithFilters } from '../gql/resolveInstrumentsWithFilters';\nimport type { Division, InstrumentDataSource } from '../gql/types/graphql';\nimport {\n  type ResolveInstrumentsWithFiltersQuery,\n  type ResolveInstrumentsWithFiltersQueryVariables,\n} from '../gql/types/graphql';\nimport { Filters } from './components';\nimport { getHeaderConfig } from './config';\nimport { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';\nimport type { MainProps } from './types';\n\nconst Main = ({\n  instruments = [],\n  division,\n  assetClasses: paramsAssetClasses,\n  columns = DEFAULT_COLUMNS,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n  recordsPerPage = 10,\n  dataSource,\n}: MainProps) => {\n  const documentRef = useRef<Document>(document);\n  const { target, setQuery, closeQuery } = useLiveRatesQuery();\n\n  const [records, setRecords] = useState<DataRecord[]>(\n    new Array(recordsPerPage).fill({})\n  );\n\n  const assetClasses = paramsAssetClasses?.map((assetClass) =>\n    assetClass.toUpperCase()\n  );\n\n  const [totalRecords, setTotalRecords] = useState<number>(0);\n\n  const [queryVariables, setQueryVariables] = useState<{\n    division: Division;\n    count: number;\n    searchPattern: string;\n    offset: number;\n    assetClass: string[];\n    instruments: string[];\n    dataSource?: InstrumentDataSource;\n  }>({\n    division,\n    count: recordsPerPage,\n    searchPattern: '',\n    offset: 0,\n    assetClass: assetClasses || [],\n    instruments,\n    dataSource,\n  });\n\n  const pageNumber = Math.floor(queryVariables.offset / recordsPerPage);\n\n  const { data, error, loading } = useQuery<\n    ResolveInstrumentsWithFiltersQuery,\n    ResolveInstrumentsWithFiltersQueryVariables\n  >(resolveInstrumentsWithFilters, {\n    variables: queryVariables,\n    fetchPolicy: 'network-only',\n    errorPolicy: 'all',\n  });\n\n  useEffect(() => {\n    if (loading) {\n      setRecords(new Array(recordsPerPage).fill({}));\n    }\n    if (!loading && data?.resolveInstrumentsWithFilters?.instruments) {\n      const newRecords = data.resolveInstrumentsWithFilters.instruments.map(\n        (record) => ({\n          instrument: record?.name || '',\n          displayName: record?.displayName || '',\n        })\n      );\n      setRecords(newRecords);\n      setTotalRecords(data.resolveInstrumentsWithFilters.totalCount);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [loading, data]);\n\n  useEffect(() => {\n    const instrumentsNames = records.map(({ instrument }) => instrument);\n    if (instrumentsNames[0]) {\n      setQuery({ instruments: instrumentsNames });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [records]);\n\n  const showError = (!loading && !!error) || (!loading && !data);\n\n  const onVisibilityChange = () => {\n    if (documentRef.current.visibilityState === 'hidden') {\n      closeQuery();\n    }\n    if (documentRef.current.visibilityState === 'visible') {\n      const instrumentsNames = records.map(({ instrument }) => instrument);\n      if (instrumentsNames[0]) {\n        setQuery({ instruments: instrumentsNames });\n      }\n    }\n  };\n\n  useEventListener('visibilitychange', onVisibilityChange, documentRef);\n\n  return (\n    <>\n      <TableWidget\n        PaginationComponent={\n          <Pagination\n            currentPage={pageNumber}\n            disabled={loading}\n            recordsPerPage={recordsPerPage}\n            totalRecords={totalRecords}\n            onPageChange={(numb) => {\n              setQueryVariables((prev) => ({\n                ...prev,\n                offset: numb * recordsPerPage,\n              }));\n            }}\n          />\n        }\n        TabsComponent={\n          isInstrumentSearchEnabled || isAssetClassFilterEnabled ? (\n            <Filters\n              assetClassOptions={[\n                {\n                  id: 'ALL',\n                  label: 'All',\n                },\n                ...(assetClasses || []).map((assetClass) => ({\n                  id: assetClass,\n                  label:\n                    assetClass.charAt(0) + assetClass.slice(1).toLowerCase(),\n                })),\n              ]}\n              isAssetClassFilterEnabled={isAssetClassFilterEnabled}\n              isInstrumentSearchEnabled={isInstrumentSearchEnabled}\n              onAssetClassChange={(assetClass) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern: '',\n                  assetClass:\n                    assetClass[0] === 'ALL' ? assetClasses || [] : assetClass,\n                }));\n              }}\n              onSearchChange={(searchPattern) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        activeColumns={columns}\n        count={totalRecords}\n        hasError={showError}\n        headerColumns={getHeaderConfig(columns)}\n        isLoading={loading}\n        pageNumber={pageNumber}\n        records={records}\n        target={target}\n        testId=\"instruments-table-wrapper\"\n        toolTipId={INSTRUMENT_TOOLTIP_ID}\n        viewType=\"table\"\n      />\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Main.js","names":["_client","require","_labsWidgetCommon","_monoI18n","_react","_interopRequireWildcard","_usehooksTs","_resolveInstrumentsWithFilters","_components","_config","_constant","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Main","_ref","instruments","division","assetClasses","paramsAssetClasses","columns","DEFAULT_COLUMNS","isAssetClassFilterEnabled","isInstrumentSearchEnabled","recordsPerPage","dataSource","documentRef","useRef","document","lang","useLocale","target","setQuery","closeQuery","useLiveRatesQuery","records","setRecords","useState","Array","fill","map","assetClass","toUpperCase","totalRecords","setTotalRecords","queryVariables","setQueryVariables","count","searchPattern","offset","pageNumber","Math","floor","data","error","loading","useQuery","resolveInstrumentsWithFilters","variables","fetchPolicy","errorPolicy","useEffect","newRecords","record","instrument","name","displayName","totalCount","instrumentsNames","_ref2","showError","onVisibilityChange","current","visibilityState","_ref3","useEventListener","createElement","Fragment","TableWidget","PaginationComponent","length","Pagination","currentPage","disabled","onPageChange","numb","prev","TabsComponent","Filters","assetClassOptions","id","label","assetClassLabels","onAssetClassChange","onSearchChange","activeColumns","hasError","headerColumns","getHeaderConfig","isLoading","testId","toolTipId","INSTRUMENT_TOOLTIP_ID","viewType","exports"],"sources":["../../../src/InstrumentsTableWidget/Main.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport type { DataRecord } from '@oanda/labs-widget-common';\nimport {\n  Pagination,\n  TableWidget,\n  useLiveRatesQuery,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useEventListener } from 'usehooks-ts';\n\nimport { resolveInstrumentsWithFilters } from '../gql/resolveInstrumentsWithFilters';\nimport type { Division, InstrumentDataSource } from '../gql/types/graphql';\nimport {\n  type ResolveInstrumentsWithFiltersQuery,\n  type ResolveInstrumentsWithFiltersQueryVariables,\n} from '../gql/types/graphql';\nimport { Filters } from './components';\nimport { assetClassLabels, getHeaderConfig } from './config';\nimport { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';\nimport type { MainProps } from './types';\n\nconst Main = ({\n  instruments = [],\n  division,\n  assetClasses: paramsAssetClasses,\n  columns = DEFAULT_COLUMNS,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n  recordsPerPage = 10,\n  dataSource,\n}: MainProps) => {\n  const documentRef = useRef<Document>(document);\n  const { lang } = useLocale();\n  const { target, setQuery, closeQuery } = useLiveRatesQuery();\n\n  const [records, setRecords] = useState<DataRecord[]>(\n    new Array(recordsPerPage).fill({})\n  );\n\n  const assetClasses = paramsAssetClasses?.map((assetClass) =>\n    assetClass.toUpperCase()\n  );\n\n  const [totalRecords, setTotalRecords] = useState<number>(0);\n\n  const [queryVariables, setQueryVariables] = useState<{\n    division: Division;\n    count: number;\n    searchPattern: string;\n    offset: number;\n    assetClass: string[];\n    instruments: string[];\n    dataSource?: InstrumentDataSource;\n  }>({\n    division,\n    count: recordsPerPage,\n    searchPattern: '',\n    offset: 0,\n    assetClass: assetClasses || [],\n    instruments,\n    dataSource,\n  });\n\n  const pageNumber = Math.floor(queryVariables.offset / recordsPerPage);\n\n  const { data, error, loading } = useQuery<\n    ResolveInstrumentsWithFiltersQuery,\n    ResolveInstrumentsWithFiltersQueryVariables\n  >(resolveInstrumentsWithFilters, {\n    variables: queryVariables,\n    fetchPolicy: 'network-only',\n    errorPolicy: 'all',\n  });\n\n  useEffect(() => {\n    if (loading) {\n      setRecords(new Array(recordsPerPage).fill({}));\n    }\n    if (!loading && data?.resolveInstrumentsWithFilters?.instruments) {\n      const newRecords = data.resolveInstrumentsWithFilters.instruments.map(\n        (record) => ({\n          instrument: record?.name || '',\n          displayName: record?.displayName || '',\n        })\n      );\n      setRecords(newRecords);\n      setTotalRecords(data.resolveInstrumentsWithFilters.totalCount);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [loading, data]);\n\n  useEffect(() => {\n    const instrumentsNames = records.map(({ instrument }) => instrument);\n    if (instrumentsNames[0]) {\n      setQuery({ instruments: instrumentsNames });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [records]);\n\n  const showError = (!loading && !!error) || (!loading && !data);\n\n  const onVisibilityChange = () => {\n    if (documentRef.current.visibilityState === 'hidden') {\n      closeQuery();\n    }\n    if (documentRef.current.visibilityState === 'visible') {\n      const instrumentsNames = records.map(({ instrument }) => instrument);\n      if (instrumentsNames[0]) {\n        setQuery({ instruments: instrumentsNames });\n      }\n    }\n  };\n\n  useEventListener('visibilitychange', onVisibilityChange, documentRef);\n\n  return (\n    <>\n      <TableWidget\n        PaginationComponent={\n          records.length > 0 ? (\n            <Pagination\n              currentPage={pageNumber}\n              disabled={loading}\n              recordsPerPage={recordsPerPage}\n              totalRecords={totalRecords}\n              onPageChange={(numb) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: numb * recordsPerPage,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        TabsComponent={\n          isInstrumentSearchEnabled || isAssetClassFilterEnabled ? (\n            <Filters\n              assetClassOptions={[\n                {\n                  id: 'ALL',\n                  label: lang('all'),\n                },\n                ...(assetClasses || []).map((assetClass) => ({\n                  id: assetClass,\n                  label: lang(assetClassLabels[assetClass]),\n                })),\n              ]}\n              isAssetClassFilterEnabled={isAssetClassFilterEnabled}\n              isInstrumentSearchEnabled={isInstrumentSearchEnabled}\n              onAssetClassChange={(assetClass) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern: '',\n                  assetClass:\n                    assetClass[0] === 'ALL' ? assetClasses || [] : assetClass,\n                }));\n              }}\n              onSearchChange={(searchPattern) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        activeColumns={columns}\n        count={totalRecords}\n        hasError={showError}\n        headerColumns={getHeaderConfig(columns)}\n        isLoading={loading}\n        pageNumber={pageNumber}\n        records={records}\n        target={target}\n        testId=\"instruments-table-wrapper\"\n        toolTipId={INSTRUMENT_TOOLTIP_ID}\n        viewType=\"table\"\n      />\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}

package/dist/main/InstrumentsTableWidget/components/Filters/Filters.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Filters = void 0;
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
+var _monoI18n = require("@oanda/mono-i18n");
 var _react = _interopRequireWildcard(require("react"));
 var _usehooksTs = require("usehooks-ts");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -17,6 +18,9 @@ const Filters = _ref => {
     isAssetClassFilterEnabled,
     isInstrumentSearchEnabled
   } = _ref;
+  const {
+    lang
+  } = (0, _monoI18n.useLocale)();
   const {
     size
   } = (0, _labsWidgetCommon.useLayoutProvider)();
@@ -47,7 +51,7 @@ const Filters = _ref => {
     })
   }, _react.default.createElement(_labsWidgetCommon.Select, {
     options: assetClassOptions,
-    selectLabel: "Asset class",
+    selectLabel: lang('asset_class'),
     selectedOption: assetClassOptions.find(opt => opt.id === assetClass[0]) || assetClassOptions[0],
     setSelectedOption: option => {
       setAssetClass([option.id]);
@@ -61,8 +65,8 @@ const Filters = _ref => {
       'lw-w-[280px]': isDesktop
     })
   }, _react.default.createElement(_labsWidgetCommon.TextInput, {
-    label: "Search",
-    placeholder: "Instrument name",
+    label: lang('search'),
+    placeholder: lang('instrument_name'),
     value: searchInputValue,
     onChange: handleTextInputSearch
   })));

package/dist/main/InstrumentsTableWidget/components/Filters/Filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.js","names":["_labsWidgetCommon","require","_react","_interopRequireWildcard","_usehooksTs","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Filters","_ref","assetClassOptions","onSearchChange","onAssetClassChange","isAssetClassFilterEnabled","isInstrumentSearchEnabled","size","useLayoutProvider","isDesktop","Size","DESKTOP","assetClass","setAssetClass","useState","id","searchInputValue","setSearchInputValue","debounced","useDebounceCallback","val","handleTextInputSearch","value","length","createElement","className","cn","Select","options","selectLabel","selectedOption","find","opt","setSelectedOption","option","TextInput","label","placeholder","onChange","exports"],"sources":["../../../../../src/InstrumentsTableWidget/components/Filters/Filters.tsx"],"sourcesContent":["import {\n  cn,\n  Select,\n  Size,\n  TextInput,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport React, { useState } from 'react';\nimport { useDebounceCallback } from 'usehooks-ts';\n\nimport type { FiltersProps } from './types';\n\nexport const Filters = ({\n  assetClassOptions,\n  onSearchChange,\n  onAssetClassChange,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n}: FiltersProps) => {\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const [assetClass, setAssetClass] = useState([assetClassOptions[0].id]);\n  const [searchInputValue, setSearchInputValue] = useState('');\n\n  const debounced = useDebounceCallback((val: string) => {\n    onSearchChange(val);\n  }, 300);\n\n  const handleTextInputSearch = (value: string) => {\n    setSearchInputValue(value);\n    if (value.length >= 3) {\n      debounced(value);\n    }\n    if (value.length === 0) {\n      onSearchChange(value);\n    }\n  };\n\n  return (\n    <div\n      className={cn('lw-mb-4 lw-mt-2 lw-flex lw-w-full lw-gap-4', {\n        'lw-flex-col': !isDesktop,\n        'lw-flex-row': isDesktop,\n      })}\n    >\n      {isAssetClassFilterEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <Select\n            options={assetClassOptions}\n            selectLabel=\"Asset class\"\n            selectedOption={\n              assetClassOptions.find((opt) => opt.id === assetClass[0]) ||\n              assetClassOptions[0]\n            }\n            setSelectedOption={(option) => {\n              setAssetClass([option.id]);\n              onAssetClassChange([option.id]);\n              setSearchInputValue('');\n              onSearchChange('');\n            }}\n          />\n        </div>\n      )}\n      {isInstrumentSearchEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <TextInput\n            label=\"Search\"\n            placeholder=\"Instrument name\"\n            value={searchInputValue}\n            onChange={handleTextInputSearch}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Filters.js","names":["_labsWidgetCommon","require","_monoI18n","_react","_interopRequireWildcard","_usehooksTs","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Filters","_ref","assetClassOptions","onSearchChange","onAssetClassChange","isAssetClassFilterEnabled","isInstrumentSearchEnabled","lang","useLocale","size","useLayoutProvider","isDesktop","Size","DESKTOP","assetClass","setAssetClass","useState","id","searchInputValue","setSearchInputValue","debounced","useDebounceCallback","val","handleTextInputSearch","value","length","createElement","className","cn","Select","options","selectLabel","selectedOption","find","opt","setSelectedOption","option","TextInput","label","placeholder","onChange","exports"],"sources":["../../../../../src/InstrumentsTableWidget/components/Filters/Filters.tsx"],"sourcesContent":["import {\n  cn,\n  Select,\n  Size,\n  TextInput,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useState } from 'react';\nimport { useDebounceCallback } from 'usehooks-ts';\n\nimport type { FiltersProps } from './types';\n\nexport const Filters = ({\n  assetClassOptions,\n  onSearchChange,\n  onAssetClassChange,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n}: FiltersProps) => {\n  const { lang } = useLocale();\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const [assetClass, setAssetClass] = useState([assetClassOptions[0].id]);\n  const [searchInputValue, setSearchInputValue] = useState('');\n\n  const debounced = useDebounceCallback((val: string) => {\n    onSearchChange(val);\n  }, 300);\n\n  const handleTextInputSearch = (value: string) => {\n    setSearchInputValue(value);\n    if (value.length >= 3) {\n      debounced(value);\n    }\n    if (value.length === 0) {\n      onSearchChange(value);\n    }\n  };\n\n  return (\n    <div\n      className={cn('lw-mb-4 lw-mt-2 lw-flex lw-w-full lw-gap-4', {\n        'lw-flex-col': !isDesktop,\n        'lw-flex-row': isDesktop,\n      })}\n    >\n      {isAssetClassFilterEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <Select\n            options={assetClassOptions}\n            selectLabel={lang('asset_class')}\n            selectedOption={\n              assetClassOptions.find((opt) => opt.id === assetClass[0]) ||\n              assetClassOptions[0]\n            }\n            setSelectedOption={(option) => {\n              setAssetClass([option.id]);\n              onAssetClassChange([option.id]);\n              setSearchInputValue('');\n              onSearchChange('');\n            }}\n          />\n        </div>\n      )}\n      {isInstrumentSearchEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <TextInput\n            label={lang('search')}\n            placeholder={lang('instrument_name')}\n            value={searchInputValue}\n            onChange={handleTextInputSearch}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/main/InstrumentsTableWidget/config.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.headerConfig = exports.getHeaderConfig = void 0;
+exports.headerConfig = exports.getHeaderConfig = exports.assetClassLabels = void 0;
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
 const headerConfig = exports.headerConfig = {
   [_labsWidgetCommon.DataRecordType.INSTRUMENT]: {
@@ -27,14 +27,22 @@ const headerConfig = exports.headerConfig = {
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   },
   [_labsWidgetCommon.DataRecordType.HIGH]: {
-    displayName: 'high',
+    displayName: 'today_high',
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   },
   [_labsWidgetCommon.DataRecordType.LOW]: {
-    displayName: 'low',
+    displayName: 'today_low',
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   }
 };
+const assetClassLabels = exports.assetClassLabels = {
+  CURRENCY: 'currency',
+  COMMODITIES: 'commodity',
+  RATES: 'bond',
+  CRYPTOCURRENCY: 'crypto',
+  EQUITY_SHARES: 'share_sfds',
+  INDICES: 'index'
+};
 const getHeaderConfig = activeColumns => {
   const columns = [_labsWidgetCommon.DataRecordType.INSTRUMENT, ...activeColumns].filter(item => item !== _labsWidgetCommon.DataRecordType.SENTIMENT);
   return columns.map(item => headerConfig[item]);

package/dist/main/InstrumentsTableWidget/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","names":["_labsWidgetCommon","require","headerConfig","exports","DataRecordType","INSTRUMENT","displayName","additionalStyles","SELL","BUY","SPREAD","DAILY_CHANGE","HIGH","LOW","getHeaderConfig","activeColumns","columns","filter","item","SENTIMENT","map"],"sources":["../../../src/InstrumentsTableWidget/config.ts"],"sourcesContent":["import type { HeaderColumns } from '@oanda/labs-widget-common';\nimport { DataRecordType } from '@oanda/labs-widget-common';\n\ntype HeaderRecordType =\n  | DataRecordType.INSTRUMENT\n  | DataRecordType.SELL\n  | DataRecordType.BUY\n  | DataRecordType.DAILY_CHANGE\n  | DataRecordType.SPREAD\n  | DataRecordType.HIGH\n  | DataRecordType.LOW;\n\nconst headerConfig: Record<\n  HeaderRecordType,\n  { displayName: string; additionalStyles: string }\n> = {\n  [DataRecordType.INSTRUMENT]: {\n    displayName: 'instrument',\n    additionalStyles: 'lw-text-left lw-min-w-[130px]',\n  },\n  [DataRecordType.SELL]: {\n    displayName: 'sell',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.BUY]: {\n    displayName: 'buy',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.SPREAD]: {\n    displayName: 'spread',\n    additionalStyles: 'lw-text-right lw-min-w-[50px]',\n  },\n  [DataRecordType.DAILY_CHANGE]: {\n    displayName: 'daily_percent_change',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.HIGH]: {\n    displayName: 'high',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.LOW]: {\n    displayName: 'low',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n};\n\nconst getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {\n  const columns: HeaderRecordType[] = [\n    DataRecordType.INSTRUMENT,\n    ...activeColumns,\n  ].filter(\n    (item): item is HeaderRecordType => item !== DataRecordType.SENTIMENT\n  );\n\n  return columns.map((item) => headerConfig[item]);\n};\n\nexport { getHeaderConfig, headerConfig };\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,OAAA;AAWA,MAAMC,YAGL,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACF,CAACE,gCAAc,CAACC,UAAU,GAAG;IAC3BC,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACI,IAAI,GAAG;IACrBF,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACK,GAAG,GAAG;IACpBH,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACM,MAAM,GAAG;IACvBJ,WAAW,EAAE,QAAQ;IACrBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACO,YAAY,GAAG;IAC7BL,WAAW,EAAE,sBAAsB;IACnCC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACQ,IAAI,GAAG;IACrBN,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACS,GAAG,GAAG;IACpBP,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB;AACF,CAAC;AAED,MAAMO,eAAe,GAAIC,aAA+B,IAAsB;EAC5E,MAAMC,OAA2B,GAAG,CAClCZ,gCAAc,CAACC,UAAU,EACzB,GAAGU,aAAa,CACjB,CAACE,MAAM,CACLC,IAAI,IAA+BA,IAAI,KAAKd,gCAAc,CAACe,SAC9D,CAAC;EAED,OAAOH,OAAO,CAACI,GAAG,CAAEF,IAAI,IAAKhB,YAAY,CAACgB,IAAI,CAAC,CAAC;AAClD,CAAC;AAACf,OAAA,CAAAW,eAAA,GAAAA,eAAA","ignoreList":[]}
+{"version":3,"file":"config.js","names":["_labsWidgetCommon","require","headerConfig","exports","DataRecordType","INSTRUMENT","displayName","additionalStyles","SELL","BUY","SPREAD","DAILY_CHANGE","HIGH","LOW","assetClassLabels","CURRENCY","COMMODITIES","RATES","CRYPTOCURRENCY","EQUITY_SHARES","INDICES","getHeaderConfig","activeColumns","columns","filter","item","SENTIMENT","map"],"sources":["../../../src/InstrumentsTableWidget/config.ts"],"sourcesContent":["import type { HeaderColumns } from '@oanda/labs-widget-common';\nimport { DataRecordType } from '@oanda/labs-widget-common';\n\ntype HeaderRecordType =\n  | DataRecordType.INSTRUMENT\n  | DataRecordType.SELL\n  | DataRecordType.BUY\n  | DataRecordType.DAILY_CHANGE\n  | DataRecordType.SPREAD\n  | DataRecordType.HIGH\n  | DataRecordType.LOW;\n\nconst headerConfig: Record<\n  HeaderRecordType,\n  { displayName: string; additionalStyles: string }\n> = {\n  [DataRecordType.INSTRUMENT]: {\n    displayName: 'instrument',\n    additionalStyles: 'lw-text-left lw-min-w-[130px]',\n  },\n  [DataRecordType.SELL]: {\n    displayName: 'sell',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.BUY]: {\n    displayName: 'buy',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.SPREAD]: {\n    displayName: 'spread',\n    additionalStyles: 'lw-text-right lw-min-w-[50px]',\n  },\n  [DataRecordType.DAILY_CHANGE]: {\n    displayName: 'daily_percent_change',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.HIGH]: {\n    displayName: 'today_high',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.LOW]: {\n    displayName: 'today_low',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n};\n\nconst assetClassLabels: Record<string, string> = {\n  CURRENCY: 'currency',\n  COMMODITIES: 'commodity',\n  RATES: 'bond',\n  CRYPTOCURRENCY: 'crypto',\n  EQUITY_SHARES: 'share_sfds',\n  INDICES: 'index',\n};\n\nconst getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {\n  const columns: HeaderRecordType[] = [\n    DataRecordType.INSTRUMENT,\n    ...activeColumns,\n  ].filter(\n    (item): item is HeaderRecordType => item !== DataRecordType.SENTIMENT\n  );\n\n  return columns.map((item) => headerConfig[item]);\n};\n\nexport { assetClassLabels, getHeaderConfig, headerConfig };\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,OAAA;AAWA,MAAMC,YAGL,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACF,CAACE,gCAAc,CAACC,UAAU,GAAG;IAC3BC,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACI,IAAI,GAAG;IACrBF,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACK,GAAG,GAAG;IACpBH,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACM,MAAM,GAAG;IACvBJ,WAAW,EAAE,QAAQ;IACrBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACO,YAAY,GAAG;IAC7BL,WAAW,EAAE,sBAAsB;IACnCC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACQ,IAAI,GAAG;IACrBN,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACH,gCAAc,CAACS,GAAG,GAAG;IACpBP,WAAW,EAAE,WAAW;IACxBC,gBAAgB,EAAE;EACpB;AACF,CAAC;AAED,MAAMO,gBAAwC,GAAAX,OAAA,CAAAW,gBAAA,GAAG;EAC/CC,QAAQ,EAAE,UAAU;EACpBC,WAAW,EAAE,WAAW;EACxBC,KAAK,EAAE,MAAM;EACbC,cAAc,EAAE,QAAQ;EACxBC,aAAa,EAAE,YAAY;EAC3BC,OAAO,EAAE;AACX,CAAC;AAED,MAAMC,eAAe,GAAIC,aAA+B,IAAsB;EAC5E,MAAMC,OAA2B,GAAG,CAClCnB,gCAAc,CAACC,UAAU,EACzB,GAAGiB,aAAa,CACjB,CAACE,MAAM,CACLC,IAAI,IAA+BA,IAAI,KAAKrB,gCAAc,CAACsB,SAC9D,CAAC;EAED,OAAOH,OAAO,CAACI,GAAG,CAAEF,IAAI,IAAKvB,YAAY,CAACuB,IAAI,CAAC,CAAC;AAClD,CAAC;AAACtB,OAAA,CAAAkB,eAAA,GAAAA,eAAA","ignoreList":[]}

package/dist/main/translations/index.js

@@ -6,22 +6,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.translations = void 0;
 var _monoI18n = require("@oanda/mono-i18n");
 var _en = _interopRequireDefault(require("./sources/en.json"));
-var _es = _interopRequireDefault(require("./sources/es.json"));
-var _th = _interopRequireDefault(require("./sources/th.json"));
-var _zh_TW = _interopRequireDefault(require("./sources/zh_TW.json"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const translations = exports.translations = {
   [_monoI18n.Locale.en]: {
     translation: _en.default
-  },
-  [_monoI18n.Locale.zhTW]: {
-    translation: _zh_TW.default
-  },
-  [_monoI18n.Locale.es]: {
-    translation: _es.default
-  },
-  [_monoI18n.Locale.th]: {
-    translation: _th.default
   }
 };
 //# sourceMappingURL=index.js.map

package/dist/main/translations/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_monoI18n","require","_en","_interopRequireDefault","_es","_th","_zh_TW","e","__esModule","default","translations","exports","Locale","en","translation","zhTW","es","th"],"sources":["../../../src/translations/index.ts"],"sourcesContent":["import type { Translations } from '@oanda/mono-i18n';\nimport { Locale } from '@oanda/mono-i18n';\n\nimport en from './sources/en.json';\nimport es from './sources/es.json';\nimport th from './sources/th.json';\nimport zhTW from './sources/zh_TW.json';\nimport type { defaultTranslations } from './translations';\n\nexport type TranslationKey = keyof typeof defaultTranslations;\n\nexport const translations: Translations = {\n  [Locale.en]: { translation: en },\n  [Locale.zhTW]: { translation: zhTW },\n  [Locale.es]: { translation: es },\n  [Locale.th]: { translation: th },\n};\n"],"mappings":";;;;;;AACA,IAAAA,SAAA,GAAAC,OAAA;AAEA,IAAAC,GAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,GAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,GAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,MAAA,GAAAH,sBAAA,CAAAF,OAAA;AAAwC,SAAAE,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKjC,MAAMG,YAA0B,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACxC,CAACE,gBAAM,CAACC,EAAE,GAAG;IAAEC,WAAW,EAAED;EAAG,CAAC;EAChC,CAACD,gBAAM,CAACG,IAAI,GAAG;IAAED,WAAW,EAAEC;EAAK,CAAC;EACpC,CAACH,gBAAM,CAACI,EAAE,GAAG;IAAEF,WAAW,EAAEE;EAAG,CAAC;EAChC,CAACJ,gBAAM,CAACK,EAAE,GAAG;IAAEH,WAAW,EAAEG;EAAG;AACjC,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_monoI18n","require","_en","_interopRequireDefault","e","__esModule","default","translations","exports","Locale","en","translation"],"sources":["../../../src/translations/index.ts"],"sourcesContent":["import type { Translations } from '@oanda/mono-i18n';\nimport { Locale } from '@oanda/mono-i18n';\n\nimport en from './sources/en.json';\nimport type { defaultTranslations } from './translations';\n\nexport type TranslationKey = keyof typeof defaultTranslations;\n\nexport const translations: Translations = {\n  [Locale.en]: { translation: en },\n};\n"],"mappings":";;;;;;AACA,IAAAA,SAAA,GAAAC,OAAA;AAEA,IAAAC,GAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAmC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAK5B,MAAMG,YAA0B,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACxC,CAACE,gBAAM,CAACC,EAAE,GAAG;IAAEC,WAAW,EAAED;EAAG;AACjC,CAAC","ignoreList":[]}

package/dist/main/translations/sources/en.json

@@ -1,29 +1,22 @@
 {
-  "24h_chart": "24h Chart",
-  "bearish": "Bearish",
-  "bullish": "Bullish",
+  "all": "All",
+  "asset_class": "Asset class",
+  "bond": "Bond",
   "buy": "Buy",
-  "buy_orders": "Buy Orders",
-  "buy_price": "Buy Price",
-  "daily_change": "Daily Change",
+  "commodity": "Commodity",
+  "crypto": "Crypto",
+  "currency": "Currency",
   "daily_percent_change": "Daily % Change",
   "data_unavailable": "Data unavailable",
-  "high_volume": "High Volume",
-  "hot": "Hot",
+  "index": "Index",
   "instrument": "Instrument",
-  "last_updated": "Last updated",
-  "most_traded": "Most Traded",
-  "net_long": "Net-long",
-  "net_short": "Net-short",
+  "instrument_name": "Instrument name",
+  "no_matching_results": "No matching results",
   "pagination_entries_range": "{{firstItemOnPage}}-{{lastItemOnPage}} of {{itemCount}} entries",
-  "popular": "Popular",
+  "search": "Search",
   "sell": "Sell",
-  "sell_price": "Sell Price",
-  "sentiment": "Sentiment",
+  "share_sfds": "Share CFDs",
   "spread": "Spread",
-  "today": "Today",
-  "volatile": "Volatile",
-  "low": "Low",
-  "high": "High",
-  "margin": "Margin"
+  "today_high": "Today High",
+  "today_low": "Today Low"
 }

package/dist/module/InstrumentsTableWidget/Main.js

@@ -1,10 +1,11 @@
 import { useQuery } from '@apollo/client';
 import { Pagination, TableWidget, useLiveRatesQuery } from '@oanda/labs-widget-common';
+import { useLocale } from '@oanda/mono-i18n';
 import React, { useEffect, useRef, useState } from 'react';
 import { useEventListener } from 'usehooks-ts';
 import { resolveInstrumentsWithFilters } from '../gql/resolveInstrumentsWithFilters';
 import { Filters } from './components';
-import { getHeaderConfig } from './config';
+import { assetClassLabels, getHeaderConfig } from './config';
 import { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';
 const Main = _ref => {
   let {
@@ -18,6 +19,9 @@ const Main = _ref => {
     dataSource
   } = _ref;
   const documentRef = useRef(document);
+  const {
+    lang
+  } = useLocale();
   const {
     target,
     setQuery,
@@ -92,7 +96,7 @@ const Main = _ref => {
   };
   useEventListener('visibilitychange', onVisibilityChange, documentRef);
   return React.createElement(React.Fragment, null, React.createElement(TableWidget, {
-    PaginationComponent: React.createElement(Pagination, {
+    PaginationComponent: records.length > 0 ? React.createElement(Pagination, {
       currentPage: pageNumber,
       disabled: loading,
       recordsPerPage: recordsPerPage,
@@ -103,14 +107,14 @@ const Main = _ref => {
           offset: numb * recordsPerPage
         }));
       }
-    }),
+    }) : React.createElement(React.Fragment, null),
     TabsComponent: isInstrumentSearchEnabled || isAssetClassFilterEnabled ? React.createElement(Filters, {
       assetClassOptions: [{
         id: 'ALL',
-        label: 'All'
+        label: lang('all')
       }, ...(assetClasses || []).map(assetClass => ({
         id: assetClass,
-        label: assetClass.charAt(0) + assetClass.slice(1).toLowerCase()
+        label: lang(assetClassLabels[assetClass])
       }))],
       isAssetClassFilterEnabled: isAssetClassFilterEnabled,
       isInstrumentSearchEnabled: isInstrumentSearchEnabled,

package/dist/module/InstrumentsTableWidget/Main.js.map

@@ -1 +1 @@
-{"version":3,"file":"Main.js","names":["useQuery","Pagination","TableWidget","useLiveRatesQuery","React","useEffect","useRef","useState","useEventListener","resolveInstrumentsWithFilters","Filters","getHeaderConfig","DEFAULT_COLUMNS","INSTRUMENT_TOOLTIP_ID","Main","_ref","instruments","division","assetClasses","paramsAssetClasses","columns","isAssetClassFilterEnabled","isInstrumentSearchEnabled","recordsPerPage","dataSource","documentRef","document","target","setQuery","closeQuery","records","setRecords","Array","fill","map","assetClass","toUpperCase","totalRecords","setTotalRecords","queryVariables","setQueryVariables","count","searchPattern","offset","pageNumber","Math","floor","data","error","loading","variables","fetchPolicy","errorPolicy","newRecords","record","instrument","name","displayName","totalCount","instrumentsNames","_ref2","showError","onVisibilityChange","current","visibilityState","_ref3","createElement","Fragment","PaginationComponent","currentPage","disabled","onPageChange","numb","prev","TabsComponent","assetClassOptions","id","label","charAt","slice","toLowerCase","onAssetClassChange","onSearchChange","activeColumns","hasError","headerColumns","isLoading","testId","toolTipId","viewType"],"sources":["../../../src/InstrumentsTableWidget/Main.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport type { DataRecord } from '@oanda/labs-widget-common';\nimport {\n  Pagination,\n  TableWidget,\n  useLiveRatesQuery,\n} from '@oanda/labs-widget-common';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useEventListener } from 'usehooks-ts';\n\nimport { resolveInstrumentsWithFilters } from '../gql/resolveInstrumentsWithFilters';\nimport type { Division, InstrumentDataSource } from '../gql/types/graphql';\nimport {\n  type ResolveInstrumentsWithFiltersQuery,\n  type ResolveInstrumentsWithFiltersQueryVariables,\n} from '../gql/types/graphql';\nimport { Filters } from './components';\nimport { getHeaderConfig } from './config';\nimport { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';\nimport type { MainProps } from './types';\n\nconst Main = ({\n  instruments = [],\n  division,\n  assetClasses: paramsAssetClasses,\n  columns = DEFAULT_COLUMNS,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n  recordsPerPage = 10,\n  dataSource,\n}: MainProps) => {\n  const documentRef = useRef<Document>(document);\n  const { target, setQuery, closeQuery } = useLiveRatesQuery();\n\n  const [records, setRecords] = useState<DataRecord[]>(\n    new Array(recordsPerPage).fill({})\n  );\n\n  const assetClasses = paramsAssetClasses?.map((assetClass) =>\n    assetClass.toUpperCase()\n  );\n\n  const [totalRecords, setTotalRecords] = useState<number>(0);\n\n  const [queryVariables, setQueryVariables] = useState<{\n    division: Division;\n    count: number;\n    searchPattern: string;\n    offset: number;\n    assetClass: string[];\n    instruments: string[];\n    dataSource?: InstrumentDataSource;\n  }>({\n    division,\n    count: recordsPerPage,\n    searchPattern: '',\n    offset: 0,\n    assetClass: assetClasses || [],\n    instruments,\n    dataSource,\n  });\n\n  const pageNumber = Math.floor(queryVariables.offset / recordsPerPage);\n\n  const { data, error, loading } = useQuery<\n    ResolveInstrumentsWithFiltersQuery,\n    ResolveInstrumentsWithFiltersQueryVariables\n  >(resolveInstrumentsWithFilters, {\n    variables: queryVariables,\n    fetchPolicy: 'network-only',\n    errorPolicy: 'all',\n  });\n\n  useEffect(() => {\n    if (loading) {\n      setRecords(new Array(recordsPerPage).fill({}));\n    }\n    if (!loading && data?.resolveInstrumentsWithFilters?.instruments) {\n      const newRecords = data.resolveInstrumentsWithFilters.instruments.map(\n        (record) => ({\n          instrument: record?.name || '',\n          displayName: record?.displayName || '',\n        })\n      );\n      setRecords(newRecords);\n      setTotalRecords(data.resolveInstrumentsWithFilters.totalCount);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [loading, data]);\n\n  useEffect(() => {\n    const instrumentsNames = records.map(({ instrument }) => instrument);\n    if (instrumentsNames[0]) {\n      setQuery({ instruments: instrumentsNames });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [records]);\n\n  const showError = (!loading && !!error) || (!loading && !data);\n\n  const onVisibilityChange = () => {\n    if (documentRef.current.visibilityState === 'hidden') {\n      closeQuery();\n    }\n    if (documentRef.current.visibilityState === 'visible') {\n      const instrumentsNames = records.map(({ instrument }) => instrument);\n      if (instrumentsNames[0]) {\n        setQuery({ instruments: instrumentsNames });\n      }\n    }\n  };\n\n  useEventListener('visibilitychange', onVisibilityChange, documentRef);\n\n  return (\n    <>\n      <TableWidget\n        PaginationComponent={\n          <Pagination\n            currentPage={pageNumber}\n            disabled={loading}\n            recordsPerPage={recordsPerPage}\n            totalRecords={totalRecords}\n            onPageChange={(numb) => {\n              setQueryVariables((prev) => ({\n                ...prev,\n                offset: numb * recordsPerPage,\n              }));\n            }}\n          />\n        }\n        TabsComponent={\n          isInstrumentSearchEnabled || isAssetClassFilterEnabled ? (\n            <Filters\n              assetClassOptions={[\n                {\n                  id: 'ALL',\n                  label: 'All',\n                },\n                ...(assetClasses || []).map((assetClass) => ({\n                  id: assetClass,\n                  label:\n                    assetClass.charAt(0) + assetClass.slice(1).toLowerCase(),\n                })),\n              ]}\n              isAssetClassFilterEnabled={isAssetClassFilterEnabled}\n              isInstrumentSearchEnabled={isInstrumentSearchEnabled}\n              onAssetClassChange={(assetClass) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern: '',\n                  assetClass:\n                    assetClass[0] === 'ALL' ? assetClasses || [] : assetClass,\n                }));\n              }}\n              onSearchChange={(searchPattern) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        activeColumns={columns}\n        count={totalRecords}\n        hasError={showError}\n        headerColumns={getHeaderConfig(columns)}\n        isLoading={loading}\n        pageNumber={pageNumber}\n        records={records}\n        target={target}\n        testId=\"instruments-table-wrapper\"\n        toolTipId={INSTRUMENT_TOOLTIP_ID}\n        viewType=\"table\"\n      />\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Main.js","names":["useQuery","Pagination","TableWidget","useLiveRatesQuery","useLocale","React","useEffect","useRef","useState","useEventListener","resolveInstrumentsWithFilters","Filters","assetClassLabels","getHeaderConfig","DEFAULT_COLUMNS","INSTRUMENT_TOOLTIP_ID","Main","_ref","instruments","division","assetClasses","paramsAssetClasses","columns","isAssetClassFilterEnabled","isInstrumentSearchEnabled","recordsPerPage","dataSource","documentRef","document","lang","target","setQuery","closeQuery","records","setRecords","Array","fill","map","assetClass","toUpperCase","totalRecords","setTotalRecords","queryVariables","setQueryVariables","count","searchPattern","offset","pageNumber","Math","floor","data","error","loading","variables","fetchPolicy","errorPolicy","newRecords","record","instrument","name","displayName","totalCount","instrumentsNames","_ref2","showError","onVisibilityChange","current","visibilityState","_ref3","createElement","Fragment","PaginationComponent","length","currentPage","disabled","onPageChange","numb","prev","TabsComponent","assetClassOptions","id","label","onAssetClassChange","onSearchChange","activeColumns","hasError","headerColumns","isLoading","testId","toolTipId","viewType"],"sources":["../../../src/InstrumentsTableWidget/Main.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport type { DataRecord } from '@oanda/labs-widget-common';\nimport {\n  Pagination,\n  TableWidget,\n  useLiveRatesQuery,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useEventListener } from 'usehooks-ts';\n\nimport { resolveInstrumentsWithFilters } from '../gql/resolveInstrumentsWithFilters';\nimport type { Division, InstrumentDataSource } from '../gql/types/graphql';\nimport {\n  type ResolveInstrumentsWithFiltersQuery,\n  type ResolveInstrumentsWithFiltersQueryVariables,\n} from '../gql/types/graphql';\nimport { Filters } from './components';\nimport { assetClassLabels, getHeaderConfig } from './config';\nimport { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';\nimport type { MainProps } from './types';\n\nconst Main = ({\n  instruments = [],\n  division,\n  assetClasses: paramsAssetClasses,\n  columns = DEFAULT_COLUMNS,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n  recordsPerPage = 10,\n  dataSource,\n}: MainProps) => {\n  const documentRef = useRef<Document>(document);\n  const { lang } = useLocale();\n  const { target, setQuery, closeQuery } = useLiveRatesQuery();\n\n  const [records, setRecords] = useState<DataRecord[]>(\n    new Array(recordsPerPage).fill({})\n  );\n\n  const assetClasses = paramsAssetClasses?.map((assetClass) =>\n    assetClass.toUpperCase()\n  );\n\n  const [totalRecords, setTotalRecords] = useState<number>(0);\n\n  const [queryVariables, setQueryVariables] = useState<{\n    division: Division;\n    count: number;\n    searchPattern: string;\n    offset: number;\n    assetClass: string[];\n    instruments: string[];\n    dataSource?: InstrumentDataSource;\n  }>({\n    division,\n    count: recordsPerPage,\n    searchPattern: '',\n    offset: 0,\n    assetClass: assetClasses || [],\n    instruments,\n    dataSource,\n  });\n\n  const pageNumber = Math.floor(queryVariables.offset / recordsPerPage);\n\n  const { data, error, loading } = useQuery<\n    ResolveInstrumentsWithFiltersQuery,\n    ResolveInstrumentsWithFiltersQueryVariables\n  >(resolveInstrumentsWithFilters, {\n    variables: queryVariables,\n    fetchPolicy: 'network-only',\n    errorPolicy: 'all',\n  });\n\n  useEffect(() => {\n    if (loading) {\n      setRecords(new Array(recordsPerPage).fill({}));\n    }\n    if (!loading && data?.resolveInstrumentsWithFilters?.instruments) {\n      const newRecords = data.resolveInstrumentsWithFilters.instruments.map(\n        (record) => ({\n          instrument: record?.name || '',\n          displayName: record?.displayName || '',\n        })\n      );\n      setRecords(newRecords);\n      setTotalRecords(data.resolveInstrumentsWithFilters.totalCount);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [loading, data]);\n\n  useEffect(() => {\n    const instrumentsNames = records.map(({ instrument }) => instrument);\n    if (instrumentsNames[0]) {\n      setQuery({ instruments: instrumentsNames });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [records]);\n\n  const showError = (!loading && !!error) || (!loading && !data);\n\n  const onVisibilityChange = () => {\n    if (documentRef.current.visibilityState === 'hidden') {\n      closeQuery();\n    }\n    if (documentRef.current.visibilityState === 'visible') {\n      const instrumentsNames = records.map(({ instrument }) => instrument);\n      if (instrumentsNames[0]) {\n        setQuery({ instruments: instrumentsNames });\n      }\n    }\n  };\n\n  useEventListener('visibilitychange', onVisibilityChange, documentRef);\n\n  return (\n    <>\n      <TableWidget\n        PaginationComponent={\n          records.length > 0 ? (\n            <Pagination\n              currentPage={pageNumber}\n              disabled={loading}\n              recordsPerPage={recordsPerPage}\n              totalRecords={totalRecords}\n              onPageChange={(numb) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: numb * recordsPerPage,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        TabsComponent={\n          isInstrumentSearchEnabled || isAssetClassFilterEnabled ? (\n            <Filters\n              assetClassOptions={[\n                {\n                  id: 'ALL',\n                  label: lang('all'),\n                },\n                ...(assetClasses || []).map((assetClass) => ({\n                  id: assetClass,\n                  label: lang(assetClassLabels[assetClass]),\n                })),\n              ]}\n              isAssetClassFilterEnabled={isAssetClassFilterEnabled}\n              isInstrumentSearchEnabled={isInstrumentSearchEnabled}\n              onAssetClassChange={(assetClass) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern: '',\n                  assetClass:\n                    assetClass[0] === 'ALL' ? assetClasses || [] : assetClass,\n                }));\n              }}\n              onSearchChange={(searchPattern) => {\n                setQueryVariables((prev) => ({\n                  ...prev,\n                  offset: 0,\n                  searchPattern,\n                }));\n              }}\n            />\n          ) : (\n            <></>\n          )\n        }\n        activeColumns={columns}\n        count={totalRecords}\n        hasError={showError}\n        headerColumns={getHeaderConfig(columns)}\n        isLoading={loading}\n        pageNumber={pageNumber}\n        records={records}\n        target={target}\n        testId=\"instruments-table-wrapper\"\n        toolTipId={INSTRUMENT_TOOLTIP_ID}\n        viewType=\"table\"\n      />\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}

package/dist/module/InstrumentsTableWidget/components/Filters/Filters.js

@@ -1,4 +1,5 @@
 import { cn, Select, Size, TextInput, useLayoutProvider } from '@oanda/labs-widget-common';
+import { useLocale } from '@oanda/mono-i18n';
 import React, { useState } from 'react';
 import { useDebounceCallback } from 'usehooks-ts';
 export const Filters = _ref => {
@@ -9,6 +10,9 @@ export const Filters = _ref => {
     isAssetClassFilterEnabled,
     isInstrumentSearchEnabled
   } = _ref;
+  const {
+    lang
+  } = useLocale();
   const {
     size
   } = useLayoutProvider();
@@ -39,7 +43,7 @@ export const Filters = _ref => {
     })
   }, React.createElement(Select, {
     options: assetClassOptions,
-    selectLabel: "Asset class",
+    selectLabel: lang('asset_class'),
     selectedOption: assetClassOptions.find(opt => opt.id === assetClass[0]) || assetClassOptions[0],
     setSelectedOption: option => {
       setAssetClass([option.id]);
@@ -53,8 +57,8 @@ export const Filters = _ref => {
       'lw-w-[280px]': isDesktop
     })
   }, React.createElement(TextInput, {
-    label: "Search",
-    placeholder: "Instrument name",
+    label: lang('search'),
+    placeholder: lang('instrument_name'),
     value: searchInputValue,
     onChange: handleTextInputSearch
   })));

package/dist/module/InstrumentsTableWidget/components/Filters/Filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.js","names":["cn","Select","Size","TextInput","useLayoutProvider","React","useState","useDebounceCallback","Filters","_ref","assetClassOptions","onSearchChange","onAssetClassChange","isAssetClassFilterEnabled","isInstrumentSearchEnabled","size","isDesktop","DESKTOP","assetClass","setAssetClass","id","searchInputValue","setSearchInputValue","debounced","val","handleTextInputSearch","value","length","createElement","className","options","selectLabel","selectedOption","find","opt","setSelectedOption","option","label","placeholder","onChange"],"sources":["../../../../../src/InstrumentsTableWidget/components/Filters/Filters.tsx"],"sourcesContent":["import {\n  cn,\n  Select,\n  Size,\n  TextInput,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport React, { useState } from 'react';\nimport { useDebounceCallback } from 'usehooks-ts';\n\nimport type { FiltersProps } from './types';\n\nexport const Filters = ({\n  assetClassOptions,\n  onSearchChange,\n  onAssetClassChange,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n}: FiltersProps) => {\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const [assetClass, setAssetClass] = useState([assetClassOptions[0].id]);\n  const [searchInputValue, setSearchInputValue] = useState('');\n\n  const debounced = useDebounceCallback((val: string) => {\n    onSearchChange(val);\n  }, 300);\n\n  const handleTextInputSearch = (value: string) => {\n    setSearchInputValue(value);\n    if (value.length >= 3) {\n      debounced(value);\n    }\n    if (value.length === 0) {\n      onSearchChange(value);\n    }\n  };\n\n  return (\n    <div\n      className={cn('lw-mb-4 lw-mt-2 lw-flex lw-w-full lw-gap-4', {\n        'lw-flex-col': !isDesktop,\n        'lw-flex-row': isDesktop,\n      })}\n    >\n      {isAssetClassFilterEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <Select\n            options={assetClassOptions}\n            selectLabel=\"Asset class\"\n            selectedOption={\n              assetClassOptions.find((opt) => opt.id === assetClass[0]) ||\n              assetClassOptions[0]\n            }\n            setSelectedOption={(option) => {\n              setAssetClass([option.id]);\n              onAssetClassChange([option.id]);\n              setSearchInputValue('');\n              onSearchChange('');\n            }}\n          />\n        </div>\n      )}\n      {isInstrumentSearchEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <TextInput\n            label=\"Search\"\n            placeholder=\"Instrument name\"\n            value={searchInputValue}\n            onChange={handleTextInputSearch}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"AAAA,SACEA,EAAE,EACFC,MAAM,EACNC,IAAI,EACJC,SAAS,EACTC,iBAAiB,QACZ,2BAA2B;AAClC,OAAOC,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,mBAAmB,QAAQ,aAAa;AAIjD,OAAO,MAAMC,OAAO,GAAGC,IAAA,IAMH;EAAA,IANI;IACtBC,iBAAiB;IACjBC,cAAc;IACdC,kBAAkB;IAClBC,yBAAyB;IACzBC;EACY,CAAC,GAAAL,IAAA;EACb,MAAM;IAAEM;EAAK,CAAC,GAAGX,iBAAiB,CAAC,CAAC;EACpC,MAAMY,SAAS,GAAGD,IAAI,KAAKb,IAAI,CAACe,OAAO;EAEvC,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGb,QAAQ,CAAC,CAACI,iBAAiB,CAAC,CAAC,CAAC,CAACU,EAAE,CAAC,CAAC;EACvE,MAAM,CAACC,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGhB,QAAQ,CAAC,EAAE,CAAC;EAE5D,MAAMiB,SAAS,GAAGhB,mBAAmB,CAAEiB,GAAW,IAAK;IACrDb,cAAc,CAACa,GAAG,CAAC;EACrB,CAAC,EAAE,GAAG,CAAC;EAEP,MAAMC,qBAAqB,GAAIC,KAAa,IAAK;IAC/CJ,mBAAmB,CAACI,KAAK,CAAC;IAC1B,IAAIA,KAAK,CAACC,MAAM,IAAI,CAAC,EAAE;MACrBJ,SAAS,CAACG,KAAK,CAAC;IAClB;IACA,IAAIA,KAAK,CAACC,MAAM,KAAK,CAAC,EAAE;MACtBhB,cAAc,CAACe,KAAK,CAAC;IACvB;EACF,CAAC;EAED,OACErB,KAAA,CAAAuB,aAAA;IACEC,SAAS,EAAE7B,EAAE,CAAC,4CAA4C,EAAE;MAC1D,aAAa,EAAE,CAACgB,SAAS;MACzB,aAAa,EAAEA;IACjB,CAAC;EAAE,GAEFH,yBAAyB,IACxBR,KAAA,CAAAuB,aAAA;IACEC,SAAS,EAAE7B,EAAE,CAAC;MACZ,WAAW,EAAE,CAACgB,SAAS;MACvB,cAAc,EAAEA;IAClB,CAAC;EAAE,GAEHX,KAAA,CAAAuB,aAAA,CAAC3B,MAAM;IACL6B,OAAO,EAAEpB,iBAAkB;IAC3BqB,WAAW,EAAC,aAAa;IACzBC,cAAc,EACZtB,iBAAiB,CAACuB,IAAI,CAAEC,GAAG,IAAKA,GAAG,CAACd,EAAE,KAAKF,UAAU,CAAC,CAAC,CAAC,CAAC,IACzDR,iBAAiB,CAAC,CAAC,CACpB;IACDyB,iBAAiB,EAAGC,MAAM,IAAK;MAC7BjB,aAAa,CAAC,CAACiB,MAAM,CAAChB,EAAE,CAAC,CAAC;MAC1BR,kBAAkB,CAAC,CAACwB,MAAM,CAAChB,EAAE,CAAC,CAAC;MAC/BE,mBAAmB,CAAC,EAAE,CAAC;MACvBX,cAAc,CAAC,EAAE,CAAC;IACpB;EAAE,CACH,CACE,CACN,EACAG,yBAAyB,IACxBT,KAAA,CAAAuB,aAAA;IACEC,SAAS,EAAE7B,EAAE,CAAC;MACZ,WAAW,EAAE,CAACgB,SAAS;MACvB,cAAc,EAAEA;IAClB,CAAC;EAAE,GAEHX,KAAA,CAAAuB,aAAA,CAACzB,SAAS;IACRkC,KAAK,EAAC,QAAQ;IACdC,WAAW,EAAC,iBAAiB;IAC7BZ,KAAK,EAAEL,gBAAiB;IACxBkB,QAAQ,EAAEd;EAAsB,CACjC,CACE,CAEJ,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"file":"Filters.js","names":["cn","Select","Size","TextInput","useLayoutProvider","useLocale","React","useState","useDebounceCallback","Filters","_ref","assetClassOptions","onSearchChange","onAssetClassChange","isAssetClassFilterEnabled","isInstrumentSearchEnabled","lang","size","isDesktop","DESKTOP","assetClass","setAssetClass","id","searchInputValue","setSearchInputValue","debounced","val","handleTextInputSearch","value","length","createElement","className","options","selectLabel","selectedOption","find","opt","setSelectedOption","option","label","placeholder","onChange"],"sources":["../../../../../src/InstrumentsTableWidget/components/Filters/Filters.tsx"],"sourcesContent":["import {\n  cn,\n  Select,\n  Size,\n  TextInput,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useState } from 'react';\nimport { useDebounceCallback } from 'usehooks-ts';\n\nimport type { FiltersProps } from './types';\n\nexport const Filters = ({\n  assetClassOptions,\n  onSearchChange,\n  onAssetClassChange,\n  isAssetClassFilterEnabled,\n  isInstrumentSearchEnabled,\n}: FiltersProps) => {\n  const { lang } = useLocale();\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const [assetClass, setAssetClass] = useState([assetClassOptions[0].id]);\n  const [searchInputValue, setSearchInputValue] = useState('');\n\n  const debounced = useDebounceCallback((val: string) => {\n    onSearchChange(val);\n  }, 300);\n\n  const handleTextInputSearch = (value: string) => {\n    setSearchInputValue(value);\n    if (value.length >= 3) {\n      debounced(value);\n    }\n    if (value.length === 0) {\n      onSearchChange(value);\n    }\n  };\n\n  return (\n    <div\n      className={cn('lw-mb-4 lw-mt-2 lw-flex lw-w-full lw-gap-4', {\n        'lw-flex-col': !isDesktop,\n        'lw-flex-row': isDesktop,\n      })}\n    >\n      {isAssetClassFilterEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <Select\n            options={assetClassOptions}\n            selectLabel={lang('asset_class')}\n            selectedOption={\n              assetClassOptions.find((opt) => opt.id === assetClass[0]) ||\n              assetClassOptions[0]\n            }\n            setSelectedOption={(option) => {\n              setAssetClass([option.id]);\n              onAssetClassChange([option.id]);\n              setSearchInputValue('');\n              onSearchChange('');\n            }}\n          />\n        </div>\n      )}\n      {isInstrumentSearchEnabled && (\n        <div\n          className={cn({\n            'lw-w-full': !isDesktop,\n            'lw-w-[280px]': isDesktop,\n          })}\n        >\n          <TextInput\n            label={lang('search')}\n            placeholder={lang('instrument_name')}\n            value={searchInputValue}\n            onChange={handleTextInputSearch}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n"],"mappings":"AAAA,SACEA,EAAE,EACFC,MAAM,EACNC,IAAI,EACJC,SAAS,EACTC,iBAAiB,QACZ,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,OAAOC,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,mBAAmB,QAAQ,aAAa;AAIjD,OAAO,MAAMC,OAAO,GAAGC,IAAA,IAMH;EAAA,IANI;IACtBC,iBAAiB;IACjBC,cAAc;IACdC,kBAAkB;IAClBC,yBAAyB;IACzBC;EACY,CAAC,GAAAL,IAAA;EACb,MAAM;IAAEM;EAAK,CAAC,GAAGX,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEY;EAAK,CAAC,GAAGb,iBAAiB,CAAC,CAAC;EACpC,MAAMc,SAAS,GAAGD,IAAI,KAAKf,IAAI,CAACiB,OAAO;EAEvC,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGd,QAAQ,CAAC,CAACI,iBAAiB,CAAC,CAAC,CAAC,CAACW,EAAE,CAAC,CAAC;EACvE,MAAM,CAACC,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGjB,QAAQ,CAAC,EAAE,CAAC;EAE5D,MAAMkB,SAAS,GAAGjB,mBAAmB,CAAEkB,GAAW,IAAK;IACrDd,cAAc,CAACc,GAAG,CAAC;EACrB,CAAC,EAAE,GAAG,CAAC;EAEP,MAAMC,qBAAqB,GAAIC,KAAa,IAAK;IAC/CJ,mBAAmB,CAACI,KAAK,CAAC;IAC1B,IAAIA,KAAK,CAACC,MAAM,IAAI,CAAC,EAAE;MACrBJ,SAAS,CAACG,KAAK,CAAC;IAClB;IACA,IAAIA,KAAK,CAACC,MAAM,KAAK,CAAC,EAAE;MACtBjB,cAAc,CAACgB,KAAK,CAAC;IACvB;EACF,CAAC;EAED,OACEtB,KAAA,CAAAwB,aAAA;IACEC,SAAS,EAAE/B,EAAE,CAAC,4CAA4C,EAAE;MAC1D,aAAa,EAAE,CAACkB,SAAS;MACzB,aAAa,EAAEA;IACjB,CAAC;EAAE,GAEFJ,yBAAyB,IACxBR,KAAA,CAAAwB,aAAA;IACEC,SAAS,EAAE/B,EAAE,CAAC;MACZ,WAAW,EAAE,CAACkB,SAAS;MACvB,cAAc,EAAEA;IAClB,CAAC;EAAE,GAEHZ,KAAA,CAAAwB,aAAA,CAAC7B,MAAM;IACL+B,OAAO,EAAErB,iBAAkB;IAC3BsB,WAAW,EAAEjB,IAAI,CAAC,aAAa,CAAE;IACjCkB,cAAc,EACZvB,iBAAiB,CAACwB,IAAI,CAAEC,GAAG,IAAKA,GAAG,CAACd,EAAE,KAAKF,UAAU,CAAC,CAAC,CAAC,CAAC,IACzDT,iBAAiB,CAAC,CAAC,CACpB;IACD0B,iBAAiB,EAAGC,MAAM,IAAK;MAC7BjB,aAAa,CAAC,CAACiB,MAAM,CAAChB,EAAE,CAAC,CAAC;MAC1BT,kBAAkB,CAAC,CAACyB,MAAM,CAAChB,EAAE,CAAC,CAAC;MAC/BE,mBAAmB,CAAC,EAAE,CAAC;MACvBZ,cAAc,CAAC,EAAE,CAAC;IACpB;EAAE,CACH,CACE,CACN,EACAG,yBAAyB,IACxBT,KAAA,CAAAwB,aAAA;IACEC,SAAS,EAAE/B,EAAE,CAAC;MACZ,WAAW,EAAE,CAACkB,SAAS;MACvB,cAAc,EAAEA;IAClB,CAAC;EAAE,GAEHZ,KAAA,CAAAwB,aAAA,CAAC3B,SAAS;IACRoC,KAAK,EAAEvB,IAAI,CAAC,QAAQ,CAAE;IACtBwB,WAAW,EAAExB,IAAI,CAAC,iBAAiB,CAAE;IACrCY,KAAK,EAAEL,gBAAiB;IACxBkB,QAAQ,EAAEd;EAAsB,CACjC,CACE,CAEJ,CAAC;AAEV,CAAC","ignoreList":[]}

package/dist/module/InstrumentsTableWidget/config.js

@@ -21,17 +21,25 @@ const headerConfig = {
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   },
   [DataRecordType.HIGH]: {
-    displayName: 'high',
+    displayName: 'today_high',
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   },
   [DataRecordType.LOW]: {
-    displayName: 'low',
+    displayName: 'today_low',
     additionalStyles: 'lw-text-right lw-min-w-[80px]'
   }
 };
+const assetClassLabels = {
+  CURRENCY: 'currency',
+  COMMODITIES: 'commodity',
+  RATES: 'bond',
+  CRYPTOCURRENCY: 'crypto',
+  EQUITY_SHARES: 'share_sfds',
+  INDICES: 'index'
+};
 const getHeaderConfig = activeColumns => {
   const columns = [DataRecordType.INSTRUMENT, ...activeColumns].filter(item => item !== DataRecordType.SENTIMENT);
   return columns.map(item => headerConfig[item]);
 };
-export { getHeaderConfig, headerConfig };
+export { assetClassLabels, getHeaderConfig, headerConfig };
 //# sourceMappingURL=config.js.map

package/dist/module/InstrumentsTableWidget/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","names":["DataRecordType","headerConfig","INSTRUMENT","displayName","additionalStyles","SELL","BUY","SPREAD","DAILY_CHANGE","HIGH","LOW","getHeaderConfig","activeColumns","columns","filter","item","SENTIMENT","map"],"sources":["../../../src/InstrumentsTableWidget/config.ts"],"sourcesContent":["import type { HeaderColumns } from '@oanda/labs-widget-common';\nimport { DataRecordType } from '@oanda/labs-widget-common';\n\ntype HeaderRecordType =\n  | DataRecordType.INSTRUMENT\n  | DataRecordType.SELL\n  | DataRecordType.BUY\n  | DataRecordType.DAILY_CHANGE\n  | DataRecordType.SPREAD\n  | DataRecordType.HIGH\n  | DataRecordType.LOW;\n\nconst headerConfig: Record<\n  HeaderRecordType,\n  { displayName: string; additionalStyles: string }\n> = {\n  [DataRecordType.INSTRUMENT]: {\n    displayName: 'instrument',\n    additionalStyles: 'lw-text-left lw-min-w-[130px]',\n  },\n  [DataRecordType.SELL]: {\n    displayName: 'sell',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.BUY]: {\n    displayName: 'buy',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.SPREAD]: {\n    displayName: 'spread',\n    additionalStyles: 'lw-text-right lw-min-w-[50px]',\n  },\n  [DataRecordType.DAILY_CHANGE]: {\n    displayName: 'daily_percent_change',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.HIGH]: {\n    displayName: 'high',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.LOW]: {\n    displayName: 'low',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n};\n\nconst getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {\n  const columns: HeaderRecordType[] = [\n    DataRecordType.INSTRUMENT,\n    ...activeColumns,\n  ].filter(\n    (item): item is HeaderRecordType => item !== DataRecordType.SENTIMENT\n  );\n\n  return columns.map((item) => headerConfig[item]);\n};\n\nexport { getHeaderConfig, headerConfig };\n"],"mappings":"AACA,SAASA,cAAc,QAAQ,2BAA2B;AAW1D,MAAMC,YAGL,GAAG;EACF,CAACD,cAAc,CAACE,UAAU,GAAG;IAC3BC,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACK,IAAI,GAAG;IACrBF,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACM,GAAG,GAAG;IACpBH,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACO,MAAM,GAAG;IACvBJ,WAAW,EAAE,QAAQ;IACrBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACQ,YAAY,GAAG;IAC7BL,WAAW,EAAE,sBAAsB;IACnCC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACS,IAAI,GAAG;IACrBN,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACU,GAAG,GAAG;IACpBP,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB;AACF,CAAC;AAED,MAAMO,eAAe,GAAIC,aAA+B,IAAsB;EAC5E,MAAMC,OAA2B,GAAG,CAClCb,cAAc,CAACE,UAAU,EACzB,GAAGU,aAAa,CACjB,CAACE,MAAM,CACLC,IAAI,IAA+BA,IAAI,KAAKf,cAAc,CAACgB,SAC9D,CAAC;EAED,OAAOH,OAAO,CAACI,GAAG,CAAEF,IAAI,IAAKd,YAAY,CAACc,IAAI,CAAC,CAAC;AAClD,CAAC;AAED,SAASJ,eAAe,EAAEV,YAAY","ignoreList":[]}
+{"version":3,"file":"config.js","names":["DataRecordType","headerConfig","INSTRUMENT","displayName","additionalStyles","SELL","BUY","SPREAD","DAILY_CHANGE","HIGH","LOW","assetClassLabels","CURRENCY","COMMODITIES","RATES","CRYPTOCURRENCY","EQUITY_SHARES","INDICES","getHeaderConfig","activeColumns","columns","filter","item","SENTIMENT","map"],"sources":["../../../src/InstrumentsTableWidget/config.ts"],"sourcesContent":["import type { HeaderColumns } from '@oanda/labs-widget-common';\nimport { DataRecordType } from '@oanda/labs-widget-common';\n\ntype HeaderRecordType =\n  | DataRecordType.INSTRUMENT\n  | DataRecordType.SELL\n  | DataRecordType.BUY\n  | DataRecordType.DAILY_CHANGE\n  | DataRecordType.SPREAD\n  | DataRecordType.HIGH\n  | DataRecordType.LOW;\n\nconst headerConfig: Record<\n  HeaderRecordType,\n  { displayName: string; additionalStyles: string }\n> = {\n  [DataRecordType.INSTRUMENT]: {\n    displayName: 'instrument',\n    additionalStyles: 'lw-text-left lw-min-w-[130px]',\n  },\n  [DataRecordType.SELL]: {\n    displayName: 'sell',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.BUY]: {\n    displayName: 'buy',\n    additionalStyles: 'lw-text-right lw-min-w-[75px] lw-pr-4',\n  },\n  [DataRecordType.SPREAD]: {\n    displayName: 'spread',\n    additionalStyles: 'lw-text-right lw-min-w-[50px]',\n  },\n  [DataRecordType.DAILY_CHANGE]: {\n    displayName: 'daily_percent_change',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.HIGH]: {\n    displayName: 'today_high',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n  [DataRecordType.LOW]: {\n    displayName: 'today_low',\n    additionalStyles: 'lw-text-right lw-min-w-[80px]',\n  },\n};\n\nconst assetClassLabels: Record<string, string> = {\n  CURRENCY: 'currency',\n  COMMODITIES: 'commodity',\n  RATES: 'bond',\n  CRYPTOCURRENCY: 'crypto',\n  EQUITY_SHARES: 'share_sfds',\n  INDICES: 'index',\n};\n\nconst getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {\n  const columns: HeaderRecordType[] = [\n    DataRecordType.INSTRUMENT,\n    ...activeColumns,\n  ].filter(\n    (item): item is HeaderRecordType => item !== DataRecordType.SENTIMENT\n  );\n\n  return columns.map((item) => headerConfig[item]);\n};\n\nexport { assetClassLabels, getHeaderConfig, headerConfig };\n"],"mappings":"AACA,SAASA,cAAc,QAAQ,2BAA2B;AAW1D,MAAMC,YAGL,GAAG;EACF,CAACD,cAAc,CAACE,UAAU,GAAG;IAC3BC,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACK,IAAI,GAAG;IACrBF,WAAW,EAAE,MAAM;IACnBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACM,GAAG,GAAG;IACpBH,WAAW,EAAE,KAAK;IAClBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACO,MAAM,GAAG;IACvBJ,WAAW,EAAE,QAAQ;IACrBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACQ,YAAY,GAAG;IAC7BL,WAAW,EAAE,sBAAsB;IACnCC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACS,IAAI,GAAG;IACrBN,WAAW,EAAE,YAAY;IACzBC,gBAAgB,EAAE;EACpB,CAAC;EACD,CAACJ,cAAc,CAACU,GAAG,GAAG;IACpBP,WAAW,EAAE,WAAW;IACxBC,gBAAgB,EAAE;EACpB;AACF,CAAC;AAED,MAAMO,gBAAwC,GAAG;EAC/CC,QAAQ,EAAE,UAAU;EACpBC,WAAW,EAAE,WAAW;EACxBC,KAAK,EAAE,MAAM;EACbC,cAAc,EAAE,QAAQ;EACxBC,aAAa,EAAE,YAAY;EAC3BC,OAAO,EAAE;AACX,CAAC;AAED,MAAMC,eAAe,GAAIC,aAA+B,IAAsB;EAC5E,MAAMC,OAA2B,GAAG,CAClCpB,cAAc,CAACE,UAAU,EACzB,GAAGiB,aAAa,CACjB,CAACE,MAAM,CACLC,IAAI,IAA+BA,IAAI,KAAKtB,cAAc,CAACuB,SAC9D,CAAC;EAED,OAAOH,OAAO,CAACI,GAAG,CAAEF,IAAI,IAAKrB,YAAY,CAACqB,IAAI,CAAC,CAAC;AAClD,CAAC;AAED,SAASX,gBAAgB,EAAEO,eAAe,EAAEjB,YAAY","ignoreList":[]}

package/dist/module/translations/index.js

@@ -1,20 +1,8 @@
 import { Locale } from '@oanda/mono-i18n';
 import en from './sources/en.json';
-import es from './sources/es.json';
-import th from './sources/th.json';
-import zhTW from './sources/zh_TW.json';
 export const translations = {
   [Locale.en]: {
     translation: en
-  },
-  [Locale.zhTW]: {
-    translation: zhTW
-  },
-  [Locale.es]: {
-    translation: es
-  },
-  [Locale.th]: {
-    translation: th
   }
 };
 //# sourceMappingURL=index.js.map

package/dist/module/translations/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Locale","en","es","th","zhTW","translations","translation"],"sources":["../../../src/translations/index.ts"],"sourcesContent":["import type { Translations } from '@oanda/mono-i18n';\nimport { Locale } from '@oanda/mono-i18n';\n\nimport en from './sources/en.json';\nimport es from './sources/es.json';\nimport th from './sources/th.json';\nimport zhTW from './sources/zh_TW.json';\nimport type { defaultTranslations } from './translations';\n\nexport type TranslationKey = keyof typeof defaultTranslations;\n\nexport const translations: Translations = {\n  [Locale.en]: { translation: en },\n  [Locale.zhTW]: { translation: zhTW },\n  [Locale.es]: { translation: es },\n  [Locale.th]: { translation: th },\n};\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,kBAAkB;AAEzC,OAAOC,EAAE,MAAM,mBAAmB;AAClC,OAAOC,EAAE,MAAM,mBAAmB;AAClC,OAAOC,EAAE,MAAM,mBAAmB;AAClC,OAAOC,IAAI,MAAM,sBAAsB;AAKvC,OAAO,MAAMC,YAA0B,GAAG;EACxC,CAACL,MAAM,CAACC,EAAE,GAAG;IAAEK,WAAW,EAAEL;EAAG,CAAC;EAChC,CAACD,MAAM,CAACI,IAAI,GAAG;IAAEE,WAAW,EAAEF;EAAK,CAAC;EACpC,CAACJ,MAAM,CAACE,EAAE,GAAG;IAAEI,WAAW,EAAEJ;EAAG,CAAC;EAChC,CAACF,MAAM,CAACG,EAAE,GAAG;IAAEG,WAAW,EAAEH;EAAG;AACjC,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["Locale","en","translations","translation"],"sources":["../../../src/translations/index.ts"],"sourcesContent":["import type { Translations } from '@oanda/mono-i18n';\nimport { Locale } from '@oanda/mono-i18n';\n\nimport en from './sources/en.json';\nimport type { defaultTranslations } from './translations';\n\nexport type TranslationKey = keyof typeof defaultTranslations;\n\nexport const translations: Translations = {\n  [Locale.en]: { translation: en },\n};\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,kBAAkB;AAEzC,OAAOC,EAAE,MAAM,mBAAmB;AAKlC,OAAO,MAAMC,YAA0B,GAAG;EACxC,CAACF,MAAM,CAACC,EAAE,GAAG;IAAEE,WAAW,EAAEF;EAAG;AACjC,CAAC","ignoreList":[]}

package/dist/module/translations/sources/en.json

@@ -1,29 +1,22 @@
 {
-  "24h_chart": "24h Chart",
-  "bearish": "Bearish",
-  "bullish": "Bullish",
+  "all": "All",
+  "asset_class": "Asset class",
+  "bond": "Bond",
   "buy": "Buy",
-  "buy_orders": "Buy Orders",
-  "buy_price": "Buy Price",
-  "daily_change": "Daily Change",
+  "commodity": "Commodity",
+  "crypto": "Crypto",
+  "currency": "Currency",
   "daily_percent_change": "Daily % Change",
   "data_unavailable": "Data unavailable",
-  "high_volume": "High Volume",
-  "hot": "Hot",
+  "index": "Index",
   "instrument": "Instrument",
-  "last_updated": "Last updated",
-  "most_traded": "Most Traded",
-  "net_long": "Net-long",
-  "net_short": "Net-short",
+  "instrument_name": "Instrument name",
+  "no_matching_results": "No matching results",
   "pagination_entries_range": "{{firstItemOnPage}}-{{lastItemOnPage}} of {{itemCount}} entries",
-  "popular": "Popular",
+  "search": "Search",
   "sell": "Sell",
-  "sell_price": "Sell Price",
-  "sentiment": "Sentiment",
+  "share_sfds": "Share CFDs",
   "spread": "Spread",
-  "today": "Today",
-  "volatile": "Volatile",
-  "low": "Low",
-  "high": "High",
-  "margin": "Margin"
+  "today_high": "Today High",
+  "today_low": "Today Low"
 }

package/dist/types/InstrumentsTableWidget/config.d.ts

@@ -5,5 +5,6 @@ declare const headerConfig: Record<HeaderRecordType, {
     displayName: string;
     additionalStyles: string;
 }>;
+declare const assetClassLabels: Record<string, string>;
 declare const getHeaderConfig: (activeColumns: DataRecordType[]) => HeaderColumns[];
-export { getHeaderConfig, headerConfig };
+export { assetClassLabels, getHeaderConfig, headerConfig };

package/lokalise.config.json

@@ -12,7 +12,7 @@
     "indentation": "2sp",
     "plural_format": "i18next",
     "export_empty_as": "skip",
-    "include_tags": ["common_widgets"],
-    "filter_langs": ["en", "zh_TW", "es", "th"]
+    "include_tags": ["common_widgets", "instruments_table_widget"],
+    "filter_langs": ["en"]
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oanda/labs-instruments-table-widget",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "description": "Labs Instruments Table Widget",
   "main": "dist/main/index.js",
   "module": "dist/module/index.js",
@@ -12,7 +12,7 @@
   "author": "OANDA",
   "license": "UNLICENSED",
   "dependencies": {
-    "@oanda/labs-widget-common": "^1.0.195",
+    "@oanda/labs-widget-common": "^1.0.197",
     "@oanda/mono-i18n": "10.0.1",
     "graphql": "16.8.1"
   },
@@ -20,5 +20,5 @@
     "@graphql-codegen/cli": "5.0.0",
     "@graphql-codegen/client-preset": "4.1.0"
   },
-  "gitHead": "84b19bb83ca050983fad8b4b35a0f29e9b739a89"
+  "gitHead": "ecd6f0edf62d64f6537ce92408ae285fc012e18e"
 }

package/src/InstrumentsTableWidget/Main.tsx

@@ -5,6 +5,7 @@ import {
   TableWidget,
   useLiveRatesQuery,
 } from '@oanda/labs-widget-common';
+import { useLocale } from '@oanda/mono-i18n';
 import React, { useEffect, useRef, useState } from 'react';
 import { useEventListener } from 'usehooks-ts';
 
@@ -15,7 +16,7 @@ import {
   type ResolveInstrumentsWithFiltersQueryVariables,
 } from '../gql/types/graphql';
 import { Filters } from './components';
-import { getHeaderConfig } from './config';
+import { assetClassLabels, getHeaderConfig } from './config';
 import { DEFAULT_COLUMNS, INSTRUMENT_TOOLTIP_ID } from './constant';
 import type { MainProps } from './types';
 
@@ -30,6 +31,7 @@ const Main = ({
   dataSource,
 }: MainProps) => {
   const documentRef = useRef<Document>(document);
+  const { lang } = useLocale();
   const { target, setQuery, closeQuery } = useLiveRatesQuery();
 
   const [records, setRecords] = useState<DataRecord[]>(
@@ -116,18 +118,22 @@ const Main = ({
     <>
       <TableWidget
         PaginationComponent={
-          <Pagination
-            currentPage={pageNumber}
-            disabled={loading}
-            recordsPerPage={recordsPerPage}
-            totalRecords={totalRecords}
-            onPageChange={(numb) => {
-              setQueryVariables((prev) => ({
-                ...prev,
-                offset: numb * recordsPerPage,
-              }));
-            }}
-          />
+          records.length > 0 ? (
+            <Pagination
+              currentPage={pageNumber}
+              disabled={loading}
+              recordsPerPage={recordsPerPage}
+              totalRecords={totalRecords}
+              onPageChange={(numb) => {
+                setQueryVariables((prev) => ({
+                  ...prev,
+                  offset: numb * recordsPerPage,
+                }));
+              }}
+            />
+          ) : (
+            <></>
+          )
         }
         TabsComponent={
           isInstrumentSearchEnabled || isAssetClassFilterEnabled ? (
@@ -135,12 +141,11 @@ const Main = ({
               assetClassOptions={[
                 {
                   id: 'ALL',
-                  label: 'All',
+                  label: lang('all'),
                 },
                 ...(assetClasses || []).map((assetClass) => ({
                   id: assetClass,
-                  label:
-                    assetClass.charAt(0) + assetClass.slice(1).toLowerCase(),
+                  label: lang(assetClassLabels[assetClass]),
                 })),
               ]}
               isAssetClassFilterEnabled={isAssetClassFilterEnabled}

package/src/InstrumentsTableWidget/components/Filters/Filters.tsx

@@ -5,6 +5,7 @@ import {
   TextInput,
   useLayoutProvider,
 } from '@oanda/labs-widget-common';
+import { useLocale } from '@oanda/mono-i18n';
 import React, { useState } from 'react';
 import { useDebounceCallback } from 'usehooks-ts';
 
@@ -17,6 +18,7 @@ export const Filters = ({
   isAssetClassFilterEnabled,
   isInstrumentSearchEnabled,
 }: FiltersProps) => {
+  const { lang } = useLocale();
   const { size } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
 
@@ -53,7 +55,7 @@ export const Filters = ({
         >
           <Select
             options={assetClassOptions}
-            selectLabel="Asset class"
+            selectLabel={lang('asset_class')}
             selectedOption={
               assetClassOptions.find((opt) => opt.id === assetClass[0]) ||
               assetClassOptions[0]
@@ -75,8 +77,8 @@ export const Filters = ({
           })}
         >
           <TextInput
-            label="Search"
-            placeholder="Instrument name"
+            label={lang('search')}
+            placeholder={lang('instrument_name')}
             value={searchInputValue}
             onChange={handleTextInputSearch}
           />

package/src/InstrumentsTableWidget/config.ts

@@ -35,15 +35,24 @@ const headerConfig: Record<
     additionalStyles: 'lw-text-right lw-min-w-[80px]',
   },
   [DataRecordType.HIGH]: {
-    displayName: 'high',
+    displayName: 'today_high',
     additionalStyles: 'lw-text-right lw-min-w-[80px]',
   },
   [DataRecordType.LOW]: {
-    displayName: 'low',
+    displayName: 'today_low',
     additionalStyles: 'lw-text-right lw-min-w-[80px]',
   },
 };
 
+const assetClassLabels: Record<string, string> = {
+  CURRENCY: 'currency',
+  COMMODITIES: 'commodity',
+  RATES: 'bond',
+  CRYPTOCURRENCY: 'crypto',
+  EQUITY_SHARES: 'share_sfds',
+  INDICES: 'index',
+};
+
 const getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {
   const columns: HeaderRecordType[] = [
     DataRecordType.INSTRUMENT,
@@ -55,4 +64,4 @@ const getHeaderConfig = (activeColumns: DataRecordType[]): HeaderColumns[] => {
   return columns.map((item) => headerConfig[item]);
 };
 
-export { getHeaderConfig, headerConfig };
+export { assetClassLabels, getHeaderConfig, headerConfig };

package/src/translations/index.ts

@@ -2,16 +2,10 @@ import type { Translations } from '@oanda/mono-i18n';
 import { Locale } from '@oanda/mono-i18n';
 
 import en from './sources/en.json';
-import es from './sources/es.json';
-import th from './sources/th.json';
-import zhTW from './sources/zh_TW.json';
 import type { defaultTranslations } from './translations';
 
 export type TranslationKey = keyof typeof defaultTranslations;
 
 export const translations: Translations = {
   [Locale.en]: { translation: en },
-  [Locale.zhTW]: { translation: zhTW },
-  [Locale.es]: { translation: es },
-  [Locale.th]: { translation: th },
 };

package/src/translations/sources/en.json

@@ -1,29 +1,22 @@
 {
-  "24h_chart": "24h Chart",
-  "bearish": "Bearish",
-  "bullish": "Bullish",
+  "all": "All",
+  "asset_class": "Asset class",
+  "bond": "Bond",
   "buy": "Buy",
-  "buy_orders": "Buy Orders",
-  "buy_price": "Buy Price",
-  "daily_change": "Daily Change",
+  "commodity": "Commodity",
+  "crypto": "Crypto",
+  "currency": "Currency",
   "daily_percent_change": "Daily % Change",
   "data_unavailable": "Data unavailable",
-  "high_volume": "High Volume",
-  "hot": "Hot",
+  "index": "Index",
   "instrument": "Instrument",
-  "last_updated": "Last updated",
-  "most_traded": "Most Traded",
-  "net_long": "Net-long",
-  "net_short": "Net-short",
+  "instrument_name": "Instrument name",
+  "no_matching_results": "No matching results",
   "pagination_entries_range": "{{firstItemOnPage}}-{{lastItemOnPage}} of {{itemCount}} entries",
-  "popular": "Popular",
+  "search": "Search",
   "sell": "Sell",
-  "sell_price": "Sell Price",
-  "sentiment": "Sentiment",
+  "share_sfds": "Share CFDs",
   "spread": "Spread",
-  "today": "Today",
-  "volatile": "Volatile",
-  "low": "Low",
-  "high": "High",
-  "margin": "Margin"
+  "today_high": "Today High",
+  "today_low": "Today Low"
 }

package/test/Main.test.tsx

@@ -56,8 +56,8 @@ describe('Main component', () => {
         </LiveRatesProvider>
       </MockedProvider>
     );
-    expect(await findByText('Asset class:')).toBeInTheDocument();
-    expect(await findByText('Search:')).toBeInTheDocument();
+    expect(await findByText('asset_class:')).toBeInTheDocument();
+    expect(await findByText('search:')).toBeInTheDocument();
   });
 
   it('handles ALL asset class selection', async () => {
@@ -77,7 +77,7 @@ describe('Main component', () => {
       </MockedProvider>
     );
 
-    expect(await findByText('All')).toBeInTheDocument();
+    expect(await findByText('all')).toBeInTheDocument();
   });
 
   it('shows loading state', async () => {

package/dist/main/translations/sources/es.json

@@ -1,2 +0,0 @@
-{
-}

package/dist/main/translations/sources/th.json

@@ -1,2 +0,0 @@
-{
-}

package/dist/main/translations/sources/zh_TW.json

@@ -1,2 +0,0 @@
-{
-}

package/dist/module/translations/sources/es.json

@@ -1,2 +0,0 @@
-{
-}

package/dist/module/translations/sources/th.json

@@ -1,2 +0,0 @@
-{
-}

package/dist/module/translations/sources/zh_TW.json

@@ -1,2 +0,0 @@
-{
-}

package/src/translations/sources/es.json

@@ -1,2 +0,0 @@
-{
-}

package/src/translations/sources/th.json

@@ -1,2 +0,0 @@
-{
-}

package/src/translations/sources/zh_TW.json

@@ -1,2 +0,0 @@
-{
-}