From e3750e6ade50fab46607470378e4e985514df295 Mon Sep 17 00:00:00 2001
From: atanasster <atanasster@gmail.com>
Date: Wed, 21 Jul 2021 13:59:21 +0300
Subject: [PATCH] feat: options to CopyContainer

---
 ui/components/src/CopyContainer/CopyContainer.tsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/ui/components/src/CopyContainer/CopyContainer.tsx b/ui/components/src/CopyContainer/CopyContainer.tsx
index 7272d0d72..bc7378ba4 100644
--- a/ui/components/src/CopyContainer/CopyContainer.tsx
+++ b/ui/components/src/CopyContainer/CopyContainer.tsx
@@ -12,6 +12,14 @@ export interface CopyContainerProps {
    * value to copy
    */
   value: string;
+  /**
+   * maximum length of string to be displayed in copied tooltip
+   */
+  maxLength?: number;
+  /**
+   * copy-to-clipboard options
+   */
+  options?: Parameters<typeof copy>[1];
 }
 
 /**
@@ -21,6 +29,7 @@ export interface CopyContainerProps {
 export const CopyContainer: FC<CopyContainerProps> = ({
   name,
   value,
+  maxLength = 50,
   children,
   ...rest
 }) => {
@@ -58,7 +67,11 @@ export const CopyContainer: FC<CopyContainerProps> = ({
           <CheckIcon size={16} sx={{ color: 'green' }} />
           <Box sx={{ ml: 2, fontSize: 2 }}>{`${
             name && name !== value ? `${name} ` : ''
-          }copied ${value}`}</Box>
+          }copied ${
+            value.length > maxLength
+              ? `${value.substring(0, maxLength)}...`
+              : value
+          }`}</Box>
         </Box>
       )}
     >