Hagreed

Hagreed is a GDPR (General Data Protection Regulation) compliance support tool

Installation

This package is an offical extension of the default package to @tizy/hagreed to facilitate integration with React It works with a simple configuration and React.Context

First, go to hagreed.com and subscribe to a free or premium plan to obtain a token and register your website.

Using npm:

npm install @tizy/hagreed @tizy/hagreed_react

Usage

These examples are defined with the Next.js framework, but they can be adapted to all React applications.

import {HagreedProvider} from '@tizy/hagreed_react';

const hagreedConfig = {
    consentsFormList: []
    cookiesList: [],
    token: 'your token here'
}

return (
    <HagreedProvider hagreedConfig={hagreedConfig}>
        <Component {...pageProps}/>
        <div id="hagreed" className="hagreed" />
    </HagreedProvider>
)

import {HagreedContext} from '@tizy/hagreed_react';

export const FormComponent = () => {
    const hagreed = useContext(HagreedContext);
    useEffect(() => {
        if (!!hagreed) {
            hagreed.initForm();
        }
    }, [hagreed])
    
    return (
        ...
        <div className="hagreedForm" data-hagreed-id="contact" />
        ...
    )
};

Next.js

This package uses React.Context and by definition runs client side.
For Next.js applications, you may need to add use-client to the top of the component or page that includes <HagreedProvider> or your context HagreedContext

Documentation

After subscribing to a plan and registering your website on hagreed.com, you will be able to download the complete documentation in the final step.