wip: ui

src/ui/cli/Input.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo } from 'react'
+import React, { useMemo } from 'react'
 import { Box, Text, useFocus, useInput } from 'ink'
 import { useState } from 'react'
 

src/ui/cli/Main.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react'
-import { Box, BoxProps, Text, useFocus, useFocusManager, useInput } from 'ink'
+import { Box, BoxProps, Text, useFocus, useInput } from 'ink'
 import { useTester } from '../TesterContext'
 import { TestRunStack, TestSuiteStack } from '../../conductor/TestRun'
 import { Overview } from './Overview'

src/ui/cli/TesterStatus.tsx

@@ -30,16 +30,20 @@ export function TesterStatus() {
         <Input
             title="Filter Suites"
             onChange={s => tester.filterSuites.set(s ? new RegExp(s, 'i') : undefined)}
-            initialValue={tester.filterSuites.get()?.source ?? ''}
+            initialValue={getRegexpSource(tester.filterSuites.get())}
         />
         <Input
             title="Filter Tests"
             onChange={s => tester.filterTests.set(s ? new RegExp(s, 'i') : undefined)}
-            initialValue={tester.filterTests.get()?.source ?? ''}
+            initialValue={getRegexpSource(tester.filterTests.get())}
         />
     </Box>
 }
 
+function getRegexpSource(r: RegExp|undefined) {
+    return r?.source.replaceAll(/\\(.)/g, '$1') ?? ''
+}
+
 function getState(tester: Tester, run?: TestRunStack): {
     color: TextProps['backgroundColor']
     text: string

src/ui/cli/useWindowSize.ts

@@ -4,8 +4,9 @@ export function useWindowSize() {
     const [size, setSize] = useState(process.stdout.getWindowSize())
 
     useEffect(() => {
-        process.stdout.addListener('resize', setSize)
-        return () => void process.stdout.removeListener('resize', setSize)
+        const h = () => setSize(process.stdout.getWindowSize())
+        process.stdout.addListener('resize', h)
+        return () => void process.stdout.removeListener('resize', h)
     }, [])
 
     return {width: size[0], height: size[1]}