npm - @madgex/fert - Versions diffs - 1.3.0 - Mend

@madgex/fert 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (120) hide show

package/server/routes/public.js ADDED Viewed

@@ -0,0 +1,29 @@
+module.exports = [
+  {
+    method: 'get',
+    path: '/_/jobseekers-frontend/assets/{p*}',
+    handler: {
+      directory: {
+        path: ['./dist', './public'],
+      },
+    },
+  },
+  {
+    method: 'get',
+    path: '/public/{p*}',
+    handler: {
+      directory: {
+        path: ['./public/'],
+      },
+    },
+  },
+  // try guess the favicon location to prevent 500 errors
+  {
+    method: 'get',
+    path: '/favicon.ico',
+    handler: {
+      file: './public/favicon.ico',
+    },
+  },
+];

package/server/routes/views.js ADDED Viewed

@@ -0,0 +1,46 @@
+const Joi = require('joi');
+module.exports = {
+  method: 'GET',
+  path: '/{page*}',
+  handler: async (request, h) => {
+    const { page } = request.params;
+    // we'll pass over the headers as ModHeader may be used but
+    // remove the browsers 'accept-encoding' header otherwise
+    // content will come back gzipped!
+    const filteredHeaders = request.headers;
+    delete filteredHeaders['accept-encoding'];
+    const podletResponse = await request.server.inject({
+      url: `/_podlet/${request.path}`,
+      method: request.method,
+      headers: filteredHeaders,
+      auth: request.auth.isAuthenticated ? request.auth : null,
+    });
+    if (podletResponse.statusCode === 200) {
+      try {
+        podletResponse.result = JSON.parse(podletResponse.result);
+      } catch (err) {
+        console.error('Unable to parse podlet response', err);
+      }
+    }
+    return h.view(page, {
+      auth: request.auth,
+      podletResponse,
+    });
+  },
+  options: {
+    validate: {
+      params: Joi.object({
+        page: Joi.string().empty(['', null]).default('page1'),
+      }),
+    },
+    auth: {
+      strategy: 'mock-user',
+      mode: 'try',
+    },
+  },
+};

package/server/templates/furniture.njk ADDED Viewed

@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8"/>
+        <title>{{ title | default('Frontend Rollout Tool') }}</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        {%- for link in fertConfig.externalAssets.links %}
+            <link {%- for key, value in link %} {{ key }}="{{ value }}" {%- endfor %}/>
+        {%- endfor -%}
+        {%- for script in fertConfig.externalAssets.scripts %}
+            <script {%- for key, value in script %} {{ key }}="{{ value }}" {%- endfor %}></script>
+        {%- endfor -%}
+    </head>
+    <body {%- if auth.isAuthenticated %} class="is-signed-in" {% endif %}>
+        <section class="layout">
+            <div id="site-container" class="mds-site-container">
+                {%- if podletResponse.statusCode === 200 -%}
+                    {{ podletResponse.result.headerHtml | safe }}
+                {%- else -%}
+                    <div style="all: revert; margin: 10px; border: 5px solid red; padding: 20px; font-family: sans-serif;">
+                        <h2>Header render error:</h2>
+                        <pre>{{ podletResponse.result | dump(2) | safe }}</pre>
+                    </div>
+                {%- endif %}
+                <main class="mds-main mds-padding-top-b5" role="main" id="main">
+                    <div class="mds-wrapper">
+                        {% block main %}Page does not override main block{% endblock %}
+                    </div>
+                </main>
+                {% if podletResponse.statusCode === 200 -%}
+                    {{ podletResponse.result.footerHtml | safe }}
+                {%- endif %}
+            </div>
+        </section>
+        {% if isFertDevelopment %}
+            <!-- development only - vite client/HMR & fert entry script -->
+            {{ viteClientScript | safe }}
+            {{ fertEntryScript | safe }}
+        {%- endif %}
+        {# Adding leaderboard placeholder to help with styling #}
+        <script type="text/javascript">
+            document.onreadystatechange = () => {
+                if (document.readyState === "interactive") {
+                    const body = document.querySelector('body');
+                    const leaderboardContainer = document.querySelector('#ad-leaderboard');
+                    body.classList.add('js');
+                    if (leaderboardContainer) {
+                        const ad = document.createElement("div");
+                        ad.setAttribute("style", "width:728px;height:90px;background-color:#f0f8ff;border:1px solid #14f;padding:20px;text-align:center;");
+                        const text = document.createTextNode("Leaderboard ad");
+                        ad.appendChild(text);
+                        leaderboardContainer.appendChild(ad);
+                    }
+                }
+            };
+        </script>
+    </body>
+</html>

package/server/templates/page1.njk ADDED Viewed

@@ -0,0 +1,37 @@
+{% extends "furniture.njk" %}
+{% block main %}
+    <ul class="mds-list mds-list--inline mds-list--pipe">
+        <li class="mds-list__item">
+        {%- if not auth.isAuthenticated -%}<a href="/?loggedin">{%- endif -%}Signed in version{%- if not auth.isAuthenticated -%}</a>{%- endif -%}
+        </li>
+        <li class="mds-list__item">
+        {%- if auth.isAuthenticated -%}<a href="/">{%- endif -%}Signed out version{%- if auth.isAuthenticated -%}</a>{%- endif -%}
+        </li>
+    </ul>
+      <div class="mds-grid-row">
+        <div class="mds-grid-col-12 mds-grid-col-lg-9 ">
+        <div class="mds-surface">
+            <div class="mds-surface__inner">
+            <h1>Page title</h1>
+            <h2>Text</h2>
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas tempus tortor nulla, id viverra lacus maximus vel.
+                In tincidunt ultrices neque in maximus. Donec leo lectus, aliquet vel molestie lacinia, elementum vel arcu. Integer
+                iaculis diam non mattis eleifend. Curabitur et tempus felis. Vestibulum tempor nec libero id blandit. Duis fermentum
+                pulvinar eleifend. Vestibulum pellentesque mauris sed augue finibus, sit amet laoreet felis fermentum. Donec in dolor id
+                elit cursus pellentesque.</p>
+            <p><a href="#">Link</a><p>
+            <p><button class="mds-button">Button</button></p>
+            </div>
+        </div>
+        </div>
+        <div class="mds-grid-col-12 mds-grid-col-lg-3">
+        <div class="mds-branded-container mds-branded-container--1 mds-padding-b4 mds-padding-bottom-b5 mds-margin-bottom-b5">
+            <h2 class="mds-font-great-primer">Branded Container</h2>
+            <p class="mds-margin-bottom-b4">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+            <a href="#" draggable="false" class="mds-button mds-button--neutral mds-button--small">Lorem ipsum</a>
+        </div>
+        </div>
+    </div>
+{% endblock %}

package/server/view-manager.js ADDED Viewed

@@ -0,0 +1,59 @@
+const Nunjucks = require('nunjucks');
+const path = require('path');
+module.exports = (server) => {
+  const fertConfig = server.fertConfig();
+  return {
+    engines: {
+      njk: {
+        compile: (src, options) => {
+          const template = Nunjucks.compile(
+            src,
+            options.environment,
+            options.filename
+          );
+          return (context) => {
+            return template.render(context);
+          };
+        },
+        prepare: (options, next) => {
+          const env = Nunjucks.configure(options.path, {
+            watch: false,
+          });
+          // pass nunjucks env for use in Vision
+          options.compileOptions.environment = env;
+          return next();
+        },
+      },
+    },
+    path: [
+      path.join(fertConfig.workingDir, './pages'), // user-created 'pages'
+      path.join(__dirname, './templates'), // fert-local base templates
+    ],
+    isCached: false,
+    async context(request) {
+      const currFertConfig = server.fertConfig();
+      const viteServerOrigin = request.server.viteServerOrigin();
+      const viteClientURL = new URL('/@vite/client', viteServerOrigin);
+      const fertEntryURL = new URL(currFertConfig.entry, viteServerOrigin);
+      const viteClientScript = `<script type="module" src="${viteClientURL}"></script>`;
+      const fertEntryScript = `<script type="module" src="${fertEntryURL}"></script>`;
+      return {
+        isFertDevelopment: true,
+        viteServerOrigin,
+        viteClientURL,
+        viteClientScript,
+        fertEntryURL,
+        fertEntryScript,
+        fertConfig: currFertConfig,
+      };
+    },
+  };
+};

package/shared/Dockerfile.brandingRepoPublish ADDED Viewed

@@ -0,0 +1,28 @@
+FROM node:18-alpine
+ENV HOME=/app/
+ARG NPM_TOKEN
+ARG GIT_USERNAME
+ARG GIT_PASSWORD
+RUN apk add git
+# Create app directory
+RUN mkdir $HOME
+WORKDIR $HOME
+COPY . $HOME
+RUN \
+  pwd && \
+  ls -la && \
+  git config --global user.email "mds-branding@madgex.com" && \
+  git config --global user.name "mds-branding" && \
+  git config --global credential.username ${GIT_USERNAME} && \
+  git config --global credential.helper "!echo password=${GIT_PASSWORD}; echo"
+RUN echo "//registry.npmjs.org/:_authToken=${NPM_TOKEN}" > .npmrc && \
+  npm install && \
+  rm -f .npmrc
+RUN npm run build

package/shared/README.md ADDED Viewed

@@ -0,0 +1,4 @@
+The docker file in this folder (`Dockerfile.brandingRepoPublish`) will be used by Jenkins to build and publish the repo assets to S3.
+When changes are pushed on a project repo, Jenkins will clone this repo, extract the docker file and use it to build and publish the assets to S3.
+If the changes are on a branch other than master, the assets will be sent to the jb-dev S3 bucket. If the changes are pushed to master, they will be sent to the production bucket.

package/vite.config.js ADDED Viewed

@@ -0,0 +1,14 @@
+const { defineConfig } = require('vite');
+const { viteStaticCopy } = require('vite-plugin-static-copy');
+module.exports = defineConfig({
+  build: {
+    // generate manifest.json in outDir
+    manifest: true,
+  },
+  plugins: [
+    viteStaticCopy({
+      targets: [{ src: 'templates/*', dest: 'templates' }],
+    }),
+  ],
+});