BUILD.bazel

load("@build_bazel_rules_nodejs//:index.bzl", "pkg_web")
load("@npm//history-server:index.bzl", "history_server")
load("//tools:defaults.bzl", "devmode_esbuild", "esbuild", "html_insert_assets", "http_server", "ng_module", "sass_binary")
load("//tools/angular:index.bzl", "LINKER_PROCESSED_FW_PACKAGES")

package(default_visibility = ["//visibility:public"])

# Run the sass compiler to output "styles.css"
sass_binary(
    name = "styles",
    src = "styles.scss",
    include_paths = ["external/npm/node_modules"],
    sourcemap = False,
    deps = ["//src/angular/styles:scss_lib"],
)

ng_module(
    name = "showcase",
    srcs = glob(
        include = ["*.ts"],
        exclude = [
            "**/*.spec.ts",
            "main.ts",
        ],
    ),
    tsconfig = ":tsconfig.json",
    deps = [
        "//src/showcase/app",
        "@npm//@angular/core",
        "@npm//@angular/platform-browser",
    ],
)

devmode_esbuild(
    name = "dev-bundles",
    args = {
        "resolveExtensions": [".js"],
    },
    entry_points = [":main.dev.ts"],
    format = "esm",
    platform = "browser",
    sources_content = True,
    splitting = True,
    # We cannot use `ES2017` or higher as that would result in `async/await` not being downleveled.
    # ZoneJS needs to be able to intercept these as otherwise change detection would not work properly.
    target = "es2016",
    # Note: We add all linker-processed FW packages as dependencies here so that ESBuild will
    # map all framework packages to their linker-processed bundles from `tools/angular`.
    deps = LINKER_PROCESSED_FW_PACKAGES + [
        ":showcase",
    ],
)

esbuild(
    name = "ng_localize",
    args = {
        "resolveExtensions": [
            ".mjs",
            ".js",
        ],
    },
    entry_point = "ng-localize-bundle.js",
    format = "iife",
    minify = True,
    sourcemap = "external",
    deps = [
        "//src/angular/i18n",
        "@npm//@angular/common",
        "@npm//@angular/core",
        "@npm//@angular/localize",
    ],
)

_ASSETS = [
    ":styles.css",
    # We load zone.js outside the bundle. That's because it's a "polyfill"
    # which speculates that such features might be available in a browser.
    # Also it's tricky to configure dead code elimination to understand that
    # zone.js is used, given that we don't have any import statement that
    # imports from it.
    "@npm//:node_modules/zone.js/bundles/zone.umd.min.js",
    # We need to load the global $localize before the app.
    ":ng_localize.js",
]

# Insert script tags into index.html
# Supports differential loading by providing a.js and a.mjs
html_insert_assets(
    name = "index_html_dev",
    outs = ["index.html"],
    args = [
        "--html=$(execpath :index.template.html)",
        "--stamp=none",
        "--out=$@",
        "--roots=. $(RULEDIR)",
        "--assets",
    ] + ["$(execpath %s)" % s for s in _ASSETS] + [
        "--scripts --module dev-bundles/main.dev.js",
    ],
    data = [
        ":dev-bundles",
        ":index.template.html",
    ] + _ASSETS,
)

# File group for all static files which are needed to serve the dev-app. These files are
# used in the devserver as runfiles and will be copied into the static web package that can
# be deployed on static hosting services (like firebase).
filegroup(
    name = "dev_app_static_files",
    srcs = [
        ":index.html",
        "//src/showcase/assets",
    ] + _ASSETS,
)

http_server(
    name = "devserver",
    srcs = [":dev_app_static_files"],
    additional_root_paths = [
        "npm/node_modules",
        # Needed for compatibility with "pkg_web" which always uses the tree
        # artifact output as workspace root.
        "sbb_angular",
    ],
    enable_dev_ui = True,
    # List of environment variables that will be made available as `window.<NAME>` in the
    # served `index.html` through an injected script. Useful for allowing developers to
    # configure API keys without requiring secrets to be committed.
    # example: `["API_KEY"]` => and then reference as `window.API_KEY`
    environment_variables = [
        "JM_API_KEY",
        "LEGACY_VERSIONS",
        "ENVIRONMENT_BANNER_TEXT",
    ],
    tags = ["manual"],
    deps = [
        ":dev-bundles",
        "//src/showcase/assets",
    ],
)

esbuild(
    name = "prod-bundles",
    args = {
        "resolveExtensions": [
            ".mjs",
            ".js",
        ],
        "sourcemap": False,
    },
    entry_point = "main.prod.ts",
    format = "esm",
    minify = True,
    output_dir = True,
    splitting = True,
    tags = ["prod-showcase"],
    # Note: We add all linker-processed FW packages as dependencies here so that ESBuild will
    # map all framework packages to their linker-processed bundles from `tools/angular`.
    deps = LINKER_PROCESSED_FW_PACKAGES + [
        ":showcase",
    ],
)

# Insert script tags into index.html
# Supports differential loading by providing a.js and a.mjs
html_insert_assets(
    name = "index_html_prod",
    # we can't output "src/showcase/index.html" since that collides with the devmode file.
    # pkg_web rule will re-root paths that start with _{name} by default
    # so we output "_prodapp/src/index.html" so that it is mapped to
    # `index.html` in the web package.
    outs = ["_prodapp/src/index.html"],
    args = [
        "--html=$(execpath :index.template.html)",
        "--out=$@",
        "--roots=. $(RULEDIR)/_prodapp/src $(RULEDIR)",
        "--assets",
    ] + ["$(execpath %s)" % s for s in _ASSETS] + [
        "--scripts --module prod-bundles/main.prod.js",
    ],
    data = _ASSETS + [
        ":index.template.html",
    ],
    tags = ["prod-showcase"],
)

pkg_web(
    name = "prodapp",
    srcs = _ASSETS + [
        ":index_html_prod",
        ":prod-bundles",
        "//src/showcase/assets",
    ],
    # In production mode we serve some polyfills with script tags that have hard-coded paths in the index.html
    # so we must serve them at that path, by stripping a prefix
    additional_root_paths = [
        "src/showcase/_prodapp/src",
        "tools/umd-modules",
    ],
    tags = ["prod-showcase"],
)

history_server(
    name = "prodserver",
    args = [
        "--port",
        "4200",
    ],
    data = [":prodapp"],
    tags = ["prod-showcase"],
    templated_args = [
        "-a",
        "$$(rlocation $(rootpath :prodapp))",
    ],
)

exports_files([
    "tsconfig.json",
])