add cicles template

Author: ci-bot

apps/remix-ide/src/app/plugins/templates-selection/templates.ts

@@ -406,6 +406,12 @@ export const templates = (intl: any, plugin: any): TemplateGroup[] => {
         },
       ],
     },
+    {
+      name: "About Circles",
+      items: [
+        { value: "circles", tagList: [], displayName: 'About Circles', description: 'Templates for interacting with the Cicles Sdk' }
+      ]
+    },
     {
       name: 'GitHub Actions',
       items: [

libs/remix-ui/workspace/src/lib/utils/constants.ts

@@ -20,6 +20,7 @@ export const TEMPLATE_NAMES = {
   'uniswapV4HookBookMultiSigSwapHook': 'Uniswap V4 HookBook MultiSigSwapHook',
   'accountAbstraction': 'Account Abstraction Template',
   'introToEIP7702': 'Intro to EIP-7702',
+  'circles': 'About Circles'
 }
 
 export const TEMPLATE_METADATA: Record<string, TemplateType> = {

libs/remix-ws-templates/src/index.ts

@@ -13,6 +13,7 @@ export { default as hashchecker } from './templates/hashchecker'
 export { default as rln } from './templates/rln'
 export { default as multNr } from './templates/multiplierNoir'
 export { default as stealthDropNr } from './templates/stealthdropNoir'
+export { default as circles } from './templates/circles'
 
 export { contractDeployerScripts } from './script-templates/contract-deployer'
 export { etherscanScripts } from './script-templates/etherscan'

libs/remix-ws-templates/src/templates/circles/.prettierrc

@@ -0,0 +1,44 @@
+{
+    "overrides": [
+        {
+            "files": "*.sol",
+            "options": {
+                "printWidth": 80,
+                "tabWidth": 4,
+                "useTabs": false,
+                "singleQuote": false,
+                "bracketSpacing": false
+            }
+        },
+        {
+            "files": "*.yml",
+            "options": {
+            }
+        },
+        {
+            "files": "*.yaml",
+            "options": {
+            }
+        },
+        {
+            "files": "*.toml",
+            "options": {
+            }
+        },
+        {
+            "files": "*.json",
+            "options": {
+            }
+        },
+        {
+            "files": "*.js",
+            "options": {
+            }
+        },
+        {
+            "files": "*.ts",
+            "options": {
+            }
+        }
+    ]
+}

libs/remix-ws-templates/src/templates/circles/README.md

@@ -0,0 +1,40 @@
+
+### Circles
+
+This template introduces the usage of the Circles sdk.
+
+## create-group.ts
+
+This script creates a new group on the Circles platform using the Circles SDK. It initializes the SDK with a BrowserProviderContractRunner,
+defines the group profile, sets up the base group options, creates the group profile CID, creates the base group,
+waits for transaction confirmation, extracts the group address from the transaction receipt, and retrieves the group's avatar.
+
+## group-creation-tx.ts
+
+This script retrieves and logs information about a group created on the Circles platform using the Circles SDK.
+It initializes the SDK with a BrowserProviderContractRunner, fetches a transaction receipt,
+extracts the group address from the transaction logs, and then retrieves and logs the group's avatar
+and its trust relations.
+
+## invite-to-group.ts
+
+This script invites a user to a group on the Circles platform using the Circles SDK. It initializes the SDK with a BrowserProviderContractRunner,
+fetches a transaction receipt, extracts the group address from the transaction logs, retrieves the group's avatar,
+and then checks if the user is already trusted by the group and trusts the user.
+
+## pathfinder.ts
+
+This script finds a path between two addresses on the Circles platform using the CirclesRpc. It initializes the CirclesRpc with the provided URL,
+and then calls the 'circlesV2_findPath' method with the source address, target address, and value.
+
+## set-owner.ts
+
+This script sets the owner of a group on the Circles platform using the Circles SDK. It initializes the SDK with a BrowserProviderContractRunner,
+fetches a transaction receipt, extracts the group address from the transaction logs, retrieves the group's avatar,
+and then sets the owner of the group.
+
+## user.ts
+
+This script retrieves and logs information about a user's avatar on the Circles platform using the Circles SDK.
+It initializes the SDK with a BrowserProviderContractRunner, retrieves the avatar information,
+and then logs the mintable amount and the avatar information.

libs/remix-ws-templates/src/templates/circles/index.ts

@@ -0,0 +1,20 @@
+export default async () => {
+  return {
+    // @ts-ignore
+    'scripts/group-creation-tx.ts': (await import('!!raw-loader!./scripts/group-creation-tx.ts')).default,
+    // @ts-ignore
+    'scripts/create-group.ts': (await import('!!raw-loader!./scripts/create-group.ts')).default,
+    // @ts-ignore
+    'scripts/invite-to-group.ts': (await import('!!raw-loader!./scripts/invite-to-group.ts')).default,
+    // @ts-ignore
+    'scripts/pathfinder.ts': (await import('!!raw-loader!./scripts/pathfinder.ts')).default,
+    // @ts-ignore
+    'scripts/set-owner.ts': (await import('!!raw-loader!./scripts/set-owner.ts')).default,
+    // @ts-ignore
+    'scripts/user.ts': (await import('!!raw-loader!./scripts/user.ts')).default,
+    // @ts-ignore
+    '.prettierrc.json': (await import('raw-loader!./.prettierrc')).default,
+    // @ts-ignore
+    'README.md': (await import('raw-loader!./README.md')).default
+  }
+}

libs/remix-ws-templates/src/templates/circles/scripts/create-group.ts

@@ -0,0 +1,62 @@
+import { Sdk } from '@circles-sdk/sdk'
+import { BrowserProviderContractRunner } from "@circles-sdk/adapter-ethers"
+import { cidV0ToUint8Array } from '@circles-sdk/utils'
+import { ethers } from 'ethers'
+
+(window as any).ethereum = web3Provider
+
+const run = async () => {
+    // Initialize the SDK
+    const adapter = new BrowserProviderContractRunner();
+    await adapter.init();
+    const sdk = new Sdk(adapter)
+    const sender = await (new ethers.BrowserProvider(web3Provider)).getSigner()
+
+    // Define the group profile (symbol is required)
+    const groupProfile = {
+        name: '',
+        symbol: '',
+        description: '',
+        imageUrl: '', // optional, can be uploaded via SDK
+        previewImageUrl: '', // optional, used for previews
+    }
+
+    // Define base group setup options    
+    const circlesGroupOwner = ''
+    const groupOwner = circlesGroupOwner
+    const serviceAddress = sender.address // Replace with actual service address
+    const feeCollection = circlesGroupOwner // Replace with actual treasury address
+    const initialConditions = []
+
+    // Step 1: Create the group profile (CID will be returned)
+    const profileCID = await sdk.profiles.create(groupProfile)
+    if (!profileCID) throw new Error('Failed to create profile CID')
+
+    // Step 2: Create the base group using the factory
+    console.log('group owner will be', sender)
+    const tx = await sdk.baseGroupFactory.createBaseGroup(
+        groupOwner, // Usually wallet address of the sender
+        serviceAddress,
+        feeCollection,
+        initialConditions,
+        groupProfile.name,
+        groupProfile.symbol,
+        cidV0ToUint8Array(profileCID), // Convert CID to bytes
+    )
+
+    // Wait for transaction confirmation
+    const receipt = await tx.wait()
+
+    console.log('receipt', receipt)
+
+    // Step 3: Extract the group address from emitted events
+    const groupAddress = ethers.stripZerosLeft(receipt.logs[15].topics[1])
+
+    // Step 4: Get the avatar for the created group
+    const baseGroupAvatar = await sdk.getAvatar(groupAddress.toLowerCase())
+
+    console.log('Base group created at:', groupAddress)
+    console.log('Group avatar:', baseGroupAvatar)
+}
+
+run().catch(console.error).then(console.log)

libs/remix-ws-templates/src/templates/circles/scripts/group-creation-tx.ts

@@ -0,0 +1,25 @@
+import { ethers } from 'ethers'
+import { Sdk } from '@circles-sdk/sdk'
+import { BrowserProviderContractRunner } from "@circles-sdk/adapter-ethers"
+
+const run = async () => {
+    // Initialize the SDK
+    const adapter = new BrowserProviderContractRunner();
+    await adapter.init();
+    const sdk = new Sdk(adapter)
+
+    const txHash = '' // transaction which registered the group.
+
+    const provider = new ethers.BrowserProvider(web3Provider)
+    const receipt = await provider.getTransactionReceipt(txHash)
+    const groupAddress = ethers.stripZerosLeft(receipt.logs[15].topics[1])
+
+    console.log('group address', groupAddress)
+    const baseGroupAvatar = await sdk.getAvatar(groupAddress.toLowerCase())
+    
+    console.log('group avatar', baseGroupAvatar)
+    console.log('owner is', await baseGroupAvatar.owner())
+    console.log('trust relations are', await baseGroupAvatar.getTrustRelations())
+}
+
+run().then(console.log).catch(console.error)

libs/remix-ws-templates/src/templates/circles/scripts/invite-to-group.ts

@@ -0,0 +1,33 @@
+import { ethers } from 'ethers'
+import { Sdk } from '@circles-sdk/sdk'
+import { BrowserProviderContractRunner } from "@circles-sdk/adapter-ethers"
+
+(window as any).ethereum = web3Provider
+
+const run = async () => {
+    // Initialize the SDK
+    const adapter = new BrowserProviderContractRunner();
+    await adapter.init();
+    const sdk = new Sdk(adapter)
+
+    const user = ''
+    const txHash = '' // transaction which registered the group.
+    
+    const provider = new ethers.BrowserProvider(web3Provider)
+    const receipt = await provider.getTransactionReceipt(txHash)
+    const groupAddress = ethers.stripZerosLeft(receipt.logs[15].topics[1])
+
+    console.log('group address', groupAddress)
+    const baseGroupAvatar = await sdk.getAvatar(groupAddress.toLowerCase())
+    
+    console.log('group avatar', baseGroupAvatar)
+
+    console.log('owner', await baseGroupAvatar.owner())
+    console.log('service', await baseGroupAvatar.service())
+    
+    console.log(await baseGroupAvatar.isTrustedBy(user))
+
+    console.log(await baseGroupAvatar.trust(user))
+}
+
+run().then(console.log).catch(console.error)

libs/remix-ws-templates/src/templates/circles/scripts/pathfinder.ts

@@ -0,0 +1,32 @@
+import { CirclesRpc } from '@circles-sdk/data';
+
+(window as any).ethereum = web3Provider
+
+const chainConfig = {
+  pathfinderUrl: 'https://pathfinder.aboutcircles.com',
+  circlesRpcUrl: 'https://rpc.aboutcircles.com',
+  v1HubAddress: '0xdbf22d4e8962db3b2f1d9ff55be728a887e47710',
+  v2HubAddress: '0x2066CDA98F98397185483aaB26A89445addD6740',
+  migrationAddress: '0x2A545B54bb456A0189EbC53ed7090BfFc4a6Af94'
+};
+
+const sourceAddress = ''
+const targetAddress = ''
+const value = '1000000000000000000'
+/*
+{"jsonrpc":"2.0","id":0,"method":"circlesV2_findPath","params":[{"Source":"0xf7f307601497eAD8217543Fc9B350Ae6DA5fB5eF","Sink":"0x3765c1633eA9dDaD819B1b7d9A27B1E117f789a2","TargetFlow":"1000000000000000000"}]}
+*/
+const run = async () => {
+    try {
+        const res = await new CirclesRpc(chainConfig.circlesRpcUrl).call<any>('circlesV2_findPath', [{
+            Source: sourceAddress,
+            Sink: targetAddress,
+            TargetFlow: value
+        }])
+        console.log(res.result)
+    } catch (e) {
+        console.error(e)
+    }    
+}
+
+run().catch(console.error).then(console.log)