misc: prettier formatting

This commit is contained in:
2026-01-04 12:17:59 -05:00
Unverified
parent 8fa923fcbc
commit ce13bf838b
4 changed files with 487 additions and 455 deletions

12
.editorconfig Normal file
View File

@@ -0,0 +1,12 @@
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.{js,jsx,ts,tsx,json,css,scss,md}]
indent_size = 2

8
.prettierrc Normal file
View File

@@ -0,0 +1,8 @@
{
"tabWidth": 2,
"useTabs": false,
"semi": true,
"singleQuote": true,
"trailingComma": "es5",
"arrowParens": "avoid"
}

11
.vscode/settings.json vendored
View File

@@ -3,5 +3,16 @@
"source.fixAll": "explicit", "source.fixAll": "explicit",
"source.organizeImports": "explicit", "source.organizeImports": "explicit",
"source.sortMembers": "explicit" "source.sortMembers": "explicit"
},
"editor.detectIndentation": false,
"editor.tabSize": 2,
"editor.insertSpaces": true,
"[javascript]": {
"editor.tabSize": 2,
"editor.insertSpaces": true
},
"[typescript]": {
"editor.tabSize": 2,
"editor.insertSpaces": true
} }
} }

View File

@@ -1,7 +1,7 @@
import { ContextMenu, Host, Button as SwiftUIButton } from "@expo/ui/swift-ui"; import { ContextMenu, Host, Button as SwiftUIButton } from '@expo/ui/swift-ui';
import { Ionicons } from "@expo/vector-icons"; import { Ionicons } from '@expo/vector-icons';
import { SymbolView } from "expo-symbols"; import { SymbolView } from 'expo-symbols';
import React, { useCallback, useEffect, useState } from "react"; import React, { useCallback, useEffect, useState } from 'react';
import { import {
ActivityIndicator, ActivityIndicator,
Alert, Alert,
@@ -12,20 +12,20 @@ import {
Text, Text,
TouchableOpacity, TouchableOpacity,
View, View,
} from "react-native"; } from 'react-native';
import { useColorScheme } from "../../hooks/use-color-scheme"; import { useColorScheme } from '../../hooks/use-color-scheme';
import api from "../../src/services/api"; import api from '../../src/services/api';
import { Device } from "../../src/types"; import { Device } from '../../src/types';
import * as Burnt from "burnt"; import * as Burnt from 'burnt';
export default function DeviceListScreen() { export default function DeviceListScreen() {
const colorScheme = useColorScheme() ?? "light"; const colorScheme = useColorScheme() ?? 'light';
const isDark = colorScheme === "dark"; const isDark = colorScheme === 'dark';
const bgColor = isDark ? "#0b0b0d" : "#f5f5f5"; const bgColor = isDark ? '#0b0b0d' : '#f5f5f5';
const cardBg = isDark ? "#1c1c1e" : "#fff"; const cardBg = isDark ? '#1c1c1e' : '#fff';
const textColor = isDark ? "#ffffff" : "#333333"; const textColor = isDark ? '#ffffff' : '#333333';
const subTextColor = isDark ? "#c6c6c8" : "#666666"; const subTextColor = isDark ? '#c6c6c8' : '#666666';
const activityColor = isDark ? "#0A84FF" : "#007AFF"; const activityColor = isDark ? '#0A84FF' : '#007AFF';
const [devices, setDevices] = useState<Device[]>([]); const [devices, setDevices] = useState<Device[]>([]);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
@@ -39,7 +39,7 @@ export default function DeviceListScreen() {
} catch (error: any) { } catch (error: any) {
// For background/periodic refreshes, avoid interruptive alerts // For background/periodic refreshes, avoid interruptive alerts
if (showLoading) { if (showLoading) {
Alert.alert("Error", error.message || "Failed to load devices"); Alert.alert('Error', error.message || 'Failed to load devices');
} }
} finally { } finally {
if (showLoading) setIsLoading(false); if (showLoading) setIsLoading(false);
@@ -71,14 +71,14 @@ export default function DeviceListScreen() {
startPolling(); startPolling();
const onAppStateChange = (nextAppState: string) => { const onAppStateChange = (nextAppState: string) => {
if (nextAppState === "active") { if (nextAppState === 'active') {
startPolling(); startPolling();
} else { } else {
stopPolling(); stopPolling();
} }
}; };
const subscription = AppState.addEventListener("change", onAppStateChange); const subscription = AppState.addEventListener('change', onAppStateChange);
return () => { return () => {
stopPolling(); stopPolling();
@@ -96,38 +96,39 @@ export default function DeviceListScreen() {
try { try {
await api.wakeDevice(device.id); await api.wakeDevice(device.id);
Burnt.toast({ Burnt.toast({
title: "Success", title: 'Success',
preset: "done", preset: 'done',
message: `Waking ${device.name} up.`, message: `Waking ${device.name} up.`,
}); });
} catch (error: any) { } catch (error: any) {
Burnt.toast({ Burnt.toast({
title: "Error", title: 'Error',
preset: "error", preset: 'error',
message: error.message || `Failed to wake up ${device.name}.`, message: error.message || `Failed to wake up ${device.name}.`,
}); });
} }
}; };
const handleSleep = async (device: Device) => { const handleSleep = async (device: Device) => {
Alert.alert("Confirm", `Send ${device.name} to sleep?`, [ Alert.alert('Confirm', `Send ${device.name} to sleep?`, [
{ text: "Cancel", style: "cancel" }, { text: 'Cancel', style: 'cancel' },
{ {
text: "Sleep", text: 'Sleep',
style: "destructive", style: 'destructive',
onPress: async () => { onPress: async () => {
try { try {
await api.sleepDevice(device.id); await api.sleepDevice(device.id);
Burnt.toast({ Burnt.toast({
title: "Success", title: 'Success',
preset: "done", preset: 'done',
message: `Sending ${device.name} to sleep.`, message: `Sending ${device.name} to sleep.`,
}); });
} catch (error: any) { } catch (error: any) {
Burnt.toast({ Burnt.toast({
title: "Error", title: 'Error',
preset: "error", preset: 'error',
message: error.message || `Failed to send ${device.name} to sleep.`, message:
error.message || `Failed to send ${device.name} to sleep.`,
}); });
} }
}, },
@@ -136,23 +137,23 @@ export default function DeviceListScreen() {
}; };
const handleReboot = async (device: Device) => { const handleReboot = async (device: Device) => {
Alert.alert("Confirm", `Reboot ${device.name}?`, [ Alert.alert('Confirm', `Reboot ${device.name}?`, [
{ text: "Cancel", style: "cancel" }, { text: 'Cancel', style: 'cancel' },
{ {
text: "Reboot", text: 'Reboot',
style: "destructive", style: 'destructive',
onPress: async () => { onPress: async () => {
try { try {
await api.rebootDevice(device.id); await api.rebootDevice(device.id);
Burnt.toast({ Burnt.toast({
title: "Success", title: 'Success',
preset: "done", preset: 'done',
message: `Rebooting ${device.name}.`, message: `Rebooting ${device.name}.`,
}); });
} catch (error: any) { } catch (error: any) {
Burnt.toast({ Burnt.toast({
title: "Error", title: 'Error',
preset: "error", preset: 'error',
message: error.message || `Failed to reboot ${device.name}`, message: error.message || `Failed to reboot ${device.name}`,
}); });
} }
@@ -163,25 +164,25 @@ export default function DeviceListScreen() {
const handleShutdown = async (device: Device) => { const handleShutdown = async (device: Device) => {
Alert.alert( Alert.alert(
"Confirm Shutdown", 'Confirm Shutdown',
`Shutdown ${device.name}? This cannot be undone.`, `Shutdown ${device.name}? This cannot be undone.`,
[ [
{ text: "Cancel", style: "cancel" }, { text: 'Cancel', style: 'cancel' },
{ {
text: "Shutdown", text: 'Shutdown',
style: "destructive", style: 'destructive',
onPress: async () => { onPress: async () => {
try { try {
await api.shutdownDevice(device.id); await api.shutdownDevice(device.id);
Burnt.toast({ Burnt.toast({
title: "Success", title: 'Success',
preset: "done", preset: 'done',
message: `Shutting down ${device.name}.`, message: `Shutting down ${device.name}.`,
}); });
} catch (error: any) { } catch (error: any) {
Burnt.toast({ Burnt.toast({
title: "Error", title: 'Error',
preset: "error", preset: 'error',
message: error.message || `Failed to shut down ${device.name}.`, message: error.message || `Failed to shut down ${device.name}.`,
}); });
} }
@@ -192,30 +193,30 @@ export default function DeviceListScreen() {
}; };
const handleDelete = (device: Device) => { const handleDelete = (device: Device) => {
Alert.alert("Delete Device", `Delete "${device.name}"?`, [ Alert.alert('Delete Device', `Delete "${device.name}"?`, [
{ {
text: "Cancel", text: 'Cancel',
style: "cancel", style: 'cancel',
onPress: () => { onPress: () => {
// Close alert // Close alert
}, },
}, },
{ {
text: "Delete", text: 'Delete',
style: "destructive", style: 'destructive',
onPress: async () => { onPress: async () => {
try { try {
await api.deleteDevice(device.id); await api.deleteDevice(device.id);
Burnt.toast({ Burnt.toast({
title: "Success", title: 'Success',
preset: "done", preset: 'done',
message: `Deleted ${device.name} successfully.`, message: `Deleted ${device.name} successfully.`,
}); });
fetchDevices(false); fetchDevices(false);
} catch (error: any) { } catch (error: any) {
Burnt.toast({ Burnt.toast({
title: "Error", title: 'Error',
preset: "error", preset: 'error',
message: error.message || `Failed to delete ${device.name}.`, message: error.message || `Failed to delete ${device.name}.`,
}); });
} }
@@ -226,12 +227,12 @@ export default function DeviceListScreen() {
const getStatusColor = (status: string) => { const getStatusColor = (status: string) => {
switch (status?.toLowerCase()) { switch (status?.toLowerCase()) {
case "online": case 'online':
return "#4CAF50"; return '#4CAF50';
case "offline": case 'offline':
return "#f44336"; return '#f44336';
default: default:
return "#ff9800"; return '#ff9800';
} }
}; };
@@ -261,7 +262,7 @@ export default function DeviceListScreen() {
type="monochrome" type="monochrome"
fallback={ fallback={
<Ionicons <Ionicons
name={(fallbackName || "ellipse") as any} name={(fallbackName || 'ellipse') as any}
size={20} size={20}
color={color} color={color}
/> />
@@ -289,7 +290,7 @@ export default function DeviceListScreen() {
styles.deviceCard, styles.deviceCard,
{ {
backgroundColor: cardBg, backgroundColor: cardBg,
shadowColor: isDark ? "rgba(0,0,0,0.6)" : "#000", shadowColor: isDark ? 'rgba(0,0,0,0.6)' : '#000',
}, },
]} ]}
> >
@@ -308,7 +309,7 @@ export default function DeviceListScreen() {
size={18} size={18}
tintColor={getStatusColor(item.status)} tintColor={getStatusColor(item.status)}
animationSpec={{ animationSpec={{
effect: { type: "pulse" }, effect: { type: 'pulse' },
repeating: true, repeating: true,
speed: 1, speed: 1,
}} }}
@@ -380,7 +381,7 @@ export default function DeviceListScreen() {
<FlatList <FlatList
data={devices} data={devices}
renderItem={renderDevice} renderItem={renderDevice}
keyExtractor={(item) => item.id} keyExtractor={item => item.id}
contentContainerStyle={styles.list} contentContainerStyle={styles.list}
refreshControl={ refreshControl={
<RefreshControl refreshing={refreshing} onRefresh={onRefresh} /> <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
@@ -400,10 +401,10 @@ export default function DeviceListScreen() {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
backgroundColor: "#f5f5f5", backgroundColor: '#f5f5f5',
}, },
headerRight: { headerRight: {
flexDirection: "row", flexDirection: 'row',
gap: 16, gap: 16,
}, },
headerButton: { headerButton: {
@@ -411,28 +412,28 @@ const styles = StyleSheet.create({
}, },
loadingContainer: { loadingContainer: {
flex: 1, flex: 1,
justifyContent: "center", justifyContent: 'center',
alignItems: "center", alignItems: 'center',
}, },
list: { list: {
padding: 15, padding: 15,
gap: 15, gap: 15,
}, },
deviceCard: { deviceCard: {
backgroundColor: "#fff", backgroundColor: '#fff',
borderRadius: 12, borderRadius: 12,
padding: 15, padding: 15,
paddingRight: 25, paddingRight: 25,
shadowColor: "#000", shadowColor: '#000',
shadowOffset: { width: 0, height: 2 }, shadowOffset: { width: 0, height: 2 },
shadowOpacity: 0.1, shadowOpacity: 0.1,
shadowRadius: 4, shadowRadius: 4,
elevation: 3, elevation: 3,
}, },
deviceHeader: { deviceHeader: {
flexDirection: "row", flexDirection: 'row',
justifyContent: "space-between", justifyContent: 'space-between',
alignItems: "center", alignItems: 'center',
marginBottom: 12, marginBottom: 12,
}, },
deviceInfo: { deviceInfo: {
@@ -440,13 +441,13 @@ const styles = StyleSheet.create({
}, },
deviceName: { deviceName: {
fontSize: 18, fontSize: 18,
fontWeight: "bold", fontWeight: 'bold',
color: "#333", color: '#333',
marginBottom: 4, marginBottom: 4,
}, },
deviceIP: { deviceIP: {
fontSize: 14, fontSize: 14,
color: "#666", color: '#666',
}, },
statusDot: { statusDot: {
width: 12, width: 12,
@@ -454,17 +455,17 @@ const styles = StyleSheet.create({
borderRadius: 6, borderRadius: 6,
}, },
deviceActions: { deviceActions: {
flexDirection: "row", flexDirection: 'row',
alignItems: "center", alignItems: 'center',
justifyContent: "flex-start", justifyContent: 'flex-start',
marginTop: 8, marginTop: 8,
paddingBottom: 6, paddingBottom: 6,
}, },
actionIconContainer: { actionIconContainer: {
padding: 6, padding: 6,
marginRight: 12, marginRight: 12,
justifyContent: "center", justifyContent: 'center',
alignItems: "center", alignItems: 'center',
minWidth: 36, minWidth: 36,
minHeight: 36, minHeight: 36,
}, },
@@ -473,21 +474,21 @@ const styles = StyleSheet.create({
height: 22, height: 22,
}, },
actionButtonText: { actionButtonText: {
color: "#fff", color: '#fff',
fontWeight: "600", fontWeight: '600',
fontSize: 12, fontSize: 12,
}, },
wakeButton: { wakeButton: {
backgroundColor: "#4CAF50", backgroundColor: '#4CAF50',
}, },
sleepButton: { sleepButton: {
backgroundColor: "#FF9800", backgroundColor: '#FF9800',
}, },
rebootButton: { rebootButton: {
backgroundColor: "#2196F3", backgroundColor: '#2196F3',
}, },
shutdownButton: { shutdownButton: {
backgroundColor: "#f44336", backgroundColor: '#f44336',
}, },
statusSymbol: { statusSymbol: {
width: 18, width: 18,
@@ -499,11 +500,11 @@ const styles = StyleSheet.create({
elevation: 6, elevation: 6,
}, },
emptyContainer: { emptyContainer: {
alignItems: "center", alignItems: 'center',
paddingVertical: 50, paddingVertical: 50,
}, },
emptyText: { emptyText: {
fontSize: 16, fontSize: 16,
color: "#999", color: '#999',
}, },
}); });