@oanda/labs-instrument-live-rate-widget 1.0.9 → 1.0.10

package/dist/types/InstrumentLiveRateWidget/types.d.ts

@@ -1,5 +1,5 @@
 import { Locale } from '@oanda/mono-i18n';
-import { Theme } from '@oanda/labs-widget-common';
+import { DataRecord, Theme, WidgetSize } from '@oanda/labs-widget-common';
 import { Division } from '../gql/types/graphql';
 export { Locale } from '@oanda/mono-i18n';
 export { Division } from '../gql/types/graphql';
@@ -12,10 +12,16 @@ export interface InstrumentLiveRateConfig {
     theme?: Theme;
     isParamError?: boolean;
     removePadding?: boolean;
-    size?: 'compact' | 'full' | 'fullWithChart';
+    size?: WidgetSize;
 }
-export interface MainProps {
+export interface ValidationWrapperProps {
     instrument: string;
     division: Division;
-    size?: 'compact' | 'full' | 'fullWithChart';
+    size?: WidgetSize;
+    isParamError?: boolean;
+}
+export interface MainProps {
+    record: DataRecord;
+    division: Division;
+    size?: WidgetSize;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oanda/labs-instrument-live-rate-widget",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "Labs Instrument Live Rate Widget",
   "main": "dist/main/index.js",
   "module": "dist/module/index.js",
@@ -12,8 +12,7 @@
   "author": "OANDA",
   "license": "UNLICENSED",
   "dependencies": {
-    "@apollo/client": "3.9.9",
-    "@oanda/labs-widget-common": "^1.0.148",
+    "@oanda/labs-widget-common": "^1.0.149",
     "@oanda/mono-i18n": "10.0.1",
     "graphql": "16.8.1"
   },
@@ -21,5 +20,5 @@
     "@graphql-codegen/cli": "5.0.0",
     "@graphql-codegen/client-preset": "4.1.0"
   },
-  "gitHead": "4a7b3a1f8d7003b1d7002dfbeb0fd6787e7d18dc"
+  "gitHead": "5669c16b7b74489de566298ef8830cd6bc99b47b"
 }

package/src/InstrumentLiveRateWidget/InstrumentLiveRateWidget.tsx

@@ -1,13 +1,12 @@
-import React from 'react';
-import classnames from 'classnames';
+import React, { Suspense } from 'react';
 import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
 import { LocaleProvider } from '@oanda/mono-i18n';
 import {
-  Error, LiveRatesProvider, ThemeProvider, getLocale,
+  LiveRatesProvider, ThemeProvider, getLocale,
 } from '@oanda/labs-widget-common';
 import { translations } from '../translations';
-import { Main } from './Main';
 import { Division, InstrumentLiveRateConfig } from './types';
+import { ValidationWrapper } from './ValidationWrapper';
 
 const InstrumentLiveRateWidget = ({
   graphqlUrl,
@@ -36,22 +35,14 @@ const InstrumentLiveRateWidget = ({
           options={{ divisionCode, dataSource }}
         >
           <ApolloProvider client={client}>
-            {isParamError ? (
-              <div className={classnames('lw-flex lw-items-center lw-border lw-border-solid lw-border-border-primary lw-px-4', {
-                'lw-h-[82px]': size !== 'compact',
-                'lw-h-[54px]': size === 'compact',
-              })}
-              >
-                <Error />
-              </div>
-            )
-              : (
-                <Main
-                  size={size}
-                  instrument={instrument}
-                  division={division}
-                />
-              )}
+            <Suspense>
+              <ValidationWrapper
+                size={size}
+                instrument={instrument}
+                division={division}
+                isParamError={isParamError}
+              />
+            </Suspense>
           </ApolloProvider>
         </LiveRatesProvider>
       </LocaleProvider>

package/src/InstrumentLiveRateWidget/Main.tsx

@@ -1,93 +1,54 @@
-import React, { useContext, useEffect, useState } from 'react';
-import { useQuery } from '@apollo/client';
-import classnames from 'classnames';
+import React, { useEffect } from 'react';
+import { useBackgroundQuery } from '@apollo/client';
 import {
-  Error,
-  DataRecord,
-  ThemeContext,
+  InstrumentRateWithChart,
   Tooltip,
   useLiveRatesQuery,
 } from '@oanda/labs-widget-common';
-import { getRecords } from './utils';
 import { MainProps } from './types';
 import { INSTRUMENT_TOOLTIP_ID } from './constant';
-import { validateInstruments } from '../gql/validateInstruments';
-import { ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables } from '../gql/types/graphql';
-import { InstrumentRateWithChart } from './components/InstrumentRateWithChart';
+import { getInstrumentsChart } from '../gql/getInstrumentsChart';
+import { GetInstrumentsChartQuery, GetInstrumentsChartQueryVariables } from '../gql/types/graphql';
 
 const Main = ({
-  instrument,
   division,
   size: widgetSize = 'fullWithChart',
+  record,
 }: MainProps) => {
-  const { size } = useContext(ThemeContext);
-  const { target, setQuery } = useLiveRatesQuery();
-  const [records, setRecords] = useState<DataRecord[]>([]);
+  const hasInstrument = !!record.instrument;
 
-  const { loading, data, error } = useQuery<
-  ValidateInstrumentsQuery,
-  ValidateInstrumentsQueryVariables
-  >(validateInstruments, {
+  const [queryRef] = useBackgroundQuery<
+  GetInstrumentsChartQuery,
+  GetInstrumentsChartQueryVariables
+  >(getInstrumentsChart, {
     variables: {
-      instruments: [instrument],
+      instruments: [record.instrument],
       division,
     },
     fetchPolicy: 'network-only',
+    skip: !hasInstrument,
   });
 
-  useEffect(() => {
-    if (!loading && data) {
-      setRecords(getRecords(data)!);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [loading, data]);
-
-  const instrumentsNames = records.map(({ instrument: instrumentName }) => instrumentName);
+  const { target, setQuery } = useLiveRatesQuery();
 
   useEffect(() => {
-    if (instrumentsNames[0]) {
-      setQuery({ instruments: instrumentsNames });
+    if (hasInstrument) {
+      setQuery({ instruments: [record?.instrument] });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [records]);
-
-  const showError = !!error;
+  }, [record]);
 
   return (
-    <>
-      {size && (
-        <div
-          data-testid="instrument-live-rate-wrapper"
-          className="lw-flex lw-border lw-border-solid lw-border-border-primary lw-px-4 lw-text-sm lw-tracking-normal lw-text-text-primary"
-        >
-          {!showError && (
-            <div className={classnames({
-              'lw-h-[82px]': widgetSize !== 'compact',
-              'lw-h-[54px]': widgetSize === 'compact',
-            })}
-            >
-              <InstrumentRateWithChart
-                loading={loading}
-                record={records[0] || {}}
-                target={target}
-                division={division}
-                size={widgetSize}
-              />
-              <Tooltip id={INSTRUMENT_TOOLTIP_ID} />
-            </div>
-          )}
-          {!loading && showError && (
-            <div className={classnames('lw-flex lw-w-full lw-items-center', {
-              'lw-h-[82px]': widgetSize !== 'compact',
-              'lw-h-[54px]': widgetSize === 'compact',
-            })}
-            >
-              <Error />
-            </div>
-          )}
-        </div>
-      )}
-    </>
+    <div>
+      <InstrumentRateWithChart<GetInstrumentsChartQuery>
+        record={record}
+        target={target}
+        size={widgetSize}
+        tooltipId={INSTRUMENT_TOOLTIP_ID}
+        queryRef={queryRef}
+      />
+      <Tooltip id={INSTRUMENT_TOOLTIP_ID} />
+    </div>
   );
 };
 

package/src/InstrumentLiveRateWidget/ValidationWrapper.tsx

@@ -0,0 +1,62 @@
+import React from 'react';
+import { useSuspenseQuery } from '@apollo/client';
+import classnames from 'classnames';
+import { Error } from '@oanda/labs-widget-common';
+import { getRecords } from './utils';
+import { ValidationWrapperProps } from './types';
+import { validateInstruments } from '../gql/validateInstruments';
+import { ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables } from '../gql/types/graphql';
+import { Main } from './Main';
+
+const ValidationWrapper = ({
+  instrument,
+  division,
+  size: widgetSize,
+  isParamError,
+}: ValidationWrapperProps) => {
+  const { data, error } = useSuspenseQuery<
+  ValidateInstrumentsQuery,
+  ValidateInstrumentsQueryVariables
+  >(validateInstruments, {
+    variables: {
+      instruments: [instrument],
+      division,
+    },
+    fetchPolicy: 'network-only',
+  });
+
+  const showError = !!error || isParamError;
+
+  return (
+    <>
+      <div
+        className="lw-flex lw-border lw-border-solid lw-border-border-primary lw-px-4 lw-text-sm lw-tracking-normal lw-text-text-primary"
+      >
+        {!showError && (
+          <div className={classnames({
+            'lw-h-[82px]': widgetSize !== 'compact',
+            'lw-h-[54px]': widgetSize === 'compact',
+          })}
+          >
+            <Main
+              size={widgetSize}
+              division={division}
+              record={getRecords(data!)?.[0]!}
+            />
+          </div>
+        )}
+        {showError && (
+          <div className={classnames('lw-flex lw-w-full lw-items-center', {
+            'lw-h-[82px]': widgetSize !== 'compact',
+            'lw-h-[54px]': widgetSize === 'compact',
+          })}
+          >
+            <Error />
+          </div>
+        )}
+      </div>
+    </>
+  );
+};
+
+export { ValidationWrapper };

package/src/InstrumentLiveRateWidget/types.tsx

@@ -1,5 +1,5 @@
 import { Locale } from '@oanda/mono-i18n';
-import { Theme } from '@oanda/labs-widget-common';
+import { DataRecord, Theme, WidgetSize } from '@oanda/labs-widget-common';
 import { Division } from '../gql/types/graphql';
 
 export { Locale } from '@oanda/mono-i18n';
@@ -14,11 +14,17 @@ export interface InstrumentLiveRateConfig {
   theme?: Theme;
   isParamError?: boolean;
   removePadding?: boolean;
-  size?: 'compact' | 'full' | 'fullWithChart';
+  size?: WidgetSize;
 }
 
-export interface MainProps {
+export interface ValidationWrapperProps {
   instrument: string;
   division: Division;
-  size?: 'compact' | 'full' | 'fullWithChart'
+  size?: WidgetSize;
+  isParamError?: boolean;
+}
+export interface MainProps {
+  record: DataRecord;
+  division: Division;
+  size?: WidgetSize;
 }

package/test/Main.test.tsx

@@ -10,18 +10,22 @@ import { Division } from '../src/gql/types/graphql';
 import { widgetMocks } from './mocks';
 
 describe('Main component', () => {
-  it('should render table component', async () => {
+  it('should render instrument live rate component', async () => {
     const { findByTestId } = render(
       <MockedProvider mocks={widgetMocks}>
         <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
           <Main
             division={Division.Oc}
-            instrument="EUR_USD"
+            record={{
+              instrument: 'EUR_USD',
+              displayName: 'EUR/USD',
+            }}
+            size="compact"
           />
         </ThemeContext.Provider>
       </MockedProvider>,
     );
 
-    expect(await findByTestId('instrument-live-rate-wrapper')).toBeInTheDocument();
+    expect(await findByTestId('instrument-rate-wrapper')).toBeInTheDocument();
   });
 });

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js

@@ -1,46 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.InstrumentRateWithChart = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _labsWidgetCommon = require("@oanda/labs-widget-common");
-var _utils = require("./utils");
-var _constant = require("../../constant");
-var _LineChartWithData = require("../LineChartWithData");
-var _utils2 = require("../../utils");
-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); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const InstrumentRateWithChart = _ref => {
-  let {
-    loading,
-    record,
-    target,
-    division,
-    size
-  } = _ref;
-  const {
-    isDark
-  } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
-  const {
-    updatedRecord,
-    error
-  } = (0, _utils2.useRecords)(record, record?.instrument ? target : null);
-  const indicator = (0, _utils.getColorIndicator)(updatedRecord.dailyPercentChange);
-  return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_labsWidgetCommon.InstrumentRate, {
-    isLoading: loading,
-    isError: !!error,
-    record: updatedRecord,
-    size: size,
-    tooltipId: _constant.INSTRUMENT_TOOLTIP_ID,
-    colorIndicator: indicator
-  }), size === 'fullWithChart' && _react.default.createElement(_LineChartWithData.LineChartWithData, {
-    record: record,
-    isLoading: loading,
-    division: division,
-    color: (0, _utils.getChartColor)(indicator, isDark)
-  }));
-};
-exports.InstrumentRateWithChart = InstrumentRateWithChart;
-//# sourceMappingURL=InstrumentRateWithChart.js.map

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InstrumentRateWithChart.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_utils","_constant","_LineChartWithData","_utils2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","InstrumentRateWithChart","_ref","loading","record","target","division","size","isDark","useContext","ThemeContext","updatedRecord","error","useRecords","instrument","indicator","getColorIndicator","dailyPercentChange","createElement","Fragment","InstrumentRate","isLoading","isError","tooltipId","INSTRUMENT_TOOLTIP_ID","colorIndicator","LineChartWithData","color","getChartColor","exports"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { InstrumentRate, ThemeContext } from '@oanda/labs-widget-common';\nimport { InstrumentRateWithChartProps } from './types';\nimport { getChartColor, getColorIndicator } from './utils';\nimport { INSTRUMENT_TOOLTIP_ID } from '../../constant';\nimport { LineChartWithData } from '../LineChartWithData';\nimport { useRecords } from '../../utils';\n\nconst InstrumentRateWithChart = ({\n  loading,\n  record,\n  target,\n  division,\n  size,\n}: InstrumentRateWithChartProps) => {\n  const { isDark } = useContext(ThemeContext);\n  const { updatedRecord, error } = useRecords(record, record?.instrument ? target : null);\n\n  const indicator = getColorIndicator(updatedRecord.dailyPercentChange);\n\n  return (\n    <>\n      <InstrumentRate\n        isLoading={loading}\n        isError={!!error}\n        record={updatedRecord}\n        size={size}\n        tooltipId={INSTRUMENT_TOOLTIP_ID}\n        colorIndicator={indicator}\n      />\n      {size === 'fullWithChart' && (\n        <LineChartWithData\n          record={record}\n          isLoading={loading}\n          division={division}\n          color={getChartColor(indicator, isDark)}\n        />\n      )}\n    </>\n  );\n};\n\nexport { InstrumentRateWithChart };\n"],"mappings":"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","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/index.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _InstrumentRateWithChart = require("./InstrumentRateWithChart");
-Object.keys(_InstrumentRateWithChart).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _InstrumentRateWithChart[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _InstrumentRateWithChart[key];
-    }
-  });
-});
-var _utils = require("./utils");
-Object.keys(_utils).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _utils[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _utils[key];
-    }
-  });
-});
-//# sourceMappingURL=index.js.map

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["_InstrumentRateWithChart","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_utils"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/InstrumentRateWithChart/index.ts"],"sourcesContent":["export * from './InstrumentRateWithChart';\nexport * from './utils';\n"],"mappings":";;;;;AAAA,IAAAA,wBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,wBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,wBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,wBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,MAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,MAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,MAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,MAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/types.js

@@ -1,6 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-//# sourceMappingURL=types.js.map

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/InstrumentLiveRateWidget/components/InstrumentRateWithChart/types.ts"],"sourcesContent":["import { DataRecord } from '@oanda/labs-widget-common';\nimport { Division } from '../../types';\n\nexport interface InstrumentRateWithChartProps {\n  loading: boolean;\n  record: DataRecord;\n  target: EventTarget | null;\n  division: Division;\n  size?: 'compact' | 'full' | 'fullWithChart'\n}\n"],"mappings":"","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/utils.js

@@ -1,25 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getColorIndicator = exports.getChartColor = void 0;
-var _labsWidgetCommon = require("@oanda/labs-widget-common");
-const getColorIndicator = dailyChange => {
-  const numberValue = Number(dailyChange?.substring(0, dailyChange.length - 1));
-  return Math.sign(numberValue);
-};
-exports.getColorIndicator = getColorIndicator;
-const getChartColor = (indicator, isDarkMode) => {
-  const theme = isDarkMode ? _labsWidgetCommon.darkTheme : _labsWidgetCommon.lightTheme;
-  switch (indicator) {
-    case 1:
-      return theme.textOk;
-    case -1:
-      return theme.textDanger;
-    default:
-      return theme.textDisabled;
-  }
-};
-exports.getChartColor = getChartColor;
-//# sourceMappingURL=utils.js.map

package/dist/main/InstrumentLiveRateWidget/components/InstrumentRateWithChart/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","names":["_labsWidgetCommon","require","getColorIndicator","dailyChange","numberValue","Number","substring","length","Math","sign","exports","getChartColor","indicator","isDarkMode","theme","darkTheme","lightTheme","textOk","textDanger","textDisabled"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/InstrumentRateWithChart/utils.ts"],"sourcesContent":["import { lightTheme, darkTheme } from '@oanda/labs-widget-common';\n\nconst getColorIndicator = (dailyChange?: string) => {\n  const numberValue = Number(dailyChange?.substring(0, dailyChange.length - 1));\n\n  return Math.sign(numberValue);\n};\n\nconst getChartColor = (indicator?: number, isDarkMode?: boolean) => {\n  const theme = isDarkMode ? darkTheme : lightTheme;\n\n  switch (indicator) {\n    case 1:\n      return theme.textOk;\n    case -1:\n      return theme.textDanger;\n    default:\n      return theme.textDisabled;\n  }\n};\n\nexport {\n  getColorIndicator,\n  getChartColor,\n};\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AAEA,MAAMC,iBAAiB,GAAIC,WAAoB,IAAK;EAClD,MAAMC,WAAW,GAAGC,MAAM,CAACF,WAAW,EAAEG,SAAS,CAAC,CAAC,EAAEH,WAAW,CAACI,MAAM,GAAG,CAAC,CAAC,CAAC;EAE7E,OAAOC,IAAI,CAACC,IAAI,CAACL,WAAW,CAAC;AAC/B,CAAC;AAACM,OAAA,CAAAR,iBAAA,GAAAA,iBAAA;AAEF,MAAMS,aAAa,GAAGA,CAACC,SAAkB,EAAEC,UAAoB,KAAK;EAClE,MAAMC,KAAK,GAAGD,UAAU,GAAGE,2BAAS,GAAGC,4BAAU;EAEjD,QAAQJ,SAAS;IACf,KAAK,CAAC;MACJ,OAAOE,KAAK,CAACG,MAAM;IACrB,KAAK,CAAC,CAAC;MACL,OAAOH,KAAK,CAACI,UAAU;IACzB;MACE,OAAOJ,KAAK,CAACK,YAAY;EAC7B;AACF,CAAC;AAACT,OAAA,CAAAC,aAAA,GAAAA,aAAA","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/LineChartWithData.js

@@ -1,42 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.LineChartWithData = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _client = require("@apollo/client");
-var _labsWidgetCommon = require("@oanda/labs-widget-common");
-var _getInstrumentsChart = require("../../../gql/getInstrumentsChart");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const LineChartWithData = _ref => {
-  let {
-    record,
-    isLoading,
-    division,
-    color
-  } = _ref;
-  const {
-    loading,
-    data
-  } = (0, _client.useQuery)(_getInstrumentsChart.getInstrumentsChart, {
-    variables: {
-      instruments: [record.instrument],
-      division
-    },
-    fetchPolicy: 'network-only',
-    skip: !record.instrument
-  });
-  const showChart = isLoading || loading;
-  const chart = data?.topicalInstrumentsCharts?.[0].chart || [];
-  return _react.default.createElement("div", {
-    className: "lw-relative"
-  }, !showChart ? _react.default.createElement("div", {
-    className: "lw-absolute lw-bottom-0 lw-right-0 lw--z-50 lw-flex lw-h-10 lw-w-[100px] lw-items-center lw-justify-center"
-  }, _react.default.createElement(_labsWidgetCommon.LineChart, {
-    color: color,
-    data: chart
-  })) : null);
-};
-exports.LineChartWithData = LineChartWithData;
-//# sourceMappingURL=LineChartWithData.js.map

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/LineChartWithData.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LineChartWithData.js","names":["_react","_interopRequireDefault","require","_client","_labsWidgetCommon","_getInstrumentsChart","e","__esModule","default","LineChartWithData","_ref","record","isLoading","division","color","loading","data","useQuery","getInstrumentsChart","variables","instruments","instrument","fetchPolicy","skip","showChart","chart","topicalInstrumentsCharts","createElement","className","LineChart","exports"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/LineChartWithData/LineChartWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useQuery } from '@apollo/client';\nimport { LineChart } from '@oanda/labs-widget-common';\nimport { LineChartWithDataProps } from './types';\nimport { getInstrumentsChart } from '../../../gql/getInstrumentsChart';\nimport { GetInstrumentsChartQuery, GetInstrumentsChartQueryVariables } from '../../../gql/types/graphql';\n\nconst LineChartWithData = ({\n  record,\n  isLoading,\n  division,\n  color,\n}: LineChartWithDataProps) => {\n  const { loading, data } = useQuery<\n  GetInstrumentsChartQuery,\n  GetInstrumentsChartQueryVariables\n  >(getInstrumentsChart, {\n    variables: {\n      instruments: [record.instrument],\n      division,\n    },\n    fetchPolicy: 'network-only',\n    skip: !record.instrument,\n  });\n\n  const showChart = isLoading || loading;\n  const chart = data?.topicalInstrumentsCharts?.[0].chart || [];\n\n  return (\n    <div className=\"lw-relative\">\n      {!showChart ? (\n        <div className=\"lw-absolute lw-bottom-0 lw-right-0 lw--z-50 lw-flex lw-h-10 lw-w-[100px] lw-items-center lw-justify-center\">\n          <LineChart\n            color={color}\n            data={chart}\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport { LineChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAEA,IAAAG,oBAAA,GAAAH,OAAA;AAAuE,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGvE,MAAMG,iBAAiB,GAAGC,IAAA,IAKI;EAAA,IALH;IACzBC,MAAM;IACNC,SAAS;IACTC,QAAQ;IACRC;EACsB,CAAC,GAAAJ,IAAA;EACvB,MAAM;IAAEK,OAAO;IAAEC;EAAK,CAAC,GAAG,IAAAC,gBAAQ,EAGhCC,wCAAmB,EAAE;IACrBC,SAAS,EAAE;MACTC,WAAW,EAAE,CAACT,MAAM,CAACU,UAAU,CAAC;MAChCR;IACF,CAAC;IACDS,WAAW,EAAE,cAAc;IAC3BC,IAAI,EAAE,CAACZ,MAAM,CAACU;EAChB,CAAC,CAAC;EAEF,MAAMG,SAAS,GAAGZ,SAAS,IAAIG,OAAO;EACtC,MAAMU,KAAK,GAAGT,IAAI,EAAEU,wBAAwB,GAAG,CAAC,CAAC,CAACD,KAAK,IAAI,EAAE;EAE7D,OACEzB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA;IAAKC,SAAS,EAAC;EAAa,GACzB,CAACJ,SAAS,GACTxB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA;IAAKC,SAAS,EAAC;EAA4G,GACzH5B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,iBAAA,CAAAyB,SAAS;IACRf,KAAK,EAAEA,KAAM;IACbE,IAAI,EAAES;EAAM,CACb,CACE,CAAC,GACJ,IACD,CAAC;AAEV,CAAC;AAACK,OAAA,CAAArB,iBAAA,GAAAA,iBAAA","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/index.js

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _LineChartWithData = require("./LineChartWithData");
-Object.keys(_LineChartWithData).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _LineChartWithData[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _LineChartWithData[key];
-    }
-  });
-});
-//# sourceMappingURL=index.js.map

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["_LineChartWithData","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/LineChartWithData/index.ts"],"sourcesContent":["export * from './LineChartWithData';\n"],"mappings":";;;;;AAAA,IAAAA,kBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,kBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,kBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,kBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/types.js

@@ -1,6 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-//# sourceMappingURL=types.js.map

package/dist/main/InstrumentLiveRateWidget/components/LineChartWithData/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/InstrumentLiveRateWidget/components/LineChartWithData/types.tsx"],"sourcesContent":["import { DataRecord } from '@oanda/labs-widget-common';\nimport { Division } from '../../../gql/types/graphql';\n\nexport interface LineChartWithDataProps {\n  record: DataRecord;\n  isLoading: boolean;\n  division: Division;\n  color: string;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/main/InstrumentLiveRateWidget/components/index.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _InstrumentRateWithChart = require("./InstrumentRateWithChart");
-Object.keys(_InstrumentRateWithChart).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _InstrumentRateWithChart[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _InstrumentRateWithChart[key];
-    }
-  });
-});
-var _LineChartWithData = require("./LineChartWithData");
-Object.keys(_LineChartWithData).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _LineChartWithData[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _LineChartWithData[key];
-    }
-  });
-});
-//# sourceMappingURL=index.js.map

package/dist/main/InstrumentLiveRateWidget/components/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["_InstrumentRateWithChart","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_LineChartWithData"],"sources":["../../../../src/InstrumentLiveRateWidget/components/index.ts"],"sourcesContent":["export * from './InstrumentRateWithChart';\nexport * from './LineChartWithData';\n"],"mappings":";;;;;AAAA,IAAAA,wBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,wBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,wBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,wBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,kBAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,kBAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,kBAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,kBAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/module/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js

@@ -1,38 +0,0 @@
-import React, { useContext } from 'react';
-import { InstrumentRate, ThemeContext } from '@oanda/labs-widget-common';
-import { getChartColor, getColorIndicator } from './utils';
-import { INSTRUMENT_TOOLTIP_ID } from '../../constant';
-import { LineChartWithData } from '../LineChartWithData';
-import { useRecords } from '../../utils';
-const InstrumentRateWithChart = _ref => {
-  let {
-    loading,
-    record,
-    target,
-    division,
-    size
-  } = _ref;
-  const {
-    isDark
-  } = useContext(ThemeContext);
-  const {
-    updatedRecord,
-    error
-  } = useRecords(record, record?.instrument ? target : null);
-  const indicator = getColorIndicator(updatedRecord.dailyPercentChange);
-  return React.createElement(React.Fragment, null, React.createElement(InstrumentRate, {
-    isLoading: loading,
-    isError: !!error,
-    record: updatedRecord,
-    size: size,
-    tooltipId: INSTRUMENT_TOOLTIP_ID,
-    colorIndicator: indicator
-  }), size === 'fullWithChart' && React.createElement(LineChartWithData, {
-    record: record,
-    isLoading: loading,
-    division: division,
-    color: getChartColor(indicator, isDark)
-  }));
-};
-export { InstrumentRateWithChart };
-//# sourceMappingURL=InstrumentRateWithChart.js.map

package/dist/module/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InstrumentRateWithChart.js","names":["React","useContext","InstrumentRate","ThemeContext","getChartColor","getColorIndicator","INSTRUMENT_TOOLTIP_ID","LineChartWithData","useRecords","InstrumentRateWithChart","_ref","loading","record","target","division","size","isDark","updatedRecord","error","instrument","indicator","dailyPercentChange","createElement","Fragment","isLoading","isError","tooltipId","colorIndicator","color"],"sources":["../../../../../src/InstrumentLiveRateWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { InstrumentRate, ThemeContext } from '@oanda/labs-widget-common';\nimport { InstrumentRateWithChartProps } from './types';\nimport { getChartColor, getColorIndicator } from './utils';\nimport { INSTRUMENT_TOOLTIP_ID } from '../../constant';\nimport { LineChartWithData } from '../LineChartWithData';\nimport { useRecords } from '../../utils';\n\nconst InstrumentRateWithChart = ({\n  loading,\n  record,\n  target,\n  division,\n  size,\n}: InstrumentRateWithChartProps) => {\n  const { isDark } = useContext(ThemeContext);\n  const { updatedRecord, error } = useRecords(record, record?.instrument ? target : null);\n\n  const indicator = getColorIndicator(updatedRecord.dailyPercentChange);\n\n  return (\n    <>\n      <InstrumentRate\n        isLoading={loading}\n        isError={!!error}\n        record={updatedRecord}\n        size={size}\n        tooltipId={INSTRUMENT_TOOLTIP_ID}\n        colorIndicator={indicator}\n      />\n      {size === 'fullWithChart' && (\n        <LineChartWithData\n          record={record}\n          isLoading={loading}\n          division={division}\n          color={getChartColor(indicator, isDark)}\n        />\n      )}\n    </>\n  );\n};\n\nexport { InstrumentRateWithChart };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,cAAc,EAAEC,YAAY,QAAQ,2BAA2B;AAExE,SAASC,aAAa,EAAEC,iBAAiB,QAAQ,SAAS;AAC1D,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,UAAU,QAAQ,aAAa;AAExC,MAAMC,uBAAuB,GAAGC,IAAA,IAMI;EAAA,IANH;IAC/BC,OAAO;IACPC,MAAM;IACNC,MAAM;IACNC,QAAQ;IACRC;EAC4B,CAAC,GAAAL,IAAA;EAC7B,MAAM;IAAEM;EAAO,CAAC,GAAGf,UAAU,CAACE,YAAY,CAAC;EAC3C,MAAM;IAAEc,aAAa;IAAEC;EAAM,CAAC,GAAGV,UAAU,CAACI,MAAM,EAAEA,MAAM,EAAEO,UAAU,GAAGN,MAAM,GAAG,IAAI,CAAC;EAEvF,MAAMO,SAAS,GAAGf,iBAAiB,CAACY,aAAa,CAACI,kBAAkB,CAAC;EAErE,OACErB,KAAA,CAAAsB,aAAA,CAAAtB,KAAA,CAAAuB,QAAA,QACEvB,KAAA,CAAAsB,aAAA,CAACpB,cAAc;IACbsB,SAAS,EAAEb,OAAQ;IACnBc,OAAO,EAAE,CAAC,CAACP,KAAM;IACjBN,MAAM,EAAEK,aAAc;IACtBF,IAAI,EAAEA,IAAK;IACXW,SAAS,EAAEpB,qBAAsB;IACjCqB,cAAc,EAAEP;EAAU,CAC3B,CAAC,EACDL,IAAI,KAAK,eAAe,IACvBf,KAAA,CAAAsB,aAAA,CAACf,iBAAiB;IAChBK,MAAM,EAAEA,MAAO;IACfY,SAAS,EAAEb,OAAQ;IACnBG,QAAQ,EAAEA,QAAS;IACnBc,KAAK,EAAExB,aAAa,CAACgB,SAAS,EAAEJ,MAAM;EAAE,CACzC,CAEH,CAAC;AAEP,CAAC;AAED,SAASP,uBAAuB","ignoreList":[]}