web

.dockerignore

@@ -16,4 +16,7 @@
 /pangraph.tar.gz
 /vendor
 /playgrounds
-/script
+/script
+\.build/
+\.cache/
+node_modules/

.gitignore

@@ -1,33 +1,33 @@
 \.cache
-.dep
-.local
-data
-viewer
-figs
-log
-docs/build
-docs/repo
-notes/
-vendor
-pangraph
-pangraph.tar.gz
-bin
-tutorial
-playgrounds
-.vscode
-script/synthetic_data
-script/panx_data
-script/.snakemake
-script/projections
-script/size-benchmark
-script/incremental_size
-script/panx_results
-script/local_scripts
+/\.dep
+/\.local
+/data
+/viewer
+/figs
+/log
+/docs/build
+/docs/repo
+/notes/
+/vendor
+/pangraph
+/pangraph.tar.gz
+/bin
+/tutorial
+/playgrounds
+/\.vscode
+/script/synthetic_data
+/script/panx_data
+/script/.snakemake
+/script/projections
+/script/size-benchmark
+/script/incremental_size
+/script/panx_results
+/script/local_scripts
 __pycache__
-tests/data
+/tests/data
 
-deps/minimap2/build
-deps/minimap2/products
+/deps/minimap2/build
+/deps/minimap2/products
 
 *.aux
 *.bbl

.nvmrc

@@ -0,0 +1 @@
+18.14.2

.vercelignore

@@ -0,0 +1,21 @@
+/.cache
+/.dep
+/.env
+/.github
+/.idea
+/.local
+/.vscode*
+/Dockerfile
+/data
+/deps/minimap2/build
+/deps/minimap2/products
+/docs
+/example_datasets
+/pangraph
+/pangraph.tar.gz
+/vendor
+/playgrounds
+/script
+\.build/
+\.cache/
+node_modules/

docker-dev

@@ -0,0 +1,41 @@
+#!/usr/bin/env bash
+
+set -euo pipefail
+
+export NICE="nice -14 ionice -c2 -n3"
+
+DOCKER_REPO="neherlab/pangraph"
+DOCKER_IMAGE_NAME_SAFE="${DOCKER_REPO//\//-}"
+DOCKER_CONTAINER_NAME="${DOCKER_IMAGE_NAME_SAFE}-$(date +%s)"
+
+USER="user"
+GROUP="group"
+
+DEFAULT_COMMAND="cd web && yarn install && yarn dev"
+
+${NICE} docker build -q \
+  --file="docker/docker-dev.dockerfile" \
+  --tag="${DOCKER_REPO}" \
+  --network=host \
+  --build-arg="UID=$(id -u)" \
+  --build-arg="GID=$(id -g)" \
+  --build-arg="USER=${USER}" \
+  --build-arg="GROUP=${GROUP}" \
+  "$(pwd)" >/dev/null
+
+${NICE} docker run -it --rm \
+  --network=host \
+  --init \
+  --name="${DOCKER_CONTAINER_NAME}" \
+  --hostname="${DOCKER_IMAGE_NAME_SAFE}" \
+  --user="$(id -u):$(id -g)" \
+  --volume="$(pwd):/workdir" \
+  --workdir="/workdir" \
+  --env="UID=$(id -u)" \
+  --env="GID=$(id -g)" \
+  --env="USER=${USER}" \
+  --env="GROUP=${GROUP}" \
+  --env="PS1=\${USER}@\${HOST}" \
+  --ulimit core=0 \
+  "${DOCKER_REPO}" \
+  bash -c "set -euo pipefail; ${*:-${DEFAULT_COMMAND}}"

docker/docker-dev.dockerfile

@@ -0,0 +1,91 @@
+# Freeze base image version to
+# ubuntu:20.04 (pushed 2023-02-01T17:52:39.31842Z)
+# https://hub.docker.com/layers/ubuntu/library/ubuntu/20.04/images/sha256-bffb6799d706144f263f4b91e1226745ffb5643ea0ea89c2f709208e8d70c999
+FROM ubuntu@sha256:bffb6799d706144f263f4b91e1226745ffb5643ea0ea89c2f709208e8d70c999
+
+SHELL ["bash", "-euxo", "pipefail", "-c"]
+
+ARG NODEMON_VERSION="2.0.15"
+ARG YARN_VERSION="1.22.18"
+
+RUN set -euxo pipefail >/dev/null \
+&& export DEBIAN_FRONTEND=noninteractive \
+&& apt-get update -qq --yes \
+&& apt-get install -qq --no-install-recommends --yes \
+  bash \
+  bash-completion \
+  build-essential \
+  ca-certificates \
+  curl \
+  git \
+  gnupg \
+  python3 \
+  python3-pip \
+  python3-setuptools \
+  python3-wheel \
+  sudo \
+  time \
+>/dev/null \
+&& apt-get clean autoclean >/dev/null \
+&& apt-get autoremove --yes >/dev/null \
+&& rm -rf /var/lib/apt/lists/*
+
+ARG USER=user
+ARG GROUP=user
+ARG UID
+ARG GID
+
+ENV USER=$USER
+ENV GROUP=$GROUP
+ENV UID=$UID
+ENV GID=$GID
+ENV TERM="xterm-256color"
+ENV HOME="/home/${USER}"
+ENV NODE_DIR="/opt/node"
+ENV PATH="${NODE_DIR}/bin:${HOME}/.local/bin:${PATH}"
+
+
+# Install Node.js
+COPY .nvmrc /
+RUN set -eux >dev/null \
+&& mkdir -p "${NODE_DIR}" \
+&& cd "${NODE_DIR}" \
+&& NODE_VERSION=$(cat /.nvmrc) \
+&& curl -fsSL  "https://nodejs.org/dist/v${NODE_VERSION}/node-v${NODE_VERSION}-linux-x64.tar.xz" | tar -xJ --strip-components=1 \
+&& npm install -g nodemon@${NODEMON_VERSION} yarn@${YARN_VERSION} >/dev/null
+
+
+# Calm down the (in)famous chatter from yarn
+RUN set -euxo pipefail >/dev/null \
+&& sed -i'' "s/this.reporter.warn(this.reporter.lang('incompatibleResolutionVersion', pattern, reqPattern));//g" "${NODE_DIR}/lib/node_modules/yarn/lib/cli.js" \
+&& sed -i'' "s/_this2\.reporter.warn(_this2\.reporter.lang('ignoredScripts'));//g" "${NODE_DIR}/lib/node_modules/yarn/lib/cli.js" \
+&& sed -i'' 's/_this3\.reporter\.warn(_this3\.reporter\.lang(peerError.*;//g' "/opt/node/lib/node_modules/yarn/lib/cli.js"
+
+
+# Make a user and group
+RUN set -euxo pipefail >/dev/null \
+&& \
+  if [ -z "$(getent group ${GID})" ]; then \
+    addgroup --system --gid ${GID} ${GROUP}; \
+  else \
+    groupmod -n ${GROUP} $(getent group ${GID} | cut -d: -f1); \
+  fi \
+&& \
+  if [ -z "$(getent passwd ${UID})" ]; then \
+    useradd \
+      --system \
+      --create-home --home-dir ${HOME} \
+      --shell /bin/bash \
+      --gid ${GROUP} \
+      --groups sudo \
+      --uid ${UID} \
+      ${USER}; \
+  fi \
+&& sed -i /etc/sudoers -re 's/^%sudo.*/%sudo ALL=(ALL:ALL) NOPASSWD: ALL/g' \
+&& sed -i /etc/sudoers -re 's/^root.*/root ALL=(ALL:ALL) NOPASSWD: ALL/g' \
+&& sed -i /etc/sudoers -re 's/^#includedir.*/## **Removed the include directive** ##"/g' \
+&& echo "foo ALL=(ALL) NOPASSWD: ALL" >> /etc/sudoers \
+&& touch ${HOME}/.hushlogin \
+&& chown -R ${UID}:${GID} "${HOME}"
+
+USER ${USER}

docs/src/dev/building-web.md

@@ -0,0 +1,74 @@
+# Building Pangraph web app
+
+## Install dependencies
+
+Install Node.js version 18+ (the latest LTS release is recommended), by either downloading it from the official website: https://nodejs.org/en/download/, or by using [nvm](https://github.com/nvm-sh/nvm). We don't recommend using Node.js from the package manager of your operating system, and neither from conda nor other sources. Make sure the `node`, `npm` and `yarn` executables are in your `$PATH`:
+
+```bash
+node --version
+npm --version
+yarn --version
+```
+
+## Build and run in development mode
+
+Development mode is suitable only for local day-to-day development. It is relatively fast to build and rebuild (incrementally), slow to run, contains lots of debug info. It looks and feels mostly like the final app the users will see, but the way it is implemented is very different. So dev mode is only suitable for day-to-day dev tasks. All testing must be performed on production app.
+
+In order to build and run the app in dev mode. Run this sequence of commands:
+
+```bash
+cd web
+
+# Prepare environment variables with default values
+cp .env.example .env
+
+# Install dependency packages
+yarn install
+
+# Run development server
+yarn dev
+```
+
+Open http://localhost:3000 in the browser.
+
+The build is lazy, so page code is only compiled when you make a request that page in the browser. Code modifications should trigger incremental rebuild and fast refresh in the browser.
+
+
+## Build and run in production mode
+
+Production version of the app closely corresponds to what will be shipped to end users. The build is always a full build and the result of it are the HTML, CSS and JS files which can be served using any static web server.
+
+In order to build and run the app in production mode (fast to build, slow to run, lots of debug info) Run this sequence of commands:
+
+```bash
+cd web
+
+# Prepare environment variables with default values
+cp .env.example .env
+
+# Install dependency packages
+yarn install
+
+# Build production app files
+yarn prod:build
+
+# Serve production app files locally
+yarn prod:serve
+
+# There is also a shortcut that runs prod:build && prod:serve:
+# yarn prod
+```
+
+Open a http://localhost:8080 in the browser.
+
+The production version has no fast refresh and it always performs the full rebuild.
+
+
+## Deployment
+
+TODO
+
+
+## Feedback
+
+If something does not work, or if you have ideas on improving the build setup, feel free to open an issue or a pull request.

vercel.json

@@ -0,0 +1,8 @@
+{
+  "rewrites": [
+    {
+      "source": "/(.*)",
+      "destination": "/index.html"
+    }
+  ]
+}

web/.browserslistrc

@@ -0,0 +1,10 @@
+[production]
+defaults
+cover 99.5%
+since 2015
+ie >= 10
+safari >= 10
+
+[development]
+last 5 Chrome versions
+last 5 Firefox versions

web/.editorconfig

@@ -0,0 +1,17 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+max_line_length = 120
+trim_trailing_whitespace = true
+
+[{*.txt,*.rst,*.md,*.mdx,*.tex}]
+max_line_length = 9999999
+trim_trailing_whitespace = false
+
+[{Makefile,*.makefile,go.mod,go.sum,*.go}]
+indent_style = tab

web/.env.example

@@ -0,0 +1,20 @@
+FULL_DOMAIN=autodetect
+DATA_ROOT_URL=/data
+
+WEB_PORT_DEV=3000
+WEB_PORT_PROD=8080
+WEB_PORT_ANALYZE=8888
+
+NEXT_TELEMETRY_DISABLED=0
+RECOIL_DUPLICATE_ATOM_KEY_CHECKING_ENABLED=false
+
+DEV_ENABLE_TYPE_CHECKS=1
+DEV_ENABLE_ESLINT=1
+
+PROD_ENABLE_SOURCE_MAPS=1
+PROD_ENABLE_TYPE_CHECKS=1
+PROD_ENABLE_ESLINT=1
+
+PROFILE=0
+
+WATCH_POLL=0

web/.env.vercel

@@ -0,0 +1,20 @@
+FULL_DOMAIN=autodetect
+DATA_ROOT_URL=/data
+
+WEB_PORT_DEV=3000
+WEB_PORT_PROD=null
+WEB_PORT_ANALYZE=8888
+
+NEXT_TELEMETRY_DISABLED=0
+RECOIL_DUPLICATE_ATOM_KEY_CHECKING_ENABLED=false
+
+DEV_ENABLE_TYPE_CHECKS=1
+DEV_ENABLE_ESLINT=1
+
+PROD_ENABLE_SOURCE_MAPS=1
+PROD_ENABLE_TYPE_CHECKS=0
+PROD_ENABLE_ESLINT=0
+
+PROFILE=0
+
+WATCH_POLL=0