joshuafhiggins/jumpstart
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

misc: init

Browse Source
This commit is contained in:
Joshua Higgins
2026-01-03 16:04:07 -05:00
Unverified
parent b091bd50e8
commit ec2425f2b7
27 changed files with 2470 additions and 709 deletions
Download Patch File Download Diff File Expand all files Collapse all files

236
app/add-device.tsx Normal file
View File

@@ -0,0 +1,236 @@
import React, { useState } from 'react';
import {
View,
Text,
ScrollView,
StyleSheet,
TextInput,
TouchableOpacity,
Alert,
ActivityIndicator,
} from 'react-native';
import { useRouter } from 'expo-router';
import api from '../src/services/api';
export default function AddDeviceScreen() {
const router = useRouter();
const [isLoading, setIsLoading] = useState(false);
const [formData, setFormData] = useState({
name: '',
mac: '',
ip: '',
netmask: '255.255.255.0',
broadcast: '',
secureOnPassword: '',
port: '9',
});
const handleSave = async () => {
if (!formData.name || !formData.mac || !formData.ip) {
Alert.alert('Error', 'Please fill in all required fields');
return;
}
setIsLoading(true);
try {
await api.createDevice({
name: formData.name,
mac: formData.mac,
ip: formData.ip,
netmask: formData.netmask,
broadcast: formData.broadcast,
secureOnPassword: formData.secureOnPassword,
port: parseInt(formData.port) || 9,
groups: [],
status: 'offline',
});
Alert.alert('Success', 'Device added successfully');
router.back();
} catch (error: any) {
Alert.alert('Error', error.message || 'Failed to add device');
} finally {
setIsLoading(false);
}
};
return (
<ScrollView style={styles.container}>
<View style={styles.content}>
<Text style={styles.header}>Add New Device</Text>
<View style={styles.form}>
<View style={styles.inputGroup}>
<Text style={styles.label}>Device Name *</Text>
<TextInput
style={styles.input}
value={formData.name}
onChangeText={(text) => setFormData({ ...formData, name: text })}
placeholder="My PC"
autoCapitalize="words"
/>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>MAC Address *</Text>
<TextInput
style={styles.input}
value={formData.mac}
onChangeText={(text) => setFormData({ ...formData, mac: text })}
placeholder="00:11:22:33:44:55"
autoCapitalize="characters"
/>
<Text style={styles.hint}>
Format: XX:XX:XX:XX:XX:XX
</Text>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>IP Address *</Text>
<TextInput
style={styles.input}
value={formData.ip}
onChangeText={(text) => setFormData({ ...formData, ip: text })}
placeholder="192.168.1.100"
keyboardType="numeric"
/>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>Netmask</Text>
<TextInput
style={styles.input}
value={formData.netmask}
onChangeText={(text) => setFormData({ ...formData, netmask: text })}
placeholder="255.255.255.0"
keyboardType="numeric"
/>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>Broadcast Address</Text>
<TextInput
style={styles.input}
value={formData.broadcast}
onChangeText={(text) => setFormData({ ...formData, broadcast: text })}
placeholder="192.168.1.255"
keyboardType="numeric"
/>
<Text style={styles.hint}>
Optional: Auto-calculated if left blank
</Text>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>SecureOn Password</Text>
<TextInput
style={styles.input}
value={formData.secureOnPassword}
onChangeText={(text) => setFormData({ ...formData, secureOnPassword: text })}
placeholder="Optional password"
secureTextEntry
/>
<Text style={styles.hint}>
Optional: For SecureOn enabled NICs
</Text>
</View>
<View style={styles.inputGroup}>
<Text style={styles.label}>Port</Text>
<TextInput
style={styles.input}
value={formData.port}
onChangeText={(text) => setFormData({ ...formData, port: text })}
placeholder="9"
keyboardType="numeric"
/>
<Text style={styles.hint}>
Default: 9 (Standard Wake-on-LAN port)
</Text>
</View>
<View style={styles.buttonGroup}>
<TouchableOpacity
style={[styles.button, styles.cancelButton]}
onPress={() => router.back()}
disabled={isLoading}
>
<Text style={styles.buttonText}>Cancel</Text>
</TouchableOpacity>
<TouchableOpacity
style={[styles.button, styles.saveButton]}
onPress={handleSave}
disabled={isLoading}
>
<Text style={styles.buttonText}>
{isLoading ? 'Adding...' : 'Add Device'}
</Text>
</TouchableOpacity>
</View>
</View>
</View>
</ScrollView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#f5f5f5',
},
content: {
padding: 20,
},
header: {
fontSize: 24,
fontWeight: 'bold',
color: '#333',
marginBottom: 20,
textAlign: 'center',
},
form: {
gap: 20,
},
inputGroup: {
gap: 8,
},
label: {
fontSize: 14,
fontWeight: '600',
color: '#333',
},
input: {
backgroundColor: '#fff',
borderWidth: 1,
borderColor: '#ddd',
borderRadius: 8,
padding: 12,
fontSize: 16,
},
hint: {
fontSize: 12,
color: '#666',
},
buttonGroup: {
flexDirection: 'row',
gap: 10,
marginTop: 10,
},
button: {
flex: 1,
paddingVertical: 15,
borderRadius: 8,
alignItems: 'center',
},
cancelButton: {
backgroundColor: '#999',
},
saveButton: {
backgroundColor: '#4CAF50',
},
buttonText: {
color: '#fff',
fontSize: 16,
fontWeight: 'bold',
},
});