Issue with Middleware Order in HttpRouter Configuration

import { HttpMiddleware, HttpRouter, HttpServer, HttpServerResponse } from "@effect/platform"
import { NodeHttpServer, NodeRuntime } from "@effect/platform-node"
import { Layer } from "effect"
import { createServer } from "node:http"

const mw1 = HttpMiddleware.make(() => HttpServerResponse.text("foo"))
const mw2 = HttpMiddleware.make((app) => app)

export const app = HttpRouter.empty.pipe(
  HttpRouter.use(mw1),
  HttpRouter.use(mw2),
  HttpServer.serve()
)

const ServerLive = app.pipe(
  Layer.provide(NodeHttpServer.layer(createServer, { port: 4000 }))
)

Layer.launch(ServerLive).pipe(NodeRuntime.runMain)

import { HttpMiddleware, HttpRouter, HttpServer, HttpServerResponse } from "@effect/platform"
import { NodeHttpServer, NodeRuntime } from "@effect/platform-node"
import { Layer } from "effect"
import { createServer } from "node:http"

const mw1 = HttpMiddleware.make(() => HttpServerResponse.text("foo"))
const mw2 = HttpMiddleware.make((app) => app)

export const app = HttpRouter.empty.pipe(
  HttpRouter.use(mw1),
  HttpRouter.use(mw2),
  HttpServer.serve()
)

const ServerLive = app.pipe(
  Layer.provide(NodeHttpServer.layer(createServer, { port: 4000 }))
)

Layer.launch(ServerLive).pipe(NodeRuntime.runMain)