Add React UI

.github/workflows/build.yml

@@ -0,0 +1,221 @@
+name: Build and Test
+
+on:
+  push:
+    branches: master
+  pull_request:
+    branches: "*"
+
+jobs:
+  build:
+    name: Build tljh_repo2docker
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Conda environment with Micromamba
+        uses: mamba-org/setup-micromamba@v1
+        with:
+          environment-name: tljh
+          micromamba-version: "1.5.5-0"
+          init-shell: bash
+          create-args: >-
+            python=3.10
+            nodejs=18
+            yarn=3
+
+      - name: Setup pip cache
+        uses: actions/cache@v2
+        with:
+          path: ~/.cache/pip
+          key: pip-3.10-${{ hashFiles('setup.py') }}
+          restore-keys: |
+            pip-3.10-
+            pip-
+
+      - name: Get yarn cache directory path
+        id: yarn-cache-dir-path
+        run: echo "::set-output name=dir::$(yarn cache dir)"
+
+      - name: Setup yarn cache
+        uses: actions/cache@v2
+        id: yarn-cache
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: yarn-${{ hashFiles('frontend/yarn.lock') }}
+          restore-keys: |
+            yarn-
+
+      - name: Lint the application
+        shell: bash -l {0}
+        working-directory: frontend
+        run: |
+          set -eux
+          yarn install
+          yarn run lint:check
+
+      - name: Package the application
+        shell: bash -l {0}
+        run: |
+          set -eux
+          python -m pip install build
+          python -m build .
+
+      - name: Upload package
+        uses: actions/upload-artifact@v3
+        with:
+          name: tljh_repo2docker-artifacts
+          path: |
+            dist/tljh_repo2docker*.whl
+          if-no-files-found: error
+
+  isolated-tests:
+    name: Isolated tests
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Install Python
+        uses: actions/setup-python@v4
+        with:
+          python-version: "3.10"
+          architecture: "x64"
+
+      - uses: actions/download-artifact@v3
+        with:
+          name: tljh_repo2docker-artifacts
+
+      - name: Install and Test
+        run: |
+          set -eux
+          # Remove NodeJS, twice to take care of system and locally installed node versions.
+          sudo rm -rf $(which node)
+          sudo rm -rf $(which node)
+
+          python -m pip install git+https://github.com/jupyterhub/the-littlest-jupyterhub tljh_repo2docker*.whl
+
+      - name: Test import
+        shell: bash -l {0}
+        run: python -c "import tljh_repo2docker"
+
+  unit-tests:
+    name: Unit tests
+    needs: build
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        python-version: ["3.8", "3.9", "3.10"]
+        jupyterhub-version: [latest, 1.2.2]
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Set up Python ${{ matrix.python-version }}
+        uses: mamba-org/setup-micromamba@v1
+        with:
+          micromamba-version: "1.5.5-0"
+          environment-name: tljh
+          init-shell: bash
+          create-args: >-
+            python=${{ matrix.python-version }}
+            nodejs=18
+            yarn=3
+
+      - name: Download app package
+        uses: actions/download-artifact@v3
+        with:
+          name: tljh_repo2docker-artifacts
+
+      - name: Install package
+        shell: bash -l {0}
+        run: |
+          set -eux
+          python -m pip install -r dev-requirements.txt
+          python -m pip install tljh_repo2docker*.whl
+          npm -g install configurable-http-proxy
+
+      - name: Downgrade jupyterhub
+        if: ${{ matrix.jupyterhub-version != 'latest' }}
+        shell: bash -l {0}
+        run: |
+          python -m pip install -U 'jupyterhub==${{ matrix.jupyterhub-version }}'
+
+      - name: Run Tests
+        shell: bash -l {0}
+        run: |
+          python -m pytest --cov
+
+  integration-tests:
+    name: Integration tests
+    needs: build
+    runs-on: ubuntu-latest
+
+    env:
+      PLAYWRIGHT_BROWSERS_PATH: ${{ github.workspace }}/pw-browsers
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Conda environment with Micromamba
+        uses: mamba-org/setup-micromamba@v1
+        with:
+          micromamba-version: "1.5.5-0"
+          environment-name: tljh
+          init-shell: bash
+          create-args: >-
+            python=3.10
+            nodejs=18
+            yarn=3
+            wget
+
+      - name: Download app package
+        uses: actions/download-artifact@v3
+        with:
+          name: tljh_repo2docker-artifacts
+
+      - name: Install package
+        shell: bash -l {0}
+        run: |
+          set -eux
+          python -m pip install -r dev-requirements.txt
+          python -m pip install tljh_repo2docker*.whl
+          npm -g install configurable-http-proxy
+
+      - name: Install UI test dependencies
+        shell: bash -l {0}
+        working-directory: frontend/ui-tests
+        env:
+          PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
+        run: yarn install
+
+      - name: Set up browser cache
+        uses: actions/cache@v3
+        with:
+          path: |
+            ${{ github.workspace }}/pw-browsers
+          key: ${{ runner.os }}-${{ hashFiles('frontend/ui-tests/yarn.lock') }}
+
+      - name: Install browser
+        shell: bash -l {0}
+        run: npx playwright install chromium
+        working-directory: frontend/ui-tests
+
+      - name: Execute integration tests
+        shell: bash -l {0}
+        working-directory: frontend/ui-tests
+        run: |
+          npx playwright test
+
+      - name: Upload Playwright Test report
+        if: always()
+        uses: actions/upload-artifact@v3
+        with:
+          name: tljh-playwright-tests
+          path: |
+            frontend/ui-tests/test-results
+            frontend/ui-tests/playwright-report

.gitignore

@@ -7,8 +7,8 @@ docs/_build
 docs/build
 .ipynb_checkpoints
 jupyterhub_cookie_secret
-jupyterhub.sqlite
-jupyterhub-proxy.pid
+**/jupyterhub.sqlite
+**/jupyterhub-proxy.pid
 *.egg-info
 MANIFEST
 .coverage
@@ -19,3 +19,11 @@ MANIFEST
 
 # Local TLJH config file
 config.yaml
+
+.yarn
+node_modules
+frontend/dist
+frontend/lib
+frontend/ui-tests/playwright-report
+frontend/ui-tests/test-results
+**/js/react/

CONTRIBUTING.md

@@ -13,7 +13,7 @@ Check out the official Docker documentation to know how to install Docker on you
 Using `mamba` / `conda`:
 
 ```bash
-mamba create -n tljh-repo2docker -c conda-forge python nodejs
+mamba create -n tljh-repo2docker -c conda-forge python nodejs yarn=3
 conda activate tljh-repo2docker
 ```
 

MANIFEST.in

@@ -1,3 +1,8 @@
 recursive-include tljh_repo2docker/templates/ *
 recursive-include tljh_repo2docker/static/ *
 recursive-include tljh_repo2docker/tests/ *
+recursive-include frontend/ *
+
+prune frontend/node_modules
+prune frontend/lib
+prune frontend/.yarn

README.md

@@ -69,6 +69,24 @@ On GitHub and GitLab, a user might have to first create an access token with `re
 
 ![image](https://user-images.githubusercontent.com/591645/107350843-39c3bf80-6aca-11eb-8b82-6fa95ba4c7e4.png)
 
+### Set CPU and Memory via machine profiles
+
+Instead of entering directly the CPU and Memory value, `tljh-repo2docker` can be configured with pre-defined machine profiles and users can only choose from the available options. The following snippet will add 3 machines with labels `Small`, `Medium` and `Large` to the profile list:
+
+```python
+from tljh.configurer import apply_config, load_config
+
+tljh_config = load_config()
+tljh_config["limits"]["machine_profiles"] = [
+    {"label": "Small", "cpu": 2, "memory": 2},
+    {"label": "Medium", "cpu": 4, "memory": 4},
+    {"label": "Large", "cpu": 8, "memory": 8},
+]
+apply_config(tljh_config, c)
+```
+
+![image](https://github.com/plasmabio/tljh-repo2docker/assets/4451292/c1f0231e-a02d-41dc-85e0-97a97ffa0311)
+
 ### Extra documentation
 
 `tljh-repo2docker` is currently developed as part of the [Plasma project](https://github.com/plasmabio/plasma).
@@ -81,4 +99,4 @@ See: https://repo2docker.readthedocs.io/en/latest/howto/jupyterhub_images.html
 
 ## Run Locally
 
-Check out the instructions in [CONTRIBUTING.md](./CONTRIBUTING.md) to setup a local environment.
+Check out the instructions in [CONTRIBUTING.md](./CONTRIBUTING.md) to set up a local environment.

frontend/.yarnrc.yml

@@ -0,0 +1,2 @@
+nodeLinker: node-modules
+enableImmutableInstalls: false