diff --git a/src/app/[lang]/components/NavBar/NavBar.test.tsx b/src/app/[lang]/components/NavBar/NavBar.test.tsx
index 533492a..cb9c3de 100644
--- a/src/app/[lang]/components/NavBar/NavBar.test.tsx
+++ b/src/app/[lang]/components/NavBar/NavBar.test.tsx
@@ -1,6 +1,8 @@
 import '@testing-library/jest-dom';
 import { render, screen } from '@testing-library/react';
 import i18nextClientMock from '@/app/lib/testing/i18nextClientMock';
+// This must be imported after the mock classes are imported
+import { JotaiProvider } from '@/app/[lang]/components';
 
 // Mock react `use` function before modules that use it are imported
 jest.mock('react', () => ({
@@ -21,33 +23,36 @@ jest.mock('next/navigation', () => ({
 // Mock i18next because it is used by child components
 jest.mock('react-i18next', () => i18nextClientMock);
 
+// Mock the wallet provider
+jest.mock('../wallet/WalletProvider.tsx', () => 'div');
+
 import NavBar  from './NavBar';
 
 describe('Nav Bar Component', () => {
 
   it('renders', async () => {
-    render(<NavBar />);
+    render(<JotaiProvider><NavBar /></JotaiProvider>);
     expect(await screen.findByRole('navigation')).toBeInTheDocument();
   });
 
   it('has site name', async () => {
-    render(<NavBar />);
+    render(<JotaiProvider><NavBar /></JotaiProvider>);
     expect(await screen.findByText('site_name_pt1')).toBeInTheDocument();
     expect(screen.getByText('site_name_pt2')).toBeInTheDocument();
   });
 
   it('has node selector button', async () => {
-    render(<NavBar />);
+    render(<JotaiProvider><NavBar /></JotaiProvider>);
     expect(await screen.findByTitle('node_selector.choose_node')).toBeInTheDocument();
   });
 
   it('has language selector button', async () => {
-    render(<NavBar />);
+    render(<JotaiProvider><NavBar /></JotaiProvider>);
     expect(await screen.findByTestId('lang-btn')).toBeInTheDocument();
   });
 
   it('has settings button', async () => {
-    render(<NavBar />);
+    render(<JotaiProvider><NavBar /></JotaiProvider>);
     expect(await screen.findByTitle('settings.heading')).toBeInTheDocument();
   });
 
diff --git a/src/app/[lang]/components/NavBar/NodeSelector/CustomNodeDialogContent.tsx b/src/app/[lang]/components/NavBar/NodeSelector/CustomNodeDialogContent.tsx
index 52ed2d8..769b01b 100644
--- a/src/app/[lang]/components/NavBar/NodeSelector/CustomNodeDialogContent.tsx
+++ b/src/app/[lang]/components/NavBar/NodeSelector/CustomNodeDialogContent.tsx
@@ -12,9 +12,9 @@ import { type PrimitiveAtom, atom, useAtom, useAtomValue, useSetAtom, useStore }
 import { RESET } from "jotai/utils";
 import { atomWithValidate } from "jotai-form";
 import * as NodeConfigLib from "@/app/lib/node-config";
+import { ToastNotification } from '@/app/[lang]/components';
 import { FieldErrorMessage, FieldGroup, TextField } from "@/app/[lang]/components/form";
 import { ValidationMessage, isAlgodOK, removeNonNumericalChars } from "@/app/lib/utils";
-import ToastNotification from '@/app/[lang]/components/ToastNotification';
 import { UNIT_NAME_MAX_LENGTH } from "@/app/lib/txn-data/constants";
 
 type Props = {
diff --git a/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.test.tsx b/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.test.tsx
index ad4f8fd..abc8738 100644
--- a/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.test.tsx
+++ b/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.test.tsx
@@ -9,9 +9,9 @@ import {
   voiTestnetNodeConfig,
 } from '@/app/lib/node-config';
 import { type NodeConfig } from '@/app/lib/node-config';
-import JotaiProvider from '@/app/[lang]/components/JotaiProvider';
-import { Provider as ToastProvider, Viewport as ToastViewport } from '@radix-ui/react-toast';
 import i18nextClientMock from '@/app/lib/testing/i18nextClientMock';
+// Jotai provider must be imported after the mock classes are imported
+import { JotaiProvider, ToastProvider, ToastViewport } from '@/app/[lang]/components';
 
 // Mock i18next before modules that use it are imported
 jest.mock('react-i18next', () => i18nextClientMock);
@@ -44,6 +44,9 @@ jest.mock('algosdk', () => ({
   }
 }));
 
+// Mock the wallet provider
+jest.mock('../../wallet/WalletProvider.tsx', () => 'div');
+
 import NodeSelector from './NodeSelector';
 
 describe('Node Selector', () => {
diff --git a/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.tsx b/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.tsx
index d3caabc..5832ee5 100644
--- a/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.tsx
+++ b/src/app/[lang]/components/NavBar/NodeSelector/NodeSelector.tsx
@@ -19,7 +19,7 @@ import {
 } from '@tabler/icons-react';
 import { useTranslation } from '@/app/i18n/client';
 import * as NodeConfigLib from '@/app/lib/node-config';
-import DialogLoadingPlaceholder from '@/app/[lang]/components/DialogLoadingPlaceholder';
+import { DialogLoadingPlaceholder } from '@/app/[lang]/components';
 import NodeMenuItem from './NodeMenuItem';
 
 const ViewConfigDialogContent = dynamic(() => import('./ViewConfigDialogContent'), {
diff --git a/src/app/[lang]/components/NavBar/Settings/SettingsDialog.tsx b/src/app/[lang]/components/NavBar/Settings/SettingsDialog.tsx
index 45f780d..7023fa4 100644
--- a/src/app/[lang]/components/NavBar/Settings/SettingsDialog.tsx
+++ b/src/app/[lang]/components/NavBar/Settings/SettingsDialog.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from '@/app/i18n/client';
 import * as Dialog from '@radix-ui/react-dialog';
 import { IconSettings, IconX } from '@tabler/icons-react';
 import dynamic from 'next/dynamic';
-import DialogLoadingPlaceholder from '@/app/[lang]/components/DialogLoadingPlaceholder';
+import { DialogLoadingPlaceholder } from '@/app/[lang]/components';
 
 const SettingsModalBox = dynamic(() => import('./SettingsForm'), {
   ssr: false,
diff --git a/src/app/[lang]/components/NavBar/Settings/SettingsForm.tsx b/src/app/[lang]/components/NavBar/Settings/SettingsForm.tsx
index 32461e1..3a90fd4 100644
--- a/src/app/[lang]/components/NavBar/Settings/SettingsForm.tsx
+++ b/src/app/[lang]/components/NavBar/Settings/SettingsForm.tsx
@@ -5,6 +5,7 @@ import { useAtom, useSetAtom } from 'jotai';
 import { RESET } from 'jotai/utils';
 import { useTranslation } from '@/app/i18n/client';
 import { Trans } from 'react-i18next';
+import { ToastNotification, WalletProvider } from '@/app/[lang]/components';
 import {
   NumberField,
   RadioButtonGroupField,
@@ -12,10 +13,8 @@ import {
 } from '@/app/[lang]/components/form';
 import { useDebouncedCallback } from 'use-debounce';
 import * as Settings from '@/app/lib/app-settings';
-import { WalletProvider } from '@/app/[lang]/components';
 import { storedSignedTxnAtom, storedTxnDataAtom } from '@/app/lib/txn-data';
 import ConnectWallet from './ConnectWallet';
-import ToastNotification from '@/app/[lang]/components/ToastNotification';
 import { IconExclamationCircle } from '@tabler/icons-react';
 
 type Props = {
diff --git a/src/app/[lang]/components/PageTitleHeading/index.ts b/src/app/[lang]/components/PageTitleHeading/index.ts
new file mode 100644
index 0000000..01103ec
--- /dev/null
+++ b/src/app/[lang]/components/PageTitleHeading/index.ts
@@ -0,0 +1,2 @@
+import PageTitleHeading from './PageTitleHeading';
+export default PageTitleHeading;
diff --git a/src/app/[lang]/components/index.ts b/src/app/[lang]/components/index.ts
index 6ad721a..f357f57 100644
--- a/src/app/[lang]/components/index.ts
+++ b/src/app/[lang]/components/index.ts
@@ -1,8 +1,10 @@
 export {default as BuilderSteps} from './BuilderSteps';
+export {default as DialogLoadingPlaceholder} from './DialogLoadingPlaceholder';
 export {default as Footer} from './Footer';
 export {default as JotaiProvider} from './JotaiProvider';
 export {default as NavBar} from './NavBar';
-export {default as PageTitleHeading} from './PageTitleHeading/PageTitleHeading';
+export {default as PageTitleHeading} from './PageTitleHeading';
+export {default as ToastNotification} from './ToastNotification';
 export {default as ToastProvider} from './ToastProvider';
 export {default as ToastViewport} from './ToastViewport';
 export {default as WalletProvider} from './wallet/WalletProvider';