@datawheel/bespoke 0.3.15 → 0.3.17

package/dist/server.js

@@ -25,6 +25,7 @@ import { renderToString } from 'react-dom/server';
 import * as allIcons from '@tabler/icons-react';
 import NextCors from 'nextjs-cors';
 import formidable from 'formidable';
+import puppeteer from 'puppeteer';
 import DomParser from 'dom-parser';
 import axiosRetry from 'axios-retry';
 import toposort from 'toposort';
@@ -3735,6 +3736,114 @@ function endpointAddNewReportToCurrentUserFactory(operations) {
     }
   }, [CMS_ROLES.EDITOR]);
 }
+async function generatePDF(path) {
+  const width = 1920;
+  const height = 1080;
+  const maxTimeoutPerPage = 0;
+  try {
+    const browser = await puppeteer.launch({
+      args: [
+        `--window-size=${width},${height}`,
+        "--start-fullscreen"
+      ],
+      defaultViewport: { width, height },
+      headless: "new",
+      ignoreHTTPSErrors: true
+    });
+    const url = new URL(path);
+    const searchParams = new URLSearchParams(url.search);
+    searchParams.set("print", "true");
+    url.search = searchParams.toString();
+    const page = await browser.newPage();
+    await page.goto(url.toString(), { waitUntil: "networkidle0", timeout: maxTimeoutPerPage });
+    await page.waitForSelector("#bespoke-report", { timeout: maxTimeoutPerPage });
+    await page.evaluate(async () => {
+      await new Promise((resolve) => {
+        const scrollInterval = setInterval(() => {
+          window.scrollBy(0, window.innerHeight);
+        }, 100);
+        const checkNetworkActivity = () => {
+          const activeRequests = performance.getEntriesByType("resource").filter((entry) => entry.duration === 0);
+          return activeRequests.length === 0;
+        };
+        const checkInterval = setInterval(() => {
+          if (checkNetworkActivity()) {
+            clearInterval(scrollInterval);
+            clearInterval(checkInterval);
+            resolve();
+          }
+        }, 1e3);
+      });
+    });
+    const pdf = await page.pdf({
+      displayHeaderFooter: true,
+      footerTemplate: `
+        <div
+          style="
+            color: lightgray; border-top: solid lightgray 1px; font-size: 10px;
+            padding-top: 5px; text-align: center; width: 100%;
+          "
+        >
+          <p>Page <span class="pageNumber" /> of <span class="totalPages" /></p>
+        </div>`,
+      format: "A4",
+      // Letter,Legal,Tabloid,Ledger,A0,A1,A2,A3,A4,A5,A6
+      headerTemplate: `
+        <div
+          style="
+            color: lightgray; border-bottom: solid lightgray 1px; font-size: 10px;
+            padding-bottom: 5px; text-align: center; width: 100%;
+          "
+        >
+          <p class="url" />
+        </div>`,
+      // height: `${height}px`,
+      landscape: false,
+      margin: {
+        bottom: 70,
+        // minimum required for footer msg to display
+        left: 20,
+        right: 20,
+        top: 70
+        // minimum required for header msg to display
+      },
+      omitBackground: true,
+      pageRanges: "",
+      // All
+      // path: "./test.pdf" // Path to save the file
+      preferCSSPageSize: false,
+      // Give any CSS @page size declared in the page priority over what is declared in the width or height or format option.
+      printBackground: true,
+      scale: 1,
+      // From 0.1 to 2
+      tagged: false,
+      // Generate tagged (accessible) PDF.
+      timeout: 0
+      // width: `${width}px`,
+    });
+    await browser.close();
+    return pdf.toString("base64");
+  } catch (error) {
+    console.error("Error generating PDF:", error);
+    throw error;
+  }
+}
+function endpointDownloadReport() {
+  return endpoint("POST", "pdf", async (req, res) => {
+    const { slugs, path } = req.body;
+    if (!slugs || !path) {
+      throw new BackendError(400, "Missing path parameter in request.");
+    } else {
+      const url = new URL(path, req.headers["origin"]);
+      const pdf = await generatePDF(url);
+      return {
+        ok: true,
+        status: 200,
+        data: pdf
+      };
+    }
+  });
+}
 
 // api/endpoints/icon/listIcons.ts
 function endpointListIconsFactory(operations, provider) {
@@ -3824,6 +3933,7 @@ function getEndpointMap(db) {
     endpointRevalidateReportFactory(api),
     endpointRevalidateUrlFactory(),
     endpointReadPrivateBlocksFactory(api),
+    endpointDownloadReport(),
     endpointListIconsFactory(api, "tabler"),
     endpointReadIconFactory(api, "tabler"),
     endpointReportVariables()
@@ -3862,7 +3972,7 @@ async function endpointNextJsHandlerFactory(req, res) {
           if (result && "error" in result) {
             throw new BackendError(result.status, result.error);
           }
-          if (result.ok) {
+          if (result.ok && req.url) {
             if (result.data instanceof Buffer) {
               const image = result.data;
               res.writeHead(result.status, { "Content-Type": "image/png" }).end(image, "binary");
@@ -4222,7 +4332,8 @@ var valueInOptions_default = (type, value, options) => {
   if (type === SELECTOR_TYPES.SINGLE) {
     return options.find((obj) => obj.id === value);
   }
-  return Array.isArray(value) && value.every((d) => options.map((o) => o.id).includes(d));
+  const multiValue = Array.isArray(value) ? value : value.split(",");
+  return Array.isArray(multiValue) && multiValue.every((d) => options.map((o) => o.id).includes(d));
 };
 
 // libs/selectors/runSelector.js

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datawheel/bespoke",
-  "version": "0.3.15",
+  "version": "0.3.17",
   "description": "Content management system for creating automated data reports",
   "exports": {
     ".": {
@@ -78,7 +78,7 @@
     "dom-parser": "^0.1.6",
     "fast-glob": "^3.2.12",
     "file-loader": "^6.2.0",
-    "file-saver": "^1.3.3",
+    "file-saver": "^1.3.8",
     "flickr-sdk": "6.1.2",
     "formidable": "^2.1.1",
     "html-react-parser": "^3.0.15",
@@ -93,6 +93,7 @@
     "normalizr": "^3.6.2",
     "pg": "^8.7.3",
     "pretty-format": "^28.1.1",
+    "puppeteer": "^21.5.2",
     "react": "^18.2.0",
     "react-clipboard.js": "^2.0.16",
     "react-dom": "^18.2.0",