Send all chat messages with new payload
This commit is contained in:
@@ -7,12 +7,12 @@ import { NymMixnetClient } from '@nymproject/sdk';
|
||||
*
|
||||
* @param {Client} nymClient the nym client to use for message sending
|
||||
*/
|
||||
export async function sendMessageTo(client: NymMixnetClient) {
|
||||
const message = (document.getElementById('message') as HTMLFormElement).value;
|
||||
export async function sendMessageTo(nym: NymMixnetClient) {
|
||||
const payload = (document.getElementById('message') as HTMLFormElement).value;
|
||||
const recipient = (document.getElementById('recipient') as HTMLFormElement).value;
|
||||
|
||||
await client.client.sendMessage({ message, recipient });
|
||||
displaySend(message);
|
||||
await nym.client.sendMessage({ payload, recipient });
|
||||
displaySend(payload);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -31,7 +31,7 @@ async function main() {
|
||||
|
||||
// subscribe to message received events and show any string messages received
|
||||
nym.events.subscribeToTextMessageReceivedEvent((e) => {
|
||||
displayReceived(e.args.message);
|
||||
displayReceived(e.args.payload);
|
||||
});
|
||||
|
||||
const sendButton: HTMLButtonElement = document.querySelector('#send-button') as HTMLButtonElement;
|
||||
|
||||
@@ -80,7 +80,7 @@ export const Content: React.FC = () => {
|
||||
log.current.push({
|
||||
kind: 'rx',
|
||||
timestamp: new Date(),
|
||||
message: e.args.message,
|
||||
message: e.args.payload,
|
||||
});
|
||||
setLogTrigger(Date.now());
|
||||
});
|
||||
@@ -109,7 +109,7 @@ export const Content: React.FC = () => {
|
||||
message,
|
||||
});
|
||||
setLogTrigger(Date.now());
|
||||
await sendTextMessage({ message, recipient });
|
||||
await sendTextMessage({ payload: message, recipient });
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -9,7 +9,7 @@ interface State {
|
||||
|
||||
// methods
|
||||
connect: (config: NymClientConfig) => Promise<void>;
|
||||
sendTextMessage: (args: { message: string; recipient: string }) => Promise<void>;
|
||||
sendTextMessage: (args: { payload: string; recipient: string }) => Promise<void>;
|
||||
}
|
||||
|
||||
const MixnetContext = React.createContext<State | undefined>(undefined);
|
||||
@@ -53,7 +53,7 @@ export const MixnetContextProvider: React.FC = ({ children }) => {
|
||||
await nym.current.client.start(config);
|
||||
};
|
||||
|
||||
const sendTextMessage = async (args: { message: string; recipient: string }) => {
|
||||
const sendTextMessage = async (args: { payload: string; recipient: string }) => {
|
||||
if (!nym.current?.client) {
|
||||
console.error('Nym client has not initialised. Please wrap in useEffect on `isReady` prop of this context.');
|
||||
return;
|
||||
|
||||
@@ -22,7 +22,12 @@
|
||||
"typecheck": "tsc --noEmit true",
|
||||
"lint": "eslint src",
|
||||
"lint:fix": "eslint src --fix",
|
||||
"build:dependencies": "run-s build:dependencies:nym-client-wasm build:dependencies:ts-packages",
|
||||
"build:dependencies:ts-packages": "cd ../../../.. && yarn && yarn build",
|
||||
"build:dependencies:nym-client-wasm": "../nym-client-wasm/scripts/build.sh",
|
||||
"prebuild": "yarn build:dependencies",
|
||||
"build": "tsc",
|
||||
"build:only-this": "tsc",
|
||||
"postbuild": "cp ../nym-client-wasm/nym_client_wasm* dist/mixnet/wasm"
|
||||
},
|
||||
"dependencies": {
|
||||
|
||||
@@ -6,7 +6,7 @@ import {
|
||||
IWebWorkerEvents,
|
||||
ConnectedEvent,
|
||||
LoadedEvent,
|
||||
TextMessageReceivedEvent,
|
||||
StringMessageReceivedEvent,
|
||||
BinaryMessageReceivedEvent,
|
||||
} from './types';
|
||||
|
||||
@@ -73,9 +73,9 @@ export const createNymMixnetClient = async (): Promise<NymMixnetClient> => {
|
||||
};
|
||||
},
|
||||
subscribeToTextMessageReceivedEvent: (handler) => {
|
||||
getSubscriptions<TextMessageReceivedEvent>(EventKinds.TextMessageReceived).push(handler);
|
||||
getSubscriptions<StringMessageReceivedEvent>(EventKinds.StringMessageReceived).push(handler);
|
||||
return () => {
|
||||
getSubscriptions<TextMessageReceivedEvent>(EventKinds.TextMessageReceived).unshift(handler);
|
||||
getSubscriptions<StringMessageReceivedEvent>(EventKinds.StringMessageReceived).unshift(handler);
|
||||
};
|
||||
},
|
||||
subscribeToBinaryMessageReceivedEvent: (handler) => {
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
/// <reference path="../../../../nym-client-wasm/nym_client_wasm.d.ts" />
|
||||
|
||||
export type OnMessageFn = (message: string) => void;
|
||||
export type OnStringMessageFn = (message: string) => void;
|
||||
|
||||
export type OnBinaryMessageFn = (message: Uint8Array) => void;
|
||||
|
||||
export type OnConnectFn = (address?: string) => void;
|
||||
|
||||
@@ -35,14 +37,14 @@ export interface NymClientConfig {
|
||||
export interface IWebWorker {
|
||||
start: (config: NymClientConfig) => void;
|
||||
selfAddress: () => string | undefined;
|
||||
sendMessage: (args: { message: string; recipient: string }) => void;
|
||||
sendBinaryMessage: (args: { message: Uint8Array; recipient: string }) => void;
|
||||
sendMessage: (args: { payload: string; recipient: string }) => void;
|
||||
sendBinaryMessage: (args: { payload: Uint8Array; recipient: string }) => void;
|
||||
}
|
||||
|
||||
export enum EventKinds {
|
||||
Loaded = 'Loaded',
|
||||
Connected = 'Connected',
|
||||
TextMessageReceived = 'TextMessageReceived',
|
||||
StringMessageReceived = 'StringMessageReceived',
|
||||
BinaryMessageReceived = 'BinaryMessageReceived',
|
||||
}
|
||||
|
||||
@@ -60,23 +62,25 @@ export interface ConnectedEvent {
|
||||
};
|
||||
}
|
||||
|
||||
export interface TextMessageReceivedEvent {
|
||||
kind: EventKinds.TextMessageReceived;
|
||||
export interface StringMessageReceivedEvent {
|
||||
kind: EventKinds.StringMessageReceived;
|
||||
args: {
|
||||
message: string;
|
||||
kind: number;
|
||||
payload: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface BinaryMessageReceivedEvent {
|
||||
kind: EventKinds.TextMessageReceived;
|
||||
kind: EventKinds.BinaryMessageReceived;
|
||||
args: {
|
||||
message: Uint8Array;
|
||||
kind: number;
|
||||
payload: Uint8Array;
|
||||
};
|
||||
}
|
||||
|
||||
export interface IWebWorkerEvents {
|
||||
subscribeToLoaded: EventHandlerSubscribeFn<LoadedEvent>;
|
||||
subscribeToConnected: EventHandlerSubscribeFn<ConnectedEvent>;
|
||||
subscribeToTextMessageReceivedEvent: EventHandlerSubscribeFn<TextMessageReceivedEvent>;
|
||||
subscribeToTextMessageReceivedEvent: EventHandlerSubscribeFn<StringMessageReceivedEvent>;
|
||||
subscribeToBinaryMessageReceivedEvent: EventHandlerSubscribeFn<BinaryMessageReceivedEvent>;
|
||||
}
|
||||
|
||||
@@ -10,9 +10,11 @@ import type {
|
||||
ConnectedEvent,
|
||||
IWebWorker,
|
||||
LoadedEvent,
|
||||
OnMessageFn,
|
||||
OnStringMessageFn,
|
||||
OnBinaryMessageFn,
|
||||
OnConnectFn,
|
||||
TextMessageReceivedEvent,
|
||||
StringMessageReceivedEvent,
|
||||
BinaryMessageReceivedEvent,
|
||||
NymClientConfig,
|
||||
} from './types';
|
||||
import { EventKinds } from './types';
|
||||
@@ -31,6 +33,10 @@ const wasmUrl = new URL('./nym_client_wasm_bg.wasm', import.meta.url);
|
||||
*/
|
||||
const postMessageWithType = <E>(event: E) => self.postMessage(event);
|
||||
|
||||
// ------------ the 1st byte of messages is the kind from the list below ------------
|
||||
const PAYLOAD_KIND_TEXT = 0;
|
||||
const PAYLOAD_KIND_BINARY = 1;
|
||||
|
||||
/**
|
||||
* This class holds the state of the Nym WASM client and provides any interop needed.
|
||||
*/
|
||||
@@ -40,9 +46,22 @@ class ClientWrapper {
|
||||
/**
|
||||
* Creates the WASM client and initialises it.
|
||||
*/
|
||||
init = (config: wasm_bindgen.Config, onConnectHandler: OnConnectFn, onMessageHandler: OnMessageFn) => {
|
||||
init = (
|
||||
config: wasm_bindgen.Config,
|
||||
onConnectHandler: OnConnectFn,
|
||||
onStringMessageHandler?: OnStringMessageFn,
|
||||
onBinaryMessageHandler?: OnBinaryMessageFn,
|
||||
) => {
|
||||
this.client = new wasm_bindgen.NymClient(config);
|
||||
this.client.set_on_message(onMessageHandler);
|
||||
if (onBinaryMessageHandler) {
|
||||
this.client.set_on_binary_message(onBinaryMessageHandler);
|
||||
}
|
||||
|
||||
// NB: because we set the `kind` byte in the message payload first, we don't need to bother to try to parse
|
||||
// all messages as string
|
||||
// if (onStringMessageHandler) {
|
||||
// this.client.set_on_message(onStringMessageHandler);
|
||||
// }
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -72,21 +91,21 @@ class ClientWrapper {
|
||||
this.client = await this.client.start();
|
||||
};
|
||||
|
||||
sendMessage = async ({ message, recipient }: { recipient: string; message: string }) => {
|
||||
sendMessage = async ({ payload, recipient }: { recipient: string; payload: string }) => {
|
||||
if (!this.client) {
|
||||
console.error('Client has not been initialised. Please call `init` first.');
|
||||
return;
|
||||
}
|
||||
|
||||
this.client = await this.client.send_message(message, recipient);
|
||||
const message = wasm_bindgen.create_binary_message_from_string(PAYLOAD_KIND_TEXT, payload);
|
||||
this.client = await this.client.send_binary_message(message, recipient);
|
||||
};
|
||||
|
||||
sendBinaryMessage = async ({ message, recipient }: { recipient: string; message: Uint8Array }) => {
|
||||
sendBinaryMessage = async ({ payload, recipient }: { recipient: string; payload: Uint8Array }) => {
|
||||
if (!this.client) {
|
||||
console.error('Client has not been initialised. Please call `init` first.');
|
||||
return;
|
||||
}
|
||||
|
||||
const message = wasm_bindgen.create_binary_message(PAYLOAD_KIND_BINARY, payload);
|
||||
this.client = await this.client.send_binary_message(message, recipient);
|
||||
};
|
||||
}
|
||||
@@ -118,8 +137,31 @@ wasm_bindgen(wasmUrl)
|
||||
() => {
|
||||
console.log();
|
||||
},
|
||||
(message) => {
|
||||
postMessageWithType<TextMessageReceivedEvent>({ kind: EventKinds.TextMessageReceived, args: { message } });
|
||||
undefined,
|
||||
async (message) => {
|
||||
try {
|
||||
const { kind, payload } = await wasm_bindgen.parse_binary_message(message);
|
||||
switch (kind) {
|
||||
case PAYLOAD_KIND_TEXT: {
|
||||
const stringMessage = await wasm_bindgen.parse_string_message(message);
|
||||
postMessageWithType<StringMessageReceivedEvent>({
|
||||
kind: EventKinds.StringMessageReceived,
|
||||
args: { kind, payload: stringMessage.payload },
|
||||
});
|
||||
break;
|
||||
}
|
||||
case PAYLOAD_KIND_BINARY:
|
||||
postMessageWithType<BinaryMessageReceivedEvent>({
|
||||
kind: EventKinds.BinaryMessageReceived,
|
||||
args: { kind, payload },
|
||||
});
|
||||
break;
|
||||
default:
|
||||
console.error('Could not determine message kind from 1st byte of message', { message, kind, payload });
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Failed to parse binary message', e);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user