Merge branch 'main' into feat/docs-revamp-layout

Author: salmad3

components/InteractiveTerminal/InteractiveTerminal.tsx

@@ -0,0 +1,59 @@
+import React, { useEffect, useState } from 'react';
+import styles from '../../styles/InteractiveTerminal.module.css';
+
+const InteractiveTerminal: React.FC = () => {
+	const [jsonData, setJsonData] = useState<any>(null);
+	const [expandedNodes, setExpandedNodes] = useState<Set<string>>(new Set());
+
+	useEffect(() => {
+		fetch('https://raw.githubusercontent.com/cosmos/chain-registry/refs/heads/master/sei/chain.json')
+			.then((res) => res.json())
+			.then((data) => setJsonData(data))
+			.catch((err) => console.error('Failed to fetch JSON data:', err));
+	}, []);
+
+	const toggleNode = (path: string) => {
+		setExpandedNodes((prevNodes) => {
+			const newNodes = new Set(prevNodes);
+			if (newNodes.has(path)) {
+				newNodes.delete(path);
+			} else {
+				newNodes.add(path);
+			}
+			return newNodes;
+		});
+	};
+
+	const renderNode = (key: string, value: any, path: string) => {
+		const isExpandable = typeof value === 'object' && value !== null;
+		const isOpen = expandedNodes.has(path);
+		const displayKey = key || 'root';
+
+		return (
+			<div key={path} className={styles.node}>
+				<div className={styles.nodeHeader} onClick={() => isExpandable && toggleNode(path)}>
+					{isExpandable && (isOpen ? '▼' : '▶')} {displayKey}
+				</div>
+				{isExpandable && isOpen && (
+					<div className={styles.nodeChildren}>
+						{Object.entries(value).map(([childKey, childValue]) => renderNode(childKey, childValue, `${path}.${childKey}`))}
+					</div>
+				)}
+				{!isExpandable && <div className={styles.leafNode}>{String(value)}</div>}
+			</div>
+		);
+	};
+
+	return (
+		<div className={styles.terminal}>
+			<div className={styles.header}>
+				<div className={styles.circle} style={{ backgroundColor: '#FF605C' }} />
+				<div className={styles.circle} style={{ backgroundColor: '#FFBD44' }} />
+				<div className={styles.circle} style={{ backgroundColor: '#00CA4E' }} />
+			</div>
+			<div className={styles.body}>{jsonData ? renderNode('', jsonData, 'root') : <div className={styles.loading}>Loading...</div>}</div>
+		</div>
+	);
+};
+
+export default InteractiveTerminal;

components/InteractiveTerminal/index.ts

@@ -0,0 +1 @@
+export { default as InteractiveTerminal } from './InteractiveTerminal';

components/index.ts

@@ -15,3 +15,4 @@ export * from './Nfts';
 export * from './VersionFetcher';
 export * from './PropertyInfo';
 export * from './EcosystemMap';
+export * from './InteractiveTerminal';

pages/build/dev-ecosystem-providers/wallets.mdx

@@ -13,6 +13,7 @@ Wallets are essential for managing assets and interacting with the Sei blockchai
 
 | Wallet                         | EVM Support | Native Support | Authentication Method | Coin Type | Type     | Mobile Support | Link                                                                                          |
 |--------------------------------|-------------|----------------|-----------------------|-----------|----------|----------------|-----------------------------------------------------------------------------------------------|
+| **Arculus**                    | ✅           | ✅              | Hardware             | 118 / 60  | Software | ✅              | [Arculus](https://www.getarculus.com)                                                     |
 | **Compass**                    | ✅           | ✅              | Mnemonic / Privkey    | 118       | Software | ✅              | [Compass Wallet](https://compasswallet.io)                                                     |
 | **Fin**                        | ✅           | ✅              | Mnemonic / Privkey    | 118       | Software | ❌              | [Fin Wallet](https://finwallet.com)                                                            |
 | **Keplr**                      | ✅           | ✅              | Mnemonic / Privkey    | 118       | Software | ✅              | [Keplr Wallet](https://wallet.keplr.app)                                                       |

pages/users/wallet-setup.mdx

@@ -8,16 +8,11 @@ import cosmSigningImage from "../../public/assets/cosm-signing.png";
 
 ### Installing a Wallet app
 
-**For complete functionality, it is recommended to navigate Sei with one of the wallets listed on the Wallets Page:**
-
-[Wallets Page](../dev-ecosystem-providers/wallets.mdx)
-
-For more wallet options, please visit our [registry](https://github.com/sei-protocol/chain-registry/blob/main/wallets.json).
+**For complete functionality, it is recommended to use one of the wallets listed on the [Wallets Page](../dev-ecosystem-providers/wallets.mdx)**
 
 <Callout type="warning">
-**Caution:** It is not recommended to manually import from an EVM-only wallet
-to a native Sei wallet, or vice versa. Doing so may result in a different
-address.
+**Attention:** Manually importing your wallet using a mnemonic from an EVM-only wallet app
+to a Cosmos based wallet app, or vice versa is not recommended. This may generate unexpected wallet address due to differing [cointypes](https://en.bitcoin.it/wiki/BIP_0044#Coin_type).
 </Callout>
 
 ### Adding the Network to Metamask

styles/InteractiveTerminal.module.css

@@ -0,0 +1,53 @@
+.terminal {
+	background-color: #1e1e1e;
+	color: #00ff00;
+	border-radius: 8px;
+	padding: 16px;
+	font-family: 'Courier New', monospace;
+	width: 600px;
+	margin: 0 auto;
+	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.header {
+	display: flex;
+	justify-content: flex-start;
+	padding-bottom: 8px;
+}
+
+.circle {
+	width: 12px;
+	height: 12px;
+	border-radius: 50%;
+	margin-right: 8px;
+}
+
+.body {
+	background-color: #1b1b1b;
+	border-radius: 4px;
+	padding: 8px;
+	overflow-y: auto;
+	max-height: 400px;
+}
+
+.node {
+	margin-left: 16px;
+}
+
+.nodeHeader {
+	cursor: pointer;
+	user-select: none;
+}
+
+.nodeChildren {
+	margin-left: 16px;
+}
+
+.leafNode {
+	margin-left: 32px;
+}
+
+.loading {
+	text-align: center;
+	color: #d1d5db;
+}