diff --git a/package.json b/package.json
index 22a8e3f..609d511 100644
--- a/package.json
+++ b/package.json
@@ -5,6 +5,7 @@
   "homepage": "./",
   "dependencies": {
     "@chakra-ui/react": "^2.5.1",
+    "@mui/material": "^5.11.14",
     "camelize": "^1.0.1",
     "chart.js": "^2.7.3",
     "classnames": "^2.3.1",
diff --git a/src/components/add-new-contract/SidebarActions.js b/src/components/add-new-contract/SidebarActions.js
index 0373960..b1c13fa 100644
--- a/src/components/add-new-contract/SidebarActions.js
+++ b/src/components/add-new-contract/SidebarActions.js
@@ -12,6 +12,8 @@ import {
 } from "shards-react";
 import { ethers } from "ethers";
 import Services from "../../api/services";
+import Tooltip from "@mui/material/Tooltip";
+
 
 const SidebarActions = ({ title, data, signData }) => {
   const [domain, setDomain] = useState({
@@ -96,11 +98,17 @@ const SidebarActions = ({ title, data, signData }) => {
             </span>
             <span className="d-flex mb-2">
               <strong className="mr-1">File Hash:</strong>{" "}
-              <strong className="text-warning">{data?.filehash}</strong>
+              <Tooltip title={data?.filehash}>
+              <strong className="text-warning">{data?.filehash.substring(0, 20) +
+              "......"}</strong>
+              </Tooltip>
             </span>
             <span className="d-flex mb-2">
               <strong className="mr-1">Digital Signature:</strong>{" "}
-              <strong className="text-warning">{data?.signature}</strong>
+              <Tooltip title={data?.signature}>
+              <strong className="text-warning">{data?.signature.substring(0, 20)+
+              "......"}</strong>
+              </Tooltip>
             </span>
             <span className="d-flex mb-2">
               <strong className="mr-1">Created Date:</strong>{" "}