[WEB-3364] Storybook migration: remove Rails, setup GH Pages deployment

.circleci/config.yml

@@ -1,176 +1,26 @@
-version: 2.1
-
-orbs:
-  browser-tools: circleci/[email protected]
-  node: circleci/[email protected]
-
-executors:
-  default:
-    description: Image for running rails with cypress
-    parameters:
-      tag:
-        description: The circleci/ruby Docker image version tag
-        type: string
-        default: latest
-    docker:
-      - image: cimg/ruby:<< parameters.tag >>-browsers
-      - image: cimg/postgres:14.9
-        environment:
-          POSTGRES_USER: ably_db_user
-          POSTGRES_PASSWORD: password
-    environment:
-      - BUNDLER_VERSION: 2.3.8
-      - BUNDLE_JOBS: 4
-      - BUNDLE_PATH: vendor/bundle
-      - BUNDLE_RETRY: 3
-      - PGHOST: 127.0.0.1
-      - PG_USER: ably_db_user
-      - PG_PASSWORD: password
-      - RAILS_ENV: test
-      - NODE_VERSION: 16.17.0
-      - YARN_VERSION: 1.22.10
-
-caches:
-  - &bundle_cache ably-ui-preview-bundle-v1-{{ checksum "preview/Gemfile.lock" }}
-  - &yarn_cache ably-ui-preview-yarn-v1-{{ checksum "yarn.lock" }}-{{ checksum "preview/yarn.lock" }}
-
-commands:
-  install_browser:
-    description: Install browser
-    steps:
-      - browser-tools/install-chrome
-  save_bundle_cache:
-    description: Save bundle cache
-    steps:
-      - save_cache:
-          key: *bundle_cache
-          paths:
-            - vendor/bundle
-            - preview/vendor/bundle
-  restore_bundle_cache:
-    description: Restore bundler cache
-    steps:
-      - restore_cache:
-          keys:
-            - *bundle_cache
-  save_yarn_cache:
-    description: Save yarn cache
-    steps:
-      - save_cache:
-          key: *yarn_cache
-          paths:
-            - node_modules
-            - preview/node_modules
-            - ~/.cache
-  restore_yarn_cache:
-    description: Restore yarn cache
-    steps:
-      - restore_cache:
-          keys:
-            - *yarn_cache
-  install_bundler:
-    description: Install bundler
-    steps:
-      - run: gem install bundler --version $BUNDLER_VERSION
-  bundle_install:
-    description: Install gems
-    steps:
-      - restore_bundle_cache
-      - install_bundler
-      - run: |
-          cd preview
-          bundle config set --local path 'vendor/bundle'
-          bundle install
-      - save_bundle_cache
-  yarn_install:
-    description: Install javascript packages
-    steps:
-      - restore_yarn_cache
-      - run: yarn --frozen-lockfile
-      - save_yarn_cache
-  start_server:
-    description: Run rails server in background
-    steps:
-      - run:
-          command: cd preview && bin/rails server -e test -p 5000
-          background: true
-  precompile_assets:
-    description: Compile assets for rails app
-    steps:
-      - run: |
-          cd preview
-          RAILS_ENV=test bin/rails assets:precompile assets:clean
-  lint:
-    description: Run eslint on library
-    steps:
-      - run:
-          command: |
-            mkdir -p ~/reports
-            yarn lint --format junit --output-file ~/reports/eslint.xml
-          when: always
-      - store_test_results:
-          path: ~/reports
-      - store_artifacts:
-          path: ~/reports
-
-  format_check:
-    description: Run prettier on library
-    steps:
-      - run: yarn format:check
-
-jobs:
-  lint:
-    executor:
-      name: default
-      tag: 3.1.2
-    steps:
-      - checkout
-      - yarn_install
-      - lint
-  format_check:
-    executor:
-      name: default
-      tag: 3.1.2
-    steps:
-      - checkout
-      - yarn_install
-      - format_check
-  cypress_tests:
-    executor:
-      name: default
-      tag: 3.1.2
-    working_directory: ~/ably-ui/preview
-    steps:
-      - checkout
-      - install_browser
-      - bundle_install
-      - yarn_install
-      - precompile_assets
-      - start_server
-      - run:
-          name: Wait for server
-          command: |
-            until $(curl --retry 10 --output /dev/null --silent --head --fail http://127.0.0.1:5000/); do
-                printf '.'
-                sleep 5
-            done
-      - run:
-          name: Executes Cypress end-to-end tests
-          command: |
-            yarn cypress run \
-              --browser chrome \
-              --reporter junit \
-              --reporter-options "mochaFile=test-results/cypress-[hash].xml,toConsole=true"
-      - store_test_results:
-          path: test-results
-      - store_artifacts:
-          path: cypress/videos
-      - store_artifacts:
-          path: cypress/screenshots
+# Temporary stub to allow CircleCi to pass until it is able to be disabled for ably-ui
 
 workflows:
+  version: 2
   build:
     jobs:
       - cypress_tests
       - lint
       - format_check
+
+jobs: # do nothing
+  lint:
+    docker:
+      - image: cimg/base:2022.06-22.04
+    resource_class: small
+    run: echo noop
+  cypress_tests:
+    docker:
+      - image: cimg/base:2022.06-22.04
+    resource_class: small
+    run: echo noop
+  format_check:
+    docker:
+      - image: cimg/base:2022.06-22.04
+    resource_class: small
+    run: echo noop

.github/workflows/push.yml

@@ -0,0 +1,42 @@
+name: Run linters
+
+on:
+  push:
+    branches-ignore:
+      - "gh-pages"
+  pull_request:
+    types: [closed]
+    branches:
+      - main
+
+jobs:
+  run-linters:
+    name: Run linters
+    runs-on: ubuntu-latest
+    env:
+      NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v4
+      - name: Set up Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 16
+      - name: Install dependencies
+        run: yarn
+      - name: Lint
+        uses: wearerequired/lint-action@v2
+        with:
+          eslint: true
+          eslint_dir: src
+          eslint_extensions: js,ts,jsx,tsx
+          eslint_auto_fix: false
+          prettier: true
+          prettier_dir: src
+          prettier_extensions: js,ts,jsx,tsx
+          prettier_auto_fix: false
+      # Cypress disabled until tests rewritten to use new SB paths
+      # - name: Cypress
+      #   uses: cypress-io/github-action@v6
+      #   with:
+      #     start: yarn start

.github/workflows/release.yml

@@ -4,6 +4,11 @@ on:
   release:
     types: [published]
 
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
 jobs:
   release:
     runs-on: ubuntu-latest
@@ -13,20 +18,39 @@ jobs:
       - uses: actions/checkout@v2
         with:
           ref: "main"
-      - uses: ruby/setup-ruby@v1
-        with:
-          ruby-version: 3.1.2
-          bundler-cache: true
       - uses: actions/setup-node@v2
         with:
           node-version: "16.17.0"
       - run: npm install -g yarn
       - name: Release latest Ably UI version
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-          RUBYGEMS_API_KEY: ${{ secrets.RUBYGEMS_API_KEY }}
         run: |
           git config --global user.email "[email protected]"
           git config --global user.name "Github Action"
           ./scripts/release.sh "${GITHUB_REF/refs\/tags\//}"
         shell: bash
+  deploy-storybook:
+    name: Deploy to Storybook
+    runs-on: ubuntu-latest
+    env:
+      NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      REGISTRY_TOKEN: ${{ secrets.REGISTRY_TOKEN }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - run: ls -l
+      - name: Build
+        shell: bash
+        run: |
+          echo "::group::Build"
+          yarn install
+          yarn build-storybook
+          echo "::endgroup::"
+      - name: Upload
+        uses: actions/[email protected]
+        with:
+          path: preview
+      - id: deploy
+        name: Deploy to GitHub Pages
+        uses: actions/deploy-pages@v4

.github/workflows/update-versions.yml

@@ -20,10 +20,6 @@ jobs:
       - name: "Get latest tag"
         id: latesttag
         uses: "WyriHaximus/github-action-get-previous-tag@v1"
-      - uses: ruby/setup-ruby@v1
-        with:
-          ruby-version: 3.1.2
-          bundler-cache: true
       - uses: actions/setup-node@v2
         with:
           node-version: 16.17.0
@@ -41,7 +37,7 @@ jobs:
         with:
           branch: update-versions-to-${{ steps.latesttag.outputs.tag }}
           title: Update @ably/ui version in repo to ${{ steps.latesttag.outputs.tag }}
-          body: "Update files that are not updated during the release process. 
+          body: "Update files that are not updated during the release process.
             Sometimes published packages are not available immediately so we open this PR for convenience."
           # This is doesn't work due to what seems a permission issue https://github.com/peter-evans/create-pull-request/issues/155
           # team-reviewers: "team-website"

.gitignore

@@ -1,9 +1,8 @@
 .bundle
 .DS_Store
-ably-ui-*.gem
 node_modules
-vendor
 cypress/screenshots
 cypress/videos
 server_killer.rb
 yarn-error.log
+preview

.npmignore

@@ -5,14 +5,11 @@
 .eslintrc.js
 .pretterrc.json
 .prettierignore
-ably-ui-*.gem
-ably-ui.gemspec
 lib
 modules-config.js
 node_modules
 preview
 release-canditate.sh
 release.sh
 scripts
-vendor
 webpack.config.js

.prettierignore

@@ -1,6 +1,5 @@
 vendor
 ./core
 ./reset
-./preview/public
-./preview/tmp
+preview
 node_modules

.tool-versions

@@ -1,3 +1,2 @@
-ruby 3.1.2
 nodejs 16.17.0
 yarn 1.22.10

CONTRIBUTING.md

@@ -15,7 +15,6 @@ Please refer to the [README](./README.md#development) for instructions on how to
 ## Testing
 
 This repo uses a combination of Jest and Cypress for testing.
-For a component that has both a React and Ruby please ensure there is a parity test, the easiest way to create that is to copy an existing one as an example.
 
 Please refer to the [README](./README.md#running-tests) for further details.
 

Procfile

@@ -1,3 +1,2 @@
 webpack-ui: node scripts/build -w
 webpack-dev-server: ./scripts/webpack-preview.sh
-rails-server: ./scripts/rails-preview.sh