diff --git a/src/contexts/Api/index.tsx b/src/contexts/Api/index.tsx
index 147d71d6..ee237c98 100644
--- a/src/contexts/Api/index.tsx
+++ b/src/contexts/Api/index.tsx
@@ -147,8 +147,10 @@ export const ApiProvider = ({ children }: { children: ReactNode }) => {
if (tab?.chain && tab.autoConnect) {
const { id, provider } = tab.chain;
- const endpoint = NetworkDirectory[id].providers[provider];
- ApiController.instantiate(tab.id, id, endpoint);
+ const endpoint = NetworkDirectory[id]?.providers[provider];
+ if (endpoint) {
+ ApiController.instantiate(tab.id, id, endpoint);
+ }
}
});
}, []);
diff --git a/src/contexts/Tabs/defaults.ts b/src/contexts/Tabs/defaults.ts
index db7ab069..90018c93 100644
--- a/src/contexts/Tabs/defaults.ts
+++ b/src/contexts/Tabs/defaults.ts
@@ -28,6 +28,7 @@ export const defaultTabsContext: TabsContextInterface = {
redirectCounter: 0,
incrementRedirectCounter: () => {},
connectTab: (tabId, chainId, endpoint) => {},
+ getStoredChain: (tabId) => undefined,
};
export const DEFAULT_TAB_WIDTH_PX = 145;
@@ -65,10 +66,7 @@ export const defaultTabs: Tabs = [
},
{
id: 4,
- chain: {
- id: 'westend',
- provider: 'IBP-GeoDNS1',
- },
+ chain: undefined,
name: 'Westend Relay Chain',
autoConnect: false,
},
diff --git a/src/contexts/Tabs/index.tsx b/src/contexts/Tabs/index.tsx
index d6d34bbc..e0a0b8ed 100644
--- a/src/contexts/Tabs/index.tsx
+++ b/src/contexts/Tabs/index.tsx
@@ -93,6 +93,17 @@ export const TabsProvider = ({ children }: { children: ReactNode }) => {
const getChainTab = (chainId: ChainId) =>
tabs.find((tab) => tab.chain?.id === chainId);
+ // Gets the previously connected to chain, if present.
+ const getStoredChain = (tabId: number) => {
+ const tab = tabs.find(({ id }) => id === tabId);
+
+ if (!tab?.chain?.id) {
+ return undefined;
+ }
+
+ return { id: tab.chain.id, chain: NetworkDirectory[tab.chain.id] };
+ };
+
// Get the largest id from a list of tabs.
const getLargestId = (list: Tabs) =>
[...list].sort((a, b) => b.id - a.id)?.[0].id || 0;
@@ -167,6 +178,7 @@ export const TabsProvider = ({ children }: { children: ReactNode }) => {
tab.id === tabId
? {
...tab,
+ // Auto rename the tab here if the setting is turned on.
name: autoTabNaming ? getAutoTabName(chainId) : tab.name,
chain: { id: chainId, provider },
}
@@ -204,6 +216,7 @@ export const TabsProvider = ({ children }: { children: ReactNode }) => {
connectTab,
redirectCounter,
incrementRedirectCounter,
+ getStoredChain,
instantiatedIds: instantiatedIds.current,
}}
>
diff --git a/src/contexts/Tabs/types.ts b/src/contexts/Tabs/types.ts
index e1b1460d..f2e22518 100644
--- a/src/contexts/Tabs/types.ts
+++ b/src/contexts/Tabs/types.ts
@@ -1,7 +1,7 @@
// Copyright 2024 @rossbulat/console authors & contributors
// SPDX-License-Identifier: GPL-3.0-only
-import type { ChainId } from 'config/networks';
+import type { ChainId, NetworkDirectoryItem } from 'config/networks';
import type { Dispatch, SetStateAction } from 'react';
export type Tabs = Tab[];
@@ -42,4 +42,7 @@ export interface TabsContextInterface {
redirectCounter: number;
incrementRedirectCounter: () => void;
connectTab: (tabId: number, chainId: ChainId, endpoint: string) => void;
+ getStoredChain: (
+ tabId: number
+ ) => { id: ChainId; chain: NetworkDirectoryItem } | undefined;
}
diff --git a/src/screens/Default/Connect/ChainList.tsx b/src/screens/Default/Connect/ChainList.tsx
index 73dd517c..d796ea10 100644
--- a/src/screens/Default/Connect/ChainList.tsx
+++ b/src/screens/Default/Connect/ChainList.tsx
@@ -11,11 +11,12 @@ import { useTags } from 'contexts/Tags';
import type { TagItem } from 'contexts/Tags/types';
export const ChainList = () => {
- const { activeTabId } = useTabs();
const { getTagsForChain } = useTags();
+ const { activeTabId, getStoredChain } = useTabs();
const { getAppliedTags, getSearchTerm } = useChainFilter();
+ const tabStoredChain = getStoredChain(activeTabId);
- // NOTE: Currently naively filering simple chain list.
+ // NOTE: Currently naively filtering simple chain list.
const results = NetworkDirectory;
@@ -35,6 +36,13 @@ export const ChainList = () => {
// Filter chains based on search term.
const searchTerm = getSearchTerm(activeTabId);
+ // Remove the currently stored chain from results if it exists.
+ if (tabStoredChain) {
+ filtered = Object.fromEntries(
+ Object.entries(filtered).filter(([key]) => key !== tabStoredChain.id)
+ );
+ }
+
if (searchTerm !== '') {
filtered = Object.fromEntries(
Object.entries(filtered).filter(([, { name }]) =>
diff --git a/src/screens/Default/Connect/RecentChain.tsx b/src/screens/Default/Connect/RecentChain.tsx
new file mode 100644
index 00000000..e977efd4
--- /dev/null
+++ b/src/screens/Default/Connect/RecentChain.tsx
@@ -0,0 +1,26 @@
+// Copyright 2024 @rossbulat/console authors & contributors
+// SPDX-License-Identifier: GPL-3.0-only
+
+import { useTabs } from 'contexts/Tabs';
+import { ChainListWrapper, Separator } from './Wrappers';
+import { ChainListItem } from './ChainListItem';
+import type { ChainId } from 'config/networks';
+
+export const RecentChain = () => {
+ const { activeTabId, getStoredChain, getActiveTab } = useTabs();
+ const activeTab = getActiveTab();
+
+ const result = getStoredChain(activeTabId);
+
+ if (!result || !activeTab?.chain?.id) {
+ return null;
+ }
+
+ return (
+
+
+ Recently Connected
+
+
+ );
+};
diff --git a/src/screens/Default/Connect/index.tsx b/src/screens/Default/Connect/index.tsx
index db137e88..c99687a5 100644
--- a/src/screens/Default/Connect/index.tsx
+++ b/src/screens/Default/Connect/index.tsx
@@ -5,11 +5,13 @@ import { ChainList } from './ChainList';
import { AutoConnect } from '../AutoConnect';
import { SearchChain } from './SearchChain';
import { PageContentWrapper } from 'library/Page/Wrapper';
+import { RecentChain } from './RecentChain';
export const Connect = () => (
+
);