Merge pull request 'feat. Timer Done Alert (Issue #3)' (#4) from dev-issue-3 into main

Reviewed-on: #1

.gitea/workflows/ci.yml

@@ -5,7 +5,7 @@ on:
       - main
 
 jobs:
-  build:
+  build-android:
     runs-on: ubuntu-latest
     steps:
     - name: 🏗 Setup repo
@@ -48,7 +48,6 @@ jobs:
           --platform=android \
           --profile=preview
 
-    # Neuer Schritt: Rename das Binary, damit es wie eine echte App aussieht
     - name: 📝 Rename build to APK
       run: mv app-build app-release.apk
 
@@ -59,6 +58,62 @@ jobs:
         path: app-release.apk
         if-no-files-found: error
 
+  build-web:
+    runs-on: ubuntu-latest
+    steps:
+    - name: 🏗 Setup repo
+      uses: actions/checkout@v2
+
+    - name: 🏗 Setup Node
+      uses: actions/setup-node@v2
+      with:
+        node-version: 22
+
+    - name: 🏗 Setup pnpm
+      uses: pnpm/action-setup@v4
+      with:
+        version: latest
+
+    - name: 🏗 Setup Expo and EAS
+      uses: expo/expo-github-action@v8
+      with:
+        token: ${{ secrets.EXPO_TOKEN }}
+        eas-version: latest
+        packager: pnpm
+
+    - name: 📦 Install dependencies
+      run: pnpm install
+
+    - name: 👷 Build web
+      run: npx expo export --platform web
+
+    - name: 📦 Zip dist
+      run: cd dist && zip -r ../dist.zip .
+
+    - name: 📤 Upload build artifact
+      uses: actions/upload-artifact@v3
+      with:
+        name: web-build
+        path: dist.zip
+        if-no-files-found: error
+
+  release:
+    runs-on: ubuntu-latest
+    needs: [build-android, build-web]
+    steps:
+    - name: 🏗 Setup repo
+      uses: actions/checkout@v2
+
+    - name: 📥 Download Android artifact
+      uses: actions/download-artifact@v3
+      with:
+        name: android-preview-build
+
+    - name: 📥 Download Web artifact
+      uses: actions/download-artifact@v3
+      with:
+        name: web-build
+
     - name: 🏷 Create tag
       run: |
         TAG="build-$(git rev-parse --short HEAD)"
@@ -71,7 +126,9 @@ jobs:
       with:
         tag_name: ${{ env.RELEASE_TAG }}
         name: ${{ env.RELEASE_TAG }}
-        files: app-release.apk
+        files: |
+          app-release.apk
+          dist.zip
         generate_release_notes: true
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitea/workflows/dev.yml

@@ -0,0 +1,28 @@
+name: Dev Branch Check
+on:
+  push:
+    branches-ignore:
+      - main
+
+jobs:
+  validate:
+    runs-on: ubuntu-latest
+    steps:
+    - name: 🏗 Setup repo
+      uses: actions/checkout@v2
+
+    - name: 🏗 Setup Node
+      uses: actions/setup-node@v2
+      with:
+        node-version: 22
+
+    - name: 🏗 Setup pnpm
+      uses: pnpm/action-setup@v4
+      with:
+        version: latest
+
+    - name: 📦 Install dependencies
+      run: pnpm install
+
+    - name: 🧪 Check for linting/type errors
+      run: npx expo export --platform web

.gitea/workflows/manual-build.yml

@@ -0,0 +1,57 @@
+name: Manual APK Build
+on:
+  workflow_dispatch:
+
+jobs:
+  build-android:
+    runs-on: ubuntu-latest
+    steps:
+    - name: 🏗 Setup repo
+      uses: actions/checkout@v2
+
+    - name: 🏗 Setup Node
+      uses: actions/setup-node@v2
+      with:
+        node-version: 22
+
+    - name: 🏗 Setup pnpm
+      uses: pnpm/action-setup@v4
+      with:
+        version: latest
+
+    - name: 🏗 Setup Java
+      uses: actions/setup-java@v4
+      with:
+        distribution: temurin
+        java-version: 17
+
+    - name: 🏗 Setup Android SDK
+      uses: android-actions/setup-android@v3
+
+    - name: 🏗 Setup Expo and EAS
+      uses: expo/expo-github-action@v8
+      with:
+        token: ${{ secrets.EXPO_TOKEN }}
+        eas-version: latest
+        packager: pnpm
+
+    - name: 📦 Install dependencies
+      run: pnpm install
+
+    - name: 👷 Build app
+      run: |
+        eas build --local \
+          --non-interactive \
+          --output=./app-build \
+          --platform=android \
+          --profile=preview
+
+    - name: 📝 Rename build to APK
+      run: mv app-build time-until-manual.apk
+
+    - name: 📤 Upload build artifact
+      uses: actions/upload-artifact@v3
+      with:
+        name: manual-apk-build
+        path: time-until-manual.apk
+        if-no-files-found: error

.github/copilot-instructions.md

@@ -0,0 +1,45 @@
+# Project Guidelines
+
+## Code Style
+- Keep components as functional React components and use hooks-based state.
+- Follow existing naming and structure in `src/screens` and `src/components`:
+  - Screen files: `*Screen.js`
+  - Shared UI pieces: `src/components/*.js`
+- Keep styling centralized in `src/styles.js` via `createStyles()` and use theme-driven inline color overrides in screens/components.
+- Reuse `getTheme(darkMode, pinkMode)` from `src/theme.js` for color values; do not hardcode alternate palettes in individual screens.
+
+## Architecture
+- Root orchestration lives in `App.js`:
+  - App-level state includes current screen, focus mode, theme toggles, and timer/countdown state.
+  - Screen switching is controlled by the `screen` state (`home`, `timeuntil`, `timer`).
+- Screen responsibilities:
+  - `HomeScreen`: mode selection and top controls.
+  - `TimeUntilScreen`: target clock-time countdown flow.
+  - `TimerScreen`: duration countdown flow.
+  - `FocusScreen`: minimal fullscreen countdown UI.
+- Shared presentational components:
+  - `TopControls`: dark/pink/fullscreen/focus controls.
+  - `CountdownRow`: reusable HH:MM:SS display.
+
+## Build And Run
+- Install dependencies: `npm install`
+- Start dev server: `npm start`
+- Run on Android: `npm run android`
+- Run on iOS: `npm run ios`
+- Run on web: `npm run web`
+- EAS builds use `eas.json` profiles (`development`, `preview`, `production`).
+
+## Conventions
+- Keep timer/countdown behavior in `App.js` unless intentionally refactoring architecture.
+- Preserve current time behavior:
+  - `now` updates every second with `setInterval`.
+  - Time-until target is based on local device time and rolls to next day when target time has passed.
+- Maintain platform guards:
+  - Web-only fullscreen uses `document.fullscreenElement` APIs.
+  - Android hardware back behavior is handled in `App.js` and should keep focus/screen fallback behavior.
+- For countdown display, continue using `CountdownRow` and 2-digit padded units for consistency.
+
+## Pitfalls
+- This project has no test scripts configured; do not claim tests were run unless you add and run them.
+- Be careful with web-only globals (`document`) and keep `Platform.OS` guards.
+- Avoid introducing timezone assumptions without explicit product requirements; current logic is local-time based.

App.js

@@ -1,6 +1,9 @@
 import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { BackHandler, Platform, StatusBar } from 'react-native';
+import { BackHandler, Platform, StatusBar, Modal, View, Image, StyleSheet, Button } from 'react-native';
 import * as ScreenOrientation from 'expo-screen-orientation';
+import * as SplashScreen from 'expo-splash-screen';
+import { Accelerometer } from 'expo-sensors';
+import { Audio } from 'expo-av';
 import FocusScreen from './src/screens/FocusScreen';
 import HomeScreen from './src/screens/HomeScreen';
 import TimeUntilScreen from './src/screens/TimeUntilScreen';
@@ -8,6 +11,11 @@ import TimerScreen from './src/screens/TimerScreen';
 import { createStyles } from './src/styles';
 import { getTheme } from './src/theme';
 
+// Keep the splash screen visible while we fetch resources
+SplashScreen.preventAutoHideAsync().catch(() => {
+  /* reloading the app might cause this to error in dev */
+});
+
 export default function App() {
   const styles = useMemo(() => createStyles(), []);
 
@@ -17,6 +25,8 @@ export default function App() {
   const [pinkMode, setPinkMode] = useState(false);
   const [isFullscreen, setIsFullscreen] = useState(false);
   const [now, setNow] = useState(new Date());
+  
+  const [showMinion, setShowMinion] = useState(false);
 
   const [targetTime, setTargetTime] = useState(null);
   const [tuHour, setTuHour] = useState('');
@@ -33,12 +43,31 @@ export default function App() {
   const timerRef = useRef(null);
   const theme = getTheme(darkMode, pinkMode);
 
+  useEffect(() => {
+    // Hide splash screen after initialization
+    SplashScreen.hideAsync().catch(() => {});
+  }, []);
+
   useEffect(() => {
     if (Platform.OS !== 'web') {
       ScreenOrientation.unlockAsync();
     }
   }, []);
 
+  useEffect(() => {
+    if (Platform.OS === 'android' || Platform.OS === 'ios') {
+      Accelerometer.setUpdateInterval(500);
+      const subscription = Accelerometer.addListener(({ x, y, z }) => {
+        const acceleration = Math.sqrt(x * x + y * y + z * z);
+        if (acceleration > 2.5) {
+          setShowMinion(true);
+          setTimeout(() => setShowMinion(false), 3000);
+        }
+      });
+      return () => subscription.remove();
+    }
+  }, []);
+
   useEffect(() => {
     const interval = setInterval(() => setNow(new Date()), 1000);
     return () => clearInterval(interval);
@@ -166,6 +195,29 @@ export default function App() {
   const timerSec = timerRemaining % 60;
   const tuCountdown = getTuCountdown();
 
+  const playSound = async () => {
+    try {
+      const { sound } = await Audio.Sound.createAsync(
+        require('./assets/alert.mp3'),
+        { shouldPlay: true, volume: 1.0 }
+      );
+      
+      sound.setOnPlaybackStatusUpdate((status) => {
+        if (status.didJustFinish) {
+          sound.unloadAsync();
+        }
+      });
+    } catch (error) {
+      console.log('Error playing sound:', error);
+    }
+  };
+
+  useEffect(() => {
+    if (timerDone || tuIsOver) {
+      playSound();
+    }
+  }, [timerDone, tuIsOver]);
+
   if (focusMode) {
     return (
       <FocusScreen
@@ -240,6 +292,18 @@ export default function App() {
 
   return (
     <>
+      <Modal visible={showMinion} transparent={true} animationType="fade">
+        <View style={StyleSheet.absoluteFill}>
+          <Image
+            source={{ uri: 'https://shx.reversed.dev/u/XHuDcA.jpg' }}
+            style={{ flex: 1 }}
+            resizeMode="contain"
+          />
+          <View style={{ position: 'absolute', top: 50, right: 20 }}>
+            <Button title="Dismiss" onPress={() => setShowMinion(false)} />
+          </View>
+        </View>
+      </Modal>
       <StatusBar barStyle={barStyle} backgroundColor={theme.bg} />
       <TimerScreen
         styles={styles}

README.md

@@ -0,0 +1,49 @@
+# Time Until
+
+A small Expo React Native app with two countdown modes:
+
+- **Time Until**: count down to a target clock time (local device time)
+- **Timer**: count down from a duration you enter (hours/minutes/seconds)
+
+It also includes a minimal focus view, dark mode, and a pink accent theme.
+
+## Download
+
+You can download ready-to-use apk builds from the Releases page:
+
+https://gitea.reversed.dev/space/time-until/releases
+
+## How It Works
+
+- Main app state and countdown logic live in `App.js`.
+- Screen components are in `src/screens`.
+- Shared UI components are in `src/components`.
+- Theme + styling are managed via `src/theme.js` and `src/styles.js`.
+
+## Development
+
+1. Install dependencies:
+   ```bash
+   npm install
+   ```
+
+2. Start the development server:
+   ```bash
+   npx expo start
+   ```
+
+### Time Until Mode
+
+- Enter hour/minute in 24-hour format.
+- If the selected time has already passed today, it rolls to the next day.
+
+### Timer Mode
+
+- Enter a duration in hours/minutes/seconds.
+- Supports start, pause, resume, and reset.
+
+## Notes
+
+- Time calculations are based on local device time.
+- Web fullscreen uses browser fullscreen APIs.
+- No automated test scripts are currently configured in `package.json`.

app.json

@@ -19,7 +19,7 @@
     "android": {
       "package": "com.spacebanane.timeuntil",
       "adaptiveIcon": {
-        "foregroundImage": "./assets/adaptive-icon.png",
+        "foregroundImage": "./assets/icon.png",
         "backgroundColor": "#0d0d0d"
       }
     },

docker-compose.yml

@@ -0,0 +1,8 @@
+services:
+  web:
+    image: nginx:alpine
+    ports:
+      - "45554:80"
+    volumes:
+      - ./entrypoint.sh:/entrypoint.sh:ro
+    entrypoint: ["/bin/sh", "/entrypoint.sh"]

entrypoint.sh

@@ -0,0 +1,29 @@
+#!/bin/sh
+set -e
+
+WEBROOT="/usr/share/nginx/html"
+GITEA_URL="https://gitea.reversed.dev"
+GITEA_REPO="space/time-until"
+
+echo "Fetching latest release"
+
+RELEASE_JSON=$(wget -qO- \
+  "$GITEA_URL/api/v1/repos/$GITEA_REPO/releases/latest")
+
+ASSET_URL=$(echo "$RELEASE_JSON" | sed -n 's/.*"browser_download_url" *: *"\([^"]*dist\.zip[^"]*\)".*/\1/p' | head -1)
+
+if [ -z "$ASSET_URL" ]; then
+  echo "ERROR: No dist.zip found in latest release"
+  exit 1
+fi
+
+echo "Downloading $ASSET_URL ..."
+wget -qO /tmp/dist.zip --header="$AUTH_HEADER" "$ASSET_URL"
+
+echo "Extracting to $WEBROOT ..."
+rm -rf "${WEBROOT:?}"/*
+unzip -o /tmp/dist.zip -d "$WEBROOT"
+rm /tmp/dist.zip
+
+echo "Starting nginx ..."
+exec nginx -g "daemon off;"

package-lock.json

@@ -9,7 +9,10 @@
       "version": "1.0.0",
       "dependencies": {
         "expo": "~54.0.33",
+        "expo-av": "^16.0.8",
         "expo-screen-orientation": "~9.0.8",
+        "expo-sensors": "^55.0.8",
+        "expo-splash-screen": "^55.0.10",
         "expo-status-bar": "~3.0.9",
         "react": "19.1.0",
         "react-dom": "19.1.0",
@@ -54,7 +57,6 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
       "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.29.0",
         "@babel/generator": "^7.29.0",
@@ -1409,7 +1411,6 @@
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
       "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=6.9.0"
       }
@@ -2171,6 +2172,193 @@
         "xmlbuilder": "^15.1.1"
       }
     },
+    "node_modules/@expo/prebuild-config": {
+      "version": "55.0.8",
+      "resolved": "https://registry.npmjs.org/@expo/prebuild-config/-/prebuild-config-55.0.8.tgz",
+      "integrity": "sha512-VJNJiOmmZgyDnR7JMmc3B8Z0ZepZ17I8Wtw+wAH/2+UCUsFg588XU+bwgYcFGw+is28kwGjY46z43kfufpxOnA==",
+      "license": "MIT",
+      "dependencies": {
+        "@expo/config": "~55.0.8",
+        "@expo/config-plugins": "~55.0.6",
+        "@expo/config-types": "^55.0.5",
+        "@expo/image-utils": "^0.8.12",
+        "@expo/json-file": "^10.0.12",
+        "@react-native/normalize-colors": "0.83.2",
+        "debug": "^4.3.1",
+        "resolve-from": "^5.0.0",
+        "semver": "^7.6.0",
+        "xml2js": "0.6.0"
+      },
+      "peerDependencies": {
+        "expo": "*"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/@expo/config": {
+      "version": "55.0.8",
+      "resolved": "https://registry.npmjs.org/@expo/config/-/config-55.0.8.tgz",
+      "integrity": "sha512-D7RYYHfErCgEllGxNwdYdkgzLna7zkzUECBV3snbUpf7RvIpB5l1LpCgzuVoc5KVew5h7N1Tn4LnT/tBSUZsQg==",
+      "license": "MIT",
+      "dependencies": {
+        "@expo/config-plugins": "~55.0.6",
+        "@expo/config-types": "^55.0.5",
+        "@expo/json-file": "^10.0.12",
+        "@expo/require-utils": "^55.0.2",
+        "deepmerge": "^4.3.1",
+        "getenv": "^2.0.0",
+        "glob": "^13.0.0",
+        "resolve-from": "^5.0.0",
+        "resolve-workspace-root": "^2.0.0",
+        "semver": "^7.6.0",
+        "slugify": "^1.3.4"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/@expo/config-plugins": {
+      "version": "55.0.6",
+      "resolved": "https://registry.npmjs.org/@expo/config-plugins/-/config-plugins-55.0.6.tgz",
+      "integrity": "sha512-cIox6FjZlFaaX40rbQ3DvP9e87S5X85H9uw+BAxJE5timkMhuByy3GAlOsj1h96EyzSiol7Q6YIGgY1Jiz4M+A==",
+      "license": "MIT",
+      "dependencies": {
+        "@expo/config-types": "^55.0.5",
+        "@expo/json-file": "~10.0.12",
+        "@expo/plist": "^0.5.2",
+        "@expo/sdk-runtime-versions": "^1.0.0",
+        "chalk": "^4.1.2",
+        "debug": "^4.3.5",
+        "getenv": "^2.0.0",
+        "glob": "^13.0.0",
+        "resolve-from": "^5.0.0",
+        "semver": "^7.5.4",
+        "slugify": "^1.6.6",
+        "xcode": "^3.0.1",
+        "xml2js": "0.6.0"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/@expo/config-types": {
+      "version": "55.0.5",
+      "resolved": "https://registry.npmjs.org/@expo/config-types/-/config-types-55.0.5.tgz",
+      "integrity": "sha512-sCmSUZG4mZ/ySXvfyyBdhjivz8Q539X1NondwDdYG7s3SBsk+wsgPJzYsqgAG/P9+l0xWjUD2F+kQ1cAJ6NNLg==",
+      "license": "MIT"
+    },
+    "node_modules/@expo/prebuild-config/node_modules/@expo/plist": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@expo/plist/-/plist-0.5.2.tgz",
+      "integrity": "sha512-o4xdVdBpe4aTl3sPMZ2u3fJH4iG1I768EIRk1xRZP+GaFI93MaR3JvoFibYqxeTmLQ1p1kNEVqylfUjezxx45g==",
+      "license": "MIT",
+      "dependencies": {
+        "@xmldom/xmldom": "^0.8.8",
+        "base64-js": "^1.5.1",
+        "xmlbuilder": "^15.1.1"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/@react-native/normalize-colors": {
+      "version": "0.83.2",
+      "resolved": "https://registry.npmjs.org/@react-native/normalize-colors/-/normalize-colors-0.83.2.tgz",
+      "integrity": "sha512-gkZAb9LoVVzNuYzzOviH7DiPTXQoZPHuiTH2+O2+VWNtOkiznjgvqpwYAhg58a5zfRq5GXlbBdf5mzRj5+3Y5Q==",
+      "license": "MIT"
+    },
+    "node_modules/@expo/prebuild-config/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
+    "node_modules/@expo/prebuild-config/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@expo/prebuild-config/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@expo/require-utils": {
+      "version": "55.0.2",
+      "resolved": "https://registry.npmjs.org/@expo/require-utils/-/require-utils-55.0.2.tgz",
+      "integrity": "sha512-dV5oCShQ1umKBKagMMT4B/N+SREsQe3lU4Zgmko5AO0rxKV0tynZT6xXs+e2JxuqT4Rz997atg7pki0BnZb4uw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.20.0",
+        "@babel/core": "^7.25.2",
+        "@babel/plugin-transform-modules-commonjs": "^7.24.8"
+      },
+      "peerDependencies": {
+        "typescript": "^5.0.0 || ^5.0.0-0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@expo/require-utils/node_modules/@babel/code-frame": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
+      "integrity": "sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.28.5",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@expo/schema-utils": {
       "version": "0.1.8",
       "resolved": "https://registry.npmjs.org/@expo/schema-utils/-/schema-utils-0.1.8.tgz",
@@ -3635,7 +3823,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -4243,7 +4430,6 @@
       "resolved": "https://registry.npmjs.org/expo/-/expo-54.0.33.tgz",
       "integrity": "sha512-3yOEfAKqo+gqHcV8vKcnq0uA5zxlohnhA3fu4G43likN8ct5ZZ3LjAh9wDdKteEkoad3tFPvwxmXW711S5OHUw==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/runtime": "^7.20.0",
         "@expo/cli": "54.0.23",
@@ -4291,6 +4477,23 @@
         }
       }
     },
+    "node_modules/expo-av": {
+      "version": "16.0.8",
+      "resolved": "https://registry.npmjs.org/expo-av/-/expo-av-16.0.8.tgz",
+      "integrity": "sha512-cmVPftGR/ca7XBgs7R6ky36lF3OC0/MM/lpgX/yXqfv0jASTsh7AYX9JxHCwFmF+Z6JEB1vne9FDx4GiLcGreQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "expo": "*",
+        "react": "*",
+        "react-native": "*",
+        "react-native-web": "*"
+      },
+      "peerDependenciesMeta": {
+        "react-native-web": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/expo-modules-autolinking": {
       "version": "3.0.24",
       "resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-3.0.24.tgz",
@@ -4400,6 +4603,19 @@
         "react-native": "*"
       }
     },
+    "node_modules/expo-sensors": {
+      "version": "55.0.8",
+      "resolved": "https://registry.npmjs.org/expo-sensors/-/expo-sensors-55.0.8.tgz",
+      "integrity": "sha512-aYDw/IBqJtWQgCIJh12oyj5N4ldT88Aa0V/Vag88xG8K2hOQuM2SLGeNlxGRFRtgLJ4m7pzXhQW7CJRj6p1uHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "invariant": "^2.2.4"
+      },
+      "peerDependencies": {
+        "expo": "*",
+        "react-native": "*"
+      }
+    },
     "node_modules/expo-server": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/expo-server/-/expo-server-1.0.5.tgz",
@@ -4409,6 +4625,18 @@
         "node": ">=20.16.0"
       }
     },
+    "node_modules/expo-splash-screen": {
+      "version": "55.0.10",
+      "resolved": "https://registry.npmjs.org/expo-splash-screen/-/expo-splash-screen-55.0.10.tgz",
+      "integrity": "sha512-RN5qqrxudxFlRIjLFr/Ifmt+mUCLRc0gs66PekP6flzNS/JYEuoCbwJ+NmUwwJtPA+vyy60DYiky0QmS98ydmQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@expo/prebuild-config": "^55.0.8"
+      },
+      "peerDependencies": {
+        "expo": "*"
+      }
+    },
     "node_modules/expo-status-bar": {
       "version": "3.0.9",
       "resolved": "https://registry.npmjs.org/expo-status-bar/-/expo-status-bar-3.0.9.tgz",
@@ -4743,7 +4971,6 @@
       "resolved": "https://registry.npmjs.org/expo-font/-/expo-font-14.0.11.tgz",
       "integrity": "sha512-ga0q61ny4s/kr4k8JX9hVH69exVSIfcIc19+qZ7gt71Mqtm7xy2c6kwsPTCyhBW2Ro5yXTT8EaZOpuRi35rHbg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fontfaceobserver": "^2.1.0"
       },
@@ -7312,7 +7539,6 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.0.tgz",
       "integrity": "sha512-Xs1hdnE+DyKgeHJeJznQmYMIBG3TKIHJJT95Q58nHLSrElKlGQqDTR2HQ9fx5CN/Gk6Vh/kupBTDLU11/nDk/g==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "scheduler": "^0.26.0"
       },
@@ -7514,7 +7740,6 @@
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
       "integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -8392,7 +8617,6 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=12"
       },

package.json

@@ -10,7 +10,10 @@
   },
   "dependencies": {
     "expo": "~54.0.33",
+    "expo-av": "^16.0.8",
     "expo-screen-orientation": "~9.0.8",
+    "expo-sensors": "^55.0.8",
+    "expo-splash-screen": "^55.0.10",
     "expo-status-bar": "~3.0.9",
     "react": "19.1.0",
     "react-dom": "19.1.0",

src/screens/HomeScreen.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ScrollView, Text, TouchableOpacity, View } from 'react-native';
+import { ScrollView, Text, TouchableOpacity, View, Image } from 'react-native';
 import TopControls from '../components/TopControls';
 
 export default function HomeScreen({
@@ -18,6 +18,10 @@ export default function HomeScreen({
   return (
     <View style={[styles.root, { backgroundColor: theme.bg }]}>
       <ScrollView contentContainerStyle={styles.scroll} keyboardShouldPersistTaps="handled">
+        <Image
+          source={require('../../assets/icon.png')}
+          style={[styles.logo, pinkMode && { borderColor: theme.accent, borderWidth: 2 }]}
+        />
         <Text
           style={[
             styles.title,

src/styles.js

@@ -16,6 +16,12 @@ export function createStyles() {
       marginBottom: 20,
       letterSpacing: 1,
     },
+    logo: {
+      width: 100,
+      height: 100,
+      marginBottom: 20,
+      borderRadius: 22,
+    },
     topRow: {
       width: '100%',
       maxWidth: 640,