feat: new name and icon

This commit is contained in:
2026-01-04 17:05:40 -05:00
Unverified
parent 47970891ef
commit 05e423ea4e
10 changed files with 257 additions and 361 deletions

View File

@@ -1,4 +1,4 @@
# UpSnap Mobile
# Jumpstart - Client for UpSnap
A React Native Expo app that connects to an UpSnap server and provides mobile access to all Wake-on-LAN features.

View File

@@ -1,6 +1,6 @@
{
"expo": {
"name": "Remote WoL",
"name": "Jumpstart",
"slug": "remote-wol",
"version": "1.0.0",
"orientation": "portrait",

View File

@@ -1,4 +1,4 @@
import React from "react";
import React from 'react';
import {
Alert,
ScrollView,
@@ -6,32 +6,33 @@ import {
Text,
TouchableOpacity,
View,
} from "react-native";
import { useColorScheme } from "../../hooks/use-color-scheme";
import { useAuth } from "../../src/context/AuthContext";
import { useRouter } from "expo-router";
} from 'react-native';
import { useColorScheme } from '../../hooks/use-color-scheme';
import { useAuth } from '../../src/context/AuthContext';
import { useRouter } from 'expo-router';
import Constants from 'expo-constants';
export default function SettingsScreen() {
const { user, serverAddress, logout } = useAuth();
const router = useRouter();
const colorScheme = useColorScheme() ?? "light";
const isDark = colorScheme === "dark";
const bgColor = isDark ? "#0b0b0d" : "#f5f5f5";
const sectionBg = isDark ? "#1c1c1e" : "#fff";
const sectionTitleBg = isDark ? "#111111" : "#f9f9f9";
const textColor = isDark ? "#fff" : "#333";
const subTextColor = isDark ? "#c6c6c8" : "#666";
const primary = isDark ? "#0A84FF" : "#007AFF";
const destructiveColor = "#f44336";
const colorScheme = useColorScheme() ?? 'light';
const isDark = colorScheme === 'dark';
const bgColor = isDark ? '#0b0b0d' : '#f5f5f5';
const sectionBg = isDark ? '#1c1c1e' : '#fff';
const sectionTitleBg = isDark ? '#111111' : '#f9f9f9';
const textColor = isDark ? '#fff' : '#333';
const subTextColor = isDark ? '#c6c6c8' : '#666';
const primary = isDark ? '#0A84FF' : '#007AFF';
const destructiveColor = '#f44336';
const handleLogout = () => {
Alert.alert("Logout", "Are you sure you want to logout?", [
{ text: "Cancel", style: "cancel" },
Alert.alert('Logout', 'Are you sure you want to logout?', [
{ text: 'Cancel', style: 'cancel' },
{
text: "Logout",
style: "destructive",
text: 'Logout',
style: 'destructive',
onPress: async () => {
router.replace("/login");
router.replace('/login');
await logout();
},
},
@@ -50,7 +51,7 @@ export default function SettingsScreen() {
<TouchableOpacity
style={[
styles.settingItem,
{ borderBottomColor: isDark ? "rgba(255,255,255,0.03)" : "#f0f0f0" },
{ borderBottomColor: isDark ? 'rgba(255,255,255,0.03)' : '#f0f0f0' },
]}
onPress={onPress}
disabled={!onPress}
@@ -96,7 +97,7 @@ export default function SettingsScreen() {
styles.section,
{
backgroundColor: sectionBg,
shadowColor: isDark ? "rgba(255,255,255,0.02)" : "#000",
shadowColor: isDark ? 'rgba(255,255,255,0.02)' : '#000',
},
]}
>
@@ -106,11 +107,12 @@ export default function SettingsScreen() {
{ color: subTextColor, backgroundColor: sectionTitleBg },
]}
>
User Information
Information
</Text>
<SettingItem label="Username" value={user?.username || "Admin"} />
<SettingItem label="Email" value={user?.email || "N/A"} />
<SettingItem label="Server URL" value={serverAddress || "N/A"} />
<SettingItem label="Username" value={user?.username || 'Admin'} />
<SettingItem label="Email" value={user?.email || 'N/A'} />
<SettingItem label="Server URL" value={serverAddress || 'N/A'} />
<SettingItem label="App Version" value={`${Constants.expoConfig?.version}`} />
</View>
<View
@@ -118,28 +120,7 @@ export default function SettingsScreen() {
styles.section,
{
backgroundColor: sectionBg,
shadowColor: isDark ? "rgba(255,255,255,0.02)" : "#000",
},
]}
>
<Text
style={[
styles.sectionTitle,
{ color: subTextColor, backgroundColor: sectionTitleBg },
]}
>
App Info
</Text>
<SettingItem label="Version" value="1.0.0" />
<SettingItem label="Build" value="Expo" />
</View>
<View
style={[
styles.section,
{
backgroundColor: sectionBg,
shadowColor: isDark ? "rgba(255,255,255,0.02)" : "#000",
shadowColor: isDark ? 'rgba(255,255,255,0.02)' : '#000',
},
]}
>
@@ -170,17 +151,17 @@ export default function SettingsScreen() {
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#f5f5f5",
backgroundColor: '#f5f5f5',
},
content: {
padding: 20,
},
section: {
backgroundColor: "#fff",
backgroundColor: '#fff',
borderRadius: 12,
marginBottom: 20,
overflow: "hidden",
shadowColor: "#000",
overflow: 'hidden',
shadowColor: '#000',
shadowOffset: { width: 0, height: 2 },
shadowOpacity: 0.1,
shadowRadius: 4,
@@ -188,63 +169,63 @@ const styles = StyleSheet.create({
},
sectionTitle: {
fontSize: 14,
fontWeight: "bold",
color: "#666",
fontWeight: 'bold',
color: '#666',
paddingHorizontal: 15,
paddingTop: 15,
paddingBottom: 10,
backgroundColor: "#f9f9f9",
backgroundColor: '#f9f9f9',
borderTopLeftRadius: 12,
borderTopRightRadius: 12,
},
settingItem: {
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
paddingHorizontal: 15,
paddingVertical: 15,
borderBottomWidth: 1,
borderBottomColor: "#f0f0f0",
borderBottomColor: '#f0f0f0',
},
settingLabel: {
fontSize: 16,
color: "#333",
color: '#333',
flex: 1,
},
settingValueContainer: {
flex: 1,
alignItems: "flex-end",
alignItems: 'flex-end',
},
settingValue: {
fontSize: 14,
color: "#666",
color: '#666',
maxWidth: 200,
},
actionButton: {
backgroundColor: "#007AFF",
backgroundColor: '#007AFF',
margin: 15,
padding: 15,
borderRadius: 8,
alignItems: "center",
alignItems: 'center',
},
actionButtonDestructive: {
backgroundColor: "#f44336",
backgroundColor: '#f44336',
},
actionButtonText: {
color: "#fff",
color: '#fff',
fontSize: 16,
fontWeight: "bold",
fontWeight: 'bold',
},
actionButtonTextDestructive: {
color: "#fff",
color: '#fff',
},
footer: {
alignItems: "center",
alignItems: 'center',
paddingVertical: 30,
},
footerText: {
fontSize: 14,
color: "#999",
color: '#999',
marginBottom: 5,
},
});

View File

@@ -55,7 +55,7 @@ export default function LoginScreen() {
>
<ScrollView contentContainerStyle={styles.scrollContent}>
<View style={styles.header}>
<Text style={[styles.title, { color: textColor }]}>Remote WoL</Text>
<Text style={[styles.title, { color: textColor }]}>Jumpstart</Text>
<Text style={[styles.subtitle, { color: subText }]}>
Mobile Frontend for UpSnap
</Text>

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 54 KiB

View File

@@ -1,19 +1,48 @@
{
"fill" : {
"automatic-gradient" : "extended-srgb:0.00000,0.53333,1.00000,1.00000"
"automatic-gradient" : "extended-gray:1.00000,1.00000"
},
"groups" : [
{
"layers" : [
{
"glass" : true,
"image-name" : "gopher.svg",
"name" : "gopher",
"hidden" : false,
"image-name" : "Image.png",
"name" : "Image",
"position" : {
"scale" : 0.45,
"scale" : 0.65,
"translation-in-points" : [
-6.017952794793246,
-0.4600234584925147
0,
-52.942187500000045
]
}
},
{
"fill-specializations" : [
{
"appearance" : "dark",
"value" : "none"
}
],
"image-name-specializations" : [
{
"value" : "display 2.png"
},
{
"appearance" : "dark",
"value" : "display.png"
},
{
"appearance" : "tinted",
"value" : "display 3.png"
}
],
"name" : "display 3",
"position" : {
"scale" : 1.25,
"translation-in-points" : [
0,
-10.625
]
}
}