Files

denshooter e431ff50fc feat: Add Directus setup scripts for collections, fields, and relations

- Created setup-directus-collections.js to automate the creation of tech stack collections, fields, and relations in Directus.
- Created setup-directus-hobbies.js for setting up hobbies collection with translations.
- Created setup-directus-projects.js for establishing projects collection with comprehensive fields and translations.
- Added setup-tech-stack-directus.js to populate tech_stack_items with predefined data.

2026-01-23 02:53:31 +01:00

4.2 KiB

Raw Blame History

📚 Reading Activity zu n8n hinzufügen

✅ Was du bereits hast:

✅ Frontend ist bereit (ActivityFeed.tsx updated)
✅ TypeScript Interfaces erweitert
✅ Grid Layout (horizontal auf Desktop, vertikal auf Mobile)
✅ Conditional Rendering (nur zeigen wenn isReading: true)

🔧 n8n Workflow anpassen

Option 1: Hardcover Integration (automatisch)

1. Neuer Node in n8n: "Hardcover"

Type: HTTP Request
Method: GET
URL: https://cms.dk0.dev/api/n8n/hardcover/currently-reading

2. Mit Webhook verbinden

Webhook → Hardcover (parallel zu Spotify/Lanyard)
          ↓
       Merge (Node mit 5 Inputs statt 4)
          ↓
    Code in JavaScript

3. Code Node updaten Ersetze den gesamten Code in deinem "Code in JavaScript" Node mit dem Code aus: scripts/n8n-workflow-code-updated.js

Option 2: Manueller Webhook (für Tests)

Neuer Workflow: "Set Reading Status"

Node 1: Webhook (POST)

Path: /set-reading
Method: POST

Node 2: PostgreSQL/Set Variable

// Speichere reading Status in einer Variablen
// Oder direkt in Database wenn du willst
const { title, author, progress, coverUrl, isReading } = items[0].json.body;

return [{
  json: {
    reading: {
      isReading: isReading !== false, // default true
      title,
      author,
      progress,
      coverUrl
    }
  }
}];

Usage:

curl -X POST https://your-n8n.com/webhook/set-reading \
  -H "Content-Type: application/json" \
  -d '{
    "isReading": true,
    "title": "Clean Architecture",
    "author": "Robert C. Martin",
    "progress": 65,
    "coverUrl": "https://example.com/cover.jpg"
  }'

# Clear reading:
curl -X POST https://your-n8n.com/webhook/set-reading \
  -d '{"isReading": false}'

🎨 Wie es aussieht

Desktop (breiter Bildschirm):

┌────────────┬────────────┬────────────┬────────────┐
│  Coding    │  Gaming    │  Music     │  Reading   │
│  (RIGHT    │  (RIGHT    │            │            │
│   NOW)     │   NOW)     │            │            │
└────────────┴────────────┴────────────┴────────────┘

Tablet:

┌────────────┬────────────┐
│  Coding    │  Gaming    │
└────────────┴────────────┘
┌────────────┬────────────┐
│  Music     │  Reading   │
└────────────┴────────────┘

Mobile:

┌────────────┐
│  Coding    │
│  (RIGHT    │
│   NOW)     │
└────────────┘
┌────────────┐
│  Gaming    │
└────────────┘
┌────────────┐
│  Music     │
└────────────┘
┌────────────┐
│  Reading   │
└────────────┘

🔥 Features

✅ Nur zeigen wenn aktiv - Wenn isReading: false, verschwindet die Card komplett ✅ Progress Bar - Visueller Fortschritt mit Animation ✅ Book Cover - Kleines Cover (40x56px) ✅ Responsive Grid - 1 Spalte (Mobile), 2 Spalten (Tablet), 3 Spalten (Desktop) ✅ Smooth Animations - Fade in/out mit Framer Motion ✅ Amber Theme - Passt zu "Reading" 📖

🚀 Testing

1. Hardcover Endpoint testen:

curl https://cms.dk0.dev/api/n8n/hardcover/currently-reading

2. n8n Webhook testen:

curl https://your-n8n.com/webhook/denshooter-71242/status

3. Frontend testen:

# Dev Server starten
npm run dev

# In Browser Console:
fetch('/api/n8n/status').then(r => r.json()).then(console.log)

📝 Nächste Schritte

✅ Frontend Code ist bereits angepasst
⏳ n8n Workflow Code updaten (siehe scripts/n8n-workflow-code-updated.js)
⏳ Optional: Hardcover Node hinzufügen
⏳ Testen und Deploy

Alles ready! Nur noch n8n Code austauschen. 🎉

4.2 KiB Raw Blame History