diff --git a/apps/OpenSign/src/json/ReportJson.js b/apps/OpenSign/src/json/ReportJson.js
index 728ef175b1..21066f6696 100644
--- a/apps/OpenSign/src/json/ReportJson.js
+++ b/apps/OpenSign/src/json/ReportJson.js
@@ -13,7 +13,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "1231",
-            btnLabel: "Edit",
+            hoverLabel: "Edit",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa-solid fa-pen",
@@ -22,7 +22,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "2142",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#ff4848",
             textColor: "white",
             btnIcon: "fa fa-trash",
@@ -41,10 +41,11 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "4536",
-            btnLabel: "Sign",
+            btnLabel: "sign",
+            hoverLabel: "Sign",
             btnColor: "#3ac9d6",
             textColor: "white",
-            btnIcon: "fa fa-eye",
+            btnIcon: "fa-solid fa-signature",
             redirectUrl: "pdfRequestFiles",
             action: "redirect"
           }
@@ -60,8 +61,8 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "8901",
-            btnLabel: "Share",
-            btnColor: "#3ac9d6",
+            hoverLabel: "Share",
+            btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa-solid fa-share",
             redirectUrl: "",
@@ -69,7 +70,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "1588",
-            btnLabel: "View",
+            hoverLabel: "View",
             btnColor: "#3ac9d6",
             textColor: "white",
             btnIcon: "fa fa-eye",
@@ -77,22 +78,30 @@ export default function reportJson(id) {
             action: "redirect"
           },
           {
-            btnId: "1488",
-            btnLabel: "Delete",
-            btnColor: "#ff4848",
-            textColor: "white",
-            btnIcon: "fa fa-trash",
-            redirectUrl: "",
-            action: "delete"
-          },
-          {
-            btnId: "1688",
-            btnLabel: "Revoke",
-            btnColor: "#ff4848",
-            textColor: "white",
-            btnIcon: "fa-solid fa-file-circle-xmark",
-            redirectUrl: "",
-            action: "revoke"
+            btnId: "2234",
+            hoverLabel: "option",
+            btnColor: "transparent",
+            textColor: "black",
+            btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
+            action: "option",
+            subaction: [
+              {
+                btnId: "1688",
+                btnLabel: "Revoke",
+                hoverLabel: "Revoke",
+                btnIcon: "fa-solid fa-file-circle-xmark",
+                redirectUrl: "",
+                action: "revoke"
+              },
+              {
+                btnId: "1488",
+                btnLabel: "Delete",
+                hoverLabel: "Delete",
+                btnIcon: "fa fa-trash",
+                redirectUrl: "",
+                action: "delete"
+              }
+            ]
           }
         ],
         helpMsg:
@@ -106,7 +115,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "1378",
-            btnLabel: "Edit",
+            hoverLabel: "Edit",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa fa-eye",
@@ -115,7 +124,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "1278",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#ff4848",
             textColor: "white",
             btnIcon: "fa fa-trash",
@@ -134,7 +143,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "1458",
-            btnLabel: "View",
+            hoverLabel: "View",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa fa-eye",
@@ -143,7 +152,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "1358",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#ff4848",
             textColor: "white",
             btnIcon: "fa fa-trash",
@@ -162,7 +171,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "1898",
-            btnLabel: "View",
+            hoverLabel: "View",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa fa-eye",
@@ -171,7 +180,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "1998",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#ff4848",
             textColor: "white",
             btnIcon: "fa fa-trash",
@@ -190,21 +199,47 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "1999",
-            btnLabel: "View",
+            hoverLabel: "Share",
             btnColor: "#4bd396",
             textColor: "white",
+            btnIcon: "fa-solid fa-share",
+            redirectUrl: "",
+            action: "share"
+          },
+          {
+            btnId: "1999",
+            hoverLabel: "View",
+            btnColor: "#3ac9d6",
+            textColor: "white",
             btnIcon: "fa fa-eye",
             redirectUrl: "pdfRequestFiles",
             action: "redirect"
           },
           {
-            btnId: "2000",
-            btnLabel: "Delete",
-            btnColor: "#ff4848",
-            textColor: "white",
-            btnIcon: "fa fa-trash",
-            redirectUrl: "",
-            action: "delete"
+            btnId: "2234",
+            hoverLabel: "option",
+            btnColor: "transparent",
+            textColor: "black",
+            btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
+            action: "option",
+            subaction: [
+              {
+                btnId: "6788",
+                btnLabel: "Revoke",
+                hoverLabel: "Revoke",
+                btnIcon: "fa-solid fa-file-circle-xmark",
+                redirectUrl: "",
+                action: "revoke"
+              },
+              {
+                btnId: "2000",
+                btnLabel: "Delete",
+                hoverLabel: "Delete",
+                btnIcon: "fa fa-trash",
+                redirectUrl: "",
+                action: "delete"
+              }
+            ]
           }
         ]
       };
@@ -216,8 +251,9 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "2001",
-            btnLabel: "Sign",
-            btnColor: "#4bd396",
+            btnLabel: "sign",
+            hoverLabel: "Sign",
+            btnColor: "#3ac9d6",
             textColor: "white",
             btnIcon: "fa-solid fa-signature",
             redirectUrl: "pdfRequestFiles",
@@ -233,7 +269,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "2003",
-            btnLabel: "Edit",
+            hoverLabel: "Edit",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa-solid fa-pen",
@@ -242,7 +278,7 @@ export default function reportJson(id) {
           },
           {
             btnId: "2004",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#ff4848",
             textColor: "white",
             btnIcon: "fa fa-trash",
@@ -259,7 +295,7 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "2204",
-            btnLabel: "Delete",
+            hoverLabel: "Delete",
             btnColor: "#f55a42",
             textColor: "white",
             btnIcon: "fa-solid fa-trash",
@@ -278,7 +314,8 @@ export default function reportJson(id) {
         actions: [
           {
             btnId: "2234",
-            btnLabel: "Create document",
+            btnLabel: "Use",
+            hoverLabel: "Use",
             btnColor: "#4bd396",
             textColor: "white",
             btnIcon: "fa fa-plus",
@@ -286,22 +323,30 @@ export default function reportJson(id) {
             action: "redirect"
           },
           {
-            btnLabel: "Edit",
-            btnId: "2434",
-            btnColor: "#00c9d5",
-            textColor: "white",
-            btnIcon: "fa-solid fa-pen",
-            redirectUrl: "template",
-            action: "redirect"
-          },
-          {
-            btnId: "1834",
-            btnLabel: "Delete",
-            btnColor: "#ff4848",
-            textColor: "white",
-            btnIcon: "fa fa-trash",
-            redirectUrl: "",
-            action: "delete"
+            btnId: "2234",
+            hoverLabel: "option",
+            btnColor: "transparent",
+            textColor: "black",
+            btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
+            action: "option",
+            subaction: [
+              {
+                btnId: "2434",
+                btnLabel: "Edit",
+                hoverLabel: "Edit",
+                btnIcon: "fa-solid fa-pen",
+                redirectUrl: "template",
+                action: "redirect"
+              },
+              {
+                btnId: "1834",
+                btnLabel: "Delete",
+                hoverLabel: "Delete",
+                btnIcon: "fa fa-trash",
+                redirectUrl: "",
+                action: "delete"
+              }
+            ]
           }
         ],
         helpMsg:
diff --git a/apps/OpenSign/src/primitives/GetReportDisplay.js b/apps/OpenSign/src/primitives/GetReportDisplay.js
index b6bbd34ba8..4684b30580 100644
--- a/apps/OpenSign/src/primitives/GetReportDisplay.js
+++ b/apps/OpenSign/src/primitives/GetReportDisplay.js
@@ -1,4 +1,4 @@
- import React, { useState, useEffect, useMemo } from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import pad from "../assets/images/pad.svg";
 import { useNavigate } from "react-router-dom";
 import axios from "axios";
@@ -9,18 +9,7 @@ import Alert from "./Alert";
 import Tooltip from "./Tooltip";
 import { RWebShare } from "react-web-share";
 
-const ReportTable = ({
-  ReportName,
-  List,
-  setList,
-  actions,
-  heading,
-  setIsNextRecord,
-  isMoreDocs,
-  docPerPage,
-  form,
-  report_help
-}) => {
+const ReportTable = (props) => {
   const navigate = useNavigate();
   const [currentPage, setCurrentPage] = useState(1);
   const [actLoader, setActLoader] = useState({});
@@ -32,18 +21,19 @@ const ReportTable = ({
   const [isShare, setIsShare] = useState({});
   const [shareUrls, setShareUrls] = useState([]);
   const [copied, setCopied] = useState(false);
+  const [isOption, setIsOption] = useState({});
   const [alertMsg, setAlertMsg] = useState({ type: "success", message: "" });
-  const startIndex = (currentPage - 1) * docPerPage;
-
+  const startIndex = (currentPage - 1) * props.docPerPage;
+  const { isMoreDocs, setIsNextRecord } = props;
   // For loop is used to calculate page numbers visible below table
   // Initialize pageNumbers using useMemo to avoid unnecessary re-creation
   const pageNumbers = useMemo(() => {
     const calculatedPageNumbers = [];
-    for (let i = 1; i <= Math.ceil(List.length / docPerPage); i++) {
+    for (let i = 1; i <= Math.ceil(props.List.length / props.docPerPage); i++) {
       calculatedPageNumbers.push(i);
     }
     return calculatedPageNumbers;
-  }, [List, docPerPage]);
+  }, [props.List, props.docPerPage]);
   //  below useEffect reset currenpage to 1 if user change route
   useEffect(() => {
     return () => setCurrentPage(1);
@@ -73,8 +63,8 @@ const ReportTable = ({
 
   // `handleURL` is used to open microapp
   const handleURL = async (item, act) => {
-    if (ReportName === "Templates") {
-      if (act.btnLabel === "Edit") {
+    if (props.ReportName === "Templates") {
+      if (act.hoverLabel === "Edit") {
         navigate(`/${act.redirectUrl}/${item.objectId}`);
       } else {
         setActLoader({ [`${item.objectId}_${act.btnId}`]: true });
@@ -212,13 +202,15 @@ const ReportTable = ({
       handleShare(item);
     } else if (act.action === "revoke") {
       setIsRevoke({ [item.objectId]: true });
+    } else if (act.action === "option") {
+      setIsOption({ [item.objectId]: !isOption[item.objectId] });
     }
   };
   // Get current list
-  const indexOfLastDoc = currentPage * docPerPage;
-  const indexOfFirstDoc = indexOfLastDoc - docPerPage;
+  const indexOfLastDoc = currentPage * props.docPerPage;
+  const indexOfFirstDoc = indexOfLastDoc - props.docPerPage;
   // `currentLists` is total record render on current page
-  const currentLists = List?.slice(indexOfFirstDoc, indexOfLastDoc);
+  const currentLists = props.List?.slice(indexOfFirstDoc, indexOfLastDoc);
 
   // Change page
   const paginateFront = () => setCurrentPage(currentPage + 1);
@@ -229,7 +221,7 @@ const ReportTable = ({
   };
 
   const handleUserData = (data) => {
-    setList((prevData) => [data, ...prevData]);
+    props.setList((prevData) => [data, ...prevData]);
   };
 
   const handleDelete = async (item) => {
@@ -243,10 +235,10 @@ const ReportTable = ({
       const serverUrl = process.env.REACT_APP_SERVERURL
         ? process.env.REACT_APP_SERVERURL
         : window.location.origin + "/api/app";
-      const cls = clsObj[ReportName] || "contracts_Document";
+      const cls = clsObj[props.ReportName] || "contracts_Document";
       const url = serverUrl + `/classes/${cls}/`;
       const body =
-        ReportName === "Contactbook"
+        props.ReportName === "Contactbook"
           ? { IsDeleted: true }
           : { IsArchive: true };
       const res = await axios.put(url + item.objectId, body, {
@@ -265,8 +257,10 @@ const ReportTable = ({
           message: "Record deleted successfully!"
         });
         setTimeout(() => setIsAlert(false), 1500);
-        const upldatedList = List.filter((x) => x.objectId !== item.objectId);
-        setList(upldatedList);
+        const upldatedList = props.List.filter(
+          (x) => x.objectId !== item.objectId
+        );
+        props.setList(upldatedList);
       }
     } catch (err) {
       console.log("err", err);
@@ -335,8 +329,10 @@ const ReportTable = ({
             message: "Record revoked successfully!"
           });
           setTimeout(() => setIsAlert(false), 1500);
-          const upldatedList = List.filter((x) => x.objectId !== item.objectId);
-          setList(upldatedList);
+          const upldatedList = props.List.filter(
+            (x) => x.objectId !== item.objectId
+          );
+          props.setList(upldatedList);
         }
       })
       .catch((err) => {
@@ -364,20 +360,20 @@ const ReportTable = ({
         {isAlert && <Alert type={alertMsg.type}>{alertMsg.message}</Alert>}
         <div className="flex flex-row items-center justify-between my-2 mx-3 text-[20px] md:text-[23px]">
           <div className="font-light">
-            {ReportName}{" "}
-            {report_help && (
+            {props.ReportName}{" "}
+            {props.report_help && (
               <span className="text-xs md:text-[13px] font-normal">
-                <Tooltip message={report_help} />
+                <Tooltip message={props.report_help} />
               </span>
             )}
           </div>
-          {ReportName === "Templates" && (
+          {props.ReportName === "Templates" && (
             <i
               onClick={() => navigate("/form/template")}
               className="fa-solid fa-square-plus text-sky-400 text-[25px]"
             ></i>
           )}
-          {form && (
+          {props.form && (
             <div
               className="cursor-pointer"
               onClick={() => handleContactFormModal()}
@@ -389,36 +385,36 @@ const ReportTable = ({
         <table className="table-auto w-full border-collapse">
           <thead className="text-[14px]">
             <tr className="border-y-[1px]">
-              {heading?.map((item, index) => (
+              {props.heading?.map((item, index) => (
                 <React.Fragment key={index}>
                   <th className="px-4 py-2 font-thin">{item}</th>
                 </React.Fragment>
               ))}
-              {actions?.length > 0 && (
+              {props.actions?.length > 0 && (
                 <th className="px-4 py-2 font-thin">Action</th>
               )}
             </tr>
           </thead>
           <tbody className="text-[12px]">
-            {List?.length > 0 && (
+            {props.List?.length > 0 && (
               <>
                 {currentLists.map((item, index) =>
-                  ReportName === "Contactbook" ? (
+                  props.ReportName === "Contactbook" ? (
                     <tr className="border-y-[1px]" key={index}>
-                      {heading.includes("Sr.No") && (
+                      {props.heading.includes("Sr.No") && (
                         <td className="px-4 py-2">{startIndex + index + 1}</td>
                       )}
                       <td className="px-4 py-2 font-semibold">{item?.Name} </td>
                       <td className="px-4 py-2">{item?.Email || "-"}</td>
                       <td className="px-4 py-2">{item?.Phone || "-"}</td>
                       <td className="px-3 py-2 text-white grid grid-cols-2">
-                        {actions?.length > 0 &&
-                          actions.map((act, index) => (
+                        {props.actions?.length > 0 &&
+                          props.actions.map((act, index) => (
                             <button
                               key={index}
                               onClick={() => handleActionBtn(act, item)}
                               className={`mb-1 flex justify-center items-center gap-1 px-2 py-1 rounded shadow`}
-                              title={act.btnLabel}
+                              title={act.hoverLabel}
                               style={{
                                 backgroundColor: act.btnColor
                                   ? act.btnColor
@@ -467,16 +463,16 @@ const ReportTable = ({
                     </tr>
                   ) : (
                     <tr className="border-y-[1px]" key={index}>
-                      {heading.includes("Sr.No") && (
+                      {props.heading.includes("Sr.No") && (
                         <td className="px-4 py-2">{startIndex + index + 1}</td>
                       )}
                       <td className="px-4 py-2 font-semibold w-56">
                         {item?.Name}{" "}
                       </td>
-                      {heading.includes("Note") && (
+                      {props.heading.includes("Note") && (
                         <td className="px-4 py-2">{item?.Note || "-"}</td>
                       )}
-                      {heading.includes("Folder") && (
+                      {props.heading.includes("Folder") && (
                         <td className="px-4 py-2">
                           {item?.Folder?.Name || "OpenSign™ Drive"}
                         </td>
@@ -500,14 +496,18 @@ const ReportTable = ({
                       <td className="px-4 py-2">
                         {item?.Signers ? formatRow(item?.Signers) : "-"}
                       </td>
-                      <td className="px-3 py-2 text-white grid grid-cols-2 gap-1">
-                        {actions?.length > 0 &&
-                          actions.map((act, index) => (
+                      <td className="px-2 py-2 text-white flex flex-row gap-x-2 gap-y-1 justify-center items-center">
+                        {props.actions?.length > 0 &&
+                          props.actions.map((act, index) => (
                             <button
                               key={index}
                               onClick={() => handleActionBtn(act, item)}
-                              className={`w-[25px] h-[25px] flex justify-center items-center rounded shadow`}
-                              title={act.btnLabel}
+                              className={`${
+                                act.action === "option" ? "" : "rounded shadow"
+                              } ${
+                                act.btnLabel ? "py-[3px] px-1.5" : "py-1.5 px-2"
+                              } relative text-center flex items-center justify-center focus:outline-none`}
+                              title={act.hoverLabel}
                               style={{
                                 backgroundColor: act.btnColor
                                   ? act.btnColor
@@ -516,6 +516,33 @@ const ReportTable = ({
                               }}
                             >
                               <i className={act.btnIcon}></i>
+                              {act.btnLabel && (
+                                <span className="ml-[4px] uppercase font-medium">
+                                  {act.btnLabel}
+                                </span>
+                              )}
+                              {isOption[item.objectId] &&
+                                act.action === "option" && (
+                                  <div className="absolute -right-2 top-5 bg-white rounded shadow z-[20] overflow-hidden">
+                                    {act.subaction?.map((subact) => (
+                                      <div
+                                        key={subact.btnId}
+                                        className="hover:bg-gray-300 cursor-pointer px-2 py-1.5 flex justify-start items-center text-black"
+                                        onClick={() =>
+                                          handleActionBtn(subact, item)
+                                        }
+                                        title={subact.hoverLabel}
+                                      >
+                                        <i className={subact.btnIcon}></i>
+                                        {subact.btnLabel && (
+                                          <span className="ml-[4px] text-xs capitalize">
+                                            {subact.btnLabel}
+                                          </span>
+                                        )}
+                                      </div>
+                                    ))}
+                                  </div>
+                                )}
                             </button>
                           ))}
                         {isDeleteModal[item.objectId] && (
@@ -637,7 +664,7 @@ const ReportTable = ({
           </tbody>
         </table>
         <div className="flex flex-wrap items-center gap-2 p-2 ">
-          {List.length > docPerPage && (
+          {props.List.length > props.docPerPage && (
             <>
               {currentPage > 1 && (
                 <button
@@ -661,7 +688,7 @@ const ReportTable = ({
           {isMoreDocs && (
             <button className="text-black rounded px-1 py-2">...</button>
           )}
-          {List.length > docPerPage && (
+          {props.List.length > props.docPerPage && (
             <>
               {pageNumbers.includes(currentPage + 1) && (
                 <button
@@ -674,7 +701,7 @@ const ReportTable = ({
             </>
           )}
         </div>
-        {List?.length <= 0 && (
+        {props.List?.length <= 0 && (
           <div className="flex flex-col items-center justify-center w-full bg-white rounded py-4">
             <div className="w-[60px] h-[60px] overflow-hidden">
               <img