diff --git a/index.d.ts b/index.d.ts index e98c74d6cdd23eaa2f99abb7ec30f8d944b5383c..c444ac2b24aeb8b2c5ae3435739ca2f424ab4234 100644 --- a/index.d.ts +++ b/index.d.ts @@ -48,12 +48,14 @@ export function Card(props: CardProps): JSX.Element; interface Icookies { location?: string, buttonText?: string, + declineButtonText?: String, cookieName?: string, expires?: number, - styles: any, - buttonStyles: any + styles: {}, + buttonStyles: {}, + declineButtonStyle: {} } -export function Cookies(props: Icookies): JSX.Element; +export function CookiesComponent(props: Icookies): JSX.Element; interface BadgeProps { children?: React.ReactNode; diff --git a/index.js b/index.js index 048163f8177e3a5a584242ba8ac649f363dc2af9..42d3e815b92adddb598cbe1889aa4b8daab6d8d5 100644 --- a/index.js +++ b/index.js @@ -31,4 +31,4 @@ export { default as Menu } from "./src/components/core/Menu"; // Menu components export { default as MenuMobile } from "./src/components/core/MenuMobile"; // Cookies components -export { default as Cookies } from "./src/components/core/Cookies"; +export { default as CookiesComponent } from "./src/components/core/CookiesComponent"; diff --git a/src/components/core/Cookies.tsx b/src/components/core/Cookies.tsx deleted file mode 100644 index 3710b36c792fe339bdc1d84a2eff04b0711413c4..0000000000000000000000000000000000000000 --- a/src/components/core/Cookies.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from "react"; -// import {CookieNotice} from "gatsby-cookie-notice"; -import CookieConsent from "react-cookie-consent"; - -interface Icookies { - location?: string, - buttonText?: string, - cookieName?: string, - expires?: number, - styles: any, - buttonStyles: any -} - -const Cookies = (props: Icookies) => { - const {location="bottom",buttonText="Accept", buttonStyles, cookieName="gatsby-gdpr-google-analytics", expires=365, styles} = props; - return ( - <CookieConsent - location={location} - buttonText={buttonText} - declineButtonText="Decline" - cookieName={cookieName} - style={styles} - buttonStyle={buttonStyles} - expires={expires} - > - Notre site utilise des cookies pour garantir son bon fonctionnement et optimiser ses performances techniques, ... - </CookieConsent> - ); -}; - -export default Cookies; diff --git a/src/components/core/CookiesComponent.tsx b/src/components/core/CookiesComponent.tsx new file mode 100644 index 0000000000000000000000000000000000000000..b6d3527fdb5cd01d49bdb9e6ce4e9cc36295979d --- /dev/null +++ b/src/components/core/CookiesComponent.tsx @@ -0,0 +1,48 @@ +import React from "react"; +// import {CookieNotice} from "gatsby-cookie-notice"; +import CookieConsent, { Cookies } from "react-cookie-consent"; + +interface Icookies { + location?: string, + buttonText?: string, + declineButtonText: String, + cookieName?: string, + expires?: number, + styles: {}, + buttonStyles: {}, + declineButtonStyle: {} +} + +const CookiesComponent = (props: Icookies) => { + const { + location="bottom", + buttonText="Accept", + declineButtonText="Decline", + buttonStyles, + cookieName="gatsby-gdpr-google-analytics", + expires=365, + styles, + declineButtonStyle + } = props; + return ( + <CookieConsent + location={location} + buttonText={buttonText} + declineButtonText={declineButtonText} + cookieName={cookieName} + style={styles} + buttonStyle={buttonStyles} + declineButtonStyle={declineButtonStyle} + expires={expires} + enableDeclineButton + onDecline={() => { + alert("remove cookie here!"); + Cookies.remove("tagManagerCookieName") + }} + > + Nous nous soucions de vos données personnelles et utilisons des cookies afin d’améliorer votre expérience. + </CookieConsent> + ); +}; + +export default CookiesComponent; diff --git a/src/pages-doc/doc/core/cookies.tsx b/src/pages-doc/doc/core/cookies.tsx index 97e1c98d1dea1f19711ab62ad6c54937e1622276..e191e17a1aff8df8979b3e7f2f98605879e81b99 100644 --- a/src/pages-doc/doc/core/cookies.tsx +++ b/src/pages-doc/doc/core/cookies.tsx @@ -1,6 +1,6 @@ import React from 'react' import { Content } from "@onegeo/gatsby-theme-onegeo"; -import { Cookies } from "@onegeo/gatsby-theme-onegeo"; +import { CookiesComponent } from "@onegeo/gatsby-theme-onegeo"; import { Link } from "gatsby"; @@ -30,7 +30,7 @@ const cookies = () => { <h2>Example</h2> </div> <div className="flex gap-6 m-4"> - <Cookies buttonStyles={ {color: "#4e503b", fontSize: "13px"} } styles={{ background: "#2B373B" }}/> + <CookiesComponent declineButtonStyle={{color: "#4e503b", fontSize: "13px"}} buttonStyles={ {color: "#4e503b", fontSize: "13px"} } styles={{ background: "#2B373B" }}/> </div> </Content> )