PeL/force-orange-2022
PeL/force-orange-2022
1
1
Fork 0
mirror of https://github.com/Paris-est-Ludique/intranet.git synced 2025-06-08 08:34:20 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

create some selectors, move hooks

Browse Source
This commit is contained in:
memeriau 2022-01-15 23:24:29 +01:00
parent fcfe4c77b9
commit 125b3145ae
3 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/Notifications/index.tsx
View File

@ -1,21 +1,21 @@
import _ from "lodash"
import React, { memo, useCallback, useEffect, useRef, useState } from "react"
import isNode from "detect-node"
import { AppDispatch } from "../../store"
import { useDispatch, useSelector } from "react-redux"
import { fetchVolunteerNotifsSet } from "../../store/volunteerNotifsSet"
import styles from "./styles.module.scss"
import { logoutUser } from "../../store/auth"
import { logoutUser, selectUserJwtToken } from "../../store/auth"
import { unsetJWT } from "../../services/auth"
import { VolunteerNotifs } from "../../services/volunteers"
interface Props {
dispatch: AppDispatch
jwt: string
// eslint-disable-next-line react/require-default-props
volunteerNotifs?: VolunteerNotifs
}
const Notifications = ({ dispatch, jwt, volunteerNotifs }: Props): JSX.Element | null => {
const Notifications = ({ volunteerNotifs }: Props): JSX.Element | null => {
const dispatch = useDispatch()
const jwtToken = useSelector(selectUserJwtToken)
const hidden = volunteerNotifs?.hiddenNotifs || []
const notifs: JSX.Element[] = []
@ -23,12 +23,12 @@ const Notifications = ({ dispatch, jwt, volunteerNotifs }: Props): JSX.Element |
(event: React.SyntheticEvent): void => {
event.preventDefault()
dispatch(
fetchVolunteerNotifsSet(jwt, 0, {
fetchVolunteerNotifsSet(jwtToken, 0, {
hiddenNotifs: [...(volunteerNotifs?.hiddenNotifs || []), 1],
})
)
},
[dispatch, jwt, volunteerNotifs]
[dispatch, jwtToken, volunteerNotifs]
)
if (!_.includes(hidden, 1)) {
@ -66,13 +66,13 @@ const Notifications = ({ dispatch, jwt, volunteerNotifs }: Props): JSX.Element |
}
dispatch(
fetchVolunteerNotifsSet(jwt, 0, {
fetchVolunteerNotifsSet(jwtToken, 0, {
hiddenNotifs: [...(volunteerNotifs?.hiddenNotifs || []), 2],
active: participation,
})
)
},
[dispatch, jwt, volunteerNotifs, participation]
[dispatch, jwtToken, volunteerNotifs, participation]
)
if (!_.includes(hidden, 2)) {
@ -195,7 +195,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
setNotifMessage("")
setAcceptsNotifs("non")
dispatch(
fetchVolunteerNotifsSet(jwt, 0, {
fetchVolunteerNotifsSet(jwtToken, 0, {
acceptsNotifs: "non",
})
)
@ -263,7 +263,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
setAcceptsNotifs("oui")
dispatch(
fetchVolunteerNotifsSet(jwt, 0, {
fetchVolunteerNotifsSet(jwtToken, 0, {
pushNotifSubscription: JSON.stringify(newSubscription),
acceptsNotifs: "oui",
})
@ -297,7 +297,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
setAcceptsNotifs("oui")
dispatch(
fetchVolunteerNotifsSet(jwt, 0, {
fetchVolunteerNotifsSet(jwtToken, 0, {
pushNotifSubscription: JSON.stringify(existedSubscription),
acceptsNotifs: "oui",
})
@ -309,7 +309,7 @@ Tu n'y es absolument pas obligé(e) ! C'est juste plus pratique.
)
}
},
[dispatch, jwt, volunteerNotifs]
[dispatch, jwtToken, volunteerNotifs]
)
function subscriptionEqualsSave(toCheck: PushSubscription, save: string | undefined): boolean {

13
src/pages/Home/Home.tsx
View File

@ -1,6 +1,6 @@
import { FC, memo } from "react"
import { RouteComponentProps, Link } from "react-router-dom"
import { useDispatch, useSelector, shallowEqual } from "react-redux"
import { useSelector, shallowEqual } from "react-redux"
import { Helmet } from "react-helmet"
import { AppState, AppThunk } from "../../store"
@ -8,13 +8,14 @@ import { LoginForm, Notifications } from "../../components"
import styles from "./styles.module.scss"
import { fetchVolunteerNotifsSetIfNeed } from "../../store/volunteerNotifsSet"
import { VolunteerNotifs } from "../../services/volunteers"
import { selectUserJwtToken } from "../../store/auth"
export type Props = RouteComponentProps
let prevNotifs: VolunteerNotifs | undefined
const HomePage: FC<Props> = (): JSX.Element => {
const dispatch = useDispatch()
const jwtToken = useSelector(selectUserJwtToken)
const volunteerNotifs = useSelector((state: AppState) => {
const notifs = state.volunteerNotifsSet?.entity
@ -25,12 +26,10 @@ const HomePage: FC<Props> = (): JSX.Element => {
return prevNotifs
}, shallowEqual)
const jwt = useSelector((state: AppState) => state.auth.jwt, shallowEqual)
if (jwtToken === undefined) return <p>Loading...</p>
if (jwt === undefined) return <p>Loading...</p>
if (jwt) {
return <Notifications dispatch={dispatch} jwt={jwt} volunteerNotifs={volunteerNotifs} />
if (jwtToken) {
return <Notifications volunteerNotifs={volunteerNotifs} />
}
return (
<div>

8
src/store/auth.ts
View File

@ -1,4 +1,4 @@
import { createSlice, PayloadAction } from "@reduxjs/toolkit"
import { createSelector, createSlice, PayloadAction } from "@reduxjs/toolkit"
import { AppState } from "."
// Define a type for the slice state
@ -30,6 +30,10 @@ export const auth = createSlice({
export const { setCurrentUser, logoutUser } = auth.actions
export const selectCount = (state: AppState): AuthState => state.auth
export const selectAuthData = (state: AppState): AuthState => state.auth
export const selectUserJwtToken = createSelector(selectAuthData, (authData) => authData.jwt)
export const isUserConnected = createSelector(selectUserJwtToken, (token) => !!token)
export default auth.reducer