From 15c6cc0be761bdc21b539936e7581c086738ff7d Mon Sep 17 00:00:00 2001
From: pikiou <pikiou.sub@gmail.com>
Date: Tue, 11 Jan 2022 21:46:37 +0100
Subject: [PATCH] Fix api url in prod

---
 src/components/ForgotForm/ForgotForm.tsx      |  4 +-
 src/components/Notifications/index.tsx        | 50 ++++++++-----------
 .../Notifications/styles.module.scss          | 12 +++++
 src/config/prod.ts                            |  6 ++-
 src/pages/Home/Home.tsx                       | 16 +++++-
 src/pages/Home/styles.module.scss             |  6 +++
 src/server/gsheets/volunteers.ts              |  2 +-
 src/server/ssr.tsx                            |  3 +-
 src/store/utils.ts                            | 13 +++--
 src/store/volunteerNotifsSet.ts               |  5 +-
 webpack/base.config.ts                        |  2 +-
 11 files changed, 75 insertions(+), 44 deletions(-)

diff --git a/src/components/ForgotForm/ForgotForm.tsx b/src/components/ForgotForm/ForgotForm.tsx
index 6c5d3ef..b0fd47b 100644
--- a/src/components/ForgotForm/ForgotForm.tsx
+++ b/src/components/ForgotForm/ForgotForm.tsx
@@ -34,12 +34,12 @@ const ForgotForm = ({ dispatch, error, message }: Props): JSX.Element => {
                 <input type="email" id="email" name="utilisateur" />
             </div>
             <div className={styles.formButtons}>
-                <button type="submit">Connexion</button>
+                <button type="submit">Envoyer</button>
             </div>
             <div className={styles.error}>{error}</div>
             <div className={styles.message}>{message}</div>
             <div className={styles.link}>
-                <Link to="/login"> S&apos;identifier </Link>
+                <Link to="/"> S&apos;identifier </Link>
             </div>
         </form>
     )
diff --git a/src/components/Notifications/index.tsx b/src/components/Notifications/index.tsx
index 02b8ce1..8419845 100644
--- a/src/components/Notifications/index.tsx
+++ b/src/components/Notifications/index.tsx
@@ -1,8 +1,7 @@
 import _ from "lodash"
 import React, { memo, useCallback, useEffect, useRef, useState } from "react"
 import isNode from "detect-node"
-import { shallowEqual, useSelector } from "react-redux"
-import { AppDispatch, AppState } from "../../store"
+import { AppDispatch } from "../../store"
 import { fetchVolunteerNotifsSet } from "../../store/volunteerNotifsSet"
 import styles from "./styles.module.scss"
 import { logoutUser } from "../../store/auth"
@@ -12,19 +11,11 @@ import { VolunteerNotifs } from "../../services/volunteers"
 interface Props {
     dispatch: AppDispatch
     jwt: string
+    // eslint-disable-next-line react/require-default-props
+    volunteerNotifs?: VolunteerNotifs
 }
-let prevNotifs: VolunteerNotifs | undefined
-
-const Notifications = ({ dispatch, jwt }: Props): JSX.Element | null => {
-    const volunteerNotifs = useSelector((state: AppState) => {
-        const notifs = state.volunteerNotifsSet.entity
-        if (notifs) {
-            prevNotifs = notifs
-            return notifs
-        }
-        return prevNotifs
-    }, shallowEqual)
 
+const Notifications = ({ dispatch, jwt, volunteerNotifs }: Props): JSX.Element | null => {
     const hidden = volunteerNotifs?.hiddenNotifs || []
     const notifs: JSX.Element[] = []
 
@@ -62,12 +53,17 @@ const Notifications = ({ dispatch, jwt }: Props): JSX.Element | null => {
     }
 
     const [participation, setParticipation] = useState(volunteerNotifs?.active || "inconnu")
+    const [participationMessage, setParticipationMessage] = useState("")
     const onChangeValue2 = (e: React.ChangeEvent<HTMLInputElement>) =>
         setParticipation(e.target.value)
 
     const onSubmit2 = useCallback(
         (event: React.SyntheticEvent): void => {
             event.preventDefault()
+            if (participation === "inconnu") {
+                setParticipationMessage("Il nous faudrait une réponse ^^")
+                return
+            }
 
             dispatch(
                 fetchVolunteerNotifsSet(jwt, 0, {
@@ -88,16 +84,6 @@ const Notifications = ({ dispatch, jwt }: Props): JSX.Element | null => {
                             <form onSubmit={onSubmit2}>
                                 Si les conditions sanitaires te le permettent, souhaites-tu être
                                 bénévole à PeL 2022 ?<br />
-                                <label>
-                                    <input
-                                        type="radio"
-                                        value="inconnu"
-                                        name="gender"
-                                        checked={participation === "inconnu"}
-                                        onChange={onChangeValue2}
-                                    />{" "}
-                                    -
-                                </label>
                                 <label>
                                     <input
                                         type="radio"
@@ -147,6 +133,7 @@ const Notifications = ({ dispatch, jwt }: Props): JSX.Element | null => {
                                 <div className={styles.formButtons}>
                                     <button type="submit">Confirmer</button>
                                 </div>
+                                <div className={styles.message}>{participationMessage}</div>
                             </form>
                         </div>
                     </div>
@@ -271,7 +258,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
                                 "Un autre navigateur était notifié, mais c'est maintenant celui-ci qui le sera."
                             )
                         } else {
-                            setNotifMessage("C'est enregistré !")
+                            setNotifMessage("C'est mémorisé !")
                         }
 
                         setAcceptsNotifs("oui")
@@ -284,7 +271,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
                     } catch (_e) {
                         if (Notification.permission !== "granted") {
                             setNotifMessage(
-                                "Mince tu as bloqué toutes notifications pour le site des bénévoles, l'exact opposé de ce qu'il fallait :) Pour annuler ça, les instructions sont ici : https://support.pushcrew.com/support/solutions/articles/9000098467-how-to-unblock-notifications-from-a-website-that-you-once-blocked-"
+                                "Mince tu as bloqué les notifications pour le site des bénévoles ! En haut juste à gauche de la barre d'adresse, il y a une icone de cadenas ou de message barré sur lequel cliquer pour annuler ce blocage."
                             )
                         } else {
                             setNotifMessage(
@@ -305,7 +292,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
                             "Un autre navigateur était notifié, mais c'est maintenant celui-ci qui le sera."
                         )
                     } else {
-                        setNotifMessage("C'est enregistré !")
+                        setNotifMessage("C'est mémorisé !")
                     }
 
                     setAcceptsNotifs("oui")
@@ -335,12 +322,15 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
     if (notifs.length === 0) {
         notifs.push(
             <div key="pushNotifs">
-                <div className={styles.notificationsPage}>
-                    <div className={styles.notificationsContent}>
+                <div className={styles.pushNotificationsPage}>
+                    <div className={styles.pushNotificationsContent}>
                         <div className={styles.formLine} key="line-participation">
                             <label>
-                                Acceptes-tu d&apos;être notifié(e) ici quand on aura des questions
-                                ou informations importantes pour toi ?
+                                Acceptes-tu de recevoir une alerte dans ton navigateur quand on aura
+                                une info ou question importante à te poser ici sur le site ?<br />
+                                <span className={styles.sousMessage}>
+                                    (Ça simplifierait grandement notre organisation !!)
+                                </span>
                                 <label>
                                     <input
                                         type="radio"
diff --git a/src/components/Notifications/styles.module.scss b/src/components/Notifications/styles.module.scss
index 6dd26fd..6856a83 100755
--- a/src/components/Notifications/styles.module.scss
+++ b/src/components/Notifications/styles.module.scss
@@ -7,6 +7,14 @@
 
 .notificationsContent {
     @include page-content-wrapper;
+}
+
+.pushNotificationsPage {
+    @include page-wrapper-center;
+}
+
+.pushNotificationsContent {
+    @include page-content-wrapper;
 
     background-color: #ece3df;
 }
@@ -23,6 +31,10 @@
         margin-left: 5px;
         margin-top: 7px;
     }
+    .sousMessage {
+        font-size: 95%;
+    }
+
     select,
     input {
         width: 10%;
diff --git a/src/config/prod.ts b/src/config/prod.ts
index 555e14e..5c0d841 100755
--- a/src/config/prod.ts
+++ b/src/config/prod.ts
@@ -1,7 +1,11 @@
+import isNode from "detect-node"
+
 const PROTOCOL = (typeof window !== "undefined" && window?.location?.protocol) || "http:"
 const PORT = 4000 + (PROTOCOL === "https:" ? 2 : 0)
 const API_URL =
-    __DEV__ || __LOCAL__ ? `${PROTOCOL}//localhost:${PORT}` : `${PROTOCOL}//fo.parisestludique.fr`
+    __DEV__ || __LOCAL__ || isNode
+        ? `${PROTOCOL}//localhost:${PORT}`
+        : `${PROTOCOL}//fo.parisestludique.fr`
 
 export default {
     PORT,
diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx
index 0715a2e..f356ebe 100644
--- a/src/pages/Home/Home.tsx
+++ b/src/pages/Home/Home.tsx
@@ -7,19 +7,31 @@ import { AppState, AppThunk } from "../../store"
 import { LoginForm, Notifications } from "../../components"
 import styles from "./styles.module.scss"
 import { fetchVolunteerNotifsSetIfNeed } from "../../store/volunteerNotifsSet"
+import { VolunteerNotifs } from "../../services/volunteers"
 
 export type Props = RouteComponentProps
 
+let prevNotifs: VolunteerNotifs | undefined
+
 const HomePage: FC<Props> = (): JSX.Element => {
     const dispatch = useDispatch()
 
+    const volunteerNotifs = useSelector((state: AppState) => {
+        const notifs = state.volunteerNotifsSet?.entity
+        if (notifs) {
+            prevNotifs = notifs
+            return notifs
+        }
+        return prevNotifs
+    }, shallowEqual)
+
     const loginError = useSelector((state: AppState) => state.volunteerLogin.error, shallowEqual)
     const jwt = useSelector((state: AppState) => state.auth.jwt, shallowEqual)
 
     if (jwt === undefined) return <p>Loading...</p>
 
     if (jwt) {
-        return <Notifications dispatch={dispatch} jwt={jwt} />
+        return <Notifications dispatch={dispatch} jwt={jwt} volunteerNotifs={volunteerNotifs} />
     }
     return (
         <div>
@@ -30,7 +42,7 @@ const HomePage: FC<Props> = (): JSX.Element => {
                 </div>
             </div>
             <div className={styles.homePage}>
-                <div className={styles.preRegisterContent}>
+                <div className={styles.navigationLink}>
                     <Link to="/preRegister"> S&apos;informer sur le bénévolat </Link>
                 </div>
             </div>
diff --git a/src/pages/Home/styles.module.scss b/src/pages/Home/styles.module.scss
index 0cab755..1a9bfda 100755
--- a/src/pages/Home/styles.module.scss
+++ b/src/pages/Home/styles.module.scss
@@ -15,3 +15,9 @@
 .preRegisterContent {
     @include page-content-wrapper;
 }
+
+.navigationLink {
+    @include page-content-wrapper;
+
+    text-align: center;
+}
diff --git a/src/server/gsheets/volunteers.ts b/src/server/gsheets/volunteers.ts
index 159498d..7a183f5 100644
--- a/src/server/gsheets/volunteers.ts
+++ b/src/server/gsheets/volunteers.ts
@@ -83,7 +83,7 @@ export const volunteerForgot = expressAccessor.set(
         return {
             toDatabase: newVolunteer,
             toCaller: {
-                message: `Un nouveau mot de passe t'a été envoyé par email. Regarde bien dans tes spams, ils pourrait y être :/`,
+                message: `Un nouveau mot de passe t'a été envoyé par email. Regarde bien dans les spams, il pourrait y être :/`,
             },
         }
     }
diff --git a/src/server/ssr.tsx b/src/server/ssr.tsx
index fbc87a9..c0395c1 100644
--- a/src/server/ssr.tsx
+++ b/src/server/ssr.tsx
@@ -22,7 +22,7 @@ export default async (req: Request, res: Response, next: NextFunction): Promise<
     const loadBranchData = (): Promise<any> => {
         const branch = matchRoutes(routes, req.path)
         const promises = branch.map(({ route, match }) => {
-            if (route.loadData)
+            if (route.loadData) {
                 return Promise.all(
                     route
                         .loadData({
@@ -33,6 +33,7 @@ export default async (req: Request, res: Response, next: NextFunction): Promise<
                         })
                         .map((item: Action) => store.dispatch(item))
                 )
+            }
 
             return Promise.resolve(null)
         })
diff --git a/src/store/utils.ts b/src/store/utils.ts
index 9ee4032..ed19b4f 100644
--- a/src/store/utils.ts
+++ b/src/store/utils.ts
@@ -1,7 +1,12 @@
-import { ActionCreatorWithoutPayload, ActionCreatorWithPayload } from "@reduxjs/toolkit"
+import {
+    Action,
+    ActionCreatorWithoutPayload,
+    ActionCreatorWithPayload,
+    ThunkDispatch,
+} from "@reduxjs/toolkit"
 import { toast } from "react-toastify"
 
-import { AppThunk, AppDispatch } from "."
+import { AppState, AppThunk } from "."
 
 export interface StateRequest {
     readyStatus: "idle" | "request" | "success" | "failure"
@@ -41,10 +46,10 @@ export function elementFetch<Element, ServiceInput extends Array<any>>(
     getSuccess: ActionCreatorWithPayload<Element, string>,
     getFailure: ActionCreatorWithPayload<string, string>,
     errorMessage?: (error: Error) => void,
-    successMessage?: (data: Element, dispatch: AppDispatch) => void
+    successMessage?: (data: Element, dispatch: ThunkDispatch<AppState, any, Action>) => void
 ): (...idArgs: ServiceInput) => AppThunk {
     return (...idArgs: ServiceInput): AppThunk =>
-        async (dispatch) => {
+        async (dispatch: ThunkDispatch<AppState, any, Action>) => {
             dispatch(getRequesting())
 
             const { error, data } = await elementService(...idArgs)
diff --git a/src/store/volunteerNotifsSet.ts b/src/store/volunteerNotifsSet.ts
index 09ea239..3b50836 100644
--- a/src/store/volunteerNotifsSet.ts
+++ b/src/store/volunteerNotifsSet.ts
@@ -40,13 +40,14 @@ export const fetchVolunteerNotifsSet = elementFetch(
 )
 
 const shouldFetchVolunteerNotifsSet = (state: AppState, id: number) =>
-    state.volunteerNotifsSet.readyStatus !== "success" ||
-    (state.volunteerNotifsSet.entity && state.volunteerNotifsSet.entity.id !== id)
+    state.volunteerNotifsSet?.readyStatus !== "success" ||
+    (state.volunteerNotifsSet?.entity && state.volunteerNotifsSet?.entity?.id !== id)
 
 export const fetchVolunteerNotifsSetIfNeed =
     (id = 0, notif: Partial<VolunteerNotifs> = {}): AppThunk =>
     (dispatch, getState) => {
         let jwt = ""
+
         if (!id) {
             ;({ id, jwt } = getState().auth)
         }
diff --git a/webpack/base.config.ts b/webpack/base.config.ts
index a7962ba..a86a6e8 100644
--- a/webpack/base.config.ts
+++ b/webpack/base.config.ts
@@ -83,7 +83,7 @@ const config = (isWeb = false): Configuration => ({
         minimizer: [
             new TerserPlugin({
                 // See more options: https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
-                terserOptions: { compress: { drop_console: true } },
+                terserOptions: { compress: { drop_console: false } },
             }),
         ],
     },