add fetchRolesMod function

packages/app/app/page.tsx

@@ -49,7 +49,7 @@ export default function AttachMod() {
                 onChange={(ev) => {
                   const { value } = ev.target;
                   if (value.indexOf(":") > 0) {
-                    const [chainPrefix, address] = value.split(":");
+                    const [chainPrefix] = value.split(":");
                     const nextChainId =
                       chains.find((chain) => chain.prefix === chainPrefix)
                         ?.id || chainId;

packages/sdk/src/fetchRole.ts

@@ -47,6 +47,10 @@ const QUERY = `
           }
         }
       }
+      annotations {
+        url
+        schema
+      }
     }
   }
 `

packages/sdk/src/fetchRolesMod.ts

@@ -0,0 +1,76 @@
+import SUBGRAPH from "./subgraph"
+import { ChainId, Target } from "./types"
+
+interface Props {
+  address: string
+  chainId: ChainId
+}
+
+const QUERY = `
+  query RolesMod($id: String) {
+    rolesModifier(id: $id) {
+      address
+      owner
+      avatar
+      target 
+      roles {
+        members {
+          member {
+            address
+          }
+        }
+        targets {
+          address
+        }
+      }
+    }
+  }
+`
+
+export const fetchRolesMod = async ({
+  address,
+  chainId,
+}: Props): Promise<RolesModifier> => {
+  const res = await fetch(SUBGRAPH[chainId], {
+    method: "POST",
+    body: JSON.stringify({
+      query: QUERY,
+      variables: { id: address.toLowerCase() },
+      operationName: "Roles",
+    }),
+  })
+  const { data, error } = await res.json()
+  if (error) {
+    throw new Error(error)
+  }
+  if (!data || !data.rolesModifier) {
+    throw new Error(`Roles modifier ${address} not found on chain #${chainId}`)
+  }
+
+  return mapGraphQl(data.rolesModifier)
+}
+
+interface RoleSummary {
+  key: string
+  members: `0x${string}`[]
+  targets: `0x${string}`[]
+}
+
+interface RolesModifier {
+  address: `0x${string}`
+  owner: `0x${string}`
+  avatar: `0x${string}`
+  target: `0x${string}`
+  roles: RoleSummary[]
+}
+
+const mapGraphQl = (rolesModifier: any): RolesModifier => ({
+  ...rolesModifier,
+  roles: rolesModifier.roles.map(mapGraphQlRole),
+})
+
+const mapGraphQlRole = (role: any): RoleSummary => ({
+  key: role.key,
+  members: role.members.map((assignment: any) => assignment.member.address),
+  targets: role.targets.map((target: any): Target => target.address),
+})

packages/sdk/src/index.ts

@@ -3,6 +3,7 @@ export * from "./permissions"
 export { encodeCalls } from "./calls"
 
 export { fetchRole } from "./fetchRole"
+export { fetchRolesMod } from "./fetchRolesMod"
 export { diffTargets } from "./diffTargets"
 export { replaceTargets } from "./replaceTargets"
 export { extendTargets } from "./extendTargets"