How bytedotdevs/thesignbridgeghana works
SignBridgeGhana is a React-based Ghanaian Sign Language dictionary and translation platform. Users browse or search the vocabulary, open detailed sign entries, and save favorites; the translator offers camera-based sign recognition, text-to-sign avatar playback, and a sign-sequence composer. The graph includes the routing/provider layer, dictionary data and search services, and persisted learning state. The README documents offline PWA support, but its service-worker implementation is not present in the supplied tree; translation internals beyond indexed module relationships are not inferred.
Main entry points: App.tsx Router and Providers · DictionaryContext.tsx Dictionary State · TranslatorPage.tsx Translator Studio · SignToTextView.tsx Sign to Text
Components 25
Application
- Router and Providers
src/App.tsx - Home
src/pages/HomePage.tsx
Dictionary
- Dictionary Browser
src/pages/DictionaryPage.tsx - Sign Detail
src/pages/VocabularyDetailPage.tsx - Alphabet Plates
src/pages/AlphabetPage.tsx - Categories
src/pages/CategoriesPage.tsx - Numerals
src/pages/NumeralsPage.tsx - Deaf Schools
src/pages/SchoolsPage.tsx - Dictionary State
src/context/DictionaryContext.tsx - Dictionary Data
src/services/dictionaryService.ts - Search Engine
src/services/searchService.ts - Dictionary Models
src/types/dictionary.ts
Translation Studio
- Translator Studio
src/pages/TranslatorPage.tsx - Camera Input
src/components/translator/CameraView.tsx - Sign to Text
src/components/translator/SignToTextView.tsx - Gesture Recognition
src/services/gestureRecognitionService.ts - Text to Sign Avatar
src/components/translator/TextToSignAvatar.tsx - Avatar Signing
src/services/avatarSigningService.ts - Sign Composer
src/components/translator/SignComposer.tsx - Pipeline Overview
src/components/translator/TranslationPipelineInfo.tsx
Learning State
- Favorites
src/pages/FavoritesPage.tsx - Favorites State
src/context/FavoritesContext.tsx - Local Persistence
src/services/storageService.ts
Other components
- Learner
- Browser LocalStorage
Connections 31
- Learner → Router and Providers: opens
src/App.tsx - Router and Providers → Home: routes to
src/App.tsx - Router and Providers → Dictionary Browser: routes to
src/App.tsx - Router and Providers → Sign Detail: routes to
src/App.tsx - Router and Providers → Alphabet Plates: routes to
src/App.tsx - Router and Providers → Categories: routes to
src/App.tsx - Router and Providers → Numerals: routes to
src/App.tsx - Router and Providers → Deaf Schools: routes to
src/App.tsx - Router and Providers → Translator Studio: routes to
src/App.tsx - Router and Providers → Favorites: routes to
src/App.tsx - Router and Providers → Dictionary State: provides
src/App.tsx - Router and Providers → Favorites State: provides
src/App.tsx - Home → Dictionary State: reads
src/pages/HomePage.tsx - Dictionary Browser → Dictionary State: reads
src/pages/DictionaryPage.tsx - Sign Detail → Dictionary Data: loads entry
src/pages/VocabularyDetailPage.tsx - Dictionary State → Dictionary Data: loads data
src/context/DictionaryContext.tsx - Dictionary State → Search Engine: searches
src/context/DictionaryContext.tsx - Dictionary State → Local Persistence: records searches
src/context/DictionaryContext.tsx - Favorites → Favorites State: reads
src/pages/FavoritesPage.tsx - Favorites State → Local Persistence: persists favorites
src/context/FavoritesContext.tsx - Local Persistence → Browser LocalStorage: reads and writes
src/services/storageService.ts - Translator Studio → Sign to Text: renders
src/pages/TranslatorPage.tsx - Translator Studio → Text to Sign Avatar: renders
src/pages/TranslatorPage.tsx - Translator Studio → Sign Composer: renders
src/pages/TranslatorPage.tsx - Translator Studio → Pipeline Overview: renders
src/pages/TranslatorPage.tsx - Sign to Text → Gesture Recognition: recognizes gestures
src/components/translator/SignToTextView.tsx - Text to Sign Avatar → Avatar Signing: generates signing
src/components/translator/TextToSignAvatar.tsx - Sign to Text → Dictionary State: looks up signs
src/components/translator/SignToTextView.tsx - Text to Sign Avatar → Dictionary State: uses vocabulary
src/components/translator/TextToSignAvatar.tsx - Sign Composer → Dictionary State: uses vocabulary
src/components/translator/SignComposer.tsx - Learner → Camera Input: presents gestures