36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
|
|
import { useEffect, useState } from 'react';
|
||
|
|
import { Preferences } from '@capacitor/preferences';
|
||
|
|
import SetupScreen from './SetupScreen';
|
||
|
|
|
||
|
|
export default function App() {
|
||
|
|
const [ready, setReady] = useState(false);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
Preferences.get({ key: 'serverUrl' }).then(({ value }) => {
|
||
|
|
if (value) {
|
||
|
|
// Navigate the WebView to the saved server URL.
|
||
|
|
// From this point the remote server's UI takes over entirely.
|
||
|
|
window.location.replace(value);
|
||
|
|
} else {
|
||
|
|
setReady(true);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
async function handleConnect(url: string) {
|
||
|
|
await Preferences.set({ key: 'serverUrl', value: url });
|
||
|
|
window.location.replace(url);
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!ready) {
|
||
|
|
// Brief blank while we check preferences before redirecting
|
||
|
|
return (
|
||
|
|
<div style={{ background: '#09090b', height: '100dvh', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
|
||
|
|
<div className="spinner" />
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
return <SetupScreen onConnect={handleConnect} />;
|
||
|
|
}
|