From 95bb74fad867a033f32ce30233a3c63102993728 Mon Sep 17 00:00:00 2001
From: Gbacc <Gbacc@users.noreply.github.com>
Date: Tue, 4 Jun 2024 09:30:06 +0200
Subject: [PATCH] chore(TMC-28658): Add a data attribute to detect DS drawer
 when open (#5324)

Co-authored-by: Geoffroy Baccarini <gbaccarini@talend.com>
---
 .changeset/quiet-tigers-mate.md                             | 5 +++++
 .../components/Drawer/__snapshots__/Drawer.test.tsx.snap    | 1 +
 .../Drawer/variants/FloatingDrawer/FloatingDrawer.tsx       | 6 ++++--
 3 files changed, 10 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/quiet-tigers-mate.md

diff --git a/.changeset/quiet-tigers-mate.md b/.changeset/quiet-tigers-mate.md
new file mode 100644
index 0000000000..bee6d66c60
--- /dev/null
+++ b/.changeset/quiet-tigers-mate.md
@@ -0,0 +1,5 @@
+---
+"@talend/design-system": patch
+---
+
+Design system drawer now has a data attribute to identify when it is opened
diff --git a/packages/design-system/src/components/Drawer/__snapshots__/Drawer.test.tsx.snap b/packages/design-system/src/components/Drawer/__snapshots__/Drawer.test.tsx.snap
index 5a47831a2d..0b34e03fcd 100644
--- a/packages/design-system/src/components/Drawer/__snapshots__/Drawer.test.tsx.snap
+++ b/packages/design-system/src/components/Drawer/__snapshots__/Drawer.test.tsx.snap
@@ -11,6 +11,7 @@ exports[`FloatingDrawer should render a11y html 1`] = `
     <div
       aria-label="label is required"
       class="theme-drawer"
+      data-drawer-visible="true"
       data-test="drawer"
       data-testid="drawer"
       id="drawer-42"
diff --git a/packages/design-system/src/components/Drawer/variants/FloatingDrawer/FloatingDrawer.tsx b/packages/design-system/src/components/Drawer/variants/FloatingDrawer/FloatingDrawer.tsx
index 3157baf9cc..027751c674 100644
--- a/packages/design-system/src/components/Drawer/variants/FloatingDrawer/FloatingDrawer.tsx
+++ b/packages/design-system/src/components/Drawer/variants/FloatingDrawer/FloatingDrawer.tsx
@@ -1,10 +1,11 @@
-import { useEffect, useState, cloneElement } from 'react';
+import { cloneElement, useEffect, useState } from 'react';
 import type { CSSProperties, HTMLAttributes, ReactElement, ReactNode } from 'react';
 import { Transition } from 'react-transition-group';
+
+import { useId } from '../../../../useId';
 import { PrimitiveDrawer } from '../../Primitive/PrimitiveDrawer';
 
 import theme from './FloatingDrawer.module.scss';
-import { useId } from '../../../../useId';
 
 type WithDisclosure = {
 	disclosure: ReactElement;
@@ -90,6 +91,7 @@ export const FloatingDrawer = ({
 							<div
 								data-test="drawer"
 								data-testid="drawer"
+								data-drawer-visible
 								id={uuid}
 								role="dialog"
 								aria-label={props['aria-label']}