querysub 0.152.0 → 0.154.0

package/src/user-implementation/loginEmail.tsx

@@ -0,0 +1,159 @@
+import preact from "preact"; import { qreact } from "../4-dom/qreact";
+import { loginTokenURL } from "./userData";
+import { list } from "socket-function/src/misc";
+import { hslToRGB } from "socket-function/src/formatting/colors";
+import { joinVNodes } from "../misc";
+export function generateLoginEmail(config: {
+    userId: string;
+    loginToken: string;
+    ip: string;
+    machineId: string;
+    redirectURL: string;
+    timeoutTime: number;
+    noHTMLWrapper?: boolean;
+}): { subject: string; contents: preact.VNode } {
+    const { userId, loginToken, ip, machineId, redirectURL } = config;
+    let url = new URL(redirectURL);
+    url.searchParams.set(loginTokenURL.urlKey, loginToken);
+    const subject = `${userId} Access Request (${new Date().toLocaleString()})`;
+    function center(jsx: preact.ComponentChild) {
+        return (
+            <table style={{ width: "100%" }}>
+                <tbody>
+                    <tr>
+                        <td {...{ "nowrap": true, align: "center" } as any}>
+                            {jsx}
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        );
+    }
+    function line(jsx: preact.ComponentChild) {
+        return (
+            <table>
+                <tbody>
+                    <tr>
+                        <td>
+                            {jsx}
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        );
+    }
+    function hexColor(color: { r: number, g: number, b: number }) {
+        return `#${color.r.toString(16).padStart(2, "0")}${color.g.toString(16).padStart(2, "0")}${color.b.toString(16).padStart(2, "0")}`;
+    }
+    function hsl(h: number, s: number, l: number) {
+        let rgb = hslToRGB({ h, s, l });
+        return hexColor(rgb);
+    }
+    // TODO: Test with https://www.emailonacid.com/email-testing/
+    const innerContents = (
+        <>
+            {/* TODO: Logo, using a table to render it inline, so it shows no matter what. */}
+            <table width="100%">
+                <tbody>
+                    <tr>
+                        <td {...{ align: "right" } as any}>
+                            <table cellSpacing={0} cellPadding={0}>
+                                <tbody>
+                                    {list(10).map(x =>
+                                        <tr>
+                                            {list(10).map((y) =>
+                                                <td width="1" height="1" style={{
+                                                    background: hexColor({ r: 255 - x * 20, g: 255 - y * 20, b: 50 }),
+                                                    fontSize: "0px",
+                                                }}>
+                                                    &nbsp;
+                                                </td>
+                                            )}
+                                        </tr>
+                                    )}
+                                </tbody>
+                            </table>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+            {line(<div style={{ color: "rgb(255, 255, 255)" }}>
+                {/* Mess up the email so it isn't turned into a link by gmail. */}
+                Greetings <b>{userId.replaceAll(".", ".​")}</b>. You have requested access to <a href={redirectURL} style={{ color: "rgb(153, 204, 255)" }}>{new URL(redirectURL).hostname}</a>.
+            </div>)}
+            {line(<div style={{ color: "rgb(255, 255, 255)" }}>
+                If you did not make this request, please disregard this email. Your account is safe and no action is required.
+            </div>)}
+            <table><tbody><tr><td style={{ paddingTop: "30px" }}></td></tr></tbody></table>
+            {center(
+                <a
+                    href={url.toString()}
+                    style={{
+                        // background: "rgb(175, 143, 239)",
+                        // border: "20px solid rgb(175, 143, 239)",
+                        // background: "rgb(207, 143, 239)",
+                        // border: "20px solid rgb(207, 143, 239)",
+                        // background: "rgb(216, 98, 188)",
+                        // border: "20px solid rgb(216, 98, 188)",
+                        background: hsl(282, 75, 72),
+                        border: `20px solid ${hsl(282, 75, 72)}`,
+                        color: "white",
+                        fontSize: "30px",
+                        fontWeight: 400,
+                        textDecoration: "none",
+                        minWidth: "500px",
+                        textAlign: "center",
+                    }}
+                >
+                    {joinVNodes(Array(8).fill(<>&nbsp;</>), "")}Click to access{joinVNodes(Array(8).fill(<>&nbsp;</>), "")}
+                </a>
+            )}
+            <table><tbody><tr><td style={{ paddingTop: "30px" }}></td></tr></tbody></table>
+            <table style={{ width: "100%" }}><tbody><tr>
+                <td {...{ "nowrap": true }} style={{ width: "100%", paddingTop: "1px", background: "rgb(211, 211, 211)" }}></td>
+                <td {...{ "nowrap": true }} style={{ paddingLeft: "40px", }}></td>
+            </tr></tbody></table>
+            <table><tbody><tr><td style={{ paddingTop: "20px" }}></td></tr></tbody></table>
+            {line(<div style={{ color: "rgb(140, 140, 140)", width: "100%" }}><b>Do NOT share or forward this email with anyone.</b></div>)}
+            <table><tbody><tr><td style={{ paddingTop: "10px" }}></td></tr></tbody></table>
+            {line(<div style={{ color: "rgb(140, 140, 140)", width: "100%" }}>
+                This link will only work with the current device and browser.
+                This link can only be used one time, until {new Date(config.timeoutTime).toLocaleString()}.
+            </div>)}
+        </>
+    );
+    // We have to use tables, because outlook uses "Word" as it's render, so we really don't have many options...
+    let contents = (
+        <table cellPadding={0} cellSpacing={0} style={{
+            background: "rgb(80, 80, 80)",
+            color: "rgb(255, 255, 255)",
+            fontFamily: "Inter, Arial, Helvetica, sans-serif",
+            fontSize: 12,
+        }}>
+            <tbody>
+                <tr><td style={{ height: "18px" }}></td><td /><td /></tr>
+                <tr>
+                    <td style={{ width: "60px" }}></td>
+                    <td style={{ width: "600px", color: "rgb(255, 255, 255)" }}>
+                        {innerContents}
+                    </td>
+                    <td style={{ width: "20px" }}></td>
+                </tr>
+                <tr><td style={{ height: "40px" }}></td></tr>
+            </tbody>
+        </table>
+    );
+    if (!config.noHTMLWrapper) {
+        contents = (
+            <html>
+                <head>
+                    <meta http-equiv="Content-Type" content="text/html; charset=utf8" />
+                </head>
+                <body>
+                    {contents}
+                </body>
+            </html>
+        );
+    }
+    return { subject, contents };
+}

package/src/user-implementation/setEmailKey.ts

@@ -0,0 +1,20 @@
+import { Querysub } from "../4-querysub/Querysub";
+import { pathValueCommitter } from "../0-path-value-core/PathValueCommitter";
+import { scriptSetPostmarkAPIKey } from "./userData";
+
+async function main() {
+    const howToCall = ` Call with yarn setemailkey <key>`;
+    const args = process.argv.slice(2).filter(x => !x.startsWith("--"));
+    const key = args[0];
+    console.log(process.argv);
+    if (!key) throw new Error("No key provided." + howToCall);
+
+    await Querysub.hostService("setSendgridKey");
+
+    await Querysub.commitSynced(() => {
+        scriptSetPostmarkAPIKey({ apiKey: key });
+    });
+
+    await pathValueCommitter.waitForValuesToCommit();
+}
+main().catch(e => console.log(e)).finally(() => process.exit());