Add CI workflow (#4)

Author: James-Kua

.github/workflows/ci.yml

@@ -0,0 +1,82 @@
+name: build CI
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build-storybook:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version: 20
+
+    - name: clean install
+      run: npm ci
+
+    - name: run build
+      id: build
+      run: npm run build
+
+    - name: Get changed files
+      id: changed-files
+      uses: tj-actions/changed-files@v45
+      with:
+        separator: "   "
+
+    - name: Set current datetime as env variable
+      env:
+        TZ: 'Asia/Singapore'
+      run: echo "CURRENT_DATETIME=$(date +'%d %b %Y, %I:%M%p [%A]')" >> $GITHUB_ENV
+
+    - name: Send telegram on success
+      if: ${{ steps.build.outcome == 'success' }}
+      uses: appleboy/telegram-action@master
+      with:
+        to: ${{ secrets.TELEGRAM_TO }}
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: markdown
+        disable_web_page_preview: true
+        message: |
+            ✅ Build passed!
+        
+            ⏰ *${{ env.CURRENT_DATETIME }}*
+
+            📂 ${{ github.ref_name }}
+
+            🧑‍💻 *${{ github.actor }}* created commit: ${{ github.event.head_commit.message }}
+
+            🗂 *Changed files*:
+            ${{ steps.changed-files.outputs.all_changed_files }}
+            
+            🎯 *Repository*: ${{ github.repository }}
+            
+            👍 *See changes*: https://github.com/${{ github.repository }}/commit/${{ github.sha }}
+
+    - name: Send telegram update on failure
+      if: ${{ steps.build.outcome == 'failure' }}
+      uses: appleboy/telegram-action@master
+      with:
+        to: ${{ secrets.TELEGRAM_TO }}
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: markdown
+        disable_web_page_preview: true
+        message: |
+            ❌ Build failed!
+        
+            ⏰ *${{ env.CURRENT_DATETIME }}*
+
+            📂 ${{ github.ref_name }}
+
+            🧑‍💻 *${{ github.actor }}* created commit: ${{ github.event.head_commit.message }}
+
+            🗂 *Changed files*:
+            ${{ steps.changed-files.outputs.all_changed_files }}
+            
+            🎯 *Repository*: ${{ github.repository }}
+            
+            👍 *See changes*: https://github.com/${{ github.repository }}/commit/${{ github.sha }}

.github/workflows/storybook.yml

@@ -0,0 +1,82 @@
+name: storybook build
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version: 20
+
+    - name: clean install
+      run: npm ci
+
+    - name: run build
+      id: build
+      run: npm run build-storybook
+
+    - name: Get changed files
+      id: changed-files
+      uses: tj-actions/changed-files@v45
+      with:
+        separator: "   "
+
+    - name: Set current datetime as env variable
+      env:
+        TZ: 'Asia/Singapore'
+      run: echo "CURRENT_DATETIME=$(date +'%d %b %Y, %I:%M%p [%A]')" >> $GITHUB_ENV
+
+    - name: Send telegram on success
+      if: ${{ steps.build.outcome == 'success' }}
+      uses: appleboy/telegram-action@master
+      with:
+        to: ${{ secrets.TELEGRAM_TO }}
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: markdown
+        disable_web_page_preview: true
+        message: |
+            ✅ Storybook build passed!
+        
+            ⏰ *${{ env.CURRENT_DATETIME }}*
+
+            📂 ${{ github.ref_name }}
+
+            🧑‍💻 *${{ github.actor }}* created commit: ${{ github.event.head_commit.message }}
+
+            🗂 *Changed files*:
+            ${{ steps.changed-files.outputs.all_changed_files }}
+            
+            🎯 *Repository*: ${{ github.repository }}
+            
+            👍 *See changes*: https://github.com/${{ github.repository }}/commit/${{ github.sha }}
+
+    - name: Send telegram update on failure
+      if: ${{ steps.build.outcome == 'failure' }}
+      uses: appleboy/telegram-action@master
+      with:
+        to: ${{ secrets.TELEGRAM_TO }}
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: markdown
+        disable_web_page_preview: true
+        message: |
+            ❌ Storybook build failed!
+        
+            ⏰ *${{ env.CURRENT_DATETIME }}*
+
+            📂 ${{ github.ref_name }}
+
+            🧑‍💻 *${{ github.actor }}* created commit: ${{ github.event.head_commit.message }}
+
+            🗂 *Changed files*:
+            ${{ steps.changed-files.outputs.all_changed_files }}
+            
+            🎯 *Repository*: ${{ github.repository }}
+            
+            👍 *See changes*: https://github.com/${{ github.repository }}/commit/${{ github.sha }}