update to latest @waku/rln

This commit is contained in:
Sasha 2024-02-14 00:45:17 +01:00
parent ee12ca859e
commit 4406f8560b
No known key found for this signature in database
7 changed files with 962 additions and 1044 deletions

View File

@ -110,14 +110,17 @@
.pairingInfo button {
flex-grow: 1;
cursor: pointer;
padding: 10px;
}
.pairingInfo button + button {
margin-left: 5px;
}
button {
cursor: pointer;
padding: 10px;
}
.chatArea {
}
@ -141,6 +144,15 @@
padding: 5px;
margin-bottom: 10px;
}
.mb-1 {
margin-bottom: 1rem;
}
.status {
display: flex;
justify-content: space-between;
}
</style>
</head>
<body>
@ -150,6 +162,7 @@
<b>Status:</b>
<span id="status" class="progress">Starting...</span>
</h3>
<button id="connect" class="mb-1">Connect wallet</button>
</div>
<div class="chatArea" id="chat-area" style="display: none">

File diff suppressed because it is too large Load Diff

View File

@ -7,7 +7,7 @@
"start": "webpack-dev-server"
},
"dependencies": {
"@waku/rln": "0.1.1-77ba0a6",
"@waku/rln": "0.1.2-e1679b6",
"@waku/sdk": "^0.0.21",
"@waku/utils": "^0.0.14",
"multiaddr": "^10.0.1",

View File

@ -3,15 +3,14 @@ import { initRLN } from "./rln";
import { initWaku } from "./waku";
async function run() {
const { onLoaded, onStatusChange, registerEvents } = initUI();
const { onStatusChange, registerEvents } = initUI();
const { rln, connectWallet } = await initRLN(onStatusChange);
const { onSend, onSubscribe } = await initWaku({
const { onSend, onSubscribe, onInitWaku } = await initWaku({
rln,
onStatusChange,
});
onLoaded();
registerEvents({ onSend, onSubscribe, connectWallet });
registerEvents({ onSend, onSubscribe, connectWallet, onInitWaku });
}
run();

View File

@ -1,7 +1,5 @@
import { createRLN, extractMetaMaskSigner } from "@waku/rln";
import { KEYSTORE, MEMBERSHIP_HASH, MEMBERSHIP_PASSWORD } from "./const";
export async function initRLN(onStatusChange) {
onStatusChange("Initializing RLN...");
@ -27,14 +25,7 @@ export async function initRLN(onStatusChange) {
try {
onStatusChange("Connecting to Ethereum...");
await rln.start({
signer,
credentials: {
keystore: KEYSTORE,
id: MEMBERSHIP_HASH,
password: MEMBERSHIP_PASSWORD,
},
});
await rln.start({ signer });
} catch (err) {
onStatusChange(`Failed to connect to Ethereum: ${err}`, "error");
throw Error(err);

View File

@ -6,6 +6,8 @@ const nickInput = document.getElementById("nick");
const textInput = document.getElementById("text");
const sendButton = document.getElementById("send");
const connectWalletButton = document.getElementById("connect");
export const initUI = () => {
const onStatusChange = (newStatus, className) => {
status.innerText = newStatus;
@ -27,26 +29,32 @@ export const initUI = () => {
};
const registerEvents = (events) => {
events.onSubscribe((nick, text, time, validation) => {
_renderMessage(nick, text, time, validation);
});
connectWalletButton.addEventListener("click", async () => {
await events.connectWallet();
await events.onInitWaku();
sendButton.addEventListener("click", async () => {
const nick = nickInput.value;
const text = textInput.value;
onLoaded();
if (!nick || !text) {
console.log("Not sending message: missing nick or text.");
return;
}
await events.onSend(nick, text);
textInput.value = "";
events.onSubscribe((nick, text, time, validation) => {
_renderMessage(nick, text, time, validation);
});
sendButton.addEventListener("click", async () => {
const nick = nickInput.value;
const text = textInput.value;
if (!nick || !text) {
console.log("Not sending message: missing nick or text.");
return;
}
await events.onSend(nick, text);
textInput.value = "";
});
});
};
return {
onLoaded,
registerEvents,
onStatusChange,
};

View File

@ -1,21 +1,39 @@
import { createLightNode, waitForRemotePeer } from "@waku/sdk";
import { ProtoChatMessage, CONTENT_TOPIC } from "./const";
import {
ProtoChatMessage,
CONTENT_TOPIC,
KEYSTORE,
MEMBERSHIP_HASH,
MEMBERSHIP_PASSWORD,
} from "./const";
export async function initWaku({ rln, onStatusChange }) {
const encoder = rln.createEncoder({
ephemeral: false,
contentTopic: CONTENT_TOPIC,
});
const decoder = rln.createDecoder(CONTENT_TOPIC);
let node;
let encoder, decoder;
let subscription;
onStatusChange("Initializing Waku...");
const node = await createLightNode({
defaultBootstrap: true,
});
onStatusChange("Waiting for peers");
await node.start();
await waitForRemotePeer(node);
const onInitWaku = async () => {
encoder = await rln.createEncoder({
ephemeral: false,
contentTopic: CONTENT_TOPIC,
credentials: {
keystore: KEYSTORE,
id: MEMBERSHIP_HASH,
password: MEMBERSHIP_PASSWORD,
},
});
decoder = rln.createDecoder(CONTENT_TOPIC);
onStatusChange("Initializing Waku...");
node = await createLightNode({
pubsubTopics: ["/waku/2/default-waku/proto"],
defaultBootstrap: true,
});
onStatusChange("Waiting for peers");
await node.start();
await waitForRemotePeer(node);
};
const onSend = async (nick, text) => {
const timestamp = new Date();
@ -31,9 +49,10 @@ export async function initWaku({ rln, onStatusChange }) {
console.log("Message sent:", res);
};
onStatusChange("Subscribing to content topic...");
const subscription = await node.filter.createSubscription();
const onSubscribe = async (cb) => {
onStatusChange("Subscribing to content topic...");
subscription = await node.filter.createSubscription();
await subscription.subscribe(decoder, (message) => {
try {
const { timestamp, nick, text } = ProtoChatMessage.decode(
@ -66,12 +85,13 @@ export async function initWaku({ rln, onStatusChange }) {
console.error("Failed in subscription listener: ", error);
}
});
};
onStatusChange("Waku initialized", "success");
onStatusChange("Waku initialized", "success");
};
return {
onSend,
onSubscribe,
onInitWaku,
};
}