feat: adding components folder to storybook (#3467)

* chore: backup before EdgeSQL migration fix - broken state

* feat: storybook folder components

* chore: remove wrong plan

* chore: storybook -- azion sync

* chore: azion cli config update

* chore: storybook azion config

* fix: active default rule

* fix: azion deploy configuration

* chore: adjust debug response rules description

* chore: update azion cli

* chore: adding azion defineConfig and remote prefix rotation

* feat: adding deploy-storybook.yml

* fix: remove pnpm

* chore: using working-directory

* chore: syntax and storybook yml adjust

* fix: path of trigger storybook pipeline

* chore: update storybook readme.md

* chore: unify package.json of storybook dependencies and devDependencies

* chore: adding license to storybook packagejson

* fix: storybook cicd install dependencies

* chore: trigger storybook deploy

* fix: unify packagejson

* fix: branch main to publish storybook modification

* chore: storybook depoloy during dev merge

Author: robsongajunior

.github/workflows/deploy-production.yml

@@ -1,38 +1,47 @@
 name: Deploy Console Kit (PRODUCTION)
+
 on:
   push:
     branches:
       - main
+
 env:
   HUSKY: 0
   CLI_VERSION: 4.15.0
+
 jobs:
   deploy:
     runs-on: ubuntu-latest
     container:
       image: node:22-alpine
+
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
+        
       - name: Install SO deps
         run: apk add curl git bash jq
+        
       - name: Install dependencies
         run: yarn install
+
       - name: Download Azion CLI
         run: |
           wget https://github.com/aziontech/azion/releases/download/${CLI_VERSION}/azion_${CLI_VERSION}_linux_amd64.apk
           apk add --allow-untrusted azion_${CLI_VERSION}_linux_amd64.apk
+
       - name: Configure Azion CLI
         run: azion -t ${{ secrets.PLATFORM_KIT_TOKEN }}
+
       - name: Build & Deploy
         run: azion deploy --auto --local --debug --config-dir azion/production
         env:
+          NODE_ENV: production
+          VITE_ENVIRONMENT: production
           VITE_STRIPE_TOKEN_PROD: ${{ secrets.PROD_STRIPE_TOKEN }}
           VITE_RECAPTCHA_SITE_KEY: ${{ secrets.PROD_RECAPTCHA_SITE_KEY }}
           VITE_SEGMENT_TOKEN: ${{ secrets.PROD_SEGMENT_TOKEN }}
           CROSS_EDGE_SECRET: ${{ secrets.PROD_CROSS_EDGE_SECRET}}
-          NODE_ENV: production
-          VITE_ENVIRONMENT: production
           VITE_PROD_SENTRY: ${{ secrets.PROD_SENTRY }}
           VITE_SSO_GITHUB: ${{ secrets.PROD_SSO_GITHUB }}
           VITE_SSO_GOOGLE: ${{ secrets.PROD_SSO_GOOGLE }}

.github/workflows/deploy-storybook.yml

@@ -0,0 +1,50 @@
+name: Deploy Storybook
+
+on:
+  push:
+    branches:
+      - dev
+    paths:
+      - 'storybook/**'
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: write
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+          cache: 'yarn'
+
+      - name: Install Azion CLI
+        run: |
+          curl -o azionlinux https://downloads.azion.com/linux/x86_64/azion
+          sudo mv azionlinux /usr/bin/azion
+          sudo chmod u+x /usr/bin/azion
+
+      - name: CLI version
+        run: azion --version
+        
+      - name: Configure token
+        run: |
+          azion -t ${{ secrets.AZION_PERSONAL_TOKEN }}  
+          azion whoami
+
+      - name: Install storybook dependencies
+        run: yarn install
+      
+      - name: Building Storybook
+        run: |
+          yarn storybook:build
+          
+      - name: Azion Deploy
+        run: |
+          yarn storybook:deploy

package.json

@@ -34,8 +34,10 @@
     "lint:architecture": "eslint src/ --ext .vue,.js,.ts --ignore-path .gitignore --no-fix",
     "lint:architecture:changed": "node scripts/lint-architecture-changed.cjs",
     "architecture:report": "node scripts/architecture-report/index.cjs",
-    "storybook:dev": "cd storybook && yarn dev",
-    "storybook:build": "cd storybook && yarn build"
+    "storybook:build": "cd storybook && storybook build -o dist -c .storybook && cd ..",
+    "storybook:dev": "cd storybook && storybook dev -p 6006 -c .storybook && cd ..",
+    "storybook:preview": "cd storybook && npx http-server dist -p 6007 && cd ..",
+    "storybook:deploy": "cd storybook && azion deploy --local --debug && cd .."
   },
   "dependencies": {
     "@analytics/segment": "^2.1.0",
@@ -100,7 +102,7 @@
     "@vue/eslint-config-prettier": "^8.0.0",
     "@vue/test-utils": "^2.4.1",
     "@whitespace/storybook-addon-html": "^6.0.0",
-    "autoprefixer": "^10.4.14",
+    "autoprefixer": "^10.4.27",
     "react-syntax-highlighter": "^15.6.1",
     "azion": "^1.20.10",
     "cypress": "13.14.0",
@@ -114,7 +116,7 @@
     "eslint-plugin-xss": "^0.1.12",
     "husky": "^8.0.0",
     "jsdom": "^22.1.0",
-    "postcss": "^8.4.31",
+    "postcss": "^8.5.8",
     "prettier": "^3.0.0",
     "sass": "1.77.6",
     "start-server-and-test": "^2.0.0",