99 |
137 |
;
138 | };
139 |
140 | const Viewer: React.FunctionComponent = () => {
141 | const [viewerState, setViewerState] = React.useState{group.subject} (group)
;
20 | } else if (contact) {
21 | return {contact.name}
;
22 | } else {
23 | return {phoneNumber}
;
24 | }
25 | };
26 |
27 | // See {s};
69 | let messageBody: React.ReactNode = unexpected("unknown message type");
70 | let quoteBody: undefined;
71 | if (message.filehash && message.mimetype) {
72 | const blob = media[message.filehash];
73 | if (blob) {
74 | messageBody =
85 | {contactName !== null && {contactName}}
86 | {renderTime(message.t)}
87 |
88 | {quoteBody}
89 | {messageBody}
90 |
91 |
92 |
;
93 | };
94 |
95 | const ChatInfo: React.FunctionComponent<{
96 | chat: Chat,
97 | contacts: {[phoneNumber: string]: Contact},
98 | groups: {[phoneNumber: string]: Group},
99 | }> = ({ chat, contacts, groups }) => {
100 | const [phoneNumber, _] = chat.id.split("@");
101 | let content: React.ReactNode = <>+{phoneNumber};
102 | const contact = contacts[phoneNumber];
103 | if (contact) {
104 | content = <>
105 | {contact.name} (+{phoneNumber})
106 | ;
107 | }
108 | const group = groups[phoneNumber];
109 | if (group) {
110 | content = <>{group.subject} (group);
111 | }
112 | return
113 | {content}
114 |
;
115 | };
116 |
117 | const Chat: React.FunctionComponent<{
118 | contacts: {[phoneNumber: string]: Contact},
119 | groups: {[phoneNumber: string]: Group},
120 | media: {[hash: string]: ArrayBuffer},
121 | messages: Message[],
122 | chat: Chat,
123 | }> = ({ contacts, groups, chat, media, messages }) => {
124 | const chatId = chat.id;
125 | const group = chat.id.includes("g.us");
126 | const els: React.ReactNode[] = [];
127 | for (const msg of messages) {
128 | if (!msg.to || !msg.from) { continue; }
129 | if (msg.from === chatId) {
130 | els.push({els}
143 | ;
144 | };
145 |
146 | export const Viewing: React.FunctionComponent<{ data: WhatsAppData }> = ({ data }) => {
147 | const contactsByNumber: {[phoneNumber: string]: Contact} = {};
148 | for (const contact of data["contact.json"]) {
149 | const [num, _] = contact.id.split("@");
150 | contactsByNumber[num] = contact;
151 | }
152 | const groupsByNumber: {[phoneNumber: string]: Group} = {};
153 | for (const group of data["group-metadata.json"]) {
154 | const [num, _] = group.id.split("@");
155 | groupsByNumber[num] = group;
156 | }
157 | const [currentChatId, setCurrentChat] = React.useState
160 |
;
178 | };
179 |
--------------------------------------------------------------------------------
/dump-messages.js:
--------------------------------------------------------------------------------
1 | // See README.md for instructions on how to use this file.
2 | //
3 | // I wanted this to be a single file with no dependencies, so we implement
4 | // various things we normally would not implement, like a minimal protobuf
5 | // reader and a tar archive generator.
6 | (() => {
7 | "use strict";
8 |
9 | const utf8Decoder = new TextDecoder("utf-8", { fatal: true });
10 | const utf8Encoder = new TextEncoder();
11 |
12 | // protobuf varint decoder
13 | function decodeVarint(s) {
14 | let number = 0;
15 | let more = false;
16 | let parsedBytes = 0;
17 | do {
18 | if (parsedBytes > 3) {
19 | throw "trying to parse varint wider than 4 bytes, we don't support this since we need to fit within 32 bits";
20 | }
21 | if (s.cursor >= s.length) {
22 | throw "EOF while parsing varint";
23 | }
24 | const byte = s.data.getUint8(s.cursor); s.cursor += 1;
25 | more = !!(byte & 0x80);
26 | number += (byte & 0x7f) << (parsedBytes * 7);
27 | parsedBytes += 1;
28 | } while (more);
29 | return number;
30 | }
31 |
32 | // protobuf message decoder. See `decodeWhatsAppProtobuf` message for example on
33 | // the spec format. We currently only bother with wire types encountered when
34 | // decoding whatsapp messages.
35 | //
36 | // rule: we increase cursor _as soon as the data is consumed_.
37 | // cursor should always be at the byte we need to read next.
38 | function decodeProtobufWithState(spec, s) {
39 | const result = {};
40 | while (s.cursor < s.length) {
41 | const header = s.data.getUint8(s.cursor); s.cursor += 1;
42 | const field = header >> 3;
43 | const wireType = header & 0x7;
44 | const fieldSpec = spec[field];
45 | if (fieldSpec === undefined) {
46 | throw `non-specced field ${field}`;
47 | }
48 | let fieldValue = null;
49 | if (wireType == 0) { // varint (int32, int64, uint32, uint64, sint32, sint64, bool, enum)
50 | fieldValue = decodeVarint(s);
51 | } else if (wireType === 1) { // fixed64, sfixed64, double
52 | if (fieldSpec.type === "double") {
53 | fieldValue = s.data.getFloat64(s.cursor, true); s.cursor += 8;
54 | } else if (fieldSpec.type === "int64") {
55 | fieldValue = s.data.getBigInt64(s.cursor, true); s.cursor += 8;
56 | } else if (fieldSpec.type === "uint64") {
57 | fieldValue = s.data.getBigUint64(s.cursor, true); s.cursor += 8;
58 | } else {
59 | throw `bad type for 64-bit data: ${fieldSpec.name}, ${fieldSpec.type}`;
60 | }
61 | } else if (wireType === 2) { // length-delimited
62 | const length = decodeVarint(s);
63 | if (fieldSpec.type === "string") {
64 | fieldValue = utf8Decoder.decode(new DataView(s.data.buffer, s.data.byteOffset + s.cursor, length));
65 | s.cursor += length;
66 | } else if (typeof fieldSpec.type === "object") {
67 | fieldValue = decodeProtobufWithState(fieldSpec.type, {
68 | data: new DataView(s.data.buffer, s.data.byteOffset + s.cursor, length),
69 | cursor: 0,
70 | length: length,
71 | });
72 | s.cursor += length;
73 | } else {
74 | throw `bad field type for length-delimited data: ${fieldSpec.name}, ${JSON.stringify(fieldSpec.type)}`;
75 | }
76 | } else if (wireType === 5) { // fixed32, sfixed32, float
77 | if (fieldSpec.type === "float") {
78 | fieldValue = s.data.getFloat32(s.cursor, true); s.cursor += 4;
79 | } else if (fieldSpec.type === "int32") {
80 | fieldValue = s.data.getInt32(s.cursor, true); s.cursor += 4;
81 | } else if (fieldSpec.type === "uint32") {
82 | fieldValue = s.data.getInt32(s.cursor, true); s.cursor += 4;
83 | } else {
84 | throw `bad type for 32-bit data: ${fieldSpec.name}, ${fieldSpec.type}`;
85 | }
86 | } else {
87 | throw `unimplemented wire type ${wireType}`;
88 | }
89 | result[fieldSpec.name] = fieldValue;
90 | }
91 | if (s.cursor !== s.length) {
92 | throw `mismatching cursor ${s.cursor} and length ${s.length}`;
93 | }
94 | return result;
95 | }
96 |
97 | // this assumes that there are no fields >= 32.
98 | function decodeProtobuf(spec, buffer) {
99 | const data = new DataView(buffer, 0);
100 | return decodeProtobufWithState(spec, { data, cursor: 0, length: buffer.byteLength });
101 | }
102 |
103 | // decoding whatsapp protobufs. note that here we have
104 | // things other than "string", I just never encountered them in
105 | // my dataset.
106 | function decodeWhatsAppProtobufMessage(buffer) {
107 | const msgSpec = {
108 | 1: { name: "body", type: "string" },
109 | 3: { name: "caption", type: "string" },
110 | 5: { name: "lng", type: "double" },
111 | 6: { name: "isLive", type: "bool" },
112 | 7: { name: "lat", type: "double" },
113 | 8: { name: "paymentAmount1000", type: "int32" },
114 | 9: { name: "paymentNoteMsgBody", type: "string" },
115 | 10: { name: "canonicalUrl", type: "string" },
116 | 11: { name: "matchedText", type: "string" },
117 | 12: { name: "title", type: "string" },
118 | 13: { name: "description", type: "string" },
119 | 14: { name: "futureproofBuffer", type: "bytes" },
120 | 15: { name: "clientUrl", type: "string" },
121 | 16: { name: "loc", type: "string" },
122 | 17: { name: "pollName", type: "string" },
123 | // 18: { name: "pollOptions"}, not implemented, repeated messages
124 | 20: { name: "pollSelectableOptionsCount", type: "uint32" },
125 | 21: { name: "messageSecret", type: "bytes" },
126 | 22: { name: "senderTimestampMs", type: "int64" },
127 | 23: { name: "pollUpdateParentKey", type: "string" },
128 | // 24: { name: "encPollVote" }, not implemented, repeated messages
129 | };
130 | const fullMsgSpec = {
131 | 1: { name: "currentMsg", type: msgSpec },
132 | 2: { name: "quotedMsg", type: msgSpec },
133 | };
134 | return decodeProtobuf(fullMsgSpec, buffer);
135 | }
136 |
137 | // see
161 |
175 | {currentChatId !== null &&
176 |
162 | {data["chat.json"].map(chat => {
167 | ev.preventDefault();
168 | setCurrentChat(chat.id);
169 | }}
170 | >
171 |
174 |