logos-messaging/logos-messaging-frontend
1
0
Fork 0
mirror of https://github.com/logos-messaging/logos-messaging-frontend.git synced 2026-01-04 06:43:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

remove unsubscribe, fix problem with message rendering

Browse Source
This commit is contained in:
Sasha 2023-11-30 22:47:40 +01:00
parent daca898ba9
commit f0d5ce34fa
No known key found for this signature in database
7 changed files with 71 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
package-lock.json generated
View File

@ -8,7 +8,7 @@
"name": "rln-js", "name": "rln-js",
"version": "0.1.0", "version": "0.1.0",
"dependencies": { "dependencies": {
"@waku/rln": "0.1.1-7e8cb89", "@waku/rln": "0.1.1-60a5070",
"@waku/utils": "^0.0.12", "@waku/utils": "^0.0.12",
"ethers": "^5.7.2", "ethers": "^5.7.2",
"next": "13.5.6", "next": "13.5.6",
@ -1424,13 +1424,13 @@
"dev": true "dev": true
}, },
"node_modules/@waku/rln": { "node_modules/@waku/rln": {
"version": "0.1.1-7e8cb89", "version": "0.1.1-60a5070",
"resolved": "https://registry.npmjs.org/@waku/rln/-/rln-0.1.1-7e8cb89.tgz", "resolved": "https://registry.npmjs.org/@waku/rln/-/rln-0.1.1-60a5070.tgz",
"integrity": "sha512-ToHwjodXoc1BrllRkIqC8/D73LqMlL4AHRdaSk4ttXjzdlqELdZYaJEwMtEBlupydNPf813RZ6V6hVuE6ttbTg==", "integrity": "sha512-c3rXqzuTTQVIn2l4gZKDG+/2UY2yb0XbumyrsuvX9fQhQxopCAsSi16CYePdG5HCpImXPNJEC3C3JakuiA3v9A==",
"dependencies": { "dependencies": {
"@chainsafe/bls-keystore": "^3.0.0", "@chainsafe/bls-keystore": "^3.0.0",
"@waku/utils": "^0.0.12", "@waku/utils": "^0.0.13",
"@waku/zerokit-rln-wasm": "^0.0.10", "@waku/zerokit-rln-wasm": "^0.0.13",
"ethereum-cryptography": "^2.1.2", "ethereum-cryptography": "^2.1.2",
"ethers": "^5.7.2", "ethers": "^5.7.2",
"lodash": "^4.17.21", "lodash": "^4.17.21",
@ -1441,6 +1441,19 @@
"node": ">=18" "node": ">=18"
} }
}, },
"node_modules/@waku/rln/node_modules/@waku/utils": {
"version": "0.0.13",
"resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.13.tgz",
"integrity": "sha512-sGZRJyYr7+QZpV2tlGJF48gKmwNdFha6rPKPgXiKDsz2YMhPlg70ffbGcND3bEfOwWmX4g/x5i3Oqwwl+HzwJw==",
"dependencies": {
"chai": "^4.3.8",
"debug": "^4.3.4",
"uint8arrays": "^4.0.4"
},
"engines": {
"node": ">=18"
}
},
"node_modules/@waku/utils": { "node_modules/@waku/utils": {
"version": "0.0.12", "version": "0.0.12",
"resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.12.tgz", "resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.12.tgz",
@ -1455,9 +1468,9 @@
} }
}, },
"node_modules/@waku/zerokit-rln-wasm": { "node_modules/@waku/zerokit-rln-wasm": {
"version": "0.0.10", "version": "0.0.13",
"resolved": "https://registry.npmjs.org/@waku/zerokit-rln-wasm/-/zerokit-rln-wasm-0.0.10.tgz", "resolved": "https://registry.npmjs.org/@waku/zerokit-rln-wasm/-/zerokit-rln-wasm-0.0.13.tgz",
"integrity": "sha512-qegIK1P54mxEp59uTa8C0/zidUffLc2Iee61yiKRIuGJDui2mQ+0V+KzPSPImKpIoqfVLT192EqgZkqPmj8VEw==" "integrity": "sha512-x7CRIIslmfCmTZc7yVp3dhLlKeLUs8ILIm9kv7+wVJ23H4pPw0Z+uH0ueLIYYfwODI6fDiwJj3S1vdFzM8D1zA=="
}, },
"node_modules/@zeit/schemas": { "node_modules/@zeit/schemas": {
"version": "2.29.0", "version": "2.29.0",
@ -7796,18 +7809,30 @@
"dev": true "dev": true
}, },
"@waku/rln": { "@waku/rln": {
"version": "0.1.1-7e8cb89", "version": "0.1.1-60a5070",
"resolved": "https://registry.npmjs.org/@waku/rln/-/rln-0.1.1-7e8cb89.tgz", "resolved": "https://registry.npmjs.org/@waku/rln/-/rln-0.1.1-60a5070.tgz",
"integrity": "sha512-ToHwjodXoc1BrllRkIqC8/D73LqMlL4AHRdaSk4ttXjzdlqELdZYaJEwMtEBlupydNPf813RZ6V6hVuE6ttbTg==", "integrity": "sha512-c3rXqzuTTQVIn2l4gZKDG+/2UY2yb0XbumyrsuvX9fQhQxopCAsSi16CYePdG5HCpImXPNJEC3C3JakuiA3v9A==",
"requires": { "requires": {
"@chainsafe/bls-keystore": "^3.0.0", "@chainsafe/bls-keystore": "^3.0.0",
"@waku/utils": "^0.0.12", "@waku/utils": "^0.0.13",
"@waku/zerokit-rln-wasm": "^0.0.10", "@waku/zerokit-rln-wasm": "^0.0.13",
"ethereum-cryptography": "^2.1.2", "ethereum-cryptography": "^2.1.2",
"ethers": "^5.7.2", "ethers": "^5.7.2",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"rlnjs": "^3.2.3", "rlnjs": "^3.2.3",
"uuid": "^9.0.1" "uuid": "^9.0.1"
},
"dependencies": {
"@waku/utils": {
"version": "0.0.13",
"resolved": "https://registry.npmjs.org/@waku/utils/-/utils-0.0.13.tgz",
"integrity": "sha512-sGZRJyYr7+QZpV2tlGJF48gKmwNdFha6rPKPgXiKDsz2YMhPlg70ffbGcND3bEfOwWmX4g/x5i3Oqwwl+HzwJw==",
"requires": {
"chai": "^4.3.8",
"debug": "^4.3.4",
"uint8arrays": "^4.0.4"
}
}
} }
}, },
"@waku/utils": { "@waku/utils": {
@ -7821,9 +7846,9 @@
} }
}, },
"@waku/zerokit-rln-wasm": { "@waku/zerokit-rln-wasm": {
"version": "0.0.10", "version": "0.0.13",
"resolved": "https://registry.npmjs.org/@waku/zerokit-rln-wasm/-/zerokit-rln-wasm-0.0.10.tgz", "resolved": "https://registry.npmjs.org/@waku/zerokit-rln-wasm/-/zerokit-rln-wasm-0.0.13.tgz",
"integrity": "sha512-qegIK1P54mxEp59uTa8C0/zidUffLc2Iee61yiKRIuGJDui2mQ+0V+KzPSPImKpIoqfVLT192EqgZkqPmj8VEw==" "integrity": "sha512-x7CRIIslmfCmTZc7yVp3dhLlKeLUs8ILIm9kv7+wVJ23H4pPw0Z+uH0ueLIYYfwODI6fDiwJj3S1vdFzM8D1zA=="
}, },
"@zeit/schemas": { "@zeit/schemas": {
"version": "2.29.0", "version": "2.29.0",

2
package.json
View File

@ -9,7 +9,7 @@
"lint": "next lint" "lint": "next lint"
}, },
"dependencies": { "dependencies": {
"@waku/rln": "0.1.1-7e8cb89", "@waku/rln": "0.1.1-60a5070",
"@waku/utils": "^0.0.12", "@waku/utils": "^0.0.12",
"ethers": "^5.7.2", "ethers": "^5.7.2",
"next": "13.5.6", "next": "13.5.6",

4
src/app/home/components/Waku.tsx
View File

@ -103,11 +103,11 @@ function useMessage() {
function renderMessage(content: MessageContent) { function renderMessage(content: MessageContent) {
return ( return (
<li key={`${content.nick}-${content.time}`} className="mb-4"> <li key={`${content.nick}-${content.timestamp}-${content.text}`} className="mb-4">
<p> <p>
<span className="text-lg">{content.nick}</span> <span className="text-lg">{content.nick}</span>
<span className="text-sm font-bold"> <span className="text-sm font-bold">
({content.time}) ({(new Date(content.timestamp)).toString()})
</span> </span>
: :
</p> </p>

37
src/hooks/useWaku.ts
View File

@ -9,23 +9,25 @@ export type MessageContent = {
}; };
export const useWaku = () => { export const useWaku = () => {
const [messages, setMessages] = React.useState<MessageContent[]>([]); const [messages, setMessages] = React.useState<Map<string, MessageContent>>(new Map());
React.useEffect(() => { React.useEffect(() => {
const messageListener = (event: CustomEvent) => { const messageListener = (event: CustomEvent) => {
const messages: Message[] = event.detail; const nextMessages = new Map(messages);
const parsedMessaged = messages.map((message) => { const newMessages: Message[] = event.detail;
const time = new Date(message.timestamp);
const payload = JSON.parse(atob(message.payload));
return { newMessages.forEach((m) => {
const payload = JSON.parse(atob(m.payload));
const message = {
nick: payload?.nick || "unknown", nick: payload?.nick || "unknown",
text: payload?.text || "empty", text: payload?.text || "empty",
time: time.toDateString(), timestamp: m.timestamp || Date.now(),
}; };
nextMessages.set(`${message.nick}-${message.timestamp}-${message.text}`, message);
}); });
setMessages((prev) => [...prev, ...parsedMessaged]); setMessages(nextMessages);
}; };
waku.relay.addEventListener(CONTENT_TOPIC, messageListener); waku.relay.addEventListener(CONTENT_TOPIC, messageListener);
@ -33,23 +35,32 @@ export const useWaku = () => {
return () => { return () => {
waku.relay.removeEventListener(CONTENT_TOPIC, messageListener); waku.relay.removeEventListener(CONTENT_TOPIC, messageListener);
}; };
}, [setMessages]); }, [messages, setMessages]);
const onSend = React.useCallback( const onSend = React.useCallback(
async (nick: string, text: string) => { async (nick: string, text: string) => {
const timestamp = Date.now();
await waku.relay.send({ await waku.relay.send({
version: 0, version: 0,
timestamp: Date.now(), timestamp,
contentTopic: CONTENT_TOPIC, contentTopic: CONTENT_TOPIC,
payload: btoa(JSON.stringify({ payload: btoa(JSON.stringify({
nick, nick,
text text
})), })),
}); });
const id = `${nick}-${timestamp}-${text}`;
setMessages((prev) => {
if (prev.has(id)) {
return prev;
}
const next = new Map(prev);
next.set(id, { nick, timestamp, text });
return next;
});
}, },
[] [setMessages]
); );
return { onSend, messages }; return { onSend, messages: Array.from(messages.values()) };
}; };

2
src/services/rln.ts
View File

@ -109,7 +109,7 @@ export class RLN implements IRLN {
private initKeystore(): Keystore { private initKeystore(): Keystore {
const localKeystoreString = localStorage.getItem("keystore"); const localKeystoreString = localStorage.getItem("keystore");
try { try {
return Keystore.fromString(localKeystoreString || ""); return Keystore.fromString(localKeystoreString || "");
} catch(error) { } catch(error) {

3
src/services/waku.ts
View File

@ -32,7 +32,6 @@ class Relay {
} }
public removeEventListener(contentTopic: string, fn: EventListener) { public removeEventListener(contentTopic: string, fn: EventListener) {
this.handleUnsubscribed(contentTopic);
return this.subscriptionsEmitter.removeEventListener( return this.subscriptionsEmitter.removeEventListener(
contentTopic, contentTopic,
fn as any fn as any
@ -53,7 +52,7 @@ class Relay {
this.subscriptionRoutine = window.setInterval(async () => { this.subscriptionRoutine = window.setInterval(async () => {
await this.fetchMessages(); await this.fetchMessages();
}, 10 * SECOND); }, SECOND);
this.contentTopicListeners.set(contentTopic, 1); this.contentTopicListeners.set(contentTopic, 1);
} catch (error) { } catch (error) {

3
src/utils/http.ts
View File

@ -2,7 +2,6 @@ export const http = {
post(url: string, body: any) { post(url: string, body: any) {
return fetch(new URL(url), { return fetch(new URL(url), {
method: "POST", method: "POST",
mode: "no-cors",
referrerPolicy: "no-referrer", referrerPolicy: "no-referrer",
headers: { headers: {
'Content-Type': 'text/plain', 'Content-Type': 'text/plain',
@ -13,8 +12,6 @@ export const http = {
delete(url: string, body: any) { delete(url: string, body: any) {
return fetch(new URL(url), { return fetch(new URL(url), {
method: "DELETE", method: "DELETE",
mode: "no-cors",
referrerPolicy: "no-referrer",
headers: { headers: {
'Content-Type': 'text/plain', 'Content-Type': 'text/plain',
}, },