Posts Refeactor

.github/workflows/preview.yml

@@ -1,21 +1,17 @@
-name: Deploy PR Preview
+name: Deploy Staging Preview
 
 on:
   pull_request:
-    types:
-      - opened
-      - reopened
-      - synchronize
-      - closed
+    types: [opened, synchronize, reopened]
+  workflow_dispatch:  # Allow manual trigger
 
 permissions:
   contents: write
-  pull-requests: write
 
-concurrency: preview-${{ github.ref }}
+concurrency: staging-preview
 
 jobs:
-  deploy-preview:
+  deploy-staging:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
@@ -27,18 +23,37 @@ jobs:
           ruby-version: '3.1'
           bundler-cache: true
 
-      - name: Build Jekyll site
-        if: github.event.action != 'closed'
+      - name: Show staging content
         run: |
-          # Remove CNAME file for previews to avoid routing conflicts
+          echo "=== Staging content ==="
+          echo "Staging posts:"
+          find staging/ -name "*.md" -not -name "README.md" -not -name "index.md" | sort || echo "  (none)"
+
+          echo "Published posts:"
+          ls -1 _posts/*.md 2>/dev/null | head -5 || echo "  (none)"
+
+      - name: Build with Jekyll
+        run: |
+          # Remove CNAME to avoid conflicts with preview
           rm -f CNAME
-          bundle exec jekyll build
+          # Build with preview config that includes staging
+          bundle exec jekyll build --config _config.yml,_config_preview.yml
         env:
           JEKYLL_ENV: production
 
-      - name: Deploy preview
-        uses: rossjrw/pr-preview-action@v1
-        with:
-          source-dir: ./_site
-          preview-branch: gh-pages
-          umbrella-dir: pr-preview
+      - name: Deploy to gh-pages
+        run: |
+          # Switch to gh-pages branch  
+          git fetch origin gh-pages:gh-pages || git checkout --orphan gh-pages
+          git checkout gh-pages
+
+          # Clear and copy site
+          rm -rf * 2>/dev/null || true
+          cp -r _site/* ./ 2>/dev/null || true
+
+          # Commit and push
+          git add -A
+          git config user.name "GitHub Actions"
+          git config user.email "actions@github.com"
+          git commit -m "Deploy preview from PR #${{ github.event.number }}" || exit 0
+          git push origin gh-pages

404.html

@@ -0,0 +1,39 @@
+---
+permalink: /404.html
+layout: default
+---
+
+<style type="text/css" media="screen">
+  .container {
+    margin: 10px auto;
+    max-width: 600px;
+    text-align: center;
+  }
+  h1 {
+    margin: 30px 0;
+    font-size: 4em;
+    line-height: 1;
+    letter-spacing: -1px;
+  }
+</style>
+
+<div class="container">
+  <h1>404</h1>
+
+  <p><strong>Page not found :(</strong></p>
+  <p>The requested page could not be found.</p>
+
+  <script type="text/javascript">
+    // GitHub Pages SPA redirect workaround
+    var pathSegmentsToKeep = 0; // Set to 0 for default github.io domains
+
+    var l = window.location;
+    l.replace(
+      l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
+      l.pathname.split('/').slice(0, 1 + pathSegmentsToKeep).join('/') + '/?/' +
+      l.pathname.slice(1).split('/').slice(pathSegmentsToKeep).join('/').replace(/&/g, '~and~') +
+      (l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
+      l.hash
+    );
+  </script>
+</div>

_config_preview.yml

@@ -0,0 +1,20 @@
+# Preview-specific configuration
+# This extends the main _config.yml for preview builds
+
+# Collections for staging posts
+collections:
+  staging:
+    output: true
+    permalink: /:collection/:name/
+
+# Make staging posts appear in site.posts
+defaults:
+  - scope:
+      path: "staging"
+      type: "staging"
+    values:
+      layout: "post"
+
+# Include staging directory in the build
+include:
+  - staging

about.md

@@ -28,6 +28,4 @@ Feel free to connect with me:
 - **GitHub**: [github.com/devnomadic](https://github.com/devnomadic)
 - **Email**: hello@devnomadic.com
 
----
-
-*Currently coding from: [Current Location]*
+---

staging/2025-06-10-test-staging-post.md

@@ -0,0 +1,29 @@
+---
+layout: post
+title: "Test Staging Post"
+date: 2025-06-10 12:00:00 -0500
+tags: [test, staging]
+---
+
+# Test Staging Post
+
+This is a test post that lives directly in the staging directory.
+
+## Purpose
+
+This post is used to test the staging preview system:
+
+- It's a real blog post with proper front matter
+- It lives in the `staging/` directory
+- It will be built as part of the staging collection
+- It appears in the preview site
+
+## Content
+
+This is just sample content to verify that:
+
+1. Jekyll can build staging posts
+2. The staging collection works
+3. Posts appear in the preview deployment
+
+When this works, we know the staging system is functioning correctly!

staging/README.md

@@ -0,0 +1,18 @@
+# Staging Directory
+
+This directory contains markdown post files that are being staged for preview before publication.
+
+## Structure:
+- `staging/` - Contains draft/preview post files  
+- `_posts/` - Contains published post files
+
+## Workflow:
+1. During preview builds, new/modified post `.md` files are automatically copied here
+2. Jekyll builds the full site including staged posts
+3. Preview site is deployed to GitHub Pages root (not nested)
+
+## Testing:
+Updated to trigger workflow with improved error handling and verbose logging.
+2. Jekyll builds the site with both `_posts/` and `staging/` content
+3. After review and approval, posts are moved from `staging/` to `_posts/`
+4. Staging directory is cleaned up after merge

staging/index.md

@@ -0,0 +1,98 @@
+---
+layout: default
+title: Staging Area
+permalink: /staging/
+---
+
+# 🚧 Staging Area
+
+This is where posts are staged for preview before going live.
+
+<div class="staging-info">
+  <span class="badge staging-badge">STAGING</span>
+  <span>Preview posts appear here before publication</span>
+</div>
+
+## Staged Posts
+
+<div class="post-links">
+  {% if site.staging and site.staging.size > 0 %}
+    {% assign staging_posts = site.staging | sort: 'date' | reverse %}
+    {% for post in staging_posts %}
+      <div class="post-link-wrapper">
+        <a href="{{ post.url | relative_url }}" class="post-link">{{ post.title }}</a>
+        <div class="post-meta">
+          <span class="badge staging-badge">STAGING</span>
+          {% if site.dash.date_format %}
+            {{ post.date | date: site.dash.date_format }}
+          {% else %}
+            {{ post.date | date: "%b %-d, %Y" }}
+          {% endif %}
+          {% if post.tags and post.tags.size > 0 %}
+            <div class="post-tags">
+              {% for tag in post.tags %}
+                <a class="tag" href="/tags#{{ tag | slugify }}">{{ tag }}</a>
+              {% endfor %}
+            </div>
+          {% endif %}
+        </div>
+      </div>
+    {% endfor %}
+  {% else %}
+    <p>No posts currently staged for preview.</p>
+  {% endif %}
+</div>
+
+## Navigation
+
+- [← Back to main site](/)
+- [About](/about/)
+- [Archive](/archive/)
+
+<style>
+.staging-badge {
+  background: #ff6b6b;
+  color: white;
+  padding: 2px 6px;
+  border-radius: 3px;
+  font-size: 0.8em;
+  margin-right: 8px;
+  font-weight: bold;
+}
+
+.staging-info {
+  background: #fff3cd;
+  border: 1px solid #ffeaa7;
+  border-radius: 5px;
+  padding: 10px;
+  margin: 20px 0;
+}
+
+.post-link-wrapper {
+  margin-bottom: 15px;
+  padding-bottom: 15px;
+  border-bottom: 1px solid #eee;
+}
+
+.post-link-wrapper:last-child {
+  border-bottom: none;
+}
+
+.post-tags {
+  margin-top: 5px;
+}
+
+.tag {
+  font-size: 0.8em;
+  background: #f8f9fa;
+  padding: 2px 6px;
+  border-radius: 3px;
+  text-decoration: none;
+  margin-right: 5px;
+  color: #666;
+}
+
+.tag:hover {
+  background: #e9ecef;
+}
+</style>