Skip to content

Commit

Permalink
feat: added missing features
Browse files Browse the repository at this point in the history 
Added:
- Daily feeling score highlight on click
- Login as guest
- Refactored codebase to use re-frame

Signed-off-by: Rifa Achrinza <[email protected]>
  • Loading branch information
@achrinza
achrinza committed May 10, 2024
1 parent 5bc4386 commit b71de16
Show file tree
Hide file tree
Showing 8 changed files with 343 additions and 177 deletions.
2 changes: 2 additions & 0 deletions packages/frontend/metro.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,6 @@ const { withNativeWind } = require('nativewind/metro');

const config = getDefaultConfig(__dirname)

config.resolver.assetExts = [...config.resolver.assetExts, 'txt']

module.exports = withNativeWind(config, { input: './global.css' })
10 changes: 10 additions & 0 deletions packages/frontend/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 3 additions & 0 deletions packages/frontend/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
"version": "0.0.1",
"private": true,
"main": "./app/index.js",
"homepage": "/mental-health-app-demo",
"scripts": {
"server": "shadow-cljs server",
"start": "expo start --offline",
Expand Down Expand Up @@ -31,6 +32,8 @@
"@react-navigation/native-stack": "^6.9.26",
"babel-plugin-module-resolver": "^5.0.0",
"create-react-class": "^15.7.0",
"expo-asset": "^9.0.2",
"expo-av": "^13.10.6",
"expo-font": "^11.10.3",
"nativewind": "^4.0.36",
"react": "^18.2.0",
Expand Down
136 changes: 99 additions & 37 deletions packages/frontend/src/main/frontend/app.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,12 @@
(:require [re-frame.core :as rf]
[reagent.core :as r]
[shadow.expo :as expo]
[screen.auth :refer [auth-screen]]
[screen.home :refer [home-screen]]
[screen.sos :refer [sos-screen]]
[screen.resources :refer [resources-screen]]
["expo-font" :as ef]
["@expo/vector-icons" :as evi]
["react-native" :as rn]
["@react-navigation/native" :as rnn]
["@react-navigation/bottom-tabs" :as rnbt]
Expand All @@ -16,42 +18,31 @@
(js/require "../global.css")
(js/require "react-native-gesture-handler")

(def Stack (rnns/createNativeStackNavigator))
(def Tab (rnbt/createBottomTabNavigator))
(defn -authenticated-navigator []
(let [tab (rnbt/createBottomTabNavigator)
navigator (.-Navigator tab)
screen (.-Screen tab)]
[:> navigator {:initialRouteName "Home"
:screenOptions {:headerShown false}}
[:> screen {:name "Home"
:component (r/reactify-component home-screen)}]
[:> screen {:name "SOS"
:component (r/reactify-component sos-screen)}]
[:> screen {:name "Resources"
:component (r/reactify-component resources-screen)}]]))

(defn root []
[:> rnn/NavigationContainer
[:> Tab.Navigator {:initialRouteName "Home"
:screenOptions {:tabBarShowLabel false}}
[:> Tab.Screen {:name "Home"
:component (r/reactify-component home-screen)
:options {:headerShown false
:tabBarIcon #(let [{size :size
color :color} (js->clj % {:keywordize-keys true})]
(-> [:> FontAwesome5 {:name "home"
:color color
:size size}]
(r/as-element)))}}]
[:> Tab.Screen {:name "SOS"
:component (r/reactify-component sos-screen)
:options {:headerShown false

:tabBarIcon #(let [{size :size
color :color} (js->clj % {:keywordize-keys true})]
(-> [:> MaterialIcons {:name "sos"
:color color
:size size}]
(r/as-element)))}}]
[:> Tab.Screen {:name "Resources"
:component (r/reactify-component resources-screen)
:options {:headerShown false
:tabBarIcon #(let [{size :size
color :color} (js->clj % {:keywordize-keys true})]
(-> [:> MaterialIcons {:name "message"
:color color
:size size}]
(r/as-element)))}}]]])

(let [user-mode @(rf/subscribe [:user-mode])
stack (rnns/createNativeStackNavigator)
navigator (.-Navigator stack)
screen (.-Screen stack)]
[:> rnn/NavigationContainer
[:> navigator {:screenOptions {:headerShown false}}
(if-not user-mode
[:> screen {:name "Auth"
:component (r/reactify-component auth-screen)}]
[:> screen {:name "AuthenticatedArea"
:component (r/reactify-component -authenticated-navigator)}])]]))
(defn start
{:dev/after-load true}
[]
Expand All @@ -63,7 +54,8 @@
:initialize-db
(fn [db _]
(-> db
(assoc :user "Guest")
(assoc :user-preferred-name nil)
(assoc :user-mode nil)
(assoc :helpline-groups {:general {:displayName "General Mental Well-being"}
:ns {:displayName "Service Helplines"}})
(assoc :helplines [{:name "Institute of Mental Health"
Expand All @@ -78,18 +70,88 @@
:operating-hours "Daily 8am-12am"}
{:name "Silver Ribbon Singapore"
:contact "6385 3714"
:operating-hours "Weekdays 9am-5pm"}]))))
:operating-hours "Weekdays 9am-5pm"}])
(assoc :mindful-pause {:audio
[{:name "Breathe"
:audio-file (js/require "../assets/mindful-minutes/breathe.mp3")
:icon [:> evi/MaterialIcons {:name "air"
:size "20px"
:color "#A5A5A5"}]}
{:name "Take a sip of tea"
:audio-file (js/require "../assets/mindful-minutes/sip-tea.mp3")
:icon [:> evi/SimpleLineIcons {:name "cup" :size "20px" :color "#A5A5A5"}]}
{:name "Take a walk"
:audio-file "../assets/mindful-minutes/sip-tea.mp3"
:icon [:> evi/MaterialIcons {:name "directions-walk" :size "20px" :color "#A5A5A5"}]}
{:name "Look at the sky"
:audio-file "../assets/mindful-minutes/observe-sky.mp3"
:icon [:> evi/MaterialIcons {:name "cloud" :size "20px" :color "#A5A5A5"}]}]}))))

(rf/reg-sub
:user
(fn [db _]
(:user db)))
(:user-preferred-name db)))

(rf/reg-sub
:user-mode
(fn [db _]
(:user-mode db)))

(rf/reg-event-db
:set-user-mode
(fn [db [_ user-mode]]
(assoc db :user-mode user-mode)))

(rf/reg-event-db
:set-user-preferred-name
(fn [db, [_ user-preferred-name]]
(assoc db :user-prefered-name user-preferred-name)))

(rf/reg-sub
:user-feeling-rating
(fn [db _]
(:user-feeling-rating db)))

(rf/reg-event-db
:set-user-feeling-rating
(fn [db [_ user-feeling-rating]]
(assoc db :user-feeling-rating user-feeling-rating)))

(rf/reg-sub
:helplines-groups
(fn [db _]
(-> db
(select-keys [:helplines :helpline-groups]))))

(rf/reg-sub
:mindful-pause-audio
(fn [db _]
(-> db
(:mindful-pause)
(:audio))))

(rf/reg-sub
:play-track
(fn [db _]
(-> db
(:av-player/current-track))))

(rf/reg-event-db
:play-track
(fn [db [_ {audio-file :audio-file}]]
(assoc db
:av-player/current-track audio-file)))

(rf/reg-sub
:start-play-track
(fn [db _]
(-> db
(:av-player/playing))))

(rf/reg-event-db
:set-playing-mode
(fn [db playing]
(assoc db :av-player/playing playing)))

(rf/dispatch-sync [:initialize-db])
(start))
61 changes: 61 additions & 0 deletions packages/frontend/src/main/screen/auth.cljs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
(ns screen.auth
(:require
[reagent.core :as r]
[re-frame.core :as rf]
["react-native" :as rn]))

(def styles (-> (.create rn/StyleSheet #js {:btn
{:paddingTop "10px"
:paddingBottom "10px"
:paddingLeft "30px"
:paddingRight "30px"
:minWidth "10vw"
:borderRadius "8px"
:border "2px solid #2A4E4C"
:textAlign "center"}

:btn-primary
{:background "#2A4E4C"
:color "#FFF"}

:btn-secondary
{:border "2px solid #2A4E4C"}

:auth-screen
{:position "relative"
:height "100%"}

:auth-logo-container
{:height "100%"
:justifyContent "center"
:alignItems "center"}

:auth-selection
{:position "absolute"
:bottom 0
:left 0
:height "40vh"
:width "100%"
:flexDirection "row"
:alignItems "center"
:justifyContent "center"
:columnGap "20px"}})
(js->clj {:keywordize-keys true})))

(defn auth-screen []
[:> rn/View {:style (:auth-screen styles)}
[:> rn/View {:style (:auth-logo-container styles)}
[:> rn/Image {:source (js/require "../assets/logo.png")}]
[:> rn/Text {:style {:textAlign "center"}}
"For when you are feeling something..."]]

[:> rn/View {:style (:auth-selection styles)}
[:> rn/Text {:accessibilityRole "button"
:style (merge (:btn styles)
(:btn-primary styles))}
"Login"]
[:> rn/Text {:accessibilityRole "button"
:onPress #(rf/dispatch [:set-user-mode :guest])
:style (merge (:btn styles)
(:btn-secondary styles))}
"Guest"]]])
1 change: 1 addition & 0 deletions packages/frontend/src/main/screen/explore.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@
:marginBottom "10px"
:marginLeft :20px
:marginRight :20px
:padding "20px"
:height :32px
:flex 1
:alignItems :center}
Expand Down
Loading

0 comments on commit b71de16

Please sign in to comment.