resolves linting errors

nucypher · Feb 25, 2025 · 43bf039 · 43bf039
1 parent 3e68d5a
commit 43bf039
Show file tree

Hide file tree

Showing 12 changed files with 122 additions and 92 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,6 +1,6 @@
 import './globals.css';
 import { Inter } from 'next/font/google';
-import type { Metadata } from "next";
+import type { ReactNode } from 'react';
 
 const inter = Inter({ subsets: ['latin'] });
 
@@ -27,9 +27,9 @@ export const metadata = {
 
 export default function RootLayout({
   children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
+}: {
+  children: ReactNode;
+}) {
   return (
     <html lang="en" className="bg-gray-950">
       <body className={`${inter.className} bg-gray-950`}>

diff --git a/src/components/CiphertextDisplay.tsx b/src/components/CiphertextDisplay.tsx
@@ -5,7 +5,6 @@ interface CiphertextDisplayProps {
   onChange?: (text: string) => void;
   onCopy?: () => void;
   onClear?: () => void;
-  isValid?: boolean;
   isReadOnly?: boolean;
   label?: string;
 }
@@ -15,7 +14,6 @@ const CiphertextDisplay: React.FC<CiphertextDisplayProps> = ({
   onChange,
   onCopy,
   onClear,
-  isValid,
   isReadOnly = false,
   label = 'Ciphertext'
 }) => {

diff --git a/src/components/DecryptPage.tsx b/src/components/DecryptPage.tsx
@@ -4,38 +4,40 @@ import React, { useState } from 'react';
 import DecryptionPanel from './DecryptionPanel';
 import ErrorPanel from './ErrorPanel';
 import Header from './layout/Header';
+import { domains } from '@nucypher/taco';
 
 const DecryptPage: React.FC = () => {
   const [error, setError] = useState<string | null>(null);
 
   const handleError = (errorMessage: string) => {
     setError(errorMessage);
+    // Automatically clear error after 10 seconds
+    setTimeout(() => setError(null), 10000);
   };
 
   const handleClearError = () => {
     setError(null);
   };
 
   return (
-    <div className="min-h-screen bg-gray-950 text-white">
+    <div className="min-h-screen flex flex-col bg-black">
       <Header variant="decrypt" />
-      <div className="p-8">
+      <main className="flex-1 p-4">
         <div className="max-w-[1600px] mx-auto space-y-6">
           <div className="grid grid-cols-1 gap-4">
             <DecryptionPanel 
               messageKit={null}
+              ciphertext=""
               onError={handleError}
+              settings={{
+                domain: domains.DEVNET,
+                ritualId: 27
+              }}
             />
           </div>
         </div>
-      </div>
-
-      {error && (
-        <ErrorPanel 
-          error={error} 
-          onClear={handleClearError}
-        />
-      )}
+      </main>
+      <ErrorPanel error={error} onClear={handleClearError} />
     </div>
   );
 };

diff --git a/src/components/DecryptionPanel.tsx b/src/components/DecryptionPanel.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useState, useEffect } from 'react';
-import { conditions, decrypt, domains, initialize, ThresholdMessageKit } from '@nucypher/taco';
+import { conditions, decrypt, initialize, ThresholdMessageKit } from '@nucypher/taco';
 import { EIP4361AuthProvider, USER_ADDRESS_PARAM_DEFAULT } from '@nucypher/taco-auth';
 import { ethers } from 'ethers';
 import CiphertextDisplay from './CiphertextDisplay';
@@ -127,7 +127,7 @@ const DecryptionPanel: React.FC<DecryptionPanelProps> = ({
           const contextParams = await conditionContext.toContextParameters();
           console.log('Required context parameters:', contextParams);
         }
-      } catch (error) {
+      } catch {
         console.log('No conditions found in message kit, proceeding with direct decryption');
         conditionContext = undefined;
       }
@@ -182,7 +182,6 @@ const DecryptionPanel: React.FC<DecryptionPanelProps> = ({
           ciphertext={customCiphertext}
           onChange={handleCustomCiphertextChange}
           onClear={handleClear}
-          isValid={false}
         />
 
         <button

diff --git a/src/components/EncryptionPanel.tsx b/src/components/EncryptionPanel.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import React, { useState } from 'react';
-import { encrypt, domains, conditions, ThresholdMessageKit } from '@nucypher/taco';
+import { encrypt, conditions, ThresholdMessageKit } from '@nucypher/taco';
 import { ethers } from 'ethers';
 import { TacoCondition } from '../types/taco';
 import { SettingsConfig } from './Settings';

diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx
@@ -25,7 +25,7 @@ const Settings: React.FC<SettingsProps> = ({
     if (config.ritualId !== ritualId) {
       onConfigChange({ ...config, ritualId });
     }
-  }, [config.domain]);
+  }, [config.domain, config, onConfigChange]);
 
   const handleDomainChange = (value: string) => {
     const domain = value === 'devnet' ? domains.DEVNET : domains.TESTNET;

diff --git a/src/components/TacoPlayground.tsx b/src/components/TacoPlayground.tsx
@@ -13,8 +13,6 @@ import ErrorPanel from './ErrorPanel';
 import TacoProvider from './TacoProvider';
 import { TacoCondition } from '../types/taco';
 import { ThresholdMessageKit, domains } from '@nucypher/taco';
-import Link from 'next/link';
-import WalletButton from './WalletButton';
 import Settings, { SettingsConfig } from './Settings';
 
 const TacoPlayground: React.FC = () => {
@@ -52,10 +50,6 @@ const TacoPlayground: React.FC = () => {
     setError(null);
   };
 
-  const handleConnect = () => {
-    // Implementation of handleConnect function
-  };
-
   return (
     <DndProvider backend={HTML5Backend}>
       <TacoProvider>

diff --git a/src/components/blocks/DraggableBlock.tsx b/src/components/blocks/DraggableBlock.tsx
@@ -244,11 +244,6 @@ const DraggableBlock: React.FC<DraggableBlockProps> = ({
     onBlockUpdate(updatedBlock);
   };
 
-  const renderConnectedBlock = (connectedBlock: Block, parentPath: string[]) => {
-    // Don't render any blocks here - they are all handled in the main render
-    return null;
-  };
-
   return (
     <div
       ref={combineRefs(elementRef, drag)}

diff --git a/src/components/blocks/JsonPreview.tsx b/src/components/blocks/JsonPreview.tsx
@@ -1,53 +1,75 @@
 'use client';
 
-import React, { useState, useEffect } from 'react';
-import ConditionValidator from './ConditionValidator';
+import React, { useState } from 'react';
 import { TacoCondition } from '../../types/taco';
 
 interface JsonPreviewProps {
   condition: TacoCondition | null;
 }
 
 const JsonPreview: React.FC<JsonPreviewProps> = ({ condition }) => {
-  const [copied, setCopied] = useState(false);
-  const formattedJson = condition ? JSON.stringify(condition, null, 2) : '';
+  const [copySuccess, setCopySuccess] = useState(false);
 
-  useEffect(() => {
-    console.log('JsonPreview received condition:', condition);
-    console.log('Formatted JSON:', formattedJson);
-  }, [condition, formattedJson]);
+  // Format the JSON for display
+  const formattedJson = condition ? JSON.stringify(condition, null, 2) : '';
 
   const handleCopy = async () => {
-    await navigator.clipboard.writeText(formattedJson);
-    setCopied(true);
-    setTimeout(() => setCopied(false), 2000); // Reset after 2 seconds
+    if (!formattedJson) return;
+
+    try {
+      await navigator.clipboard.writeText(formattedJson);
+      setCopySuccess(true);
+      setTimeout(() => setCopySuccess(false), 2000);
+    } catch (err) {
+      console.error('Failed to copy text: ', err);
+    }
   };
 
   return (
-    <div className="h-full flex flex-col bg-black">
-      <div className="bg-white/5 border-b border-white/10 px-6 py-4">
+    <div className="h-full flex flex-col">
+      <div className="flex justify-between items-center border-b border-white/10 px-6 py-4 bg-white/5">
         <div className="flex items-center gap-3">
           <div className="p-2 bg-white/5 rounded-lg border border-white/10">
             <svg className="w-5 h-5 text-taco" viewBox="0 0 24 24" fill="none" stroke="currentColor">
               <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} 
-                d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
+                d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" />
             </svg>
           </div>
-          <div>
-            <h3 className="text-sm font-medium text-white tracking-wide uppercase">JSON Preview</h3>
-          </div>
+          <h3 className="text-sm font-medium text-white tracking-wide uppercase">JSON Preview</h3>
         </div>
+        {copySuccess && (
+          <div className="text-xs text-taco flex items-center gap-1.5">
+            <svg className="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
+            </svg>
+            <span>Copied!</span>
+          </div>
+        )}
       </div>
-      <div className="flex-1 overflow-y-auto p-3 font-mono text-sm">
+      <div className="flex-1 overflow-auto p-4 bg-black/30 relative group">
         {condition ? (
-          <pre className="text-white/80">
-            {JSON.stringify(condition, null, 2)}
-          </pre>
+          <>
+            <pre className="text-white/70 text-sm font-mono whitespace-pre-wrap">
+              {formattedJson}
+            </pre>
+            <button
+              onClick={handleCopy}
+              className="absolute top-2 right-2 p-2 text-white/40 hover:text-white/80
+                hover:bg-white/10 rounded-lg transition-all duration-200
+                opacity-0 group-hover:opacity-100"
+              title="Copy to clipboard"
+            >
+              <svg className="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} 
+                  d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3" />
+              </svg>
+            </button>
+          </>
         ) : (
-          <div className="flex items-center justify-center h-full min-h-[200px]">
-            <div className="text-white/40 text-sm font-medium">
-              No condition defined
-            </div>
+          <div className="flex items-center justify-center h-full">
+            <p className="text-white/40 text-sm">
+              No condition created yet
+            </p>
           </div>
         )}
       </div>

diff --git a/src/components/layout/MainLayout.tsx b/src/components/layout/MainLayout.tsx
@@ -1,10 +1,7 @@
 'use client';
 
 import React from 'react';
-import Link from 'next/link';
 import BlockSidebar from '../blocks/BlockSidebar';
-import WalletButton from '../WalletButton';
-import { ethers } from 'ethers';
 import Header from './Header';
 
 interface MainLayoutProps {
@@ -13,10 +10,6 @@ interface MainLayoutProps {
 }
 
 const MainLayout: React.FC<MainLayoutProps> = ({ children, onOpenSettings }) => {
-  const handleConnect = (provider: ethers.providers.Web3Provider) => {
-    console.log('Connected to wallet', provider);
-  };
-
   return (
     <div className="min-h-screen flex flex-col bg-black">
       {/* Full-width Header */}

diff --git a/src/types/taco-types.ts b/src/types/taco-types.ts
@@ -6,20 +6,35 @@ export interface TacoOptions {
   porterUri?: string;
 }
 
+export interface TacoCondition {
+  conditionType: string;
+  chain?: number;
+  method?: string;
+  parameters?: Record<string, unknown>;
+  returnValueTest?: Record<string, unknown>;
+  [key: string]: unknown;
+}
+
 export type EncryptFunction = (
   provider: Provider,
   domain: string,
   message: string | Uint8Array,
-  condition: any,
+  condition: TacoCondition,
   threshold: number,
   signer: Signer,
   options?: TacoOptions
 ) => Promise<ThresholdMessageKit>;
 
+export interface ConditionContext {
+  address?: string;
+  chain?: number;
+  [key: string]: unknown;
+}
+
 export type DecryptFunction = (
   provider: Provider,
   domain: string,
   messageKit: ThresholdMessageKit,
-  conditionContext?: any,
+  conditionContext?: ConditionContext,
   options?: TacoOptions
 ) => Promise<Uint8Array>; 
diff --git a/src/types/taco.d.ts b/src/types/taco.d.ts
@@ -2,33 +2,45 @@ import { Provider } from '@ethersproject/providers';
 import { Signer } from '@ethersproject/abstract-signer';
 import { ThresholdMessageKit } from '@nucypher/taco';
 
-declare module '@nucypher/taco' {
-  interface TacoOptions {
-    porterUri?: string;
-  }
+// Define our own types that match what's in the @nucypher/taco package
+export interface TacoOptions {
+  porterUri?: string;
+}
+
+export interface TacoCondition {
+  conditionType: string;
+  chain?: number;
+  method?: string;
+  parameters?: Record<string, unknown>;
+  returnValueTest?: Record<string, unknown>;
+  [key: string]: unknown;
+}
 
-  interface EncryptFunction {
-    (
-      provider: Provider,
-      domain: string,
-      message: string | Uint8Array,
-      condition: any,
-      threshold: number,
-      signer: Signer,
-      options?: TacoOptions
-    ): Promise<ThresholdMessageKit>;
-  }
+export interface ConditionContext {
+  address?: string;
+  chain?: number;
+  [key: string]: unknown;
+}
 
-  interface DecryptFunction {
-    (
-      provider: Provider,
-      domain: string,
-      messageKit: ThresholdMessageKit,
-      conditionContext?: any,
-      options?: TacoOptions
-    ): Promise<Uint8Array>;
-  }
+// Declare the module augmentation without exports
+declare module '@nucypher/taco' {
+  // These functions are already exported by the package
+  // We're just adding type information
+  const encrypt: (
+    provider: Provider,
+    domain: string,
+    message: string | Uint8Array,
+    condition: TacoCondition,
+    threshold: number,
+    signer: Signer,
+    options?: TacoOptions
+  ) => Promise<ThresholdMessageKit>;
 
-  export const encrypt: EncryptFunction;
-  export const decrypt: DecryptFunction;
+  const decrypt: (
+    provider: Provider,
+    domain: string,
+    messageKit: ThresholdMessageKit,
+    conditionContext?: ConditionContext,
+    options?: TacoOptions
+  ) => Promise<Uint8Array>;
 }