Skip to main content

Mobile Architecture (Tfila Application)

The "Tfila" application is a React Native app (CLI, not Expo) designed for installation on Android TV displays, streamers, and tablets in synagogues. The application operates in "Kiosk Mode" and displays prayer times and announcements in sequence.

Key Technologies​

  • Framework: React Native 0.76+.
  • Language: TypeScript.
  • TV Support: react-native-tvos (or manual remote control adaptations).
  • Communication:
    • Socket.IO: For receiving real-time commands (Reload, Update).
    • MQTT: (Optional) for telemetry.
    • Axios: For regular API calls (Sync).
  • Storage: AsyncStorage (saving local settings, Token, and Cache).
  • Device Info: react-native-device-info (Unique ID identification).

Project Structure​

Tfila/
├── android/            # Native code (Gradle, Java/Kotlin)
├── src/
│   ├── components/     # UI components (Clock, MessageCard, TfilaRow)
│   ├── screens/        # Screens (MainDisplay, Settings, Pairing)
│   ├── services/       # Business logic (SocketService, ApiService)
│   ├── contexts/       # React Context (SettingsContext, ThemeContext)
│   ├── utilities/      # Helpers (Date formatting, Hebcal integration)
│   └── navigation/     # React Navigation (Stack Navigator)
└── App.tsx             # Entry point

Pairing Process​

  1. On first launch, the application checks if an authToken exists in storage.
  2. Without a token, a Pairing screen is displayed with a 6-digit code (generated anonymously or locally on the server).
  3. The synagogue administrator enters the code in the management interface (WEB).
  4. The server sends a paired event via Socket.
  5. The application saves the token, downloads the synagogue configuration, and transitions to the display screen.

Reliability and Resilience​

  • Offline Mode: The application caches the latest data (prayer times, messages) locally. In case of internet disconnection, it will continue to display the last known information.
  • Auto Boot: Configured in AndroidManifest to launch automatically on device startup (RECEIVE_BOOT_COMPLETED).
  • Keep Awake: Uses react-native-keep-awake to prevent screen timeout.