feat: use the chartView LocalStore to load the last set resolution (#769)

src/components/trade/TradeChart/index.tsx

@@ -8,7 +8,10 @@ import Text from 'components/common/Text'
 import { datafeed } from 'components/trade/TradeChart/DataFeed'
 import PoweredByPyth from 'components/trade/TradeChart/PoweredByPyth'
 import { disabledFeatures, enabledFeatures } from 'components/trade/TradeChart/constants'
+import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
+import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
@@ -20,6 +23,10 @@ interface Props {
 }
 export default function TradeChart(props: Props) {
   const { data: prices, isLoading } = usePrices()
+  const [chartInterval, _] = useLocalStorage<ResolutionString>(
+    LocalStorageKeys.CHART_INTERVAL,
+    DEFAULT_SETTINGS.chartInterval,
+  )
   const ratio = useMemo(() => {
     const priceBuyAsset = prices.find(byDenom(props.buyAsset.denom))?.amount
     const priceSellAsset = prices.find(byDenom(props.sellAsset.denom))?.amount
@@ -35,7 +42,7 @@ export default function TradeChart(props: Props) {
       const widgetOptions: ChartingLibraryWidgetOptions = {
         symbol: props.buyAsset.pythFeedName ?? `${props.buyAsset.symbol}/USD`,
         datafeed: datafeed,
-        interval: '1h' as ResolutionString,
+        interval: chartInterval,
         library_path: '/charting_library/',
         locale: 'en',
         time_scale: {

src/constants/defaultSettings.ts

@@ -1,5 +1,6 @@
 import { ORACLE_DENOM } from 'constants/oracle'
 import useStore from 'store'
+import { ResolutionString } from 'utils/charting_library/charting_library'
 
 // This does not retrigger when chains are switched. Assets might not be present on the new chain, but
 // This scenario is still caught.
@@ -22,4 +23,5 @@ export const DEFAULT_SETTINGS: Settings = {
   migrationBanner: true,
   perpsAsset: '',
   updateOracle: true,
+  chartInterval: '60' as ResolutionString,
 }

src/constants/localStorageKeys.ts

@@ -16,4 +16,5 @@ export enum LocalStorageKeys {
   CURRENT_CHAIN_ID = 'currentChainId',
   PERPS_ASSET = 'perpsAsset',
   UPDATE_ORACLE = 'updateOracle',
+  CHART_INTERVAL = 'tradingview.chart.lastUsedTimeBasedResolution',
 }

src/types/interfaces/store/settings.d.ts

@@ -10,4 +10,5 @@ interface Settings {
   tutorial: boolean
   migrationBanner: boolean
   updateOracle: boolean
+  chartInterval: import('utils/charting_library').ResolutionString
 }