1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-06-16 01:13:24 +02:00
market/src/@context/CookieConsent.tsx
Matthias Kretschmann 5f3ee32ca2
Test setup tweaks (#1415)
* unused package cleanup

* make storybook use webpack 5

* see https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#webpack-5

* bump react, cleanup

* button story tweaks

* add Alert stories

* bump Jest to v28.1.0

* try original storyshots initialization

* split up build & test CI jobs

* stop testing Node.js v14

* set jest coverage flag

* downgrade paambaati/codeclimate-action again

* move  jest config files, remove coverageReporter override

* collect coverage from `src/` only

* another paambaati/codeclimate-action bump test

* create additional button markup test

* downgrade paambaati/codeclimate-action again

* more downgrade

* render default button without optional style prop

* ignore some folders for Jest

* full coverage for Alert

* more package updates

* add eslint-plugin-testing-library & eslint-plugin-jest-dom

* bump ESLint packages, follow new rules

* start storybook in quiet mode

* update docs

* test storybook build as part of CI

* more testing docs clarification

* add jest:watch command

* add body background colors switch in toolbar

* TypeScript voodoo

* test codeclimate-action@v2.7.3 for default coverageCommand

* downgrade codeclimate-action and running in debug mode

* make coverage artifacts OS agnostic

* subgraph typings as artifact for coverage job

* disable coverage sending job for now

Co-authored-by: Enzo Vezzaro <enzo-vezzaro@live.it>
2022-05-12 11:35:07 +01:00

142 lines
3.7 KiB
TypeScript

import React, {
useContext,
useState,
createContext,
useEffect,
ReactNode,
ReactElement
} from 'react'
import { deleteCookie, getCookieValue, setCookie } from '@utils/cookies'
import { UseGdprMetadata, useGdprMetadata } from '@hooks/useGdprMetadata'
import { useMarketMetadata } from './MarketMetadata'
export enum CookieConsentStatus {
NOT_AVAILABLE = -1,
APPROVED = 0,
REJECTED = 1
}
export interface ConsentStatus {
[name: string]: CookieConsentStatus
}
interface ConsentProviderValue {
cookies: UseGdprMetadata['optionalCookies']
cookieConsentStatus: ConsentStatus
setConsentStatus: (cookieName: string, status: CookieConsentStatus) => void
resetConsentStatus: (status?: CookieConsentStatus) => void
}
const ConsentContext = createContext({} as ConsentProviderValue)
function ConsentProvider({ children }: { children: ReactNode }): ReactElement {
const cookies = useGdprMetadata()
const { appConfig } = useMarketMetadata()
const [consentStatus, setConsentStatus] = useState({} as ConsentStatus)
function resetConsentStatus(status = CookieConsentStatus.NOT_AVAILABLE) {
const resetCookieConsent = {} as ConsentStatus
cookies.optionalCookies?.map((cookie) => {
deleteCookie(cookie.cookieName)
resetCookieConsent[cookie.cookieName] = status
return status
})
setConsentStatus(resetCookieConsent)
}
function setCookieConsentStatus(
cookieName: string,
status: CookieConsentStatus
) {
setConsentStatus({ ...consentStatus, [cookieName]: status })
}
function handleAccept(cookieName: string) {
setCookie(cookieName, true)
switch (cookieName) {
case 'AnalyticsCookieConsent':
break
default:
break
// Add your specific logic here
// e.g.
/* function handleAnalytics() {
ReactGA.initialize(analyticsId)
ReactGA.pageview(window.location.pathname + window.location.search)
} */
}
}
function handleReject(cookieName: string) {
setCookie(cookieName, false)
switch (cookieName) {
case 'AnalyticsCookieConsent':
break
default:
break
// Add your specific logic here
}
}
useEffect(() => {
if (appConfig?.privacyPreferenceCenter !== 'true') return
const initialValues = {} as ConsentStatus
cookies.optionalCookies?.map((cookie) => {
const cookieValue = getCookieValue(cookie.cookieName)
switch (cookieValue) {
case 'true':
initialValues[cookie.cookieName] = CookieConsentStatus.APPROVED
break
case 'false':
initialValues[cookie.cookieName] = CookieConsentStatus.REJECTED
break
default:
initialValues[cookie.cookieName] = CookieConsentStatus.NOT_AVAILABLE
break
}
return initialValues
})
setConsentStatus(initialValues)
}, [cookies.optionalCookies, appConfig])
useEffect(() => {
// eslint-disable-next-line array-callback-return
Object.keys(consentStatus).map((cookieName) => {
switch (consentStatus[cookieName]) {
case CookieConsentStatus.APPROVED:
handleAccept(cookieName)
break
case CookieConsentStatus.REJECTED:
handleReject(cookieName)
break
}
})
}, [consentStatus])
return (
<ConsentContext.Provider
value={
{
cookies: cookies.optionalCookies || [],
cookieConsentStatus: consentStatus,
setConsentStatus: setCookieConsentStatus,
resetConsentStatus
} as ConsentProviderValue
}
>
{children}
</ConsentContext.Provider>
)
}
const useConsent = (): ConsentProviderValue => useContext(ConsentContext)
export { ConsentProvider, useConsent, ConsentContext }
export default ConsentProvider