diff --git a/apps/trading/components/chart-container/chart-container.spec.tsx b/apps/trading/components/chart-container/chart-container.spec.tsx
index 585df9755..a5b1efcfa 100644
--- a/apps/trading/components/chart-container/chart-container.spec.tsx
+++ b/apps/trading/components/chart-container/chart-container.spec.tsx
@@ -1,3 +1,41 @@
+import { render, screen } from '@testing-library/react';
+import { ChartContainer } from './chart-container';
+import { useCandlesChartSettingsStore } from './use-candles-chart-settings';
+
+jest.mock('@vegaprotocol/candles-chart', () => ({
+  CandlesChartContainer: ({ marketId }: { marketId: string }) => (
+    <div data-testid="pennant">{marketId}</div>
+  ),
+}));
+
+jest.mock('@vegaprotocol/trading-view', () => ({
+  TradingViewContainer: ({ marketId }: { marketId: string }) => (
+    <div data-testid="tradingview">{marketId}</div>
+  ),
+}));
+
 describe('ChartContainer', () => {
-  it.todo('switches chart type');
+  it('shows tradingview chart', () => {
+    useCandlesChartSettingsStore.setState({
+      chartlib: 'tradingview',
+    });
+
+    const marketId = 'market-id';
+
+    render(<ChartContainer marketId={marketId} />);
+
+    expect(screen.getByTestId('tradingview')).toHaveTextContent(marketId);
+  });
+
+  it('shows pennant chart', () => {
+    useCandlesChartSettingsStore.setState({
+      chartlib: 'pennant',
+    });
+
+    const marketId = 'market-id';
+
+    render(<ChartContainer marketId={marketId} />);
+
+    expect(screen.getByTestId('pennant')).toHaveTextContent(marketId);
+  });
 });
diff --git a/apps/trading/components/chart-container/chart-container.tsx b/apps/trading/components/chart-container/chart-container.tsx
index 96a29825c..5af014560 100644
--- a/apps/trading/components/chart-container/chart-container.tsx
+++ b/apps/trading/components/chart-container/chart-container.tsx
@@ -3,7 +3,7 @@ import {
   useCandlesChartSettings,
   STUDY_SIZE,
 } from './use-candles-chart-settings';
-import { TradingViewContainer } from '../../components/trading-view-container';
+import { TradingViewContainer } from '@vegaprotocol/trading-view';
 
 /**
  * Renders either the pennant chart or the tradingview chart
diff --git a/apps/trading/components/trading-view-container/index.ts b/apps/trading/components/trading-view-container/index.ts
deleted file mode 100644
index 97f6bf9f5..000000000
--- a/apps/trading/components/trading-view-container/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { TradingViewContainer } from './trading-view-container';
diff --git a/apps/trading/components/trading-view-container/trading-view-container.tsx b/apps/trading/components/trading-view-container/trading-view-container.tsx
deleted file mode 100644
index eb2f4f1ba..000000000
--- a/apps/trading/components/trading-view-container/trading-view-container.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { TradingView } from '@vegaprotocol/trading-view';
-
-export const TradingViewContainer = ({ marketId }: { marketId: string }) => {
-  return <TradingView marketId={marketId} />;
-};
diff --git a/libs/trading-view/src/index.ts b/libs/trading-view/src/index.ts
index 12de0145e..a7b0d3949 100644
--- a/libs/trading-view/src/index.ts
+++ b/libs/trading-view/src/index.ts
@@ -1 +1 @@
-export * from './lib/trading-view';
+export { TradingViewContainer } from './lib/trading-view';
diff --git a/libs/trading-view/src/lib/trading-view.tsx b/libs/trading-view/src/lib/trading-view.tsx
index ff0cc013d..38e1f64ec 100644
--- a/libs/trading-view/src/lib/trading-view.tsx
+++ b/libs/trading-view/src/lib/trading-view.tsx
@@ -44,15 +44,15 @@ export const useScript = (url: string) => {
   return loaded;
 };
 
-export const TradingView = ({ marketId }: { marketId: string }) => {
+export const TradingViewContainer = ({ marketId }: { marketId: string }) => {
   const loaded = useScript(LIBRARY_PATH);
 
   if (!loaded) return null;
 
-  return <TradingViewChart marketId={marketId} />;
+  return <TradingView marketId={marketId} />;
 };
 
-export const TradingViewChart = ({ marketId }: { marketId: string }) => {
+export const TradingView = ({ marketId }: { marketId: string }) => {
   const { theme } = useThemeSwitcher();
   const chartContainerRef =
     useRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>;