add Storybook

[PiDelport]

Issues:

• Create frontend codebase scaffolding #3
• Set up static sites for dev #10

Depends on:

• build(web-client): add prettier #9

[codecov]

Codecov Report

Merging #8 (f92eca3) into web-client/build-add-prettier (0eec038) will not change coverage.
The diff coverage is n/a.

❗ Current head f92eca3 differs from pull request most recent head ac7bc77. Consider uploading reports for the commit ac7bc77 to get more accurate results

@@                       Coverage Diff                       @@
##           web-client/build-add-prettier        #8   +/-   ##
===============================================================
  Coverage                         100.00%   100.00%           
===============================================================
  Files                                  4         4           
  Lines                                  8         8           
===============================================================
  Hits                                   8         8           

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 0eec038...ac7bc77. Read the comment docs.

[PiDelport]

Hmm, it looks like one of the Storybook dependencies in 9e7dc54 breaks build:prod (but not build).

I'll investigate.

[PiDelport]

Investigation

It looks like this is one those npm issues… 🤦🏼‍♀️

At first, I had trouble reproducing this reliably: a normal npm install would not trigger the crash after updating to the breaking changeset (or stop the crash, after switching to the parent changeset), but a full npm ci would.

In theory, the result of those two commands should be the same, but they're not.

To inspect closer, 🕵🏼‍♀️ I compared snapshots of the working and non-working node-modules, and apparently the breaking difference is that the contents of the cssnano-utils package somehow gets replaced with the contents of the postcss-values-parser package (which doesn't seem related), in the same directory. 🤯

It looks like something went wrong in package-lock.json:

     "cssnano-utils": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/cssnano-utils/-/cssnano-utils-2.0.1.tgz",
-      "integrity": "sha512-i8vLRZTnEH9ubIyfdZCAdIdgnHAUeQeByEeQ2I7oTilvP9oHO6RScpeq3GsFUVqeB8uZgOQ9pw8utofNn32hhQ==",
+      "resolved": "https://registry.npmjs.org/postcss-values-parser/-/postcss-values-parser-2.0.1.tgz",
+      "integrity": "sha512-2tLuBsA6P4rYTNKCXYG/71C7j1pU6pK503suYOmn4xYrQIzW+opD+7FAFNuGSdZC/3Qfy334QbeMu7MEb8gOxg==",
       "dev": true,
-      "requires": {}
+      "requires": {
+        "flatten": "^1.0.2",
+        "indexes-of": "^1.0.1",
+        "uniq": "^1.0.1"
+      }
     },

This could have happened due to some npm resolution weirdness, or a particularly unlucky automatic mis-merge alignment, or something else?

I'll try to fix this by replaying the dependency additions in a separate commit.

[PiDelport]

That fixed it! 🎉

Diff: 3760107..bb95236