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.
This commit is contained in:
@@ -16,6 +16,10 @@ import {
|
||||
} from "lucide-react";
|
||||
|
||||
// Types matching your n8n output
|
||||
interface CustomActivity {
|
||||
[key: string]: any; // Komplett dynamisch!
|
||||
}
|
||||
|
||||
interface StatusData {
|
||||
status: {
|
||||
text: string;
|
||||
@@ -47,6 +51,7 @@ interface StatusData {
|
||||
topProject: string;
|
||||
};
|
||||
} | null;
|
||||
customActivities?: Record<string, CustomActivity>; // Dynamisch!
|
||||
}
|
||||
|
||||
export default function ActivityFeed() {
|
||||
@@ -162,11 +167,13 @@ export default function ActivityFeed() {
|
||||
const coding = activityData.coding;
|
||||
const gaming = activityData.gaming;
|
||||
const music = activityData.music;
|
||||
const customActivities = activityData.customActivities || {};
|
||||
|
||||
const hasActiveActivity = Boolean(
|
||||
coding?.isActive ||
|
||||
gaming?.isPlaying ||
|
||||
music?.isPlaying
|
||||
music?.isPlaying ||
|
||||
Object.values(customActivities).some((act: any) => act?.enabled)
|
||||
);
|
||||
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
@@ -174,6 +181,7 @@ export default function ActivityFeed() {
|
||||
coding: coding?.isActive,
|
||||
gaming: gaming?.isPlaying,
|
||||
music: music?.isPlaying,
|
||||
customActivities: Object.keys(customActivities).length,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1882,6 +1890,124 @@ export default function ActivityFeed() {
|
||||
</motion.div>
|
||||
)}
|
||||
|
||||
{/* CUSTOM ACTIVITIES - Dynamisch aus n8n */}
|
||||
{data.customActivities && Object.entries(data.customActivities).map(([type, activity]: [string, any]) => {
|
||||
if (!activity?.enabled) return null;
|
||||
|
||||
// Icon Mapping für bekannte Typen
|
||||
const iconMap: Record<string, any> = {
|
||||
reading: '📖',
|
||||
working_out: '🏃',
|
||||
learning: '🎓',
|
||||
streaming: '📺',
|
||||
cooking: '👨🍳',
|
||||
traveling: '✈️',
|
||||
meditation: '🧘',
|
||||
podcast: '🎙️',
|
||||
};
|
||||
|
||||
// Farben für verschiedene Typen
|
||||
const colorMap: Record<string, { from: string; to: string; border: string; shadow: string }> = {
|
||||
reading: { from: 'amber-500/10', to: 'orange-500/5', border: 'amber-500/30', shadow: 'amber-500/10' },
|
||||
working_out: { from: 'red-500/10', to: 'orange-500/5', border: 'red-500/30', shadow: 'red-500/10' },
|
||||
learning: { from: 'purple-500/10', to: 'pink-500/5', border: 'purple-500/30', shadow: 'purple-500/10' },
|
||||
streaming: { from: 'violet-500/10', to: 'purple-500/5', border: 'violet-500/30', shadow: 'violet-500/10' },
|
||||
};
|
||||
|
||||
const colors = colorMap[type] || { from: 'gray-500/10', to: 'gray-500/5', border: 'gray-500/30', shadow: 'gray-500/10' };
|
||||
const icon = iconMap[type] || '✨';
|
||||
const title = type.replace(/_/g, ' ').replace(/\b\w/g, (l: string) => l.toUpperCase());
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
key={type}
|
||||
layout
|
||||
initial={{ scale: 0.9, opacity: 0 }}
|
||||
animate={{ scale: 1, opacity: 1 }}
|
||||
exit={{ scale: 0.9, opacity: 0 }}
|
||||
className={`relative bg-gradient-to-br from-${colors.from} to-${colors.to} border border-${colors.border} rounded-xl p-3 overflow-visible shadow-lg shadow-${colors.shadow}`}
|
||||
>
|
||||
<div className="relative z-10">
|
||||
<div className="flex items-start gap-3">
|
||||
{/* Image/Cover wenn vorhanden */}
|
||||
{(activity.coverUrl || activity.image_url || activity.albumArt) && (
|
||||
<div className="w-10 h-14 rounded overflow-hidden flex-shrink-0 border border-white/10 shadow-md">
|
||||
<Image
|
||||
src={activity.coverUrl || activity.image_url || activity.albumArt}
|
||||
alt={activity.title || activity.name || title}
|
||||
width={40}
|
||||
height={56}
|
||||
className="w-full h-full object-cover"
|
||||
unoptimized
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Text Info */}
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<span className="text-sm">{icon}</span>
|
||||
<p className="text-[10px] font-bold text-white/80 uppercase tracking-wider">
|
||||
{title}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Haupttitel */}
|
||||
{(activity.title || activity.name || activity.book_title) && (
|
||||
<p className="font-bold text-xs text-white truncate mb-0.5">
|
||||
{activity.title || activity.name || activity.book_title}
|
||||
</p>
|
||||
)}
|
||||
|
||||
{/* Untertitel/Details */}
|
||||
{(activity.author || activity.artist || activity.platform) && (
|
||||
<p className="text-xs text-white/60 truncate mb-1">
|
||||
{activity.author || activity.artist || activity.platform}
|
||||
</p>
|
||||
)}
|
||||
|
||||
{/* Progress Bar wenn vorhanden */}
|
||||
{activity.progress !== undefined && typeof activity.progress === 'number' && (
|
||||
<div className="mt-1.5">
|
||||
<div className="h-1 bg-white/10 rounded-full overflow-hidden">
|
||||
<motion.div
|
||||
className="h-full bg-white/60"
|
||||
initial={{ width: 0 }}
|
||||
animate={{ width: `${activity.progress}%` }}
|
||||
transition={{ duration: 1, ease: "easeOut" }}
|
||||
/>
|
||||
</div>
|
||||
<p className="text-[9px] text-white/50 mt-0.5">
|
||||
{activity.progress}% {activity.progress_label || 'complete'}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Zusätzliche Felder dynamisch rendern */}
|
||||
{Object.entries(activity).map(([key, value]) => {
|
||||
// Skip bereits gerenderte und interne Felder
|
||||
if (['enabled', 'title', 'name', 'book_title', 'author', 'artist', 'platform', 'progress', 'progress_label', 'coverUrl', 'image_url', 'albumArt'].includes(key)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Nur einfache Werte rendern
|
||||
if (typeof value === 'string' || typeof value === 'number') {
|
||||
return (
|
||||
<div key={key} className="text-[10px] text-white/50 mt-0.5">
|
||||
<span className="capitalize">{key.replace(/_/g, ' ')}: </span>
|
||||
<span className="font-medium">{value}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
);
|
||||
})}
|
||||
|
||||
{/* Quote of the Day (when idle) */}
|
||||
{!hasActivity && quote && (
|
||||
<div className="bg-white/5 rounded-lg p-3 border border-white/10 relative overflow-hidden group hover:bg-white/10 transition-colors">
|
||||
|
||||
Reference in New Issue
Block a user