chore: fix all tests

feat: add lockConnect to QS options for alt connection screen UI

README.MD

@@ -103,10 +103,11 @@ world chunks have a *yellow* border, hostile mobs have a *red* outline, passive
 
 Press `Y` to set query parameters to url of your current game state.
 
-- `?server=<server_address>` - Display connect screen to the server on load
-- `?username=<username>` - Set the username on load
-- `?proxy=<proxy_address>` - Set the proxy server address on load
-- `?version=<version>` - Set the version on load
+- `?ip=<server_address>` - Display connect screen to the server on load
+- `?username=<username>` - Set the username for server
+- `?proxy=<proxy_address>` - Set the proxy server address to use for server
+- `?version=<version>` - Set the version for server
+- `?lockConnect=true` - Disable cancel / save buttons, useful for integrates iframes
 - `?reconnect=true` - Reconnect to the server on page reloads. Available in **dev mode only** and very useful on server testing.
 <!-- - `?password=<password>` - Set the password on load -->
 - `?loadSave=<save_name>` - Load the save on load with the specified folder name (not title)

cypress/e2e/index.spec.ts

@@ -38,7 +38,7 @@ const setOptions = (options: Partial<AppOptions>) => {
 }
 
 it('Loads & renders singleplayer', () => {
-  cleanVisit('/?singleplayer=1')
+  visit('/?singleplayer=1')
   setOptions({
     localServerOptions: {
       generation: {
@@ -52,7 +52,7 @@ it('Loads & renders singleplayer', () => {
   testWorldLoad()
 })
 
-it.only('Joins to server', () => {
+it('Joins to server', () => {
   visit('/?ip=localhost&version=1.16.1')
   window.localStorage.version = ''
   // todo replace with data-test

src/react/AddServer.tsx → src/react/AddServerOrConnect.tsx

@@ -38,6 +38,7 @@ export default ({ onBack, onConfirm, title = 'Add a Server', initialData, parseQ
   const [usernameOverride, setUsernameOverride] = React.useState(initialData?.usernameOverride ?? qsParams?.get('username') ?? '')
   const [passwordOverride, setPasswordOverride] = React.useState(initialData?.passwordOverride ?? qsParams?.get('password') ?? '')
   const smallWidth = useIsSmallWidth()
+  const lockConnect = qsParams?.get('lockConnect') === 'true'
 
   return <Screen title={qsParams?.get('ip') ? 'Connect to Server' : title} backdrop>
     <form style={{
@@ -74,10 +75,9 @@ export default ({ onBack, onConfirm, title = 'Add a Server', initialData, parseQ
         <InputWithLabel label="Proxy Override" value={proxyOverride} onChange={({ target: { value } }) => setProxyOverride(value)} placeholder={defaults?.proxyOverride} />
         <InputWithLabel label="Username Override" value={usernameOverride} onChange={({ target: { value } }) => setUsernameOverride(value)} placeholder={defaults?.usernameOverride} />
         <InputWithLabel label="Password Override" value={passwordOverride} onChange={({ target: { value } }) => setPasswordOverride(value)} /* placeholder='For advanced usage only' */ />
-        <Button onClick={() => {
+        {!lockConnect && <><Button onClick={() => {
           onBack()
-        }}>Cancel</Button>
-        <Button type='submit'>Save</Button>
+        } }>Cancel</Button><Button type='submit'>Save</Button></>}
         {qsParams?.get('ip') && <div style={{ gridColumn: smallWidth ? '' : 'span 2', display: 'flex', justifyContent: 'center' }}>
           <Button
             data-test-id='connect-qs'

src/react/ServersList.stories.tsx

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react'
 import 'iconify-icon'
 
 import { useState } from 'react'
-import AddServer from './AddServer'
+import AddServerOrConnect from './AddServerOrConnect'
 import ServersList from './ServersList'
 
 const meta: Meta<typeof ServersList> = {
@@ -12,7 +12,7 @@ const meta: Meta<typeof ServersList> = {
     const [username, setUsername] = useState('')
 
     return addOpen ?
-      <AddServer onBack={() => {
+      <AddServerOrConnect onBack={() => {
         setAddOpen(false)
       }}
       onConfirm={(info) => {

src/react/ServersListProvider.tsx

@@ -4,7 +4,7 @@ import { qsOptions } from '../optionsStorage'
 import { ConnectOptions } from '../connect'
 import { hideCurrentModal, miscUiState, showModal } from '../globalState'
 import ServersList from './ServersList'
-import AddServer from './AddServer'
+import AddServerOrConnect from './AddServerOrConnect'
 import { useDidUpdateEffect } from './utils'
 import { useIsModalActive } from './utilsApp'
 
@@ -180,7 +180,7 @@ const Inner = () => {
 
   const isEditScreenModal = useIsModalActive('editServer')
 
-  useEffect(() => {
+  useDidUpdateEffect(() => {
     if (serverEditScreen && !isEditScreenModal) {
       showModal({ reactType: 'editServer' })
     }
@@ -190,7 +190,7 @@ const Inner = () => {
   }, [serverEditScreen])
 
   if (isEditScreenModal) {
-    return <AddServer
+    return <AddServerOrConnect
       defaults={{
         proxyOverride: selectedProxy,
         usernameOverride: defaultUsername,