chore(Kbar): results fix

Author: developerfred

components/ChainSelector.tsx

@@ -1,13 +1,12 @@
-import { useContext, useEffect, useMemo, useState, useCallback } from 'react'
+import { useContext, useMemo, useState, useCallback } from 'react'
 
-import { useRegisterActions, Action } from 'kbar'
+import { useRegisterActions } from 'kbar'
 import { useRouter } from 'next/router'
 import Select, { OnChangeValue, components } from 'react-select'
 
 import { EthereumContext } from 'context/ethereumContext'
 
 import { CURRENT_FORK } from 'util/constants'
-import { toKeyIndex } from 'util/string'
 
 import { Icon, Label } from 'components/ui'
 
@@ -64,7 +63,9 @@ const ChainOption = (props: any) => {
 
 const ChainSelector = () => {
   const { forks, selectedFork, onForkChange } = useContext(EthereumContext)
-  const [forkValue, setForkValue] = useState(null)
+  const [forkValue, setForkValue] = useState(() => {
+    return forks.find((fork) => fork.name === CURRENT_FORK) || null
+  })
   const router = useRouter()
 
   const forkOptions = useMemo(

components/KBar/Results.tsx

@@ -1,6 +1,7 @@
 import { useMemo } from 'react'
 
 import { KBarResults, useMatches } from 'kbar'
+import type { ActionImpl } from 'kbar'
 
 import ResultItem from './ResultItem'
 
@@ -10,20 +11,29 @@ const Results = () => {
   const { results } = useMatches()
 
   const flattened = useMemo(() => {
-    return results.reduce((acc: any[], curr: any) => {
-      if (typeof curr === 'string') {
-        acc.push(curr)
-      } else {
-        acc.push(curr.name)
-        acc.push(...curr.actions)
-      }
-      return acc
-    }, [])
+    const flattenActions = (actions: (string | ActionImpl)[]) => {
+      return actions.reduce((acc: any[], curr: string | ActionImpl) => {
+        if (typeof curr === 'string') {
+          acc.push(curr)
+        } else {
+          acc.push(curr)
+
+          if (curr.children && curr.children.length > 0) {
+            acc.push(...flattenActions(curr.children))
+          }
+        }
+        return acc
+      }, [])
+    }
+
+    return flattenActions(results)
   }, [results])
 
   return (
     <KBarResults
-      items={flattened.filter((i: string) => i !== NO_GROUP)}
+      items={flattened.filter(
+        (i: any) => typeof i !== 'string' || i !== NO_GROUP,
+      )}
       onRender={({ item, active }) =>
         typeof item === 'string' ? (
           <div className="px-4 py-2 text-2xs uppercase text-gray-400 dark:text-gray-600 bg-white dark:bg-black-600">