From cd32f743ceb2961ba1674d546e5b6c9e00bb2591 Mon Sep 17 00:00:00 2001
From: pramod mahajan <pramod.mahajan@marcoaiot.com>
Date: Tue, 2 Sep 2025 16:39:44 +0530
Subject: [PATCH] changed segment button radio

---
 .../Documents/DocumentFilterPanel.jsx         | 88 ++++++++++++-------
 1 file changed, 55 insertions(+), 33 deletions(-)

diff --git a/src/components/Documents/DocumentFilterPanel.jsx b/src/components/Documents/DocumentFilterPanel.jsx
index 02cb1cff..830648a7 100644
--- a/src/components/Documents/DocumentFilterPanel.jsx
+++ b/src/components/Documents/DocumentFilterPanel.jsx
@@ -53,10 +53,15 @@ const DocumentFilterPanel = ({ entityTypeId, onApply }) => {
   };
 
   if (isLoading) return <div>Loading...</div>;
-  if (isError) return <div>Error: {error?.message || "Something went wrong!"}</div>;
+  if (isError)
+    return <div>Error: {error?.message || "Something went wrong!"}</div>;
 
-  const { uploadedBy = [], documentCategory = [], documentType = [], documentTag = [] } =
-    data?.data || {};
+  const {
+    uploadedBy = [],
+    documentCategory = [],
+    documentType = [],
+    documentTag = [],
+  } = data?.data || {};
 
   return (
     <FormProvider {...methods}>
@@ -129,36 +134,53 @@ const DocumentFilterPanel = ({ entityTypeId, onApply }) => {
         </div>
 
         {/* Status Filter */}
-        <div className="text-start d-flex align-items-center my-2">
-          <label className="form-label me-2 my-0">Choose Status:</label>
-          <div className="d-inline-flex border rounded-pill overflow-hidden shadow-none">
-            <button
-              type="button"
-              className={`btn px-2 py-1 rounded-0 text-tiny ${
-                isVerified === null ? "active btn-primary text-white" : "text-primary"
-              }`}
-              onClick={() => setValue("isVerified", null)}
-            >
-              All
-            </button>
-            <button
-              type="button"
-              className={`btn px-2 py-1 rounded-0 text-tiny ${
-                isVerified === true ? "active btn-success text-white" : "text-success"
-              }`}
-              onClick={() => setValue("isVerified", true)}
-            >
-              Verified
-            </button>
-            <button
-              type="button"
-              className={`btn px-2 py-1 rounded-0 text-tiny ${
-                isVerified === false ? "active btn-danger text-white" : "text-danger"
-              }`}
-              onClick={() => setValue("isVerified", false)}
-            >
-              Rejected
-            </button>
+        <div className="text-start my-2">
+          <label className="form-label d-block mb-2">Choose Status:</label>
+          <div className="d-flex gap-4">
+            <label className="switch switch-sm">
+              <input
+                type="radio"
+                className="switch-input"
+                name="isVerified"
+                checked={isVerified === null}
+                onChange={() => setValue("isVerified", null)}
+              />
+              <span className="switch-toggle-slider">
+                <span className="switch-on"></span>
+                <span className="switch-off"></span>
+              </span>
+              <span className="switch-label">All</span>
+            </label>
+
+            <label className="switch switch-sm">
+              <input
+                type="radio"
+                className="switch-input"
+                name="isVerified"
+                checked={isVerified === true}
+                onChange={() => setValue("isVerified", true)}
+              />
+              <span className="switch-toggle-slider">
+                <span className="switch-on"></span>
+                <span className="switch-off"></span>
+              </span>
+              <span className="switch-label">Verified</span>
+            </label>
+
+            <label className="switch switch-sm">
+              <input
+                type="radio"
+                className="switch-input"
+                name="isVerified"
+                checked={isVerified === false}
+                onChange={() => setValue("isVerified", false)}
+              />
+              <span className="switch-toggle-slider">
+                <span className="switch-on"></span>
+                <span className="switch-off"></span>
+              </span>
+              <span className="switch-label">Rejected</span>
+            </label>
           </div>
         </div>