Disclaimer

This disclaimer component can be used as a discrete notice at the beginning of the conversation. For example, they can allow users to opt in for tracking.

1const Disclaimer = () => {
2  const [status, setStatus] = useState("pending");
3  return html`
4    <div className="chat-disclaimer">
5      ${status === "pending" &&
6        html`
7          <p>
8            In order to enhance your experience in this chat, we would like to
9            temporarily store personal data according to our 
10            <a>privacy policy</a>.
11          </p>
12          <button
13            onClick=${() => {
14              setStatus("accepted");
15            }}
16          >
17            Accept
18          </button>
19          <button
20            onClick=${() => {
21              setStatus("denied");
22            }}
23          >
24            Deny
25          </button>
26        `}
27      ${status === "accepted" &&
28        html`
29          <p>
30            As requested, we might store certain personal or device identifiers
31            to enhance your experience on this chat.
32          </p>
33        `}
34      ${status === "denied" &&
35        html`
36          <p>
37            As requested, we will not store personal information in this chat.
38          </p>
39        `}
40    </div>
41  `;
42};