1
/*
2
Used for viewing a list of messages, e.g., in timetravel.
3
*/
4

5
import { Map as immutableMap } from "immutable";
6
import { useMemo } from "react";
7

8
import type { Document } from "@cocalc/sync/editor/generic/types";
9
import { useTypedRedux } from "@cocalc/frontend/app-framework";
10
import { MessageList, getSortedDates } from "./chat-log";
11
import type { ChatMessages } from "./types";
12

13
export default function Viewer({
14
  doc,
15
  font_size,
16
}: {
17
  doc: Document;
18
  font_size?: number;
19
}) {
20
  const messages = useMemo<ChatMessages>(() => {
21
    let m = immutableMap();
22
    for (let v of doc.get()) {
23
      if (v.get("event") == "chat") {
24
        const date = new Date(v.get("date"));
25
        v = v.set("date", date);
26
        m = m.set(`${date.valueOf()}`, v);
27
      }
28
    }
29
    return m as ChatMessages;
30
  }, [doc]);
31
  const user_map = useTypedRedux("users", "user_map");
32
  const account_id = useTypedRedux("account", "account_id");
33
  const { dates: sortedDates, numChildren } = useMemo(() => {
34
    return getSortedDates(messages, "", account_id, undefined);
35
  }, [messages]);
36

37
  return (
38
    <MessageList
39
      messages={messages}
40
      user_map={user_map}
41
      account_id={account_id}
42
      fontSize={font_size}
43
      mode="standalone"
44
      sortedDates={sortedDates}
45
      numChildren={numChildren}
46
    />
47
  );
48
}
49

50