[feature] automated build and next release

.github/workflows/create-next-release.yml

@@ -0,0 +1,117 @@
+#
+# This workflow follows the following steps:
+#  1. Checkout the main branch (see line 27)
+#  1. Get the version from the package.json file and store it as environment
+#     variable for this job
+#  1. Build the Storybook and publish it to the GitHub pages
+#     https://epfl-si.github.io/epfl-elements-react/
+#  1. Build the epfl-elements-react library
+#    - add the package.json and run npm pack
+#  1. Archive production artifacts (not used right now but might be useful later)
+#  1. Create a release (with a proper Tag based on the version) →
+#     duplicated tag are not allowed and will fail!
+#  1. Upload both epfl-elements-react-v${{ env.EER_VERSION }}.tgz and
+#     epfl-elements-react.tgz to the release
+#
+#
+#  Note:
+#    - One might want to split the steps in different jobs: environment
+#      variables will not work in this case and you will have to use artifacts
+#      https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts#passing-data-between-jobs-in-a-workflow
+#    - GitHub propose a Packages registry that stores npm packages — we rather
+#      want to use nomjs but it still need an extra step. For now we can work
+#      with referencing to this package with its URL in package.json:
+#        [...]
+#        "epfl-elements-react": "https://github.com/epfl-si/epfl-elements-react/releases/latest/download/epfl-elements-react.tgz",
+#        [...]
+#
+name: Deploy Storybook to GitHub Pages and release epfl-elements-react library
+
+on:
+  push:
+    branches:
+      - main
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+jobs:
+  epfl-elements-react:
+    runs-on: ubuntu-latest
+    steps:
+      # Setup Node.js on ubuntu-latest
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      # Checkout the 'next' branch
+      - name: Checkout the 'next' branch
+        uses: actions/checkout@v4
+        with:
+          ref: 'next'
+
+      # Get the version from package.json and export it to 
+      # EER_VERSION environment variable
+      - name: Export Elements React Version (EER_VERSION)
+        shell: bash
+        run: |
+          echo "EER_VERSION=$(cat package.json | grep version | cut -d'"' -f4)" >> $GITHUB_ENV
+          echo "EER_VERSION=${{ env.EER_VERSION }}"
+
+      # Install npm dependencies (run npm install)
+      - name: Install npm dependencies
+        run: npm install
+
+      # Build Storybook (run npx storybook build)
+      - name: Build Storybook
+        run: npx storybook build
+
+      # Deploy to GitHub Pages → https://epfl-si.github.io/epfl-elements-react/
+      - name: Deploy to GitHub Pages
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          ACCESS_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BRANCH: gh-pages
+          FOLDER: storybook-static
+
+      # Build the epfl-elements-react library (npm run build)
+      - name: Build the epfl-elements-react library
+        run: npm run build
+
+      # Create the package.json that is needed to create a package
+      - name: Create the package.json
+        run: jq -n --arg version v${{ env.EER_VERSION }} '{"name":"epfl-elements-react","version":$version,"description":"EPFL Elements React Library","main":"index.js","repository":"github:epfl-si/epfl-elements-react","keywords":["epfl-elements-react"],"author":"EPFL ISAS-FSD","contributors":["Amine672 (https://github.com/Amine672)","Azecko (https://github.com/Azecko)","domq (https://github.com/domq)","GoldenCorgo (https://github.com/GoldenCorgo)","ponsfrilus (https://github.com/ponsfrilus)","rosamaggi (https://github.com/rosamaggi)","webdacjs (https://github.com/webdacjs)"],"license":"MIT","types":"./index.d.ts","bugs":{"url":"https://github.com/epfl-si/epfl-elements-react/issues"},"homepage":"https://github.com/epfl-si/epfl-elements-react#readme"}' > dist/package.json
+
+      # Create the epfl-elements-react package
+      - name: Create the epfl-elements-react package
+        run: |
+          npm pack ./dist/
+          ls -al
+          cp epfl-elements-react-v${{ env.EER_VERSION }}.tgz epfl-elements-react.tgz
+
+      # Archive production artifacts
+      - name: Archive production artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: epfl-elements-react
+          path: |
+            epfl-elements-react-v${{ env.EER_VERSION }}.tgz
+
+      # Create Release
+      # https://stackoverflow.com/a/75679739/960623
+      - name: Create release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          tag: v${{ env.EER_VERSION }}
+        run: |
+          gh release create "$tag" ./dist/*.tgz \
+            --target="next"
+            --repo="$GITHUB_REPOSITORY" \
+            --title="${GITHUB_REPOSITORY#*/} ${tag#v}" \
+            --generate-notes
+
+
+        # gh release upload "$tag" \
+        #   epfl-elements-react.tgz \
+        #   epfl-elements-react-v${{ env.EER_VERSION }}.tgz