Import source: src/components/CenterPanel/forms/WiFiForm
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,35 @@
|
||||
import { useQR } from '../../../context/QRContext';
|
||||
import { TextInput } from '../../ui/TextInput';
|
||||
import { SegmentedControl } from '../../ui/SegmentedControl';
|
||||
import type { WifiEncryption } from '../../../types';
|
||||
|
||||
const ENCRYPTION_OPTIONS: { label: string; value: WifiEncryption }[] = [
|
||||
{ label: 'WPA', value: 'WPA' },
|
||||
{ label: 'WEP', value: 'WEP' },
|
||||
{ label: 'None', value: 'None' },
|
||||
];
|
||||
|
||||
export function WiFiForm() {
|
||||
const { state, dispatch } = useQR();
|
||||
const { networkName, encryption, password } = state.formData.wifi;
|
||||
|
||||
const set = (field: string, value: string) =>
|
||||
dispatch({ type: 'SET_FORM_FIELD', qrType: 'wifi', field, value });
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<TextInput label="Network Name" value={networkName} onChange={(v) => set('networkName', v)} placeholder="My WiFi Network" />
|
||||
<div className="flex flex-col gap-2">
|
||||
<label className="text-[15px] font-semibold text-gray-900">Encryption</label>
|
||||
<SegmentedControl
|
||||
options={ENCRYPTION_OPTIONS}
|
||||
value={encryption}
|
||||
onChange={(v) => set('encryption', v)}
|
||||
/>
|
||||
</div>
|
||||
{encryption !== 'None' && (
|
||||
<TextInput label="Password" value={password} onChange={(v) => set('password', v)} placeholder="Enter password" type="password" />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user