Build the frontend with nix and add to container

frontend/next.config.mjs

@@ -7,7 +7,8 @@ const nextConfig =
         destination: 'http://localhost:8080/:path*' // Proxy to Backend
       }
     ]
-  }
+  },
+  output: 'export'
   };
 
 export default nextConfig;

nix/containers.nix

@@ -1,37 +1,29 @@
 { repoRoot, inputs, pkgs, lib, system }: let
 
-staticFilesDerivation = pkgs.stdenv.mkDerivation {
-  name = "staticFiles";
-  src = ../generated;
-  unpackPhase = "true";
+frontendNpm = pkgs.buildNpmPackage rec {
+  name = "frontend";
+  src = ../frontend;
+  npmDepsHash = "sha256-Oz7pdTMJVgGj5rzjIMvDjaOV7JU+hYLHoSSb+OcJARk=";
+  npmPackFlags = [ "--ignore-scripts" ];
   installPhase = ''
-    ls -alh "$src"
-    mkdir -p "$out"
-    cp -r $src/html $out
-    ls -alh $out
+    mkdir -p $out/frontend
+    cp -r out/* $out/frontend
   '';
 };
 
-staticFiles = pkgs.buildEnv {
-  name = "staticFiles";
-  paths = [
-    # the actual payload we want
-    staticFilesDerivation
-    # allow interactivity with the image
-    # NOTE: Uncomment the lines below if you need a shell inside the image
-    # (for example when debugging the image contents)
-    # pkgs.bashInteractive
-    # pkgs.coreutils
-  ];
-  pathsToLink = [ "/html" "/bin" ];
-  extraOutputsToInstall = [ "/html" ];
+frontend = pkgs.buildEnv {
+  name = "frontend";
+  paths = [ frontendNpm ];
 };
 
 in rec {
 
   # Builds a docker container for the cabal executable given as input. First we
   # build the container json itself. Note the explicit architecture.
   #
+  # NOTE: I don't think iogx.mkContainerFromCabalExe enables linking in the base image correctly. Hence the more manual construction below.
+  # TODO: Consider patching iogx if that is the case?
+  #
   # NOTE: The following commands produce a nice test environment for the container
   # Build via nix first
   #
@@ -42,7 +34,7 @@ in rec {
   #$ ./result/bin/copy-to dir:./tmp
   #
   # Now we can run the container (the tx is just some random I copied from the explorer)
-  #$ podman run --publish 8080:8080 --env WST_BLOCKFROST_TOKEN=REPLACE_ME_APIKEY dir:./tmp manage 76e2cfb0b087873ef50a3f709fa6ab3df21bdd5b67c1254837cc353613524251.0 start --static-files /html
+  #$ podman run --publish 8080:8080 --env WST_BLOCKFROST_TOKEN=REPLACE_ME_APIKEY dir:./tmp manage 76e2cfb0b087873ef50a3f709fa6ab3df21bdd5b67c1254837cc353613524251.0 start --static-files /frontend
   #
   # NOTE: To build the oci container image run:
   #
@@ -58,27 +50,13 @@ in rec {
       };
     };
     layers = [
+      # npm-created data for frontend
       (inputs.n2c.packages.nix2container.buildLayer {
-        copyToRoot = [staticFiles];
+        copyToRoot = [frontend];
       })
     ];
   };
 
-  # NOTE: I don't think iogx.mkContainerFromCabalExe enables linking in the base image correctly. Hence the more manual construction above.
-  # TODO: Consider patching iogx if that is the case?
-
-  # Builds a docker container for the cabal executable given as input. First we
-  # build the container json itself. Note the explicit architecture.
-  #
-  # $ nix build .#containers.x86_64-linux.wstBinary
-  #
-  # wstBinary = lib.iogx.mkContainerFromCabalExe {
-  #   exe = inputs.self.packages.wst-poc-cli;
-  #   name = "wst-poc";
-  #   description = "WST Proof of Concept";
-  #   # packages = [ staticFiles staticFilesDerivation ];
-  #   sourceUrl = "https://github.com/input-output-hk/wsc-poc";
-  # };
 
   wst-poc-mock-server = lib.iogx.mkContainerFromCabalExe {
     exe = inputs.self.packages.wst-poc-mock-server;