From dbf0027aa709d2d64e43cf0cc90b9a343480656e Mon Sep 17 00:00:00 2001 From: devchenyan Date: Fri, 12 Jul 2024 13:52:57 +0800 Subject: [PATCH] feat: Supports adding light client custom nodes --- .../components/NetworkEditorDialog/hooks.ts | 5 ++- .../components/NetworkEditorDialog/index.tsx | 31 +++++++++++++- .../networkEditorDialog.module.scss | 42 +++++++++++++++++++ .../src/components/NetworkSetting/index.tsx | 10 ++++- .../neuron-ui/src/containers/Main/index.tsx | 10 +---- packages/neuron-ui/src/locales/en.json | 14 ++++--- packages/neuron-ui/src/locales/es.json | 12 +++--- packages/neuron-ui/src/locales/fr.json | 12 +++--- packages/neuron-ui/src/locales/zh-tw.json | 12 +++--- packages/neuron-ui/src/locales/zh.json | 12 +++--- .../neuron-ui/src/types/Controller/index.d.ts | 9 +++- .../src/widgets/Button/button.module.scss | 6 +++ .../neuron-ui/src/widgets/Button/index.tsx | 2 +- .../neuron-ui/src/widgets/Dialog/index.tsx | 9 +++- .../neuron-wallet/src/services/networks.ts | 4 +- packages/neuron-wallet/src/services/node.ts | 15 ++++--- 16 files changed, 157 insertions(+), 48 deletions(-) diff --git a/packages/neuron-ui/src/components/NetworkEditorDialog/hooks.ts b/packages/neuron-ui/src/components/NetworkEditorDialog/hooks.ts index dff16d8083..3f0d18b26f 100644 --- a/packages/neuron-ui/src/components/NetworkEditorDialog/hooks.ts +++ b/packages/neuron-ui/src/components/NetworkEditorDialog/hooks.ts @@ -9,6 +9,7 @@ export const useOnSubmit = ({ id = '', name = '', remote = '', + type, networks = [], callback, dispatch, @@ -18,6 +19,7 @@ export const useOnSubmit = ({ id: string name: string remote: string + type: Controller.NetworkType networks: Readonly callback: () => void dispatch: StateDispatch @@ -25,7 +27,7 @@ export const useOnSubmit = ({ setIsUpdating: React.Dispatch }) => useCallback((): void => { - if (disabled) { + if (disabled || !type) { return } let errorMessage: State.Message | undefined @@ -98,6 +100,7 @@ export const useOnSubmit = ({ createNetwork({ name, remote, + type, })(dispatch, callback) return } diff --git a/packages/neuron-ui/src/components/NetworkEditorDialog/index.tsx b/packages/neuron-ui/src/components/NetworkEditorDialog/index.tsx index a636923b7e..ca2e6137ac 100644 --- a/packages/neuron-ui/src/components/NetworkEditorDialog/index.tsx +++ b/packages/neuron-ui/src/components/NetworkEditorDialog/index.tsx @@ -31,6 +31,7 @@ const NetworkEditorDialog = ({ ) const [t] = useTranslation() const [editor, setEditor] = useState({ + type: 0, name: '', nameError: '', url: url ?? '', @@ -39,6 +40,7 @@ const NetworkEditorDialog = ({ const [isUpdating, setIsUpdating] = useState(false) const disabled = !!( + !editor.type || !editor.name || !editor.url || editor.nameError || @@ -50,6 +52,7 @@ const NetworkEditorDialog = ({ useEffect(() => { if (cachedNetwork) { setEditor({ + type: cachedNetwork.type, name: cachedNetwork.name, nameError: '', url: cachedNetwork.remote, @@ -65,11 +68,14 @@ const NetworkEditorDialog = ({ dataset: { field = '' }, } = e.target as HTMLInputElement let error = '' + let fieldValue = value as string | number try { if (field === 'name') { validateNetworkName(value, usedNetworkNames) } else if (field === 'url') { validateURL(value) + } else if (field === 'type') { + fieldValue = Number(value) } } catch (err) { if (isErrorWithI18n(err)) { @@ -79,7 +85,7 @@ const NetworkEditorDialog = ({ setEditor(state => ({ ...state, - [field]: value, + [field]: fieldValue, [`${field}Error`]: error, })) }, @@ -90,6 +96,7 @@ const NetworkEditorDialog = ({ id: id!, name: editor.name, remote: editor.url, + type: editor.type, networks, callback: onSuccess, dispatch, @@ -109,6 +116,27 @@ const NetworkEditorDialog = ({ isLoading={isUpdating} >
+
+

{t('settings.network.type')}

+ {[ + { value: '1', label: t('settings.network.full-node') }, + { value: '2', label: t('settings.network.light-client-node') }, + ].map(item => ( +
+ +
+ ))} +
id.includes('light_client') + const showNetworks = useMemo(() => { const internalLightNodeId = lastShowInternalNodeIds.get(NetworkType.Light) - return networks.filter(v => v.type !== NetworkType.Light || v.id === internalLightNodeId) + if (isInternalLightNode(internalLightNodeId)) { + return networks.filter(network => !isInternalLightNode(network.id) || network.id === internalLightNodeId) + } + const index = networks.findIndex(network => isInternalLightNode(network.id)) + return networks.filter((network, i) => !isInternalLightNode(network.id) || index === i) }, [currentId, networks]) return ( @@ -111,7 +117,7 @@ const NetworkSetting = ({ chain = chainState, settings: { networks = [] } }: Sta ), suffix: (
- {currentId === network.id && network.type === NetworkType.Light ? ( + {currentId === network.id && isInternalLightNode(network.id) && network.type === NetworkType.Light ? ( diff --git a/packages/neuron-ui/src/containers/Main/index.tsx b/packages/neuron-ui/src/containers/Main/index.tsx index 93e64e0a6d..23fef43db1 100644 --- a/packages/neuron-ui/src/containers/Main/index.tsx +++ b/packages/neuron-ui/src/containers/Main/index.tsx @@ -37,8 +37,6 @@ const MainContent = () => { [network, networks] ) - const isLightClientNetwork = network?.type === 2 - useSyncChainData({ chainURL: network?.remote ?? '', dispatch, @@ -100,12 +98,6 @@ const MainContent = () => { }, []) const dialogProps = (function getDialogProps() { - if (isLightClientNetwork) { - return { - onConfirm: onCloseSwitchNetwork, - children: t('main.external-node-detected-dialog.external-node-is-light'), - } - } if (sameUrlNetworks.length) { return { onConfirm: onSwitchNetwork, @@ -172,6 +164,8 @@ const MainContent = () => { cancelText={t('main.external-node-detected-dialog.ignore-external-node')} title={t('main.external-node-detected-dialog.title')} className={styles.networkDialog} + confirmProps={{ type: 'dashed' }} + cancelProps={{ type: 'dashed' }} > {dialogProps.children} diff --git a/packages/neuron-ui/src/locales/en.json b/packages/neuron-ui/src/locales/en.json index 65b3341a08..8776fede5b 100644 --- a/packages/neuron-ui/src/locales/en.json +++ b/packages/neuron-ui/src/locales/en.json @@ -459,7 +459,10 @@ "lightTestnet": "Light Testnet", "lightMainnet": "Light Mainnet", "devnet": "Devnet", - "switch-network-type": "Switch to {{type}}" + "switch-network-type": "Switch to {{type}}", + "type": "Type", + "full-node": "Full Node", + "light-client-node": "Light Client Node" }, "locale": { "en": "English", @@ -1216,12 +1219,11 @@ }, "main": { "external-node-detected-dialog": { - "title": "External node detected", - "body-tips-without-network": "\"Internal Node\" is reserved for the built-in CKB node, please add a new network option for the external node.", - "body-tips-with-network": "\"Internal Node\" is reserved for the built-in CKB node, please select from the following network options or add a new one for the external node.", + "title": "Detected external node", + "body-tips-without-network": "You have selected the internal node but started the external node, if you want to continue to use the external node, please add a new network.", + "body-tips-with-network": "You have currently selected an internal node but started an external node, if you need to continu using the external node please switch to another external network or add a new network.", "add-network": "Add Network", - "ignore-external-node": "Ignore external node", - "external-node-is-light": "Neuron does not support external light client nodes due to different security assumptions for light clients. Would you like to connect to the \"Light Client\" ?" + "ignore-external-node": "Ignore external node" }, "no-disk-space-dialog": { "tip": "Due to insufficient disk space, synchronization has been stopped.
Please allocate more disk space or migrate the data to another disk.", diff --git a/packages/neuron-ui/src/locales/es.json b/packages/neuron-ui/src/locales/es.json index b8561c404f..99ec9071cc 100644 --- a/packages/neuron-ui/src/locales/es.json +++ b/packages/neuron-ui/src/locales/es.json @@ -442,7 +442,10 @@ "lightTestnet": "Light Testnet", "lightMainnet": "Light Mainnet", "devnet": "Devnet", - "switch-network-type": "Cambiar a {{type}}" + "switch-network-type": "Cambiar a {{type}}", + "type": "Tipo", + "full-node": "Nodo Completo", + "light-client-node": "Nodo Cliente Ligero" }, "locale": { "en": "English", @@ -1197,11 +1200,10 @@ "main": { "external-node-detected-dialog": { "title": "Nodo externo detectado", - "body-tips-without-network": "\"Internal Node\" está reservado para el nodo CKB incorporado, agregue una nueva opción de red para el nodo externo.", - "body-tips-with-network": "\"Internal Node\" está reservado para el nodo CKB incorporado, seleccione una de las siguientes opciones de red o agregue una nueva para el nodo externo.", + "body-tips-without-network": "Has seleccionado el nodo interno pero has iniciado el nodo externo. Si deseas continuar usando el nodo externo, por favor añade una nueva red.", + "body-tips-with-network": "Actualmente has seleccionado un nodo interno pero has iniciado un nodo externo. Si necesitas continuar usando el nodo externo, por favor cambia a otra red externa o añade una nueva red.", "add-network": "Agregar red", - "ignore-external-node": "Ignorar nodo externo", - "external-node-is-light": "Debido a las diferentes suposiciones de seguridad del cliente ligero, Neuron no admite nodos de cliente ligero externos. ¿Desea conectarse a un \"Light Client\" ?" + "ignore-external-node": "Ignorar nodo externo" }, "no-disk-space-dialog": { "tip": "La sincronización se ha detenido debido a falta de espacio en disco.
Asigne más espacio en disco o migre los datos a otro disco.", diff --git a/packages/neuron-ui/src/locales/fr.json b/packages/neuron-ui/src/locales/fr.json index 985df1b7c9..7c7b4d3365 100644 --- a/packages/neuron-ui/src/locales/fr.json +++ b/packages/neuron-ui/src/locales/fr.json @@ -449,7 +449,10 @@ "lightTestnet": "Testnet léger", "lightMainnet": "Mainnet léger", "devnet": "Devnet", - "switch-network-type": "Basculer vers {{type}}" + "switch-network-type": "Basculer vers {{type}}", + "type": "Type", + "full-node": "Nœud Complet", + "light-client-node": "Nœud Client Léger" }, "locale": { "en": "English", @@ -1207,11 +1210,10 @@ "main": { "external-node-detected-dialog": { "title": "Détection d'un noeud externe", - "body-tips-without-network": "\"Noeud interne\" est réservé au noeud CKB intégré, veuillez ajouter une nouvelle option réseau pour le noeud externe.", - "body-tips-with-network": "\"Noeud interne\" est réservé au noeud CKB intégré, veuillez sélectionner parmi les options réseau suivantes ou en ajouter une nouvelle pour le noeud externe.", + "body-tips-without-network": "Vous avez sélectionné le nœud interne mais démarré le nœud externe. Si vous souhaitez continuer à utiliser le nœud externe, veuillez ajouter un nouveau réseau.", + "body-tips-with-network": "Vous avez actuellement sélectionné un nœud interne mais démarré un nœud externe. Si vous avez besoin de continuer à utiliser le nœud externe, veuillez passer à un autre réseau externe ou ajouter un nouveau réseau.", "add-network": "Ajouter un réseau", - "ignore-external-node": "Ignorer le noeud externe", - "external-node-is-light": "En raison de différentes hypothèses de sécurité du client léger, Neuron ne prend pas en charge les nœuds clients légers externes. Voulez-vous vous connecter à un \"Light Client\" ?" + "ignore-external-node": "Ignorer le noeud externe" }, "no-disk-space-dialog": { "tip": "En raison d'un espace disque insuffisant, la synchronisation a été interrompue.
Veuillez allouer plus d'espace disque ou migrer les données vers un autre disque.", diff --git a/packages/neuron-ui/src/locales/zh-tw.json b/packages/neuron-ui/src/locales/zh-tw.json index d12dd36228..c275bad610 100644 --- a/packages/neuron-ui/src/locales/zh-tw.json +++ b/packages/neuron-ui/src/locales/zh-tw.json @@ -453,7 +453,10 @@ "testnet": "測試網", "lightMainnet": "輕節點主網", "devnet": "開發網", - "switch-network-type": "切換到 {{type}}" + "switch-network-type": "切換到 {{type}}", + "type": "類型", + "full-node": "全節點", + "light-client-node": "輕客戶端節點" }, "locale": { "en": "English", @@ -1210,11 +1213,10 @@ "main": { "external-node-detected-dialog": { "title": "檢測到外部節點", - "body-tips-without-network": "\"Internal Node\" 僅用於連接內置節點，請添加新的網絡選項以連接外部節點。", - "body-tips-with-network": "\"Internal Node\" 僅用於連接內置節點，請選擇以下網絡選項或添加新的網絡選項以連接外部節點。", + "body-tips-without-network": "您選擇了內部節點，但啟動了外部節點。如果您想繼續使用外部節點，請添加一個新網絡", + "body-tips-with-network": "您當前選擇了內部節點，但啟動了外部節點。如果需要繼續使用外部節點，請切換到另一個外部網絡或添加一個新網絡", "add-network": "添加網絡", - "ignore-external-node": "忽略外部節點", - "external-node-is-light": "由於輕客戶端的安全假設不同，Neuron 不支持外部輕客戶端節點。您想連接到 \"Light Client\" 嗎？" + "ignore-external-node": "忽略外部節點" }, "no-disk-space-dialog": { "tip": "由於磁盤空間不足，同步已停止。
請分配更多磁盤空間或將數據遷移到其他磁盤。", diff --git a/packages/neuron-ui/src/locales/zh.json b/packages/neuron-ui/src/locales/zh.json index 0d5bba3a30..c8344972ec 100644 --- a/packages/neuron-ui/src/locales/zh.json +++ b/packages/neuron-ui/src/locales/zh.json @@ -452,7 +452,10 @@ "lightTestnet": "轻节点测试网", "lightMainnet": "轻节点主网", "devnet": "开发网", - "switch-network-type": "切换到 {{type}}" + "switch-network-type": "切换到 {{type}}", + "type": "类型", + "full-node": "全节点", + "light-client-node": "轻客户端节点" }, "locale": { "en": "English", @@ -1209,11 +1212,10 @@ "main": { "external-node-detected-dialog": { "title": "检测到外部节点", - "body-tips-without-network": "\"Internal Node\" 仅用于连接内置节点，请添加新的网络选项以连接外部节点。", - "body-tips-with-network": "\"Internal Node\" 仅用于连接内置节点，请选择以下网络选项或添加新的网络选项以连接外部节点。", + "body-tips-without-network": "您选择了内部节点，但启动了外部节点。如果您想继续使用外部节点，请添加一个新网络", + "body-tips-with-network": "您当前选择了内部节点，但启动了外部节点。如果需要继续使用外部节点，请切换到另一个外部网络或添加一个新网络", "add-network": "添加网络", - "ignore-external-node": "忽略外部节点", - "external-node-is-light": "由于轻客户端的安全假设不同，Neuron 不支持外部轻客户端节点。您想连接到 \"Light Client\" 吗？" + "ignore-external-node": "忽略外部节点" }, "no-disk-space-dialog": { "tip": "由于磁盘空间不足，同步已停止。
请分配更多磁盘空间或将数据迁移到其他磁盘。", diff --git a/packages/neuron-ui/src/types/Controller/index.d.ts b/packages/neuron-ui/src/types/Controller/index.d.ts index 83d7cab827..4d82bbb15f 100644 --- a/packages/neuron-ui/src/types/Controller/index.d.ts +++ b/packages/neuron-ui/src/types/Controller/index.d.ts @@ -113,14 +113,21 @@ declare namespace Controller { description: string } + enum NetworkType { + Default, // internal full node + Normal, + Light, // internal Light node + } + interface CreateNetworkParams { name: string remote: string + type: NetworkType } interface UpdateNetworkParams { networkID: string - options: Partial<{ name: string; remote: string }> + options: Partial<{ name: string; remote: string; type: NetworkType }> } interface UpdateTransactionDescriptionParams { diff --git a/packages/neuron-ui/src/widgets/Button/button.module.scss b/packages/neuron-ui/src/widgets/Button/button.module.scss index cae6535284..93434159f3 100644 --- a/packages/neuron-ui/src/widgets/Button/button.module.scss +++ b/packages/neuron-ui/src/widgets/Button/button.module.scss @@ -56,6 +56,12 @@ $active-primary-color: color-mix(in srgb, #000000 40%, var(--primary-color)); } } + &[data-type='dashed'] { + background-color: transparent; + color: var(--primary-color); + border: 1px solid var(--primary-color); + } + &[data-type='text'] { color: var(--primary-color); background-color: transparent; diff --git a/packages/neuron-ui/src/widgets/Button/index.tsx b/packages/neuron-ui/src/widgets/Button/index.tsx index 9d4e6e276e..a94e5c186d 100644 --- a/packages/neuron-ui/src/widgets/Button/index.tsx +++ b/packages/neuron-ui/src/widgets/Button/index.tsx @@ -18,7 +18,7 @@ const Button = React.forwardRef( loading, ...rest }: { - type?: 'default' | 'cancel' | 'ok' | 'submit' | 'confirm' | 'primary' | 'reset' | 'text' + type?: 'default' | 'cancel' | 'ok' | 'submit' | 'confirm' | 'primary' | 'reset' | 'text' | 'dashed' label?: string className?: string loading?: boolean diff --git a/packages/neuron-ui/src/widgets/Dialog/index.tsx b/packages/neuron-ui/src/widgets/Dialog/index.tsx index 7a0056c25e..b4c6621faa 100644 --- a/packages/neuron-ui/src/widgets/Dialog/index.tsx +++ b/packages/neuron-ui/src/widgets/Dialog/index.tsx @@ -17,6 +17,7 @@ interface DialogProps { children?: React.ReactNode isLoading?: boolean confirmProps?: object + cancelProps?: object showHeader?: boolean showConfirm?: boolean showCancel?: boolean @@ -39,6 +40,7 @@ const Dialog = ({ children, isLoading, confirmProps = {}, + cancelProps = {}, showHeader = true, showConfirm = true, showCancel = true, @@ -100,7 +102,12 @@ const Dialog = ({
{showCancel ? ( -