From bb826c88f05f049d0dcda11ba299f4216ae28e31 Mon Sep 17 00:00:00 2001
From: "m.ray" <16125548+MadalinaRaicu@users.noreply.github.com>
Date: Mon, 22 Jan 2024 18:09:18 +0200
Subject: [PATCH] fix(trading): set trading view as default (#5632)

---
 .../nested-data-list.spec.tsx                 | 38 +------------------
 .../chart-container/chart-menu.spec.tsx       |  6 +--
 .../chart-container/use-chart-settings.ts     |  2 +-
 apps/trading/components/navbar/navbar.tsx     | 11 +++++-
 libs/trading-view/src/lib/trading-view.tsx    |  4 +-
 5 files changed, 17 insertions(+), 44 deletions(-)

diff --git a/apps/explorer/src/app/components/nested-data-list/nested-data-list.spec.tsx b/apps/explorer/src/app/components/nested-data-list/nested-data-list.spec.tsx
index dc0aba4fa..0e7dc03dc 100644
--- a/apps/explorer/src/app/components/nested-data-list/nested-data-list.spec.tsx
+++ b/apps/explorer/src/app/components/nested-data-list/nested-data-list.spec.tsx
@@ -1,9 +1,5 @@
 import { render, waitFor } from '@testing-library/react';
-import {
-  BORDER_COLOURS,
-  NestedDataList,
-  sortNestedDataByChildren,
-} from './nested-data-list';
+import { NestedDataList, sortNestedDataByChildren } from './nested-data-list';
 import userEvent from '@testing-library/user-event';
 
 const mockData = {
@@ -61,38 +57,6 @@ describe('NestedDataList', () => {
     expect(parent[0].querySelector('li')).toHaveClass('pl-4 border-l-4 pt-2');
   });
 
-  it('should repeat the border colours in the correct order', () => {
-    const colourMockData = {
-      t0: {
-        t1: {
-          t2: {
-            t3: {
-              t4: {
-                t5: {
-                  t6: {
-                    t7: {
-                      t8: {
-                        hello: 'world',
-                      },
-                    },
-                  },
-                },
-              },
-            },
-          },
-        },
-      },
-    };
-    const tree = render(<NestedDataList data={colourMockData} />);
-    const { getByTestId } = tree;
-
-    for (let i = 0; i < 8; i++) {
-      const item = getByTestId(`T${i}`);
-      const expected = BORDER_COLOURS.light[i % 5];
-      expect(item.style.borderColor.toUpperCase()).toBe(expected);
-    }
-  });
-
   it('should sort the data by values with children', () => {
     const mockData = {
       nonce: '5980890939790185837',
diff --git a/apps/trading/components/chart-container/chart-menu.spec.tsx b/apps/trading/components/chart-container/chart-menu.spec.tsx
index e3611b278..ea844d731 100644
--- a/apps/trading/components/chart-container/chart-menu.spec.tsx
+++ b/apps/trading/components/chart-container/chart-menu.spec.tsx
@@ -27,11 +27,11 @@ describe('ChartMenu', () => {
 
     render(<ChartMenu />);
 
-    await userEvent.click(screen.getByRole('button', { name: 'TradingView' }));
-    expect(useChartSettingsStore.getState().chartlib).toEqual('tradingview');
-
     await userEvent.click(screen.getByRole('button', { name: 'Vega chart' }));
     expect(useChartSettingsStore.getState().chartlib).toEqual('pennant');
+
+    await userEvent.click(screen.getByRole('button', { name: 'TradingView' }));
+    expect(useChartSettingsStore.getState().chartlib).toEqual('tradingview');
   });
 
   describe('tradingview', () => {
diff --git a/apps/trading/components/chart-container/use-chart-settings.ts b/apps/trading/components/chart-container/use-chart-settings.ts
index fb33b3297..0349faba7 100644
--- a/apps/trading/components/chart-container/use-chart-settings.ts
+++ b/apps/trading/components/chart-container/use-chart-settings.ts
@@ -30,7 +30,7 @@ const STUDY_ORDER: Study[] = [
 ];
 
 export const DEFAULT_CHART_SETTINGS = {
-  chartlib: 'pennant' as const,
+  chartlib: 'tradingview' as const,
   interval: Interval.INTERVAL_I15M,
   type: ChartType.CANDLE,
   overlays: [Overlay.MOVING_AVERAGE],
diff --git a/apps/trading/components/navbar/navbar.tsx b/apps/trading/components/navbar/navbar.tsx
index ac6690841..1328f26f6 100644
--- a/apps/trading/components/navbar/navbar.tsx
+++ b/apps/trading/components/navbar/navbar.tsx
@@ -162,6 +162,8 @@ const NavbarMenu = ({ onClick }: { onClick: () => void }) => {
   const envNameMapping = useEnvNameMapping();
   const { VEGA_ENV, VEGA_NETWORKS, GITHUB_FEEDBACK_URL } = useEnvironment();
   const marketId = useGlobalStore((store) => store.marketId);
+  const GOVERNANCE_LINK = useLinks(DApp.Governance)();
+  const EXPLORER_LINK = useLinks(DApp.Explorer)();
 
   return (
     <div className="gap-3 lg:flex lg:h-full">
@@ -220,7 +222,7 @@ const NavbarMenu = ({ onClick }: { onClick: () => void }) => {
           </NavbarLink>
         </NavbarItem>
         <NavbarItem>
-          <NavbarLinkExternal to={useLinks(DApp.Governance)()}>
+          <NavbarLinkExternal to={GOVERNANCE_LINK}>
             {t('Governance')}
           </NavbarLinkExternal>
         </NavbarItem>
@@ -228,6 +230,13 @@ const NavbarMenu = ({ onClick }: { onClick: () => void }) => {
           <NavbarTrigger>{t('Resources')}</NavbarTrigger>
           <NavbarContent data-testid="navbar-content-resources">
             <ul className="lg:p-4">
+              {EXPLORER_LINK && (
+                <NavbarSubItem>
+                  <NavbarLinkExternal to={EXPLORER_LINK}>
+                    {t('Explorer')}
+                  </NavbarLinkExternal>
+                </NavbarSubItem>
+              )}
               {DocsLinks?.NEW_TO_VEGA && (
                 <NavbarSubItem>
                   <NavbarLinkExternal to={DocsLinks?.NEW_TO_VEGA}>
diff --git a/libs/trading-view/src/lib/trading-view.tsx b/libs/trading-view/src/lib/trading-view.tsx
index c4325fb00..4d7470fff 100644
--- a/libs/trading-view/src/lib/trading-view.tsx
+++ b/libs/trading-view/src/lib/trading-view.tsx
@@ -100,12 +100,12 @@ export const TradingView = ({
     },
 
     // No theme in deps to avoid full chart reload when the theme changes
-    // Instead the theme is changed programmitcally in a separate useEffect
+    // Instead the theme is changed programmatically in a separate useEffect
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [datafeed, marketId, language, libraryPath, isMobile]
   );
 
-  // Update the trading view theme every time the app theme updates, doen separately
+  // Update the trading view theme every time the app theme updates, done separately
   // to avoid full chart reload
   useEffect(() => {
     if (!widgetRef.current || !widgetRef.current._ready) return;