daml/navigator/frontend/BUILD.bazel

# Copyright (c) 2019 The DAML Authors. All rights reserved.
# SPDX-License-Identifier: Apache-2.0

load("@build_bazel_rules_nodejs//:defs.bzl", "nodejs_binary")
load("@os_info//:os_info.bzl", "is_windows")

filegroup(
    name = "src",
    srcs = glob(["src/**"]),
)

# TODO: Set up a target for generating GraphQL query definition files.
# Currently, these checked in, and updated with 'make update-graphql-types'.
# TODO: Consider switching from Apollo to https://github.com/dotansimha/graphql-code-generator,
# as the latter can be configured such that no postprocessing on the generated files is necessary.
# nodejs_binary(
#   name = "apollo_codegen",
#   entry_point = "node_modules/apollo/bin/run",
#   data = [
#       "@navigator_frontend_deps//apollo",
#       ":src_files"
#   ],
#   templated_args = [
#     "client:codegen",
#     "-c ./apollo.config.js",
#     "--passthroughCustomScalars",
#     "--customScalarsPrefix=OpaqueTypes.",
#     "--outputFlat",
#     "--target",
#     "typescript",
#     "--includes=\"$(location :src)/ui-core/**/*.ts*\"",
#     "$(location :src)/ui-core/src/api/QueriesBody.txt"
#   ]
# )

# Webpack build tool
# The webpack config is a JavaScript file that can import other modules.
# These dependencies are not automagically detected by the pregenerated
# "@navigator_frontend_deps//webpack/bin:webpack" target, so we need to create
# a custom node.js binary that has access to all plugins loaded by webpack at runtime.
nodejs_binary(
    name = "webpack",
    entry_point = "@navigator_frontend_deps//:node_modules/webpack/bin/webpack.js",
    node_modules = "@navigator_frontend_deps//:node_modules",
    # The webpack build step requires almost all of the node_modules dependencies
    # data = [
    #  ...
    # ],
)

# Builds the frontend single page application and bundles all output files
# (HTML + JavaScript + CSS + images) in a .tgz or .jar archive.
genrule(
    name = "frontend",
    srcs = [
        "webpack.config.js",
        "declarations.d.ts",
        "tsconfig.json",
        "tslint.json",
        "package.json",
        ".modernizrrc",
        ":src",
        "@navigator_frontend_deps//:node_modules",
    ],
    outs = [
        "frontend.tgz",
        "frontend.jar",
    ],
    cmd = """
    # Working directories
    export IN="$$(pwd)/$(@D)/in"
    export OUT="$$(pwd)/$(@D)/out"
    export WP_IN={WP_IN}
    export WP_OUT={WP_OUT}
    rm -rf $$IN $$OUT
    mkdir "$$IN" "$$OUT"

    # Our tools (node.js, webpack, webpack plugins, typescript) do not work nicely
    # with symbolic links and a node_modules directory that is not in the project root.
    # All input files are therefore copied to a working directory.
    cp -rL "$$(pwd)/$$(dirname $(execpath declarations.d.ts))/src" "$$IN/src"
    cp -rL "$$(pwd)/external/navigator_frontend_deps/node_modules" "$$IN/node_modules"
    cp -L "$$(pwd)/$(execpath webpack.config.js)" "$$IN/webpack.config.js"
    cp -L "$$(pwd)/$(execpath .modernizrrc)" "$$IN/.modernizrrc"
    cp -L "$$(pwd)/$(execpath tsconfig.json)" "$$IN/tsconfig.json"
    cp -L "$$(pwd)/$(execpath tslint.json)" "$$IN/tslint.json"
    cp -L "$$(pwd)/$(execpath declarations.d.ts)" "$$IN/declarations.d.ts"

    # Webpack needs the HOME variable to be set
    export HOME="$$IN"

    # Run webpack.
    # To debug, add the following options:
    # -d --progress --display-error-details --verbose
    $(execpath :webpack) \
      --config="$$IN/webpack.config.js" \
      --env.prod \
      --env.paths_case_check="{PATHS_CASE_CHECK}" \
      --env.bazel_in_dir="$$WP_IN" \
      --env.bazel_out_dir="$$WP_OUT/frontend"

    # Package result (.TGZ)
    # To debug, change 'czf' to 'czfv'.
    echo "Packaging result from $$OUT to $(@D)/frontend.tgz"
    tar czf "$(@D)/frontend.tgz" -C $$OUT .

    # Package result (.JAR)
    echo "Packaging result from $$OUT to $(@D)/frontend.jar"
    $(location @bazel_tools//tools/jdk:jar) c0Mf "$(@D)/frontend.jar" -C $$OUT .
    """.format(
        PATHS_CASE_CHECK = "false" if is_windows else "true",
        WP_IN = "$$(cygpath -w $$IN)" if is_windows else "$$IN",
        WP_OUT = "$$(cygpath -w $$OUT)" if is_windows else "$$OUT",
    ),
    toolchains = ["@bazel_tools//tools/jdk:current_java_runtime"],
    tools = [
        ":webpack",
        "@bazel_tools//tools/jdk:jar",
    ],
    visibility = [
        "//navigator:__subpackages__",
    ],
)