diff --git a/.github/workflows/build-pr.yml b/.github/workflows/build-pr.yml
new file mode 100644
index 000000000..66c97af32
--- /dev/null
+++ b/.github/workflows/build-pr.yml
@@ -0,0 +1,65 @@
+name: Build PR-Preview
+
+on:
+  pull_request_review:
+    types: submitted
+
+concurrency:
+  group: ${{github.workflow}}-${{github.ref}}
+  cancel-in-progress: true
+
+env:
+  LAYOUT_EDITOR_BASE_URL: "/EmbeddedChat/pulls/pr-${{github.event.pull_request.number}}/layout_editor"
+  DOCS_BASE_URL: "/EmbeddedChat/pulls/pr-${{github.event.pull_request.number}}/docs"
+  STORYBOOK_RC_HOST: "https://demo.qa.rocket.chat"
+  
+jobs:
+  build:
+    if: github.event.review.state == 'approved' && (github.event.review.author_association == 'COLLABORATOR' || github.event.review.author_association == 'OWNER')
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "16.19.0"
+
+      - name: Install Dependencies
+        run: yarn install
+
+      - name: Build packages
+        run: yarn build && yarn build:storybook
+
+      - name: Setup Node.js for Docs
+        uses: actions/setup-node@v4
+        with:
+          node-version: "18.x"
+
+      - name: "Install dependencies for docs"
+        run: yarn install
+        working-directory: packages/docs/
+
+      - name: Build Docs
+        run: yarn build
+        working-directory: packages/docs/
+
+      - name: Prepare Build Folder
+        run: |
+          mkdir -p build/pulls/pr-${{github.event.pull_request.number}}/
+          mkdir -p build/pulls/pr-${{github.event.pull_request.number}}/ui-elements
+          mkdir -p build/pulls/pr-${{github.event.pull_request.number}}/layout_editor
+          mkdir -p build/pulls/pr-${{github.event.pull_request.number}}/docs
+
+          mv -v packages/react/storybook-static/* build/pulls/pr-${{github.event.pull_request.number}}/
+          mv -v packages/ui-elements/storybook-static/* build/pulls/pr-${{github.event.pull_request.number}}/ui-elements/
+          mv -v packages/layout_editor/dist/* build/pulls/pr-${{github.event.pull_request.number}}/layout_editor/
+          mv -v packages/docs/build/* build/pulls/pr-${{github.event.pull_request.number}}/docs/
+
+      - name: Upload Artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: github-pages
+          path: build/
diff --git a/.github/workflows/deploy-pr.yml b/.github/workflows/deploy-pr.yml
new file mode 100644
index 000000000..4f687507d
--- /dev/null
+++ b/.github/workflows/deploy-pr.yml
@@ -0,0 +1,36 @@
+name: Deploy PR-Preview
+
+on:
+  workflow_run:
+    workflows: ["Build PR-Preview"]
+    types:
+      - completed
+
+permissions:
+  contents: write
+  pages: write
+
+jobs:
+  deploy:
+    if: github.event.workflow_run.conclusion == 'success'
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/download-artifact@v4
+        with:
+          name: github-pages
+          path: build/
+          github-token: ${{github.token}}
+          repository: ${{github.repository}}
+          run-id: ${{github.event.workflow_run.id}}
+
+      - name: Deploy to GitHub Pages
+        uses: crazy-max/ghaction-github-pages@v2
+        with:
+          target_branch: gh-deploy
+          build_dir: build/
+          commit_message: "Deploy to Github Pages"
+          jekyll: false
+          keep_history: true
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.github/workflows/pr-cleanup.yml b/.github/workflows/pr-cleanup.yml
new file mode 100644
index 000000000..c5b878373
--- /dev/null
+++ b/.github/workflows/pr-cleanup.yml
@@ -0,0 +1,34 @@
+name: Pull Request Cleanup
+on:
+  pull_request_target:
+    types: [closed]
+
+jobs:
+  cleanup:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+        with:
+          ref: gh-deploy
+
+      - name: Check if Deployment Exists
+        id: check_deployment
+        run: |
+          if [ -d "pulls/pr-${{ github.event.pull_request.number }}" ]; then
+          echo "deployment_exists=true" >> $GITHUB_ENV
+          else
+          echo "deployment_exists=false" >> $GITHUB_ENV
+          fi
+
+      - name: Remove Deployment
+        if: env.deployment_exists == 'true'
+        run: |
+          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+          git config --global user.name "github-actions[bot]"
+          git fetch origin gh-deploy
+          git checkout gh-deploy
+          git rm -r pulls/pr-${{github.event.pull_request.number}}
+          git commit -m "Remove deployment for PR #${{github.event.pull_request.number}}"
+          git push origin gh-deploy
diff --git a/packages/docs/docusaurus.config.js b/packages/docs/docusaurus.config.js
index f9073bfa8..1201dae91 100644
--- a/packages/docs/docusaurus.config.js
+++ b/packages/docs/docusaurus.config.js
@@ -17,7 +17,7 @@ const config = {
   url: "https://rocketchat.github.io/",
   // Set the /<baseUrl>/ pathname under which your site is served
   // For GitHub pages deployment, it is often '/<projectName>/'
-  baseUrl: "/EmbeddedChat/docs/",
+  baseUrl: process.env.DOCS_BASE_URL || "/EmbeddedChat/docs/",
 
   // GitHub pages deployment config.
   // If you aren't using GitHub pages, you don't need these.
diff --git a/packages/layout_editor/vite.config.ts b/packages/layout_editor/vite.config.ts
index 2b9daff2d..b6ab8acd2 100644
--- a/packages/layout_editor/vite.config.ts
+++ b/packages/layout_editor/vite.config.ts
@@ -11,5 +11,5 @@ export default defineConfig({
       },
     }),
   ],
-  base: "/EmbeddedChat/layout_editor"
+  base: process.env.LAYOUT_EDITOR_BASE_URL || '/EmbeddedChat/layout_editor',
 });