From bc3b77a04dea2034fb70964754e678d19214a304 Mon Sep 17 00:00:00 2001
From: Ruslan <56787163+typicalHuman@users.noreply.github.com>
Date: Sun, 4 Feb 2024 11:18:11 +0600
Subject: [PATCH] example: add Filters & Logs Pending transactions example
(#1773)
---
examples/README.md | 4 ++--
.../logs_pending-transactions-logs/index.html | 12 ++++++++++
.../logs_pending-transactions-logs/index.ts | 24 +++++++++++++++++++
.../package.json | 15 ++++++++++++
.../tsconfig.json | 19 +++++++++++++++
5 files changed, 72 insertions(+), 2 deletions(-)
create mode 100644 examples/logs_pending-transactions-logs/index.html
create mode 100644 examples/logs_pending-transactions-logs/index.ts
create mode 100644 examples/logs_pending-transactions-logs/package.json
create mode 100644 examples/logs_pending-transactions-logs/tsconfig.json
diff --git a/examples/README.md b/examples/README.md
index 3c5a4b0e38..a892ec2d8b 100644
--- a/examples/README.md
+++ b/examples/README.md
@@ -29,8 +29,8 @@ The below list is not exhaustive, and is a work in progress. If you have an idea
- [x] ENS Name from Address
- [ ] Fetch ENS Resolver
- Filters & Logs
- - [ ] Blocks
- - [ ] Pending Transactions
+ - [x] Blocks
+ - [x] Pending Transactions
- [x] Events
- Anvil/Hardhat
- [ ] Impersonating Accounts
diff --git a/examples/logs_pending-transactions-logs/index.html b/examples/logs_pending-transactions-logs/index.html
new file mode 100644
index 0000000000..3518f18091
--- /dev/null
+++ b/examples/logs_pending-transactions-logs/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+ Pending Transactions Example
+ Loading...
+
+
+
diff --git a/examples/logs_pending-transactions-logs/index.ts b/examples/logs_pending-transactions-logs/index.ts
new file mode 100644
index 0000000000..cc33dc0e86
--- /dev/null
+++ b/examples/logs_pending-transactions-logs/index.ts
@@ -0,0 +1,24 @@
+import { http, createPublicClient } from "viem";
+import { sepolia } from "viem/chains";
+
+const client = createPublicClient({
+ chain: sepolia,
+ transport: http(),
+});
+
+const el = document.getElementById("app");
+
+// Polling frequency (in ms)
+const pollingInterval = 1000;
+
+client.watchPendingTransactions({
+ poll: true,
+ pollingInterval,
+ onTransactions: (hashes) => {
+ for (let i = 0; i < hashes.length; i++) {
+ let newElement = document.createElement("p");
+ newElement.textContent = hashes[i];
+ el!.appendChild(newElement);
+ }
+ },
+});
diff --git a/examples/logs_pending-transactions-logs/package.json b/examples/logs_pending-transactions-logs/package.json
new file mode 100644
index 0000000000..95c456eb72
--- /dev/null
+++ b/examples/logs_pending-transactions-logs/package.json
@@ -0,0 +1,15 @@
+{
+ "name": "example-pending-transactions-logs",
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "dev": "vite"
+ },
+ "dependencies": {
+ "viem": "latest"
+ },
+ "devDependencies": {
+ "typescript": "^5.0.3",
+ "vite": "^4.4.2"
+ }
+}
diff --git a/examples/logs_pending-transactions-logs/tsconfig.json b/examples/logs_pending-transactions-logs/tsconfig.json
new file mode 100644
index 0000000000..eac16d14a6
--- /dev/null
+++ b/examples/logs_pending-transactions-logs/tsconfig.json
@@ -0,0 +1,19 @@
+{
+ "compilerOptions": {
+ "target": "ESNext",
+ "useDefineForClassFields": true,
+ "module": "ESNext",
+ "lib": ["ESNext", "DOM"],
+ "moduleResolution": "Node",
+ "strict": true,
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "esModuleInterop": true,
+ "noEmit": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "noImplicitReturns": true,
+ "skipLibCheck": true
+ },
+ "include": ["src"]
+}