From 98e60bbeb2dc1542a79019dac97958cb38285782 Mon Sep 17 00:00:00 2001
From: JulesBelveze <jules.belveze@hotmail.fr>
Date: Wed, 22 Jan 2025 18:21:29 +0100
Subject: [PATCH] [sparkle] - refactor: update dialog component usage in
 DataTable stories

 - Replaced deprecated 'NewDialog' components with the updated 'Dialog' components
 - Adjusted component props and children to match the new Dialog API structure
---
 sparkle/src/stories/DataTable.stories.tsx | 36 +++++++++++------------
 1 file changed, 18 insertions(+), 18 deletions(-)

diff --git a/sparkle/src/stories/DataTable.stories.tsx b/sparkle/src/stories/DataTable.stories.tsx
index 50f49615718c..7209a2961e23 100644
--- a/sparkle/src/stories/DataTable.stories.tsx
+++ b/sparkle/src/stories/DataTable.stories.tsx
@@ -8,16 +8,16 @@ import React, { useMemo } from "react";
 
 import {
   DataTable,
+  Dialog,
+  DialogContainer,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
   DropdownMenu,
   DropdownMenuItemProps,
   Input,
-  NewDialog,
-  NewDialogContainer,
-  NewDialogContent,
-  NewDialogDescription,
-  NewDialogFooter,
-  NewDialogHeader,
-  NewDialogTitle,
 } from "@sparkle/components/";
 import { FolderIcon } from "@sparkle/icons";
 
@@ -259,19 +259,19 @@ export const DataTableExample = () => {
         filterColumn="name"
         columns={columns}
       />
-      <NewDialog open={dialogOpen} onOpenChange={(open) => setDialogOpen(open)}>
-        <NewDialogContent
+      <Dialog open={dialogOpen} onOpenChange={(open) => setDialogOpen(open)}>
+        <DialogContent
           onOpenAutoFocus={(e) => e.preventDefault()}
           onCloseAutoFocus={(e) => e.preventDefault()}
         >
-          <NewDialogHeader>
-            <NewDialogTitle>Edit {selectedName}</NewDialogTitle>
-            <NewDialogDescription>
+          <DialogHeader>
+            <DialogTitle>Edit {selectedName}</DialogTitle>
+            <DialogDescription>
               Make changes to your item here
-            </NewDialogDescription>
-          </NewDialogHeader>
-          <NewDialogContainer>Your dialog content here</NewDialogContainer>
-          <NewDialogFooter
+            </DialogDescription>
+          </DialogHeader>
+          <DialogContainer>Your dialog content here</DialogContainer>
+          <DialogFooter
             leftButtonProps={{
               label: "Cancel",
               variant: "outline",
@@ -282,8 +282,8 @@ export const DataTableExample = () => {
               onClick: () => setDialogOpen(false),
             }}
           />
-        </NewDialogContent>
-      </NewDialog>
+        </DialogContent>
+      </Dialog>
     </div>
   );
 };