Develop

.github/scripts/check-package-availability.sh

@@ -0,0 +1,55 @@
+#!/bin/bash
+
+# Script to check if npm packages are available
+# Usage: ./check-package-availability.sh <package-name> <version> [timeout-minutes]
+
+set -e
+
+PACKAGE_NAME="$1"
+VERSION="$2"
+TIMEOUT_MINUTES="${3:-15}"  # Default to 15 minutes
+
+if [ -z "$PACKAGE_NAME" ] || [ -z "$VERSION" ]; then
+    echo "❌ Usage: $0 <package-name> <version> [timeout-minutes]"
+    echo "   Example: $0 '@egovernments/digit-ui-libraries' '1.9.0' 10"
+    exit 1
+fi
+
+MAX_ATTEMPTS=$((TIMEOUT_MINUTES * 2))  # Check every 30 seconds
+ATTEMPT=1
+
+echo "🔍 Checking availability of $PACKAGE_NAME@$VERSION..."
+echo "⏰ Timeout: $TIMEOUT_MINUTES minutes ($MAX_ATTEMPTS attempts)"
+
+while [ $ATTEMPT -le $MAX_ATTEMPTS ]; do
+    if npm view "$PACKAGE_NAME@$VERSION" version &>/dev/null; then
+        echo "✅ $PACKAGE_NAME@$VERSION is available on npm!"
+
+        # Get additional package info
+        PUBLISHED_VERSION=$(npm view "$PACKAGE_NAME@$VERSION" version 2>/dev/null)
+        PUBLISH_TIME=$(npm view "$PACKAGE_NAME@$VERSION" time 2>/dev/null | grep "\"$VERSION\"" | cut -d'"' -f4)
+
+        echo "📦 Confirmed version: $PUBLISHED_VERSION"
+        if [ -n "$PUBLISH_TIME" ]; then
+            echo "📅 Published at: $PUBLISH_TIME"
+        fi
+
+        exit 0
+    else
+        MINUTES_ELAPSED=$((($ATTEMPT - 1) / 2))
+        echo "⏳ Attempt $ATTEMPT/$MAX_ATTEMPTS ($MINUTES_ELAPSED min elapsed): $PACKAGE_NAME@$VERSION not yet available..."
+
+        if [ $ATTEMPT -lt $MAX_ATTEMPTS ]; then
+            sleep 30
+        fi
+
+        ((ATTEMPT++))
+    fi
+done
+
+echo "❌ $PACKAGE_NAME@$VERSION is still not available after $TIMEOUT_MINUTES minutes"
+echo "💡 This might indicate:"
+echo "   - Publishing failed"
+echo "   - npm registry propagation delay"
+echo "   - Version mismatch"
+exit 1

.github/scripts/validate-dependency-chain.sh

@@ -0,0 +1,171 @@
+#!/bin/bash
+
+# Script to validate the dependency chain for DIGIT UI packages
+# This helps ensure the publish order is correct
+
+set -e
+
+echo "🔍 Validating DIGIT UI Package Dependency Chain..."
+echo "=================================================="
+
+# Define package paths
+WEBPACK_DIR="webpack"
+
+# Function to get package info
+get_package_info() {
+    local package_dir=$1
+    local package_json="$WEBPACK_DIR/$package_dir/package.json"
+
+    if [ ! -f "$package_json" ]; then
+        echo "❌ Package.json not found: $package_json"
+        return 1
+    fi
+
+    local name=$(node -p "require('./$package_json').name" 2>/dev/null)
+    local version=$(node -p "require('./$package_json').version" 2>/dev/null)
+
+    echo "$name@$version"
+}
+
+# Function to get dependencies
+get_internal_deps() {
+    local package_dir=$1
+    local package_json="$WEBPACK_DIR/$package_dir/package.json"
+
+    if [ ! -f "$package_json" ]; then
+        return 0
+    fi
+
+    # Get dependencies and peerDependencies that are internal DIGIT packages
+    node -e "
+        const pkg = require('./$package_json');
+        const deps = {...(pkg.dependencies || {}), ...(pkg.peerDependencies || {})};
+        const internalDeps = Object.keys(deps).filter(dep => dep.startsWith('@egovernments/digit-ui-'));
+        if (internalDeps.length > 0) {
+            console.log(internalDeps.join(' '));
+        }
+    " 2>/dev/null || true
+}
+
+echo "📦 Package Analysis:"
+echo "==================="
+
+# Analyze each package
+echo "📋 libraries: $(get_package_info 'libraries')"
+LIBS_DEPS=$(get_internal_deps 'libraries')
+if [ -n "$LIBS_DEPS" ]; then
+    echo "   📎 Internal dependencies: $LIBS_DEPS"
+else
+    echo "   📎 No internal dependencies ✅"
+fi
+
+echo ""
+echo "📋 svg-components: $(get_package_info 'svg-components')"
+SVG_DEPS=$(get_internal_deps 'svg-components')
+if [ -n "$SVG_DEPS" ]; then
+    echo "   📎 Internal dependencies: $SVG_DEPS"
+else
+    echo "   📎 No internal dependencies ✅"
+fi
+
+echo ""
+echo "📋 ui-components: $(get_package_info 'ui-components')"
+UI_DEPS=$(get_internal_deps 'ui-components')
+if [ -n "$UI_DEPS" ]; then
+    echo "   📎 Internal dependencies: $UI_DEPS"
+else
+    echo "   📎 No internal dependencies"
+fi
+
+echo ""
+echo "📋 react-components: $(get_package_info 'react-components')"
+REACT_DEPS=$(get_internal_deps 'react-components')
+if [ -n "$REACT_DEPS" ]; then
+    echo "   📎 Internal dependencies: $REACT_DEPS"
+else
+    echo "   📎 No internal dependencies"
+fi
+
+echo ""
+echo "🏗️ Recommended Publish Order:"
+echo "============================="
+
+echo "1. 🟢 Stage 1 - Base packages (can publish in parallel):"
+if [ -z "$LIBS_DEPS" ]; then
+    echo "   ✅ libraries - $(get_package_info 'libraries')"
+fi
+if [ -z "$SVG_DEPS" ]; then
+    echo "   ✅ svg-components - $(get_package_info 'svg-components')"
+fi
+
+echo ""
+echo "2. 🟡 Stage 2 - Packages with base dependencies:"
+if [ -n "$UI_DEPS" ]; then
+    echo "   ✅ ui-components - $(get_package_info 'ui-components')"
+    echo "      📎 Wait for: $UI_DEPS"
+fi
+
+echo ""
+echo "3. 🔴 Stage 3 - Packages with complex dependencies:"
+if [ -n "$REACT_DEPS" ]; then
+    echo "   ✅ react-components - $(get_package_info 'react-components')"
+    echo "      📎 Wait for: $REACT_DEPS"
+fi
+
+echo ""
+echo "⚠️ GitHub Actions Workflow Validation:"
+echo "======================================"
+
+# Check if workflow file exists and analyze it
+WORKFLOW_FILE=".github/workflows/publishComponents.yml"
+if [ -f "$WORKFLOW_FILE" ]; then
+    echo "✅ Workflow file exists: $WORKFLOW_FILE"
+
+    # Check for dependency management
+    if grep -q "needs:" "$WORKFLOW_FILE"; then
+        echo "✅ Workflow uses job dependencies (needs:)"
+    else
+        echo "❌ Workflow missing job dependencies - all jobs will run in parallel!"
+    fi
+
+    if grep -q "npm view.*version" "$WORKFLOW_FILE"; then
+        echo "✅ Workflow includes package availability checks"
+    else
+        echo "⚠️ Workflow missing package availability checks"
+    fi
+
+    if grep -q "sleep" "$WORKFLOW_FILE"; then
+        echo "✅ Workflow includes wait/retry logic"
+    else
+        echo "⚠️ Workflow missing wait/retry logic"
+    fi
+
+    # Count stages in workflow
+    STAGE_COUNT=$(grep -c "publish-.*:" "$WORKFLOW_FILE" | head -1)
+    echo "📊 Workflow stages found: $STAGE_COUNT"
+
+else
+    echo "❌ Workflow file not found: $WORKFLOW_FILE"
+fi
+
+echo ""
+echo "💡 Summary & Recommendations:"
+echo "============================"
+echo "✅ Publish Order: libraries & svg-components → ui-components → react-components"
+echo "⏰ Wait Strategy: Check npm availability with 30s intervals, 15min timeout"
+echo "🔄 Retry Logic: Essential for npm registry propagation delays"
+echo "📦 Tag Strategy: Use consistent tags across all packages"
+echo ""
+
+# Generate quick publish commands
+echo "🚀 Manual Publish Commands (for testing):"
+echo "=========================================="
+echo "# Stage 1 (parallel)"
+echo "cd webpack/libraries && npm publish --tag beta"
+echo "cd webpack/svg-components && npm publish --tag beta"
+echo ""
+echo "# Stage 2 (wait for Stage 1)"
+echo "cd webpack/ui-components && npm publish --tag beta"
+echo ""
+echo "# Stage 3 (wait for Stage 2)"
+echo "cd webpack/react-components && npm publish --tag beta"

.github/workflows/deploy-storybook.yml

@@ -2,8 +2,8 @@ name: Deploy Storybook to GitHub Pages
 
 on:
   push:
-    branches: [storybook-fix]
-    paths: ['webpack/storybook/**', 'webpack/ui-components/**']
+    branches: [develop]
+    paths: ['react/storybook/**', 'react/ui-components/**']
   workflow_dispatch:
 
 permissions:
@@ -25,23 +25,16 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: '18'
-          cache: 'npm'
-          cache-dependency-path: webpack/storybook/package-lock.json
-
-      - name: Install ui-components dependencies
-        run: |
-          cd webpack/ui-components
-          npm ci
+          node-version: 20
 
       - name: Install storybook dependencies
         run: |
-          cd webpack/storybook
-          npm ci
+          cd react/storybook
+          npm install --legacy-peer-deps
 
       - name: Build Storybook
         run: |
-          cd webpack/storybook
+          cd react/storybook
           npm run build-storybook
 
       - name: Setup Pages
@@ -50,7 +43,7 @@ jobs:
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v3
         with:
-          path: webpack/storybook/storybook-static
+          path: react/storybook/storybook-static
 
   deploy:
     environment:
@@ -61,4 +54,4 @@ jobs:
     steps:
       - name: Deploy to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v4
+        uses: actions/deploy-pages@v4