Adapt Layout

apps/contract-verification/src/app/layouts/Default.tsx

@@ -5,13 +5,22 @@ import { NavMenu } from '../components/NavMenu'
 interface Props {
   from: string
   title?: string
+  description?: string
 }
 
-export const DefaultLayout = ({ children }: PropsWithChildren<Props>) => {
+export const DefaultLayout = ({ children, title, description }: PropsWithChildren<Props>) => {
   return (
     <div>
       <NavMenu />
+      <div className="my-4">
+        <div>
+          <h2 className="text-center text-uppercase font-weight-bold">{title}</h2>
+          <p className="text-center" style={{ fontSize: '0.8rem' }}>
+            {description}
+          </p>
+        </div>
         {children}
       </div>
+    </div>
   )
 }

apps/contract-verification/src/app/routes.tsx

@@ -11,7 +11,7 @@ const DisplayRoutes = () => (
       <Route
         path="/"
         element={
-          <DefaultLayout from="/" title="Verify Smart Contracts">
+          <DefaultLayout from="/" title="Verify" description="Verify compiled contracts on different verification services">
             <VerifyView />
           </DefaultLayout>
         }
@@ -20,7 +20,7 @@ const DisplayRoutes = () => (
       <Route
         path="/receipts"
         element={
-          <DefaultLayout from="/" title="Receipts">
+          <DefaultLayout from="/" title="Receipts" description="Check the verification statuses of contracts submitted for verification">
             <ReceiptsView />
           </DefaultLayout>
         }

apps/contract-verification/src/app/views/ReceiptsView.tsx

@@ -7,13 +7,13 @@ import { SubmittedContract } from '../types/VerificationTypes'
 export const ReceiptsView = () => {
   // const {submittedContracts} = React.useContext(AppContext);
 
-  const submittedContracts = example as unknown as SubmittedContract
+  const submittedContracts = example as unknown as Record<string,SubmittedContract>
   console.log('submittedContracts', submittedContracts)
   return (
-    <div className="my-4">
+    <>
       {Object.values(submittedContracts).map((contract, index) => (
         <AccordionReceipt contract={contract} index={index} />
       ))}
-    </div>
+    </>
   )
 }

apps/contract-verification/src/app/views/VerifyView.tsx

@@ -109,13 +109,6 @@ export const VerifyView = () => {
   console.log('sourcifyVerifiers:', verifiers)
 
   return (
-    <div className="my-4">
-      <div>
-        <h2 className="text-center text-uppercase font-weight-bold">Verify</h2>
-        <p className="text-center" style={{ fontSize: '0.8rem' }}>
-          Verify compiled contracts on different verification services
-        </p>
-      </div>
     <form onSubmit={handleVerify}>
       <SearchableDropdown label="Contract Chain" chains={dropdownChains} id="network-dropdown" setSelectedChain={setSelectedChain} selectedChain={selectedChain} />
 
@@ -157,6 +150,5 @@ export const VerifyView = () => {
         <ConstructorArguments abiEncodedConstructorArgs={abiEncodedConstructorArgs} setAbiEncodedConstructorArgs={setAbiEncodedConstructorArgs} />
       </div>
     </form>
-    </div>
   )
 }