review fixes

ui/address/contract/ContractCode.pw.tsx

@@ -234,50 +234,53 @@ test('non verified', async({ mount, page }) => {
   await expect(component).toHaveScreenshot();
 });
 
-const withAuditsTest = test.extend({
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  context: contextWithEnvs(configs.UIEnvs.hasContractAuditReports) as any,
-});
-
-withAuditsTest('with audits feature, no audits', async({ mount, page }) => {
-  await page.route(CONTRACT_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(contractMock.verified),
-  }));
-  await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify({ items: [] }),
-  }));
-  await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
-
-  const component = await mount(
-    <TestApp>
-      <ContractCode addressHash={ addressHash } noSocket/>
-    </TestApp>,
-    { hooksConfig },
-  );
-
-  await expect(component).toHaveScreenshot();
-});
-
-withAuditsTest('with audits feature, has audits', async({ mount, page }) => {
-  await page.route(CONTRACT_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(contractMock.verified),
-  }));
-  await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(contractAudits),
-  }));
-
-  await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
-
-  const component = await mount(
-    <TestApp>
-      <ContractCode addressHash={ addressHash } noSocket/>
-    </TestApp>,
-    { hooksConfig },
-  );
+test.describe('with audits feature', () => {
+
+  const withAuditsTest = test.extend({
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    context: contextWithEnvs(configs.UIEnvs.hasContractAuditReports) as any,
+  });
+
+  withAuditsTest('no audits', async({ mount, page }) => {
+    await page.route(CONTRACT_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractMock.verified),
+    }));
+    await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify({ items: [] }),
+    }));
+    await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
+
+    const component = await mount(
+      <TestApp>
+        <ContractCode addressHash={ addressHash } noSocket/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+
+  withAuditsTest('has audits', async({ mount, page }) => {
+    await page.route(CONTRACT_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractMock.verified),
+    }));
+    await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractAudits),
+    }));
+
+    await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
+
+    const component = await mount(
+      <TestApp>
+        <ContractCode addressHash={ addressHash } noSocket/>
+      </TestApp>,
+      { hooksConfig },
+    );
 
-  await expect(component).toHaveScreenshot();
+    await expect(component).toHaveScreenshot();
+  });
 });

ui/address/contract/ContractSecurityAudits.tsx

-import { Box, Button, Skeleton, useDisclosure } from '@chakra-ui/react';
+import { Box, Button, useDisclosure } from '@chakra-ui/react';
 import React from 'react';
 
 import type { SmartContractSecurityAuditSubmission } from 'types/api/contract';
@@ -61,11 +61,9 @@ const ContractSecurityAudits = ({ addressHash }: Props) => {
             mt={ 2 }
           >
             { data.items.map(item => (
-              <Skeleton isLoaded={ !isPlaceholderData } key={ item.audit_company_name + item.audit_publish_date }>
-                <LinkExternal href={ item.audit_report_url }>
-                  { `${ item.audit_company_name }, ${ dayjs(item.audit_publish_date).format('MMM DD, YYYY') }` }
-                </LinkExternal>
-              </Skeleton>
+              <LinkExternal href={ item.audit_report_url } key={ item.audit_company_name + item.audit_publish_date } isLoading={ isPlaceholderData }>
+                { `${ item.audit_company_name }, ${ dayjs(item.audit_publish_date).format('MMM DD, YYYY') }` }
+              </LinkExternal>
             )) }
           </ContainerWithScrollY>
         </Box>

ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterEmail.tsx

@@ -20,7 +20,6 @@ const AuditSubmitterEmail = ({ control }: Props) => {
           { ...field }
           required
           isInvalid={ Boolean(fieldState.error) }
-          autoComplete="off"
         />
         <InputPlaceholder text="Submitter email" error={ fieldState.error }/>
       </FormControl>

ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterName.tsx

@@ -19,7 +19,6 @@ const AuditSubmitterName = ({ control }: Props) => {
           { ...field }
           required
           isInvalid={ Boolean(fieldState.error) }
-          autoComplete="off"
         />
         <InputPlaceholder text="Submitter name" error={ fieldState.error }/>
       </FormControl>