@nzz/q-cli 1.10.2 → 2.0.0-beta.7

package/dev-server/routes/rendering-info.js

@@ -1,130 +0,0 @@
-const Joi = require("joi");
-const Boom = require("@hapi/boom");
-const fetch = require("node-fetch");
-const querystring = require("querystring");
-const deepmerge = require("deepmerge");
-
-const toolBaseUrl = process.env.TOOL_BASE_URL || "http://localhost:3000";
-
-// try different endpoints to get the right one for the current tool
-function getRenderingInfo(item, queryString, config) {
-  let promises = [];
-  const pathEnds = ["html-static", "html-js", "web"];
-
-  pathEnds.forEach((pathEnd) => {
-    promises.push(
-      fetch(`${toolBaseUrl}/rendering-info/${pathEnd}?${queryString}`, {
-        method: "POST",
-        body: JSON.stringify({
-          item: item,
-          toolRuntimeConfig: config.toolRuntimeConfig,
-        }),
-        headers: {
-          "Content-Type": "application/json",
-        },
-      }).then((response) => {
-        if (response.ok) {
-          return response.json();
-        } else {
-          return undefined;
-        }
-      })
-    );
-  });
-  return Promise.all(promises);
-}
-
-module.exports = {
-  method: "GET",
-  path: "/rendering-info/{id}/{target}",
-  options: {
-    validate: {
-      params: {
-        id: Joi.string().required(),
-        target: Joi.string().required(),
-      },
-      options: {
-        allowUnknown: true,
-      },
-    },
-  },
-  handler: async function (request, h) {
-    try {
-      // fetch item with id from array of fixture data
-      const target = request.params.target;
-      const fixtureDataResponse = await fetch(`${toolBaseUrl}/fixtures/data`);
-      if (!fixtureDataResponse.ok) {
-        throw new Error(fixtureDataResponse.status);
-      }
-      const fixtureData = await fixtureDataResponse.json();
-      const item = fixtureData[request.params.id];
-
-      // if these attributes are present in current item add them as query params to rendering-info request
-      const queryParams = ["_id", "createdDate", "updatedDate"];
-      let query = {};
-      for (let queryParam of queryParams) {
-        if (item.hasOwnProperty(queryParam) && item[queryParam]) {
-          query[queryParam] = item[queryParam];
-        } else if (queryParam === "_id") {
-          query["_id"] = request.params.id;
-        }
-      }
-      let queryString = querystring.stringify(query);
-
-      let toolRuntimeConfig = {
-        toolBaseUrl:
-          request.server.info.protocol +
-          "://" +
-          request.server.info.address +
-          ":" +
-          request.server.info.port +
-          "/tools",
-      };
-
-      let config;
-      if (process.env.CONFIG) {
-        const getConfig = require(process.env.CONFIG);
-        config = await getConfig();
-        // add tool specifc toolRuntimeConfig if it exists
-        if (config[target].toolRuntimeConfig) {
-          toolRuntimeConfig = Object.assign(
-            toolRuntimeConfig,
-            config[target].toolRuntimeConfig
-          );
-        }
-      }
-
-      let responses = await getRenderingInfo(item, queryString, {
-        toolRuntimeConfig: toolRuntimeConfig,
-      });
-      let renderingInfo = responses.filter(
-        (response) => response !== undefined
-      )[0];
-
-      // add target/tool specific additional rendering info to rendering info if it exists
-      if (config && config[target].additionalRenderingInfo) {
-        renderingInfo = deepmerge(
-          renderingInfo,
-          config[target].additionalRenderingInfo,
-          {
-            arrayMerge: (destArr, srcArr) => {
-              return srcArr.concat(destArr);
-            },
-          }
-        );
-      }
-
-      return h.response(renderingInfo);
-    } catch (err) {
-      console.log(err);
-      if (err.stack) {
-        request.server.log(["error"], err.stack);
-      }
-      if (err.isBoom) {
-        return err;
-      } else {
-        return Boom.serverUnavailable(err.message);
-      }
-    }
-  },
-};

package/dev-server/routes/routes.js

@@ -1,6 +0,0 @@
-module.exports = [
-  require("./file.js"),
-  require("./tool-default.js").get,
-  require("./tool-default.js").post,
-  require("./rendering-info.js")
-].concat(require("./dev-view.js"));

package/dev-server/routes/tool-default.js

@@ -1,108 +0,0 @@
-const Joi = require("joi");
-const Wreck = require("@hapi/wreck");
-const querystring = require("querystring");
-const fetch = require("node-fetch");
-
-const toolBaseUrl = process.env.TOOL_BASE_URL || "http://localhost:3000";
-
-async function handler(request, h, payload = null) {
-  let queryString = "";
-  if (request.query && Object.keys(request.query).length > 0) {
-    queryString = querystring.stringify(request.query);
-  }
-
-  let toolResponse;
-  if (payload) {
-    toolResponse = await Wreck.post(
-      `${toolBaseUrl}/${request.params.path}?${queryString}`,
-      {
-        payload: payload,
-      }
-    );
-  } else {
-    toolResponse = await Wreck.get(
-      `${toolBaseUrl}/${request.params.path}?${queryString}`
-    );
-  }
-
-  // prepare the response to add more headers
-  const response = h.response(toolResponse.payload);
-
-  // set all the headers from the tool response
-  for (let header in toolResponse.res.headers) {
-    response.header(header, toolResponse.res.headers[header]);
-  }
-
-  return response;
-}
-
-module.exports = {
-  get: {
-    path: "/tools/{path*}",
-    method: "GET",
-    options: {
-      validate: {
-        params: {
-          path: Joi.string().required(),
-        },
-        query: {
-          appendItemToPayload: Joi.string().optional(),
-        },
-        options: {
-          allowUnknown: true,
-        },
-      },
-    },
-    handler: async (request, h) => {
-      let payload = null;
-      if (request.query.appendItemToPayload) {
-        // we use fixture data here instead of items in db
-        const fixtureDataResponse = await fetch(`${toolBaseUrl}/fixtures/data`);
-        if (!fixtureDataResponse.ok) {
-          throw new Error(fixtureDataResponse.status);
-        }
-
-        const fixtureData = await fixtureDataResponse.json();
-        // appendItemToPayload = item id = index in fixtures data array
-        const item = fixtureData[request.query.appendItemToPayload];
-        payload = {
-          item: item,
-        };
-      }
-      return Reflect.apply(handler, this, [request, h, payload]);
-    },
-  },
-  post: {
-    path: "/tools/{path*}",
-    method: "POST",
-    options: {
-      validate: {
-        params: {
-          path: Joi.string().required(),
-        },
-        query: {
-          appendItemToPayload: Joi.string().optional(),
-        },
-        payload: Joi.string(),
-        options: {
-          allowUnknown: true,
-        },
-      },
-    },
-    handler: async (request, h) => {
-      if (request.query.appendItemToPayload) {
-        // we use fixture data here instead of items in db
-        const fixtureDataResponse = await fetch(`${toolBaseUrl}/fixtures/data`);
-        if (!fixtureDataResponse.ok) {
-          throw new Error(fixtureDataResponse.status);
-        }
-
-        const fixtureData = await fixtureDataResponse.json();
-        // appendItemToPayload = item id = index in fixtures data array
-        const item = fixtureData[request.query.appendItemToPayload];
-        request.payload.item = item;
-      }
-      return Reflect.apply(handler, this, [request, h, request.payload]);
-    },
-  },
-};

package/dev-server/server-plugins.js

@@ -1 +0,0 @@
-module.exports = [require("@hapi/inert"), require("@hapi/vision")];

package/dev-server/server.js

@@ -1,18 +0,0 @@
-const Hapi = require("@hapi/hapi");
-const Joi = require("joi");
-const Path = require("path");
-
-const server = new Hapi.Server({
-  port: process.env.PORT || 5000,
-  routes: {
-    cors: {
-      origin: ["*"],
-    },
-    files: {
-      relativeTo: Path.join(__dirname, "public"),
-    },
-  },
-});
-server.validator(Joi);
-
-module.exports = server;

package/dev-server/views/index.html

@@ -1,184 +0,0 @@
-<!-- index.html to test what markup would look like locally (independent of target) -->
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8" />
-    <title>Q Tool</title>
-    <meta name="viewport" content="width=device-width" />
-    <script src="https://cdn.jsdelivr.net/gh/muicss/loadjs@3.6.1/dist/loadjs.min.js"></script>
-    <script src="https://q-server.st.nzz.ch/files/system.js"></script>
-    <!-- if context is given load stylesheets and scripts if available -->
-    {%- if context.stylesheets %} {%- for stylesheet in context.stylesheets %}
-    {%- if stylesheet.url %}
-    <link rel="stylesheet" href="{{ stylesheet.url }}" />
-    {%- endif %} {%- if stylesheet.content %}
-    <style>
-      {{ stylesheet.content }}
-    </style>
-    {%- endif %} {%- endfor %} {%- endif %} {%- if context.scripts %} {%- for
-    script in context.scripts %} {%- if script.url %}
-    <script src="{{ script.url }}"></script>
-    {%- endif %} {%- if script.content %}
-    <script>
-      {
-        {
-          script.content;
-        }
-      }
-    </script>
-    {%- endif %} {%- endfor %} {%- endif %} {%- if context.background %}
-    <style>
-      body {
-        background-color: {{ context.background.color }};
-        color: {{ context.background.color }}
-      }
-      #container {
-        background-color: {{ context.background.color }};
-        color: {{ context.background.color }}
-      }
-    </style>
-    {%- endif %}
-    <link rel="stylesheet" href="http://localhost:5000/style.css" />
-  </head>
-  <!-- we have four different article templates, since the article itself has the same structure in each template 
-		we can use either of these classes: regular, longformstandard, regular, opinion 
-		if one changes the class attached to body tag one should change the class in section tag accordingly (maybe further adjustments needed too) -->
-  <body class="regular">
-    <div class="fixtures__container">
-      <select class="fixtures__select"></select>
-      <button class="fixtures__reload-button" type="button">Reload</button>
-    </div>
-    <div id="__nzz">
-      <div id="__layout">
-        <div class="page--article-id">
-          <div class="pageholder">
-            <div class="nzz-container">
-              <div class="nzz-page-transition">
-                <div class="article">
-                  <!-- also here change layout--{template} accordingly -->
-                  <section class="container container--article layout--regular">
-                    <!-- default = content width, for fullwidth, small left/right one has to add one of 
-                        the following classes accordingly: widget--fullwidth, widget--left, widget--right-->
-                    <div
-                      class="articlecomponent q-embed widget--qembed regwalled"
-                    >
-                      <div>
-                        <div class="s-q-item" id="container"></div>
-                      </div>
-                    </div>
-                  </section>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script>
-      const port = {{ port }};
-      const target = '{{ target }}';
-      // load fixture data and populate select element with titles
-      fetch(`http://localhost:${port}/tools/fixtures/data`)
-        .then(response => {
-          if (response.ok) {
-            return response.json();
-          }
-          throw new Error(response);
-        })
-        .then(fixtureData => {
-          let selectElement = document.querySelector(".fixtures__select");
-          fixtureData.forEach((data, index) => {
-            let option = document.createElement('option');
-            // removes mandatory 'FIXTURE: ' from title
-            option.text = data.title.substr(9);
-            option.value = index;
-            selectElement.appendChild(option);
-          });
-          // init with rendering info for first item in select
-          updateRenderingInfoForItem(fixtureData, 0);
-
-          // as soon as another fixture data item is selected, update with its rendering info
-          selectElement.addEventListener('change', (event) => {
-            updateRenderingInfoForItem(fixtureData, selectElement.selectedIndex);
-          });
-
-          document.querySelector(".fixtures__reload-button").addEventListener('click', () => {
-            updateRenderingInfoForItem(fixtureData, selectElement.selectedIndex);
-          })
-        });
-
-      function loadRenderingInfo(fixtureData, index) {
-        return fetch(`http://localhost:${port}/rendering-info/${index}/${target}`)
-          .then(response => {
-            if (response.ok) {
-              return response.json();
-            }
-            throw new Error(response);
-          })
-          .catch(e => {
-            console.log(e);
-            // do nothing
-          });
-      }
-
-      function updateRenderingInfoForItem(fixtureData, index) {
-        loadRenderingInfo(fixtureData, index)
-          .then(data => {
-            if(data) {
-              // add markup
-              document.querySelector("#container").innerHTML = data.markup;
-              // load resources
-              let scriptUrls = [];
-              if(data.scripts) {
-                data.scripts.map(script => {
-                  if(script.name) {
-                    script.url = `http://localhost:${port}/tools/script/${script.name}`;
-                  }
-                });
-                scriptUrls = data.scripts.filter(script => script.url).map(script => script.url);
-              }
-
-              let stylesheetUrls = [];
-              if(data.stylesheets) {
-                data.stylesheets.map(stylesheet => {
-                  if (stylesheet.name) {
-                    stylesheet.url = `http://localhost:${port}/tools/stylesheet/${stylesheet.name}`
-                  }
-                });
-                stylesheetUrls = data.stylesheets.filter(stylesheet => stylesheet.url).map(stylesheet => stylesheet.url);
-              }
-
-              const urlResources = [...scriptUrls, ...stylesheetUrls];
-              loadjs(urlResources, {
-                success: () => {
-                  if(data.scripts) {
-                    for(const script of data.scripts.filter(script => script.content)) {
-                      const scriptElement = document.createElement('script');
-                      scriptElement.innerHTML = script.content;
-                      document.querySelector("#container").appendChild(scriptElement);
-                    }
-                  }
-                  if(data.stylesheets) {
-                    for(const stylesheet of data.stylesheets.filter(stylesheet => stylesheet.content)) {
-                      const styleElement = document.createElement('style');
-                      styleElement.type = "text/css";
-                      styleElement.appendChild(document.createTextNode(stylesheet.content));
-                      document.querySelector("#container").appendChild(styleElement);
-                    }
-                  }
-                },
-                before: (path, scriptElement) => {
-                  document.querySelector("#container").appendChild(scriptElement);
-                  /* return `false` to bypass default DOM insertion mechanism */
-                  return false;
-                }
-              });
-            } else {
-              throw new Error("Something went wrong while loading the renderingInfo. There might be a problem in your tool");
-            }
-          })
-      }
-    </script>
-  </body>
-</html>

package/skeletons/custom-code-skeleton/.nvmrc

@@ -1 +0,0 @@
-16

package/skeletons/custom-code-skeleton/.vscode/settings.json

@@ -1,5 +0,0 @@
-{
-  "[svelte]": {
-    "editor.defaultFormatter": "svelte.svelte-vscode"
-  }
-}

package/skeletons/custom-code-skeleton/README.md

@@ -1,26 +0,0 @@
-## Custom code boilerplate
-
-Install the dependencies
-
-```bash
-npm install
-```
-
-#### Running it locally
-
-Regular layout
-```
-npm start
-```
-
-Longform standard
-```
-npm run start-ls
-```
-
-Longform Visual
-```
-npm run start-lv
-```
-
-Navigate to [http://0.0.0.0:5555](http://0.0.0.0:5555). You should see your app running. Edit a component file in `src`, save it and see the changes in the browser.

package/skeletons/custom-code-skeleton/index.d.ts

@@ -1,3 +0,0 @@
-declare module '*.jpg';
-declare module '*.png';
-declare module '*.svg';