From 8b60c6ea356e20348bfd688b0b39cf05a4c6172c Mon Sep 17 00:00:00 2001 From: Rifa Achrinza <25147899+achrinza@users.noreply.github.com> Date: Sun, 28 Apr 2024 16:41:54 +0800 Subject: [PATCH] feat(sos): adds helplines Signed-off-by: Rifa Achrinza <25147899+achrinza@users.noreply.github.com> --- .../src/main/component/helplines.cljs | 61 +++++++++++++++++++ .../main/components/daily-feeling-scale.cljs | 6 -- packages/frontend/src/main/frontend/app.cljs | 30 ++++++--- packages/frontend/src/main/screen/home.cljs | 6 +- .../frontend/src/main/screen/resources.cljs | 4 +- packages/frontend/src/main/screen/sos.cljs | 25 +++----- 6 files changed, 98 insertions(+), 34 deletions(-) create mode 100644 packages/frontend/src/main/component/helplines.cljs delete mode 100644 packages/frontend/src/main/components/daily-feeling-scale.cljs diff --git a/packages/frontend/src/main/component/helplines.cljs b/packages/frontend/src/main/component/helplines.cljs new file mode 100644 index 0000000..1adb722 --- /dev/null +++ b/packages/frontend/src/main/component/helplines.cljs @@ -0,0 +1,61 @@ +(ns component.helplines + (:require [reagent.core :as r] + ["react-native" :as rn] + ["@expo/vector-icons" :refer [FontAwesome5]])) + +(defn helpline-group [title helplines streamlined-svc-mode] + [:> rn/View {:style {:marginTop (if streamlined-svc-mode "" "20px")}} + [:> rn/Text {:style {:color "#2A4E4C" + :fontSize "16px"}} + title] + (->> helplines + (map (fn [{name :name + contact :contact + operating-hours :operating-hours}] + [:> rn/Pressable {:style {:flexDirection :row + :alignItems "center" + :justifyContent "space-between" + :padding "10px"} + :onPress #(rn/Linking.openURL (str "tel:" contact))} + [:> rn/View + [:> rn/Text name] + [:> rn/Text {:style {:color :#a5a5a5}} + contact " · " operating-hours]] + [:> FontAwesome5 {:name :phone + :size 24 + :color :black}]])) + (into [:> rn/View]))]) + +(defn helplines [streamlined-svc-mode] + [:> rn/View {:style {:marginTop (if streamlined-svc-mode "" "20px")}} + (when (not streamlined-svc-mode) + [:> rn/Text {:style {:color :#2A4E4C + :fontSize 24}} + "More helplines"] + [helpline-group + "General Mental Well-Being" + [{:name "Institute of Mental Health" + :contact "6389 2222" + :operating-hours "24Hrs"} + {:name "Samaritans of Singapore" + :contact "1767" + :operating-hours "24Hrs"} + {:name "National Care Helpline" + :contact "1800 202 6868" + :operating-hours "Daily 8am-12am"} + {:name "Silver Ribbon Singapore" + :contact "6385 3714" + :operating-hours "Weekdays 9am-5pm"}]]) + + [helpline-group + (if streamlined-svc-mode "" "Service Helplines") + [{:name "Singapore Armed Forces" + :contact "1800 278 0022" + :operating-hours "24Hrs"} + {:name "Singapore Civil Defence Force" + :contact "1800 286 6666" + :operating-hours "24Hrs"} + {:name "Singapore Police Forces" + :contact "1800 255 1151" + :operating-hours "Weekdays 8.30am-6.30pm"}] + streamlined-svc-mode]]) diff --git a/packages/frontend/src/main/components/daily-feeling-scale.cljs b/packages/frontend/src/main/components/daily-feeling-scale.cljs deleted file mode 100644 index 99c8209..0000000 --- a/packages/frontend/src/main/components/daily-feeling-scale.cljs +++ /dev/null @@ -1,6 +0,0 @@ -(ns components.daily-feeling-scale - (:require [reagent.core :as r] - ["react-native" :as rn])) - -(defn feeling-scale [] - [:> rn/View {:style diff --git a/packages/frontend/src/main/frontend/app.cljs b/packages/frontend/src/main/frontend/app.cljs index 53f55ca..1b5a667 100644 --- a/packages/frontend/src/main/frontend/app.cljs +++ b/packages/frontend/src/main/frontend/app.cljs @@ -18,12 +18,6 @@ (def Tab (rnbt/createBottomTabNavigator)) (defn root [] -; [:> rnn/NavigationContainer -; [:> Stack.Navigator {:initialRouteName "Home"} -; [:> Stack.Screen {:name "Home" -; :component (r/reactify-component home-screen)}] -; [:> Stack.Screen {:name "SOS" -; :component (r/reactify-component sos-screen)}]]]) [:> rnn/NavigationContainer [:> Tab.Navigator {:initialRouteName :Home} [:> Tab.Screen {:name "Home" @@ -47,12 +41,34 @@ (rf/reg-event-db :initialize-db (fn [db _] - (assoc db :user "Guest"))) + (-> db + (assoc :user "Guest") + (assoc :helpline-groups {:general {:displayName "General Mental Well-being"} + :ns {:displayName "Service Helplines"}}) + (assoc :helplines [{:name "Institute of Mental Health" + :contact "6389 2222" + :operating-hours "24Hrs" + :group :general} + {:name "Samaritans of Singapore" + :contact "1767" + :operating-hours "24Hrs"} + {:name "National Care Helpline" + :contact "1800 202 6868" + :operating-hours "Daily 8am-12am"} + {:name "Silver Ribbon Singapore" + :contact "6385 3714" + :operating-hours "Weekdays 9am-5pm"}])))) (rf/reg-sub :user (fn [db _] (:user db))) + + (rf/reg-sub + :helplines-groups + (fn [db _] + (-> db + (select-keys [:helplines :helpline-groups])))) (rf/dispatch-sync [:initialize-db]) (start)) diff --git a/packages/frontend/src/main/screen/home.cljs b/packages/frontend/src/main/screen/home.cljs index 951e942..7ebdfad 100644 --- a/packages/frontend/src/main/screen/home.cljs +++ b/packages/frontend/src/main/screen/home.cljs @@ -39,8 +39,10 @@ :borderRadius :6px :flexDirection :row :gap :5px}} - [:> rn/Text {:style {:flex 2}} - "Image goes here"] +; [:> rn/Text {:style {:flex 2}} +; "Image goes here"] + [:> rn/Image {:style {:flex 2} + :source ""}] [:> rn/View {:style {:flex 5}} [:> rn/Text {:style {:color :#2A4E4C :fontWeight :bold}} diff --git a/packages/frontend/src/main/screen/resources.cljs b/packages/frontend/src/main/screen/resources.cljs index 45890fe..cae018e 100644 --- a/packages/frontend/src/main/screen/resources.cljs +++ b/packages/frontend/src/main/screen/resources.cljs @@ -1,5 +1,6 @@ (ns screen.resources (:require [reagent.core :as r] + [component.helplines :refer [helplines]] ["react-native" :as rn] ["@expo/vector-icons" :refer [FontAwesome5]])) @@ -72,7 +73,8 @@ :#DDF1FE "https://mindline.sg/"] - [section-header "Useful Contacts"]]]) + [section-header "Useful Contacts"] + [helplines true]]]) (defn resources-screen [] [resources-screen-inner]) diff --git a/packages/frontend/src/main/screen/sos.cljs b/packages/frontend/src/main/screen/sos.cljs index c5ab862..be9035a 100644 --- a/packages/frontend/src/main/screen/sos.cljs +++ b/packages/frontend/src/main/screen/sos.cljs @@ -1,20 +1,21 @@ (ns screen.sos (:require [reagent.core :as r] - ["react-native" :as rn])) + [re-frame.core :as rf] + [component.helplines :refer [helplines]] + ["react-native" :as rn] + ["@expo/vector-icons" :refer [FontAwesome5]])) (defn prominent-dialer [] [:> rn/View {:style {:alignItems :center}} -; :height :90%}} [:> rn/View {:style {:alignItems :center :justifyContent :center :padding :15px -; :height :90% :maxWidth :500px}} [:> rn/Text {:style {:fontSize 24}} "You are not alone."] [:> rn/Text {:style {:fontSize 24}} "We're here to help."] [:> rn/Text {:style {:fontSize 14 :color :#a5a5a5}} "You will remain anonymous."] - [:> rn/View {:style {:borderRadius :100% + [:> rn/Pressable {:style {:borderRadius :100% :background :#FCEDD0 :margin :20px :padding :15px @@ -52,21 +53,9 @@ "Helpline 1767"]]]] [:> rn/Text {:style {:color :#a5a5a5 :fontSize 14}} - "The button will bring up your phone’s dialler but will not call immediately."]]]) - -(defn helpline-group [title hotlines] - [:> rn/View - [:> rn/Text title]]) - -(defn helplines [] - [:> rn/View - [:> rn/Text {:style {:color :#2A4E4C - :fontSize 24}} - "More helplines"] - [helpline-group - "General Mental Well-Being"]]) + "The button will bring up your phone’s dialer but will not call immediately."]]]) (defn sos-screen [] - [:> rn/ScrollView + [:> rn/ScrollView {:style {:padding "10px"}} [prominent-dialer] [helplines]])