@oanda/labs-instruments-price-chart-widget 1.0.1

package/dist/types/gql/types/graphql.d.ts

@@ -0,0 +1,468 @@
+import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
+export type Maybe<T> = T | null;
+export type InputMaybe<T> = Maybe<T>;
+export type Exact<T extends {
+    [key: string]: unknown;
+}> = {
+    [K in keyof T]: T[K];
+};
+export type MakeOptional<T, K extends keyof T> = Omit<T, K> & {
+    [SubKey in K]?: Maybe<T[SubKey]>;
+};
+export type MakeMaybe<T, K extends keyof T> = Omit<T, K> & {
+    [SubKey in K]: Maybe<T[SubKey]>;
+};
+export type MakeEmpty<T extends {
+    [key: string]: unknown;
+}, K extends keyof T> = {
+    [_ in K]?: never;
+};
+export type Incremental<T> = T | {
+    [P in keyof T]?: P extends ' $fragmentName' | '__typename' ? T[P] : never;
+};
+/** All built-in and custom scalars, mapped to their actual values */
+export type Scalars = {
+    ID: {
+        input: string;
+        output: string;
+    };
+    String: {
+        input: string;
+        output: string;
+    };
+    Boolean: {
+        input: boolean;
+        output: boolean;
+    };
+    Int: {
+        input: number;
+        output: number;
+    };
+    Float: {
+        input: number;
+        output: number;
+    };
+};
+export type AssetClass = {
+    __typename?: 'AssetClass';
+    instruments: Array<Instrument>;
+    name: Scalars['String']['output'];
+};
+export declare enum AssetClassName {
+    Commodities = "COMMODITIES",
+    Cryptocurrency = "CRYPTOCURRENCY",
+    Currency = "CURRENCY",
+    EquityShares = "EQUITY_SHARES",
+    Etfs = "ETFS",
+    Indices = "INDICES",
+    Rates = "RATES"
+}
+export declare enum BookType {
+    Order = "ORDER",
+    Position = "POSITION"
+}
+export type Candle = {
+    __typename?: 'Candle';
+    high: Scalars['Float']['output'];
+};
+export type CandlesData = {
+    __typename?: 'CandlesData';
+    candle: Candle;
+    time: Scalars['String']['output'];
+    timeSpan: TimeSpan;
+    unixTime: Scalars['Int']['output'];
+};
+export type CorrelationHeatmap = {
+    __typename?: 'CorrelationHeatmap';
+    baseInstrument: Instrument;
+    heatmap: Array<Heatmap>;
+};
+export type CorrelationMatrix = {
+    __typename?: 'CorrelationMatrix';
+    baseTimeUnit: CorrelationTimeUnit;
+    matrix: Array<Matrix>;
+};
+export declare enum CorrelationTimeUnit {
+    H1 = "H1",
+    H4 = "H4",
+    H24 = "H24",
+    M1 = "M1",
+    M3 = "M3",
+    M6 = "M6",
+    W1 = "W1",
+    Y1 = "Y1"
+}
+export declare enum CurrencyName {
+    Aud = "AUD",
+    Cad = "CAD",
+    Chf = "CHF",
+    Eur = "EUR",
+    Gbp = "GBP",
+    Jpy = "JPY",
+    Nzd = "NZD",
+    Usd = "USD"
+}
+export type CurrencyPower = {
+    __typename?: 'CurrencyPower';
+    /** UTC Timestamp */
+    point: Scalars['String']['output'];
+    price: Scalars['Float']['output'];
+};
+export type CurrencyPowerBalance = {
+    __typename?: 'CurrencyPowerBalance';
+    currency: CurrencyName;
+    power: Array<CurrencyPower>;
+    updatedAt: Scalars['String']['output'];
+};
+export declare enum CurrencyPowerBalanceTimeUnit {
+    CurrentDay = "CURRENT_DAY",
+    H4 = "H4",
+    H8 = "H8",
+    H24 = "H24",
+    M1 = "M1",
+    M3 = "M3",
+    PreviousDay = "PREVIOUS_DAY",
+    W1 = "W1"
+}
+export type CurrencyStrength = {
+    __typename?: 'CurrencyStrength';
+    currency: CurrencyName;
+    strengthRelation?: Maybe<Array<StrengthRelation>>;
+    updatedAt: Scalars['String']['output'];
+};
+export declare enum DataSource {
+    Ny4 = "NY4",
+    Ty3 = "TY3"
+}
+export declare enum Division {
+    Oap = "OAP",
+    Oau = "OAU",
+    Oc = "OC",
+    Ocan = "OCAN",
+    Oel = "OEL",
+    Ogm = "OGM",
+    Oj = "OJ",
+    Opt = "OPT",
+    Otms = "OTMS"
+}
+export declare enum Granularity {
+    Day_1 = "DAY_1",
+    Hour_1 = "HOUR_1",
+    Hour_4 = "HOUR_4",
+    Minute_5 = "MINUTE_5",
+    Minute_15 = "MINUTE_15",
+    Minute_30 = "MINUTE_30"
+}
+export type Heatmap = {
+    __typename?: 'Heatmap';
+    instrument: Instrument;
+    timeCorrelation: Array<TimeCorrelation>;
+};
+export type Instrument = {
+    __typename?: 'Instrument';
+    displayName: Scalars['String']['output'];
+    name: Scalars['String']['output'];
+};
+export type InstrumentCorrelation = {
+    __typename?: 'InstrumentCorrelation';
+    instrument: Instrument;
+    value?: Maybe<Scalars['Float']['output']>;
+};
+export declare enum InstrumentDataSource {
+    Mt5 = "MT5",
+    V20 = "V20"
+}
+export type InstrumentTableResult = {
+    __typename?: 'InstrumentTableResult';
+    instruments: Array<Instrument>;
+    totalCount: Scalars['Int']['output'];
+};
+export type Matrix = {
+    __typename?: 'Matrix';
+    instrument: Instrument;
+    instrumentCorrelation: Array<InstrumentCorrelation>;
+};
+export type OrderPositionBucket = {
+    __typename?: 'OrderPositionBucket';
+    longCountPercent: Scalars['Float']['output'];
+    price: Scalars['Float']['output'];
+    shortCountPercent: Scalars['Float']['output'];
+};
+export type OrderPositionData = {
+    __typename?: 'OrderPositionData';
+    bucketWidth: Scalars['Float']['output'];
+    buckets: Array<Maybe<OrderPositionBucket>>;
+    dataSource?: Maybe<Scalars['String']['output']>;
+    instrument: Scalars['String']['output'];
+    price?: Maybe<Scalars['Float']['output']>;
+    region?: Maybe<Scalars['String']['output']>;
+    time: Scalars['String']['output'];
+    unixTime: Scalars['Int']['output'];
+};
+export type Query = {
+    __typename?: 'Query';
+    assetClasses?: Maybe<Array<Maybe<AssetClass>>>;
+    correlationHeatmap: CorrelationHeatmap;
+    correlationMatrix: CorrelationMatrix;
+    currencyPowerBalance?: Maybe<Array<CurrencyPowerBalance>>;
+    currencyStrength?: Maybe<Array<CurrencyStrength>>;
+    getPriceCandles: Array<CandlesData>;
+    isAllowedPartner?: Maybe<Scalars['Boolean']['output']>;
+    mapInstrumentNames?: Maybe<Array<Maybe<Instrument>>>;
+    orderPositionBooks: Array<Maybe<OrderPositionData>>;
+    resolveInstrumentsByDivision?: Maybe<Array<Instrument>>;
+    resolveInstrumentsWithFilters?: Maybe<InstrumentTableResult>;
+    sentiment?: Maybe<Array<SentimentInstrument>>;
+    sentimentList?: Maybe<Array<SentimentInstrument>>;
+    topicalInstruments?: Maybe<Array<TopicalInstrument>>;
+    topicalInstrumentsCharts?: Maybe<Array<TopicalInstrumentChart>>;
+    topicalInstrumentsTotalCount: Scalars['Int']['output'];
+    valueAtRiskAssetClasses?: Maybe<Array<AssetClass>>;
+    valueAtRiskChart?: Maybe<ValueAtRiskChart>;
+    volatilityChart?: Maybe<Array<Maybe<VolatilityChart>>>;
+    volatilityChartAssetClasses?: Maybe<Array<AssetClass>>;
+};
+export type QueryAssetClassesArgs = {
+    division: Division;
+};
+export type QueryCorrelationHeatmapArgs = {
+    division: Division;
+    instruments?: InputMaybe<Array<InputMaybe<Scalars['String']['input']>>>;
+    timeSpans?: InputMaybe<Array<InputMaybe<CorrelationTimeUnit>>>;
+};
+export type QueryCorrelationMatrixArgs = {
+    division: Division;
+    instruments?: InputMaybe<Array<InputMaybe<Scalars['String']['input']>>>;
+};
+export type QueryCurrencyPowerBalanceArgs = {
+    timeUnit: CurrencyPowerBalanceTimeUnit;
+};
+export type QueryGetPriceCandlesArgs = {
+    division?: InputMaybe<Division>;
+    granularity: Granularity;
+    instrument: Scalars['String']['input'];
+    timeSpan: TimeSpan;
+};
+export type QueryIsAllowedPartnerArgs = {
+    url: Scalars['String']['input'];
+};
+export type QueryMapInstrumentNamesArgs = {
+    division?: InputMaybe<Division>;
+    instruments: Array<InputMaybe<Scalars['String']['input']>>;
+};
+export type QueryOrderPositionBooksArgs = {
+    bookType: BookType;
+    dataSource?: InputMaybe<DataSource>;
+    instrument: Scalars['String']['input'];
+    recentHours?: InputMaybe<Scalars['Int']['input']>;
+    region?: InputMaybe<Region>;
+};
+export type QueryResolveInstrumentsByDivisionArgs = {
+    division: Division;
+    instruments: Array<InputMaybe<Scalars['String']['input']>>;
+};
+export type QueryResolveInstrumentsWithFiltersArgs = {
+    assetClass?: InputMaybe<Array<InputMaybe<AssetClassName>>>;
+    count?: InputMaybe<Scalars['Int']['input']>;
+    dataSource?: InputMaybe<InstrumentDataSource>;
+    division: Division;
+    instruments?: InputMaybe<Array<InputMaybe<Scalars['String']['input']>>>;
+    offset?: InputMaybe<Scalars['Int']['input']>;
+    searchPattern?: InputMaybe<Scalars['String']['input']>;
+};
+export type QuerySentimentArgs = {
+    division?: InputMaybe<Division>;
+    name: Scalars['String']['input'];
+};
+export type QuerySentimentListArgs = {
+    division?: InputMaybe<Division>;
+    sort?: InputMaybe<Sort>;
+};
+export type QueryTopicalInstrumentsArgs = {
+    assetClass?: InputMaybe<AssetClassName>;
+    count?: InputMaybe<Scalars['Int']['input']>;
+    division?: InputMaybe<Division>;
+    offset?: InputMaybe<Scalars['Int']['input']>;
+    sort: TopicalSort;
+};
+export type QueryTopicalInstrumentsChartsArgs = {
+    division?: InputMaybe<Division>;
+    instruments?: InputMaybe<Array<Scalars['String']['input']>>;
+};
+export type QueryTopicalInstrumentsTotalCountArgs = {
+    assetClass?: InputMaybe<AssetClassName>;
+    division?: InputMaybe<Division>;
+    sort: TopicalSort;
+};
+export type QueryValueAtRiskAssetClassesArgs = {
+    division?: InputMaybe<Division>;
+};
+export type QueryValueAtRiskChartArgs = {
+    bars: ValueAtRiskBars;
+    division?: InputMaybe<Division>;
+    duration: ValueAtRiskDuration;
+    instrument: Scalars['String']['input'];
+};
+export type QueryVolatilityChartArgs = {
+    division?: InputMaybe<Division>;
+    instrument: Scalars['String']['input'];
+    timeSpan: VolatilityChartTimeSpan;
+    timeUnit: VolatilityChartTimeUnit;
+};
+export type QueryVolatilityChartAssetClassesArgs = {
+    division?: InputMaybe<Division>;
+};
+export declare enum Region {
+    Amer = "AMER",
+    Apac = "APAC",
+    Emea = "EMEA"
+}
+export type Sentiment = {
+    __typename?: 'Sentiment';
+    longPercent: Scalars['Float']['output'];
+    shortPercent: Scalars['Float']['output'];
+};
+export type SentimentInstrument = {
+    __typename?: 'SentimentInstrument';
+    displayName: Scalars['String']['output'];
+    name: Scalars['String']['output'];
+    sentiment: Sentiment;
+    updatedAt: Scalars['String']['output'];
+};
+export declare enum Sort {
+    Bearish = "BEARISH",
+    Bullish = "BULLISH"
+}
+export type StrengthRelation = {
+    __typename?: 'StrengthRelation';
+    currency: CurrencyName;
+    percentage: Scalars['Float']['output'];
+};
+export type TimeCorrelation = {
+    __typename?: 'TimeCorrelation';
+    timeUnit: CorrelationTimeUnit;
+    value?: Maybe<Scalars['Float']['output']>;
+};
+export declare enum TimeSpan {
+    Day_1 = "DAY_1",
+    Day_2 = "DAY_2",
+    Hour_1 = "HOUR_1",
+    Hour_12 = "HOUR_12",
+    Month_1 = "MONTH_1",
+    Month_3 = "MONTH_3",
+    Month_6 = "MONTH_6",
+    Week_1 = "WEEK_1",
+    Week_2 = "WEEK_2",
+    Week_3 = "WEEK_3",
+    Year_1 = "YEAR_1"
+}
+export type TopicalInstrument = {
+    __typename?: 'TopicalInstrument';
+    assetClass?: Maybe<AssetClassName>;
+    displayName: Scalars['String']['output'];
+    name: Scalars['String']['output'];
+    sentiment: Sentiment;
+    updatedAt: Scalars['String']['output'];
+};
+export type TopicalInstrumentChart = {
+    __typename?: 'TopicalInstrumentChart';
+    chart?: Maybe<Array<Scalars['Float']['output']>>;
+    name: Scalars['String']['output'];
+};
+export declare enum TopicalSort {
+    Bearish = "BEARISH",
+    Bullish = "BULLISH",
+    Hot = "HOT",
+    Popular = "POPULAR",
+    Volatile = "VOLATILE"
+}
+export declare enum ValueAtRiskBars {
+    C100 = "C100",
+    C200 = "C200",
+    C300 = "C300"
+}
+export type ValueAtRiskChart = {
+    __typename?: 'ValueAtRiskChart';
+    down: ValueAtRiskChartData;
+    up: ValueAtRiskChartData;
+};
+export type ValueAtRiskChartData = {
+    __typename?: 'ValueAtRiskChartData';
+    average: Scalars['Float']['output'];
+    max: Scalars['Float']['output'];
+    median: Scalars['Float']['output'];
+    points?: Maybe<Array<ValueAtRiskChartPoint>>;
+    threshold: Scalars['Float']['output'];
+};
+export type ValueAtRiskChartPoint = {
+    __typename?: 'ValueAtRiskChartPoint';
+    percent: Scalars['Float']['output'];
+    pips: Scalars['Float']['output'];
+};
+export declare enum ValueAtRiskDuration {
+    C1 = "C1",
+    C2 = "C2",
+    C3 = "C3",
+    C4 = "C4",
+    C5 = "C5",
+    C10 = "C10"
+}
+export type VolatilityChart = {
+    __typename?: 'VolatilityChart';
+    pips: Scalars['Float']['output'];
+    /** Time point - hour in format hh:mm, Date in UTC, Week in format 'Mo' */
+    point: Scalars['String']['output'];
+    updatedAt: Scalars['String']['output'];
+};
+export declare enum VolatilityChartTimeSpan {
+    /**  Valid for: H */
+    D5 = "D5",
+    /**  Valid for: H */
+    D10 = "D10",
+    /**  Valid for: D */
+    M1 = "M1",
+    /**  Valid for: D */
+    M3 = "M3",
+    /**  Valid for: W */
+    W5 = "W5",
+    /**  Valid for: W */
+    W10 = "W10"
+}
+export declare enum VolatilityChartTimeUnit {
+    D = "D",
+    H = "H",
+    W = "W"
+}
+export type GetPriceCandlesQueryVariables = Exact<{
+    division?: InputMaybe<Division>;
+    instrument: Scalars['String']['input'];
+    granularity: Granularity;
+    timeSpan: TimeSpan;
+}>;
+export type GetPriceCandlesQuery = {
+    __typename?: 'Query';
+    getPriceCandles: Array<{
+        __typename?: 'CandlesData';
+        time: string;
+        unixTime: number;
+        timeSpan: TimeSpan;
+        candle: {
+            __typename?: 'Candle';
+            high: number;
+        };
+    }>;
+};
+export type ValidateInstrumentsQueryVariables = Exact<{
+    instruments: Array<InputMaybe<Scalars['String']['input']>> | InputMaybe<Scalars['String']['input']>;
+    division?: InputMaybe<Division>;
+}>;
+export type ValidateInstrumentsQuery = {
+    __typename?: 'Query';
+    mapInstrumentNames?: Array<{
+        __typename?: 'Instrument';
+        name: string;
+        displayName: string;
+    } | null> | null;
+};
+export declare const GetPriceCandlesDocument: DocumentNode<GetPriceCandlesQuery, GetPriceCandlesQueryVariables>;
+export declare const ValidateInstrumentsDocument: DocumentNode<ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables>;

package/dist/types/gql/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './fragment-masking';
+export * from './gql';

package/dist/types/gql/validateInstruments.d.ts

@@ -0,0 +1 @@
+export declare const validateInstruments: import("@apollo/client").DocumentNode;

package/dist/types/index.d.ts

@@ -0,0 +1 @@
+export * from './InstrumentsPriceChartWidget';

package/dist/types/translations/index.d.ts

@@ -0,0 +1,4 @@
+import type { Translations } from '@oanda/mono-i18n';
+import type { defaultTranslations } from './translations';
+export type TranslationKey = keyof typeof defaultTranslations;
+export declare const translations: Translations;

package/dist/types/translations/translations.d.ts

@@ -0,0 +1 @@
+export declare const defaultTranslations: {};

package/index.ts

@@ -0,0 +1 @@
+export * from './src';

package/lokalise.config.json

@@ -0,0 +1,18 @@
+{
+  "projectId": "19607517615e88022ba782.45168463",
+  "outputDir": "src/translations/sources",
+  "esModuleTranslations": "src/translations/translations.ts",
+  "messagesFormat": "esModule",
+  "esModuleConstName": "defaultTranslations",
+  "includeEmptyTranslations": true,
+  "downloadOptions": {
+    "format": "json",
+    "add_newline_eof": true,
+    "placeholder_format": "i18n",
+    "indentation": "2sp",
+    "plural_format": "i18next",
+    "export_empty_as": "skip",
+    "include_tags": ["common_widgets"],
+    "filter_langs": ["en", "zh_TW", "es", "th"]
+  }
+}

package/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@oanda/labs-instruments-price-chart-widget",
+  "version": "1.0.1",
+  "description": "Labs Instruments Price Chart Widget",
+  "main": "dist/main/index.js",
+  "module": "dist/module/index.js",
+  "types": "dist/types/index.d.ts",
+  "scripts": {
+    "codegen": "graphql-codegen --config codegen.ts"
+  },
+  "keywords": [],
+  "author": "OANDA",
+  "license": "UNLICENSED",
+  "dependencies": {
+    "@oanda/labs-widget-common": "^1.0.205",
+    "@oanda/mono-i18n": "10.0.1",
+    "graphql": "16.8.1"
+  },
+  "devDependencies": {
+    "@graphql-codegen/cli": "5.0.0",
+    "@graphql-codegen/client-preset": "4.1.0"
+  },
+  "gitHead": "c3d9e64eb9cf5a50d714b8147501b7dfe7aa4aed"
+}

package/src/InstrumentsPriceChartWidget/InstrumentsPriceChartWidget.tsx

@@ -0,0 +1,40 @@
+import { ApolloClient, InMemoryCache } from '@apollo/client';
+import { WidgetProvider, WidgetWrapper } from '@oanda/labs-widget-common';
+import React from 'react';
+
+import { translations } from '../translations';
+import { Main } from './Main';
+import type { InstrumentsPriceChartConfig } from './types';
+
+const InstrumentsPriceChartWidget = ({
+  graphqlUrl,
+  locale,
+  theme,
+  isParamError,
+  logoLink,
+  division,
+}: InstrumentsPriceChartConfig) => {
+  const client = new ApolloClient({
+    uri: graphqlUrl,
+    cache: new InMemoryCache(),
+  });
+
+  return (
+    <WidgetProvider
+      client={client}
+      locale={locale}
+      theme={theme}
+      translations={translations}
+    >
+      <WidgetWrapper
+        isParamError={isParamError}
+        linkArea="logo"
+        logoLink={logoLink}
+      >
+        <Main division={division} />
+      </WidgetWrapper>
+    </WidgetProvider>
+  );
+};
+
+export { InstrumentsPriceChartWidget };

package/src/InstrumentsPriceChartWidget/Main.tsx

@@ -0,0 +1,59 @@
+import { useQuery } from '@apollo/client';
+import {
+  Spinner,
+  SpinnerSize,
+  TimeUnitSwitch,
+} from '@oanda/labs-widget-common';
+import React, { useState } from 'react';
+
+import { getPriceCandles } from '../gql/mock/getPriceCandles';
+import { type GetPriceCandlesQuery } from '../gql/types/graphql';
+import { Chart } from './components/Chart';
+import { timeUnitConfig } from './config';
+import { type MainProps, TimeSpanSubset } from './types';
+
+const Main = ({ division }: MainProps) => {
+  const [selectedTimeUnit, setSelectedTimeUnit] = useState(
+    TimeSpanSubset.Day_1
+  );
+
+  const { loading, data, error } = useQuery<GetPriceCandlesQuery>(
+    getPriceCandles,
+    {
+      variables: {
+        timeSpan: TimeSpanSubset.Day_1,
+        division,
+      },
+      fetchPolicy: 'cache-and-network',
+    }
+  );
+
+  const showError =
+    data?.getPriceCandles.length === 0 || !data?.getPriceCandles || !!error;
+
+  return (
+    <div data-testid="instruments-price-chart-wrapper">
+      {loading && (
+        <div className="lw-mb-[50px] lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary">
+          <Spinner size={SpinnerSize.lg} />
+        </div>
+      )}
+
+      {!loading && !showError && (
+        <div data-testid="instruments-price-chart-widget">
+          <div className="lw-flex lw-pt-2">
+            <TimeUnitSwitch<TimeSpanSubset>
+              callback={setSelectedTimeUnit}
+              options={timeUnitConfig}
+              selected={selectedTimeUnit}
+            />
+          </div>
+
+          <Chart values={data?.getPriceCandles} />
+        </div>
+      )}
+    </div>
+  );
+};
+
+export { Main };

package/src/InstrumentsPriceChartWidget/components/Chart.tsx

@@ -0,0 +1,47 @@
+import {
+  BaseChart,
+  getChartTheme,
+  Theme,
+  useLayoutProvider,
+} from '@oanda/labs-widget-common';
+import { CustomChart, LineChart } from 'echarts/charts';
+import {
+  DatasetComponent,
+  GraphicComponent,
+  GridSimpleComponent,
+} from 'echarts/components';
+import * as echarts from 'echarts/core';
+import { CanvasRenderer } from 'echarts/renderers';
+import React from 'react';
+
+import { CHART_HEIGHT } from './constants';
+import { getOption } from './getOption';
+import type { ChartProps } from './types';
+
+echarts.use([
+  GridSimpleComponent,
+  GraphicComponent,
+  LineChart,
+  DatasetComponent,
+  CustomChart,
+  CanvasRenderer,
+]);
+
+echarts.registerTheme('dark_theme', getChartTheme(Theme.Dark));
+echarts.registerTheme('light_theme', getChartTheme(Theme.Light));
+
+export const Chart = ({ values }: ChartProps) => {
+  const { isDark } = useLayoutProvider();
+
+  return (
+    <BaseChart
+      chartHeight={CHART_HEIGHT}
+      echarts={echarts}
+      isDark={isDark}
+      option={getOption({
+        values,
+        isDark,
+      })}
+    />
+  );
+};

package/src/InstrumentsPriceChartWidget/components/constants.ts

@@ -0,0 +1,5 @@
+export const X_LABEL_SIZE = 40;
+export const Y_LABEL_SIZE_DESKTOP = 45;
+export const CHART_WIDTH = 9999;
+export const CHART_HEIGHT = 425;
+export const CHART_INTERVAL = 0.01;

package/src/InstrumentsPriceChartWidget/components/formatters.ts

@@ -0,0 +1,7 @@
+export const dailyFormatter = (timestamp: string) => {
+  const date = new Date(timestamp);
+  return date.toLocaleTimeString(undefined, {
+    hour: 'numeric',
+    hour12: true,
+  });
+};