refactor(wallet-dashboard): clean up settings (#4540)

* refactor(wallet-dashboard): Clean up settings * fmt --------- Co-authored-by: evavirseda <[email protected]>
iotaledger · Dec 19, 2024 · 5380fc3 · 5380fc3
1 parent 9fb6665
commit 5380fc3
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 26 deletions.
diff --git a/apps/wallet-dashboard/components/Dialogs/settings/SettingsDialog.tsx b/apps/wallet-dashboard/components/Dialogs/settings/SettingsDialog.tsx
@@ -25,14 +25,12 @@ export function SettingsDialog({
 
     return (
         <Dialog open={isOpen} onOpenChange={() => handleClose()}>
-            <>
-                {view === SettingsDialogView.SelectSetting && (
-                    <SettingsListView handleClose={handleClose} setView={setView} />
-                )}
-                {view === SettingsDialogView.NetworkSettings && (
-                    <NetworkSelectorView handleClose={handleClose} onBack={onBack} />
-                )}
-            </>
+            {view === SettingsDialogView.SelectSetting && (
+                <SettingsListView handleClose={handleClose} setView={setView} />
+            )}
+            {view === SettingsDialogView.NetworkSettings && (
+                <NetworkSelectorView handleClose={handleClose} onBack={onBack} />
+            )}
         </Dialog>
     );
 }
diff --git a/apps/wallet-dashboard/components/Dialogs/settings/views/NetworkSelectorView.tsx b/apps/wallet-dashboard/components/Dialogs/settings/views/NetworkSelectorView.tsx
@@ -19,6 +19,8 @@ export function NetworkSelectorView({
 }: NetworkSelectorViewProps): JSX.Element {
     const clientContext = useIotaClientContext();
     const activeNetwork = clientContext.network;
+    // Dashboard doesn't support RPCs yet
+    const networks = clientContext.networks as Record<string, NetworkConfiguration>;
 
     async function handleNetworkChange(network: NetworkConfiguration) {
         if (activeNetwork === network.id) {
@@ -27,25 +29,21 @@ export function NetworkSelectorView({
         clientContext.selectNetwork(network.id);
         toast.success(`Switched to ${network.name}`);
     }
+
     return (
         <DialogLayout>
             <Header title="Network" onClose={handleClose} onBack={onBack} titleCentered />
             <DialogLayoutBody>
                 <div className="flex w-full flex-col gap-md">
-                    {Object.keys(clientContext.networks).map((network) => {
-                        const networkConfig = clientContext.networks[
-                            network
-                        ] as NetworkConfiguration;
-                        return (
-                            <div className="px-md" key={networkConfig.id}>
-                                <RadioButton
-                                    label={networkConfig.name}
-                                    isChecked={activeNetwork === networkConfig.id}
-                                    onChange={() => handleNetworkChange(networkConfig)}
-                                />
-                            </div>
-                        );
-                    })}
+                    {Object.values(networks).map((network) => (
+                        <div className="px-md" key={network.id}>
+                            <RadioButton
+                                label={network.name}
+                                isChecked={activeNetwork === network.id}
+                                onChange={() => handleNetworkChange(network)}
+                            />
+                        </div>
+                    ))}
                 </div>
             </DialogLayoutBody>
         </DialogLayout>

diff --git a/apps/wallet-dashboard/components/Dialogs/settings/views/SettingsListView.tsx b/apps/wallet-dashboard/components/Dialogs/settings/views/SettingsListView.tsx
@@ -26,17 +26,16 @@ interface SettingsListViewProps {
 export function SettingsListView({ handleClose, setView }: SettingsListViewProps): JSX.Element {
     const { network } = useIotaClientContext();
     const { name: networkName } = getNetwork(network);
-    function onSelectSettingClick(view: SettingsDialogView): void {
-        setView(view);
-    }
+
     const MENU_ITEMS = [
         {
             title: 'Network',
             subtitle: networkName,
             icon: <Globe />,
-            onClick: () => onSelectSettingClick(SettingsDialogView.NetworkSettings),
+            onClick: () => setView(SettingsDialogView.NetworkSettings),
         },
     ];
+
     return (
         <DialogLayout>
             <Header title="Settings" onClose={handleClose} onBack={handleClose} titleCentered />