diff --git a/packages/app-explorer/src/systems/Core/components/CopyButton/CopyButton.tsx b/packages/app-explorer/src/systems/Core/components/CopyButton/CopyButton.tsx
index a4bf7d4cc..d481caefb 100644
--- a/packages/app-explorer/src/systems/Core/components/CopyButton/CopyButton.tsx
+++ b/packages/app-explorer/src/systems/Core/components/CopyButton/CopyButton.tsx
@@ -7,16 +7,29 @@ type CopyButtonProps = ButtonProps & {
   text?: string;
 };
 
-const COPY_ICON_SIZES = {
+const COPY_ICON_SIZES: Record<string, number> = {
   '1': 15,
   '2': 19,
   '3': 24,
   '4': 29,
 };
 
-const CopyButton = ({ value, text = 'Copy', ...props }: CopyButtonProps) => {
-  const size = props.size || '1';
-  const variant = props.variant || 'soft';
+const CopyButton = ({
+  value,
+  text = 'Copy',
+  size = '1',
+  variant = 'soft',
+  ...props
+}: CopyButtonProps) => {
+  const iconSize = COPY_ICON_SIZES[size];
+
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(value);
+    } catch (err) {
+      console.error('Failed to copy:', err);
+    }
+  };
 
   return (
     <Button
@@ -25,16 +38,14 @@ const CopyButton = ({ value, text = 'Copy', ...props }: CopyButtonProps) => {
       variant={variant}
       size={size}
       color="gray"
-      iconSize={COPY_ICON_SIZES[size as string]}
       rightIcon={IconCopy}
+      iconSize={iconSize}
       iconColor="text-muted"
-      onClick={async () => {
-        await navigator.clipboard.writeText(value);
-      }}
+      onClick={handleCopy}
     >
       {text}
     </Button>
   );
 };
 
-export default CopyButton;
+export default CopyButton;
\ No newline at end of file
diff --git a/packages/app-explorer/src/systems/Core/components/JsonViewer/JsonViewer.tsx b/packages/app-explorer/src/systems/Core/components/JsonViewer/JsonViewer.tsx
index d35082980..35292e0df 100644
--- a/packages/app-explorer/src/systems/Core/components/JsonViewer/JsonViewer.tsx
+++ b/packages/app-explorer/src/systems/Core/components/JsonViewer/JsonViewer.tsx
@@ -18,25 +18,21 @@ export type JsonViewerProps = BaseProps<{
 
 export function JsonViewer({ data, className, ...props }: JsonViewerProps) {
   const classes = styles();
-  const [style, setStyle] = useState(defaultStyles);
   const { theme } = useTheme();
+  const [style, setStyle] = useState(defaultStyles);
 
-  // TODO: theme is loaded as dark but doesn't render in JsonView correctly
-  // using this solution we force the state to change
-  // and rerender the component
   useEffect(() => {
     setStyle(theme === 'dark' ? darkStyles : defaultStyles);
   }, [theme]);
+
   return (
     <JsonView
       data={data}
       shouldExpandNode={collapseAllNested}
-      style={
-        {
-          ...style,
-          container: cx(classes.json(), className),
-        } as any
-      }
+      style={{
+        ...style,
+        container: cx(classes.json(), className),
+      }}
       {...props}
     />
   );
@@ -46,4 +42,4 @@ const styles = tv({
   slots: {
     json: 'bg-transparent text-sm py-2 px-1 break-all',
   },
-});
+});
\ No newline at end of file