From 3d4b740e5a512db8fbdd934af2fbc9585fa00f0f Mon Sep 17 00:00:00 2001
From: polwex <polwex@sortug.com>
Date: Thu, 15 May 2025 18:47:59 +0700
Subject: thanks gemini, very pretty

---
 src/pages/test/trigger-modal-button.tsx | 37 +++++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 src/pages/test/trigger-modal-button.tsx

(limited to 'src/pages/test/trigger-modal-button.tsx')

diff --git a/src/pages/test/trigger-modal-button.tsx b/src/pages/test/trigger-modal-button.tsx
new file mode 100644
index 0000000..eaa2dda
--- /dev/null
+++ b/src/pages/test/trigger-modal-button.tsx
@@ -0,0 +1,37 @@
+"use client";
+
+import { useState, ReactNode } from "react";
+import ClientModal from "./client-modal"; // The modal shell
+
+interface TriggerModalButtonProps {
+  children: ReactNode; // This will be the <ProductDetailsServer />
+  buttonText?: string;
+  modalTitle?: string;
+}
+
+export default function TriggerModalButton({
+  children,
+  buttonText = "Open Product Details",
+  modalTitle,
+}: TriggerModalButtonProps) {
+  const [isModalOpen, setIsModalOpen] = useState(false);
+
+  return (
+    <>
+      <button
+        onClick={() => setIsModalOpen(true)}
+        className="px-4 py-2 font-semibold text-white bg-indigo-600 rounded-md hover:bg-indigo-700"
+      >
+        {buttonText}
+      </button>
+
+      <ClientModal
+        isOpen={isModalOpen}
+        onClose={() => setIsModalOpen(false)}
+        title={modalTitle || ""}
+      >
+        {children} {/* Pass the Server Component content here */}
+      </ClientModal>
+    </>
+  );
+}
-- 
cgit v1.2.3