App Architecture Overview

medusa-wallet/
├── app/                    # Expo Router file-based routing
├── api/                    # API integration layer
├── assets/                 # Images, fonts, and icons
├── components/             # Reusable React components
├── config/                 # Configuration files
├── constants/              # App constants
├── hooks/                  # Custom React hooks
├── layouts/                # Layout components
├── locales/                # Internationalization
├── schemas/                # Zod validation schemas
├── storage/                # Storage utilities (MMKV, Secure Store)
├── store/                  # Zustand state management
├── styles/                 # Shared styles and themes
├── types/                  # TypeScript type definitions
├── utils/                  # Utility functions
└── tests/                  # Unit and integration tests

// Access wallet by ID
app/(authenticated)/(plain)/wallet/[id]/index.tsx

// Access wallet settings
app/(authenticated)/(plain)/wallet/[id]/settings/index.tsx

// Access transaction details
app/(authenticated)/(plain)/wallet/[id]/transaction/[tid]/index.tsx

store/
├── auth.ts                 # Authentication state
├── wallets.ts              # Wallet management
├── settings.ts             # App settings
├── fiat.ts                 # Fiat currency preferences
└── version.ts              # App version tracking

// store/auth.ts
type AuthState = {
  firstTime: boolean
  loggedOut: boolean
  username: string
  email: string
  accessToken: string
  pinRetries: number
  authTriggered: boolean
}

// store/wallets.ts
type WalletsState = {
  wallets: Wallet[]
  walletColors: Record<string, WalletCardColor>
  selectedWalletId: string | null
  totalBalance: number
  totalFiat: number
  paylink?: Paylink
}

import { create } from 'zustand'
import { createJSONStorage, persist } from 'zustand/middleware'
import mmkvStorage from '@/storage/mmkv'

const useStore = create(
  persist(
    (set) => ({ /* state */ }),
    {
      name: 'medusa-store-name',
      storage: createJSONStorage(() => mmkvStorage)
    }
  )
)

api/
├── medusa.ts               # Medusa API (price data)
├── mempool.ts              # Mempool.space (blockchain data)
├── lnbits.ts               # LNbits (Lightning wallet)
├── lnaddress.ts            # Lightning Address
├── maxfy.ts                # Maxfy integration
└── github.ts               # GitHub API (updates)

import { QueryClient, QueryClientProvider } from '@tanstack/react-query'

const queryClient = new QueryClient()

// In component
const { data, isLoading } = useQuery({
  queryKey: ['wallet-balance'],
  queryFn: fetchBalance
})

// api/medusa.ts
const API_URL = 'https://api.medusa.bz/v1'

async function getBitcoinPricesAt(timestamp: number) {
  const response = await fetch(
    `${API_URL}/btcPriceAll?unix_time=${timestamp}`,
    { headers, method: 'GET' }
  )
  return await response.json()
}

// storage/mmkv.ts
import { MMKV } from 'react-native-mmkv'

const storage = new MMKV()

export default {
  getItem: (key: string) => storage.getString(key),
  setItem: (key: string, value: string) => storage.set(key, value),
  removeItem: (key: string) => storage.delete(key)
}

// storage/encrypted.ts
import * as SecureStore from 'expo-secure-store'

export async function setItem(key: string, value: string) {
  await SecureStore.setItemAsync(key, value)
}

export async function getItem(key: string) {
  return await SecureStore.getItemAsync(key)
}

schemas/
├── medusa.ts               # Medusa API schemas
├── mempool.ts              # Mempool API schemas
├── lnbits.ts               # LNbits schemas
├── lnaddress.ts            # Lightning Address schemas
└── maxfy.ts                # Maxfy schemas

import { z } from 'zod'

export const TimestampPriceSchema = z.object({
  bitcoin: z.record(z.number())
})

type TimestampPrice = z.infer<typeof TimestampPriceSchema>

layouts/
├── MMainLayout.tsx         # Main screen layout
├── MFormLayout.tsx         # Form layout
├── MPinLayout.tsx          # PIN entry layout
├── MCenter.tsx             # Centered content
├── MHStack.tsx             # Horizontal stack
└── MVStack.tsx             # Vertical stack

styles/
├── index.ts                # Style exports
├── colors.ts               # Color palette
├── typography.ts           # Font styles
├── sizes.ts                # Spacing and sizes
└── layout.ts               # Layout utilities

import { Colors, Typography, Sizes } from '@/styles'

const styles = StyleSheet.create({
  container: {
    backgroundColor: Colors.dark,
    padding: Sizes.md
  },
  text: {
    ...Typography.body,
    color: Colors.textPrimary
  }
})

tests/
├── unit/                   # Unit tests
│   └── utils/              # Utility function tests
└── int/                    # Integration tests
    └── api/                # API integration tests

# All tests
pnpm test

# Unit tests only
pnpm test:unit

# Integration tests only
pnpm test:int