From 82f36e2cad2dd9fe36014e561fc236c45053d2f7 Mon Sep 17 00:00:00 2001
From: Sebastiaan Janssen <sebastiaan@umbraco.com>
Date: Tue, 29 Jul 2025 17:04:53 +0200
Subject: [PATCH] Run npm on GitHub so it is deployed into the Cloud site

---
 .github/workflows/main.yml                      |  6 ++----
 .github/workflows/package-and-deploy.yml        | 17 +++++++++++++++++
 .../OpenSourceTest.MyExtension.csproj           | 13 ++++++++++---
 3 files changed, 29 insertions(+), 7 deletions(-)

diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
index 95aff03..331eeaa 100644
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@@ -8,9 +8,6 @@ on:
   workflow_dispatch: # Allow manual triggering of the workflow
 
 jobs:
-
-  # Intentionally NOT syncing from Cloud as all patches/updates etc being done manually on GitHub repo
-
   # Package and Deploy to Umbraco Cloud (without saving the artifact as contains sensitive data)
   cloud-deployment:
     name: "Deploy to Cloud"
@@ -23,4 +20,5 @@ jobs:
       formsLicenseKey: ${{ secrets.FORMS_LICENSE_KEY }}
     with:
       pathToWebsite: "src/OpenSourceTest.Site"
-      csprojFile: "OpenSourceTest.Site.csproj"
\ No newline at end of file
+      csprojFile: "OpenSourceTest.Site.csproj"
+      pathToFrontendClient: "src/OpenSourceTest.MyExtension/Client"
\ No newline at end of file
diff --git a/.github/workflows/package-and-deploy.yml b/.github/workflows/package-and-deploy.yml
index 1f615f9..d0df71a 100644
--- a/.github/workflows/package-and-deploy.yml
+++ b/.github/workflows/package-and-deploy.yml
@@ -9,6 +9,9 @@ on:
       csprojFile:
         required: true
         type: string
+      pathToFrontendClient:
+        required: true
+        type: string
 
     secrets:
       projectId: 
@@ -74,6 +77,20 @@ jobs:
         run: cp cloud.gitignore .gitignore
         shell: bash
 
+      # Setup Node.js for frontend build
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22.x'
+          cache: 'npm'
+          cache-dependency-path: '${{ inputs.pathToFrontendClient }}/package-lock.json'
+
+      # build the frontend assets
+      - name: Build frontend assets
+        working-directory: ${{ inputs.pathToFrontendClient }}
+        run: npm ci && npm run build --if-present
+        shell: bash
+
       # zip everything, except what is defined in the 'cloud.zipignore'
       - name: Zip Source Code
         run: zip -r sources.zip . -x@cloud.zipignore
diff --git a/src/OpenSourceTest.MyExtension/OpenSourceTest.MyExtension.csproj b/src/OpenSourceTest.MyExtension/OpenSourceTest.MyExtension.csproj
index 9987d87..acb11b3 100644
--- a/src/OpenSourceTest.MyExtension/OpenSourceTest.MyExtension.csproj
+++ b/src/OpenSourceTest.MyExtension/OpenSourceTest.MyExtension.csproj
@@ -34,13 +34,20 @@
     <Folder Include="wwwroot\" />
   </ItemGroup>
 
-  <!-- Restore and build Client files -->
-  <Target Name="RestoreClient" Inputs="Client\package.json;Client\package-lock.json" Outputs="Client\node_modules\.package-lock.json">
+  <!-- Restore and build Client files outside of Cloud environments -->
+  <Target Name="RestoreClient"
+          Inputs="Client\package.json;Client\package-lock.json" 
+          Outputs="Client\node_modules\.package-lock.json">
     <Message Importance="high" Text="Restoring Client NPM packages..." />
     <Exec Command="npm i" WorkingDirectory="Client" />
   </Target>
 
-  <Target Name="BuildClient" BeforeTargets="AssignTargetPaths" DependsOnTargets="RestoreClient" Inputs="@(ClientAssetsInputs)" Outputs="$(IntermediateOutputPath)client.complete.txt">
+  <Target Name="BuildClient" 
+          BeforeTargets="AssignTargetPaths" 
+          DependsOnTargets="RestoreClient" 
+          Inputs="@(ClientAssetsInputs)" 
+          Outputs="$(IntermediateOutputPath)client.complete.txt"
+          Condition="!('$(UMBRACO__CLOUD__ISRUNNINGONCLOUD)' == 'true' OR '$(ENVIRONMENT__PROJECTID)' != '')">
     <Message Importance="high" Text="Executing Client NPM build script..." />
     <Exec Command="npm run build" WorkingDirectory="Client" />
     <ItemGroup>