Merge pull request #285 from gnosisguild/fix-diff-align

Fix diff view alignments & permission anchors
gnosisguild · Aug 21, 2024 · 37f59b4 · 37f59b4
2 parents 054bcc5 + 1fe47fd
commit 37f59b4
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 14 deletions.
diff --git a/packages/app/components/permissions/TargetItem/FunctionPermissionItem.tsx b/packages/app/components/permissions/TargetItem/FunctionPermissionItem.tsx
@@ -25,18 +25,21 @@ const FunctionPermissionItem: React.FC<
   abi,
   modified,
   condition,
-  ...rest
+  send,
+  delegatecall,
 }) => {
   const functionAbi = abi?.find(
-    (fragment) =>
+    (fragment: any) =>
       fragment.type === "function" && toFunctionSelector(fragment) === selector
   ) as AbiFunction | undefined
 
   return (
     <DiffBox
       diff={diff}
       modified={
-        modified && <FunctionPermissionItem {...modified} chainId={chainId} />
+        modified && (
+          <FunctionPermissionItem {...modified} chainId={chainId} abi={abi} />
+        )
       }
     >
       <div className={classes.functionContainer}>
@@ -46,14 +49,16 @@ const FunctionPermissionItem: React.FC<
             selector={selector}
             abi={functionAbi}
             condition={condition}
-            {...rest}
+            send={send}
+            delegatecall={delegatecall}
           />
         ) : (
           <RawFunctionPermissionItem
             targetAddress={targetAddress}
             selector={selector}
             condition={condition}
-            {...rest}
+            send={send}
+            delegatecall={delegatecall}
           />
         )}
         <div className={classes.verticalGuide} />

diff --git a/packages/app/components/permissions/annotations.test.ts b/packages/app/components/permissions/annotations.test.ts
@@ -73,7 +73,7 @@ describe("processAnnotations()", () => {
                 "explode": false,
                 "in": "query",
                 "name": "buy",
-                "required": true,
+                "required": false,
                 "schema": {
                   "deprecated": false,
                   "items": {
@@ -100,6 +100,22 @@ describe("processAnnotations()", () => {
                 },
                 "style": "form",
               },
+              {
+                "allowEmptyValue": false,
+                "allowReserved": false,
+                "explode": false,
+                "in": "query",
+                "name": "feeAmountBp",
+                "required": false,
+                "schema": {
+                  "deprecated": false,
+                  "maximum": 10000,
+                  "minimum": 0,
+                  "nullable": false,
+                  "type": "integer",
+                },
+                "style": "form",
+              },
             ],
             "summary": "Make swaps on cowswap",
             "tags": [

diff --git a/packages/app/ui/Anchor/index.tsx b/packages/app/ui/Anchor/index.tsx
@@ -1,7 +1,7 @@
 "use client"
 import { ReactNode, createContext, useContext, useEffect } from "react"
 import { RiLinkM } from "react-icons/ri"
-import { IconLinkButton } from "../IconButton"
+import { IconAButton } from "../IconButton"
 
 const AnchorContext = createContext<string>("")
 
@@ -44,13 +44,9 @@ const Anchor: React.FC<{
   }, [uniqueName])
 
   return (
-    <IconLinkButton
-      id={uniqueName}
-      href={"#" + uniqueName}
-      className={className}
-    >
+    <IconAButton id={uniqueName} href={"#" + uniqueName} className={className}>
       <RiLinkM />
-    </IconLinkButton>
+    </IconAButton>
   )
 }
 

diff --git a/packages/app/ui/IconButton/index.tsx b/packages/app/ui/IconButton/index.tsx
@@ -1,5 +1,5 @@
 import cn from "classnames"
-import React from "react"
+import React, { AnchorHTMLAttributes } from "react"
 
 import classes from "./style.module.css"
 import Link from "next/link"
@@ -38,3 +38,18 @@ export const IconLinkButton: React.FC<
     {...rest}
   />
 )
+
+export const IconAButton: React.FC<
+  AnchorHTMLAttributes<HTMLAnchorElement> & {
+    danger?: boolean
+    small?: boolean
+  }
+> = ({ className, danger, small, ...rest }) => (
+  <a
+    className={cn(classes.button, className, {
+      [classes.danger]: danger,
+      [classes.small]: small,
+    })}
+    {...rest}
+  />
+)