Files

4.0 KiB

Media Aggregation and Sorting System

This is my final-year mobile app project.

It is an Expo/React Native app that pulls media from multiple sources (device storage, Google Photos picker flow, and NAS) and shows everything in one timeline-style view.

Notes:

note for ServerFiles, this can be ran on its own it doesn't need the rest of the project's code to run. /ServerFiles/ is its own subproject, it is only included in this repo as this is the public version of the repo with certain keys abstracted due to privacy reasons. Keys such as my google photos API key and NAS credentials are not included in this public repo, but the server file is included as it is a crucial part of the project and can be run on its own with the appropriate keys added in.

This is also why there are no commits, it is a necessary abstraction for security reasons. I cannot put my keys in the repo. To run the app, consult the .env.example.txt file. Use that file to create the .env file and add your keys.

The method of obtaining the Google photos picker's api key is via:

  • Go to the Google Cloud console Website
  • Sign up with a Google account
  • Create a new project
  • Enable the Google Photos Picker API (By searching for Google Photo Picker API)
  • Enable the API
  • Go to the OAuth consent screen tab
  • In the overview tab of the OAuth consent screen, click get started
  • Name the app
  • Add a support email (select the one you used to sign up for the google account)
  • In audience select: External
  • contact information = your email yet again (click enter after typing it in)
  • agree to the user data policy
  • click create
  • Go to the Clients tab
  • Application type = ANDROID
  • package name = com.bobthebob.massphotoapp
  • get fingerprint for app via the command it displays
  • under the advanced tab, enable custom URI scheme
  • click create
  • Copy the Client ID key and paste it into the .env file
  • Under Audience Tab, go to add users under the Test users section
  • Add your email address and any users you want to test the Google photos picker api with
  • click save

Running the Project

Node requirement: >=20.19.4.

Useful scripts:

npm run start
npm run android
npm run ios
npm run web

These scripts set NODE_ENV automatically so Expo can load the correct mode during bundling.

NAS backend

cd ./ServerFiles
npm i
npm start

What This Project Does

  • Local user accounts (register/login)
  • Local SQLite database on-device (PhotosApp.db)
  • Service onboarding for:
    • Google Photos
    • NAS
    • iCloud placeholder
  • Unified media view with source badges
  • Collections/albums screen
  • Search screen
  • Settings screen for theme, services, and backup options

Current Architecture

App entry and navigation

  • Entrypoint is App.js
  • App.js initializes the database, then mounts navigation
  • Stack flow:
    • Login
    • Register
    • Onboarding
    • MainTabs
    • Settings
  • Bottom tabs in MainTabs:
    • Library (HomeScreen)
    • Search (SearchScreen)
    • Collections (AlbumsScreen)

Data layer

Database setup lives in src/services/DatabaseService.js.

Tables currently used:

  • users
  • linked_accounts
  • media

Passwords are hashed with SHA-256 via src/services/CredentialEncryption.js. Linked account payloads are stored as Base64-encoded JSON strings.

Service/auth layer

Auth services are in src/AUTH/:

  • GoogleAUTH.js
  • NASAUTH.js
  • IOSAUTH.js (placeholder)

Common interface base: src/AUTH/AuthServiceBase.js.

API client wrappers are in src/API/.

Backend (NAS side)

There is a separate Node/Express backend in ServerFiles/server.js.

It handles NAS connection and file operations for the mobile app.

Project Structure

Media-Aggregation-and-Sorting-System/
├── App.js
├── app.json
├── package.json
├── src/
│   ├── API/
│   ├── AUTH/
│   ├── components/
│   ├── screens/
│   └── services/
├── ServerFiles/
│   ├── server.js
│   └── package.json
└── TEST/