From 560982683cb30329587848ad123abc1d4e510e9d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benedikt=20R=C3=B6tsch?= <benedikt@hashbite.net>
Date: Tue, 19 Dec 2023 20:08:39 +0100
Subject: [PATCH] feat: delay till introduction bubble is shown can now be
 configured - fixes #118

---
 .changeset/silly-phones-vanish.md               |  5 +++++
 packages/interface-default/src/index.tsx        |  1 +
 packages/interface-default/src/interface.tsx    |  2 ++
 packages/interface-default/src/introduction.tsx | 12 +++++++++++-
 4 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/silly-phones-vanish.md

diff --git a/.changeset/silly-phones-vanish.md b/.changeset/silly-phones-vanish.md
new file mode 100644
index 00000000..c7ff22f4
--- /dev/null
+++ b/.changeset/silly-phones-vanish.md
@@ -0,0 +1,5 @@
+---
+'@consent-manager/interface-default': patch
+---
+
+You can now configure the delay till the introduction popup is shown
diff --git a/packages/interface-default/src/index.tsx b/packages/interface-default/src/index.tsx
index f653ffee..cdd37411 100644
--- a/packages/interface-default/src/index.tsx
+++ b/packages/interface-default/src/index.tsx
@@ -41,6 +41,7 @@ export interface ButtonProps {
 export interface ConsentManagerDefaultInterfaceDesignProps {
   useDefaultButtonForIntroduction?: boolean
   slideDuration?: number
+  noActionDelay?: number
   styles?: Styles
   animationStyles?: Styles
   ToggleButton?: React.ComponentType<ToggleButtonProps>
diff --git a/packages/interface-default/src/interface.tsx b/packages/interface-default/src/interface.tsx
index 7d4d9099..2481d880 100644
--- a/packages/interface-default/src/interface.tsx
+++ b/packages/interface-default/src/interface.tsx
@@ -46,6 +46,7 @@ export const Interface: React.FC<InterfaceProps> = ({
   initialValues,
   onSubmit,
   useDefaultButtonForIntroduction = true,
+  noActionDelay = 4000,
   slideDuration = 700,
   styles = defaultStyles,
   CloseIcon = IoClose,
@@ -139,6 +140,7 @@ export const Interface: React.FC<InterfaceProps> = ({
           slideDuration={slideDuration}
           CloseIcon={CloseIcon}
           Button={useDefaultButtonForIntroduction ? DefaultButton : Button}
+          noActionDelay={noActionDelay}
         />
       )}
       <Backdrop fadeDuration={slideDuration} styles={styles} />
diff --git a/packages/interface-default/src/introduction.tsx b/packages/interface-default/src/introduction.tsx
index fccaed5a..bf47a99d 100644
--- a/packages/interface-default/src/introduction.tsx
+++ b/packages/interface-default/src/introduction.tsx
@@ -1,4 +1,10 @@
-import React, { MouseEvent, useCallback, useContext, useEffect, useState } from 'react'
+import React, {
+  MouseEvent,
+  useCallback,
+  useContext,
+  useEffect,
+  useState,
+} from 'react'
 import clsx from 'clsx'
 import { CSSTransition } from 'react-transition-group'
 import createActivityDetector from 'activity-detector-ssr'
@@ -45,6 +51,10 @@ export const Introduction: React.FC<IntroductionProps> = ({
 
   // Listen for user interaction
   React.useEffect(() => {
+    if (noActionDelay === 0) {
+      setIsIdle(true)
+      return
+    }
     const activityDetector: ActivityDetector = createActivityDetector({
       timeToIdle: noActionDelay,
       inactivityEvents: [],