diff --git a/src/components/CookiesBanner/index.jsx b/src/components/CookiesBanner/index.jsx
index f3c3c129..f8da614b 100644
--- a/src/components/CookiesBanner/index.jsx
+++ b/src/components/CookiesBanner/index.jsx
@@ -5,12 +5,15 @@ import FormControlLabel from '@material-ui/core/FormControlLabel'
import IconButton from '@material-ui/core/IconButton'
import React, { useEffect, useState } from 'react'
import { makeStyles } from '@material-ui/core/styles'
+import { useDispatch, useSelector } from 'react-redux'
import Link from '~/components/layout/Link'
import Button from '~/components/layout/Button'
import { primary, mainFontFamily } from '~/theme/variables'
import type { CookiesProps } from '~/logic/cookies/model/cookie'
import { COOKIES_KEY } from '~/logic/cookies/model/cookie'
import { loadFromCookie, saveCookie } from '~/utils/cookies'
+import { cookieBannerOpen } from '~/logic/cookies/store/selectors'
+import { openCookieBanner } from '~/logic/cookies/store/actions/openCookieBanner'
const useStyles = makeStyles({
container: {
@@ -68,10 +71,10 @@ const useStyles = makeStyles({
const CookiesBanner = () => {
const classes = useStyles()
-
- const [showBanner, setShowBanner] = useState(false)
+ const dispatch = useDispatch()
const [localNecessary, setLocalNecessary] = useState(true)
const [localAnalytics, setLocalAnalytics] = useState(false)
+ const showBanner = useSelector(cookieBannerOpen)
useEffect(() => {
async function fetchCookiesFromStorage() {
@@ -80,13 +83,14 @@ const CookiesBanner = () => {
const { acceptedNecessary, acceptedAnalytics } = cookiesState
setLocalAnalytics(acceptedAnalytics)
setLocalNecessary(acceptedNecessary)
- setShowBanner(acceptedNecessary === false)
+ const openBanner = acceptedNecessary === false || showBanner
+ dispatch(openCookieBanner(openBanner))
} else {
- setShowBanner(true)
+ dispatch(openCookieBanner(true))
}
}
fetchCookiesFromStorage()
- }, [])
+ }, [showBanner])
const acceptCookiesHandler = async () => {
const newState = {
@@ -94,7 +98,7 @@ const CookiesBanner = () => {
acceptedAnalytics: true,
}
await saveCookie(COOKIES_KEY, newState, 365)
- setShowBanner(false)
+ dispatch(openCookieBanner(false))
}
const closeCookiesBannerHandler = async () => {
@@ -104,7 +108,7 @@ const CookiesBanner = () => {
}
const expDays = localAnalytics ? 365 : 7
await saveCookie(COOKIES_KEY, newState, expDays)
- setShowBanner(false)
+ dispatch(openCookieBanner(false))
}
@@ -141,7 +145,7 @@ const CookiesBanner = () => {
onChange={() => setLocalAnalytics((prev) => !prev)}
value={localAnalytics}
control={(
-
+
)}
/>
diff --git a/src/components/Sidebar/LegalLinks.jsx b/src/components/Sidebar/LegalLinks.jsx
index 0b0ed30f..e9bbe7e9 100644
--- a/src/components/Sidebar/LegalLinks.jsx
+++ b/src/components/Sidebar/LegalLinks.jsx
@@ -1,9 +1,12 @@
// @flow
import React from 'react'
import { makeStyles } from '@material-ui/core/styles'
+import { useDispatch } from 'react-redux'
import Block from '~/components/layout/Block'
import Link from '~/components/layout/Link'
import { sm, primary } from '~/theme/variables'
+import { openCookieBanner } from '~/logic/cookies/store/actions/openCookieBanner'
+import GnoButtonLink from '~/components/layout/ButtonLink'
const useStyles = makeStyles({
container: {
@@ -12,10 +15,15 @@ const useStyles = makeStyles({
link: {
color: primary,
},
+ buttonLink: {
+ textDecoration: 'none',
+ color: primary,
+ },
})
const LegalLinks = () => {
const classes = useStyles()
+ const dispatch = useDispatch()
return (
@@ -30,6 +38,9 @@ const LegalLinks = () => {
Imprint
+ dispatch(openCookieBanner(true))}>
+ Cookies
+
)
}
diff --git a/src/logic/cookies/model/cookie.js b/src/logic/cookies/model/cookie.js
index 23007489..3d8b144a 100644
--- a/src/logic/cookies/model/cookie.js
+++ b/src/logic/cookies/model/cookie.js
@@ -6,6 +6,7 @@ export const COOKIES_KEY = 'COOKIES'
export type CookiesProps = {
acceptedNecessary: boolean,
acceptedAnalytics: boolean,
+ cookieBannerOpen: boolean,
}
export type Cookie = RecordOf
diff --git a/src/logic/cookies/store/actions/openCookieBanner.js b/src/logic/cookies/store/actions/openCookieBanner.js
new file mode 100644
index 00000000..2e158c42
--- /dev/null
+++ b/src/logic/cookies/store/actions/openCookieBanner.js
@@ -0,0 +1,6 @@
+// @flow
+import { createAction } from 'redux-actions'
+
+export const OPEN_COOKIE_BANNER = 'OPEN_COOKIE_BANNER'
+
+export const openCookieBanner = createAction(OPEN_COOKIE_BANNER, (cookieBannerOpen: boolean) => ({ cookieBannerOpen }))
diff --git a/src/logic/cookies/store/reducer/cookies.js b/src/logic/cookies/store/reducer/cookies.js
new file mode 100644
index 00000000..3e2155c8
--- /dev/null
+++ b/src/logic/cookies/store/reducer/cookies.js
@@ -0,0 +1,24 @@
+// @flow
+import { Map } from 'immutable'
+import { handleActions, type ActionType } from 'redux-actions'
+import type { Cookie } from '~/logic/cookies/model/cookie'
+import { OPEN_COOKIE_BANNER } from '~/logic/cookies/store/actions/openCookieBanner'
+
+export const COOKIES_REDUCER_ID = 'cookies'
+
+export type State = Map>
+
+export default handleActions(
+ {
+ [OPEN_COOKIE_BANNER]: (state: State, action: ActionType): State => {
+ const { cookieBannerOpen } = action.payload
+
+ const newState = state.withMutations((map) => {
+ map.set('cookieBannerOpen', cookieBannerOpen)
+ })
+
+ return newState
+ },
+ },
+ Map(),
+)
diff --git a/src/logic/cookies/store/selectors/index.js b/src/logic/cookies/store/selectors/index.js
new file mode 100644
index 00000000..277053b8
--- /dev/null
+++ b/src/logic/cookies/store/selectors/index.js
@@ -0,0 +1,5 @@
+// @flow
+import type { Provider } from '~/logic/wallets/store/model/provider'
+import { COOKIES_REDUCER_ID } from '~/logic/cookies/store/reducer/cookies'
+
+export const cookieBannerOpen = (state: any): Provider => state[COOKIES_REDUCER_ID].get('cookieBannerOpen')
diff --git a/src/store/index.js b/src/store/index.js
index deeff088..f59be684 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -18,6 +18,7 @@ import notifications, {
NOTIFICATIONS_REDUCER_ID,
type NotificationReducerState as NotificationsState,
} from '~/logic/notifications/store/reducer/notifications'
+import cookies, { COOKIES_REDUCER_ID } from '~/logic/cookies/store/reducer/cookies'
export const history = createBrowserHistory()
@@ -45,6 +46,7 @@ const reducers: Reducer = combineReducers({
[TOKEN_REDUCER_ID]: tokens,
[TRANSACTIONS_REDUCER_ID]: transactions,
[NOTIFICATIONS_REDUCER_ID]: notifications,
+ [COOKIES_REDUCER_ID]: cookies,
})
export const store: Store = createStore(reducers, finalCreateStore)