From 9d2da160b180905c38d811e2a86ac033dea3d111 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Fern=C3=A1ndez=20de=20Alba?= Date: Tue, 21 May 2024 16:42:30 +0200 Subject: [PATCH] Improvements from moving sneridagh.dev to the new setup (#20) * knowledge from moving sneridagh.dev to the new setup * Better now * Try to fix tests * Finally * Fix Readme RST in backend --- .../README.md | 3 +- project/cookiecutter.json | 4 + .../.github/workflows/frontend.yml | 68 +++++++--- sub/project_settings/cookiecutter.json | 7 +- sub/project_settings/tests/test_cutter.py | 1 + .../frontend/.dockerignore | 2 - .../frontend/Dockerfile | 74 +++------- .../frontend/Makefile | 126 ++++++++++++++++++ 8 files changed, 206 insertions(+), 79 deletions(-) create mode 100644 sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/Makefile diff --git a/backend_addon/{{ cookiecutter.__folder_name }}/README.md b/backend_addon/{{ cookiecutter.__folder_name }}/README.md index f8ab205..7ca026a 100644 --- a/backend_addon/{{ cookiecutter.__folder_name }}/README.md +++ b/backend_addon/{{ cookiecutter.__folder_name }}/README.md @@ -12,8 +12,7 @@ This package contains a simple volto configuration. -Installation ------------- +## Installation Install {{ cookiecutter.python_package_name }} with `pip`: diff --git a/project/cookiecutter.json b/project/cookiecutter.json index 9a031c0..42e3ad0 100644 --- a/project/cookiecutter.json +++ b/project/cookiecutter.json @@ -36,6 +36,7 @@ "1", "0" ], + "__npm_package_name": "{{ cookiecutter.frontend_addon_name }}", "__folder_name": "{{ cookiecutter.project_slug }}", "__python_package_name_upper": "{{ cookiecutter.python_package_name | pascal_case }}", "__node_version": "{{ cookiecutter.volto_version | node_version_for_volto }}", @@ -51,6 +52,9 @@ "__pre_commit_version": "3.7.1", "__gha_enable": true, "__gha_version_checkout": "v4", + "__gha_version_setup_node": "v4", + "__gha_version_setup_pnpm": "v4", + "__gha_version_cache": "v4", "__gha_version_docker_stack": "v1.2.0", "__gha_version_code_analysis": "v2", "__gha_version_docker_metadata": "v5", diff --git a/project/{{ cookiecutter.__folder_name }}/.github/workflows/frontend.yml b/project/{{ cookiecutter.__folder_name }}/.github/workflows/frontend.yml index 41e8453..d32bee4 100644 --- a/project/{{ cookiecutter.__folder_name }}/.github/workflows/frontend.yml +++ b/project/{{ cookiecutter.__folder_name }}/.github/workflows/frontend.yml @@ -17,6 +17,23 @@ defaults: working-directory: ./frontend jobs: + meta: + runs-on: ubuntu-latest + outputs: + BASE_TAG: {{"${{ steps.vars.outputs.BASE_TAG }}"}} + VOLTO_VERSION: {{"${{ steps.vars.outputs.VOLTO_VERSION }}"}} + steps: + - name: Checkout + uses: actions/checkout@v4 + - name: Compute several vars needed for the build + id: vars + run: | + echo 'BASE_TAG=sha-$(git rev-parse --short HEAD)' >> $GITHUB_OUTPUT + python3 -c 'import json; data = json.load(open("./mrs.developer.json")); print("VOLTO_VERSION=" + data["core"]["tag"])' >> $GITHUB_OUTPUT + - name: Test vars + run: | + echo 'BASE_TAG={{"${{ steps.vars.outputs.BASE_TAG }}"}}' + echo 'VOLTO_VERSION={{"${{ steps.vars.outputs.VOLTO_VERSION }}"}}' code-analysis: runs-on: ubuntu-latest @@ -24,34 +41,44 @@ jobs: - name: Checkout codebase uses: actions/checkout@{{ cookiecutter.__gha_version_checkout }} - - name: Update Global Yarn - run: | - corepack enable - corepack prepare yarn@stable --activate - - name: Use Node.js {{ "${{ env.node-version }}" }} - uses: actions/setup-node@v3 + uses: actions/setup-node@{{ cookiecutter.__gha_version_setup_node }} with: node-version: {{ "${{ env.NODE_VERSION }}" }} - cache: 'yarn' - cache-dependency-path: 'frontend/yarn.lock' - - name: Prettier - id: prettier - run: npx prettier@3.0.3 --single-quote --check 'src/**/*.{js,jsx,ts,tsx,css,scss}' --config=package.json + - uses: pnpm/action-setup@{{ cookiecutter.__gha_version_setup_pnpm }} + name: Install pnpm + with: + version: 9 + # We don't want to install until later, + # when the cache is in place + run_install: false + + - name: Get pnpm store directory + shell: bash + run: | + echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV - - name: Install packages + - uses: actions/cache@{{ cookiecutter.__gha_version_cache }} + name: Setup pnpm cache + with: + path: {{"${{ env.STORE_PATH }}"}} + key: {{"${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}"}} + restore-keys: | + {{"${{ runner.os }}"}}-pnpm-store- + + - name: Install dependencies run: make install - - name: ESLint - id: eslint + - name: Linting + id: lint if: {{ "${{ success() || failure() }}" }} - run: yarn run lint:ci + run: make lint - name: i18n sync id: i18n if: {{ "${{ success() || failure() }}" }} - run: make i18n-ci + run: make ci-i18n - name: Unit Tests id: unit @@ -64,15 +91,14 @@ jobs: echo '# Code Analysis' >> $GITHUB_STEP_SUMMARY echo '| Test | Status |' >> $GITHUB_STEP_SUMMARY echo '| --- | --- |' >> $GITHUB_STEP_SUMMARY - {{ "echo '| Prettier | ${{ steps.prettier.conclusion == 'failure' && '❌' || ' ✅' }} |' >> $GITHUB_STEP_SUMMARY" }} - {{ "echo '| ESLint | ${{ steps.eslint.conclusion == 'failure' && '❌' || ' ✅' }} |' >> $GITHUB_STEP_SUMMARY" }} + {{ "echo '| Lint | ${{ steps.lint.conclusion == 'failure' && '❌' || ' ✅' }} |' >> $GITHUB_STEP_SUMMARY" }} {{ "echo '| i18n | ${{ steps.i18n.conclusion == 'failure' && '❌' || ' ✅' }} |' >> $GITHUB_STEP_SUMMARY" }} {{ "echo '| Unit Tests | ${{ steps.unit.conclusion == 'failure' && '❌' || ' ✅' }} |' >> $GITHUB_STEP_SUMMARY " }} - release: runs-on: ubuntu-latest needs: + - meta - code-analysis permissions: contents: read @@ -125,4 +151,6 @@ jobs: file: frontend/Dockerfile push: {{"${{ github.event_name != 'pull_request' }}"}} tags: {{"${{ steps.meta.outputs.tags }}"}} - labels: ${{"${{ steps.meta.outputs.labels }}"}} + labels: {{"${{ steps.meta.outputs.labels }}"}} + build-args: | + VOLTO_VERSION={{"${{ needs.meta.outputs.VOLTO_VERSION }}"}} diff --git a/sub/project_settings/cookiecutter.json b/sub/project_settings/cookiecutter.json index af33124..ddf48b7 100644 --- a/sub/project_settings/cookiecutter.json +++ b/sub/project_settings/cookiecutter.json @@ -9,6 +9,10 @@ "language_code": "en", "volto_version": "{{ 'Yes' | latest_volto }}", "github_organization": "collective", + "container_registry": ["github", "docker_hub", "gitlab"], + "__npm_package_name": "{{ cookiecutter.frontend_addon_name }}", + "__container_registry_prefix": "{{ cookiecutter.container_registry | image_prefix }}", + "__container_image_prefix": "{{ cookiecutter.__container_registry_prefix }}{{ cookiecutter.github_organization }}/{{ cookiecutter.project_slug }}", "__folder_name": "{{ cookiecutter.project_slug }}", "__package_name": "{{ cookiecutter.python_package_name | package_name }}", "__package_namespace": "{{ cookiecutter.python_package_name | package_namespace }}", @@ -17,8 +21,7 @@ "__profile_language": "{{ cookiecutter.language_code|gs_language_code }}", "__locales_language": "{{ cookiecutter.language_code|locales_language_code }}", "__node_version": "{{ cookiecutter.volto_version | node_version_for_volto }}", - "_copy_without_render": [ - ], + "_copy_without_render": [], "_extensions": [ "cookieplone.filters.use_prerelease_versions", "cookieplone.filters.node_version_for_volto", diff --git a/sub/project_settings/tests/test_cutter.py b/sub/project_settings/tests/test_cutter.py index 0466455..eda2ebd 100644 --- a/sub/project_settings/tests/test_cutter.py +++ b/sub/project_settings/tests/test_cutter.py @@ -36,6 +36,7 @@ def test_variable_substitution(build_files_list, variable_pattern, cutter_result "backend/src/project/title/profiles/default/registry/plone.i18n.interfaces.ILanguageSchema.xml", "frontend/.dockerignore", "frontend/Dockerfile", + "frontend/Makefile", "frontend/packages/volto-project-title/src/index.js", ], ) diff --git a/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/.dockerignore b/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/.dockerignore index be3a7a0..71a9d07 100644 --- a/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/.dockerignore +++ b/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/.dockerignore @@ -1,8 +1,6 @@ -.yarn/cache *.log build cache cypress Dockerfile node_modules -omelette \ No newline at end of file diff --git a/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/Dockerfile b/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/Dockerfile index e241630..779b916 100644 --- a/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/Dockerfile +++ b/sub/project_settings/{{ cookiecutter.__folder_name }}/frontend/Dockerfile @@ -1,62 +1,30 @@ # syntax=docker/dockerfile:1 -FROM node:{{ cookiecutter.__node_version }}-slim as base -FROM base as builder - -RUN < Start Docker-based Plone Backend$(RESET)" + docker run -it --rm --name=backend -p 8080:8080 -e SITE=Plone $(DOCKER_IMAGE) + +## Storybook +.PHONY: storybook-start +storybook-start: ## Start Storybook server on port 6006 + @echo "$(GREEN)==> Start Storybook$(RESET)" + pnpm run storybook + +.PHONY: storybook-build +storybook-build: ## Build Storybook + @echo "$(GREEN)==> Build Storybook$(RESET)" + mkdir -p $(CURRENT_DIR)/.storybook-build + pnpm run build-storybook -o $(CURRENT_DIR)/.storybook-build + +## Acceptance +.PHONY: acceptance-frontend-dev-start +acceptance-frontend-dev-start: ## Start acceptance frontend in development mode + RAZZLE_API_PATH=http://127.0.0.1:55001/plone pnpm start + +.PHONY: acceptance-frontend-prod-start +acceptance-frontend-prod-start: ## Start acceptance frontend in production mode + RAZZLE_API_PATH=http://127.0.0.1:55001/plone pnpm build && pnpm start:prod + +.PHONY: acceptance-backend-start +acceptance-backend-start: ## Start backend acceptance server + docker run -it --rm -p 55001:55001 $(DOCKER_IMAGE_ACCEPTANCE) + +.PHONY: ci-acceptance-backend-start +ci-acceptance-backend-start: ## Start backend acceptance server in headless mode for CI + docker run -i --rm -p 55001:55001 $(DOCKER_IMAGE_ACCEPTANCE) + +.PHONY: acceptance-test +acceptance-test: ## Start Cypress in interactive mode + pnpm --filter @plone/volto exec cypress open --config-file $(CURRENT_DIR)/cypress.config.js --config specPattern=$(CURRENT_DIR)'/cypress/tests/**/*.{js,jsx,ts,tsx}' + +.PHONY: ci-acceptance-test +ci-acceptance-test: ## Run cypress tests in headless mode for CI + pnpm --filter @plone/volto exec cypress run --config-file $(CURRENT_DIR)/cypress.config.js --config specPattern=$(CURRENT_DIR)'/cypress/tests/**/*.{js,jsx,ts,tsx}' + +.PHONY: build-image +build-image: ## Build Docker Image + @DOCKER_BUILDKIT=1 docker build . -t $(IMAGE_NAME):$(IMAGE_TAG) -f Dockerfile --build-arg VOLTO_VERSION=$(VOLTO_VERSION)