wip

apps/website/components/achievements/AchievementCard.tsx

@@ -1,63 +0,0 @@
-import React from 'react';
-import { Trophy, Medal, Star, Crown, Target, Zap } from 'lucide-react';
-import type { DriverProfileAchievementViewModel } from '@/lib/view-models/DriverProfileViewModel';
-
-interface AchievementCardProps {
-  achievement: DriverProfileAchievementViewModel;
-}
-
-function getRarityColor(rarity: DriverProfileAchievementViewModel['rarity']) {
-  switch (rarity) {
-    case 'common':
-      return 'text-gray-400 bg-gray-400/10 border-gray-400/30';
-    case 'rare':
-      return 'text-primary-blue bg-primary-blue/10 border-primary-blue/30';
-    case 'epic':
-      return 'text-purple-400 bg-purple-400/10 border-purple-400/30';
-    case 'legendary':
-      return 'text-yellow-400 bg-yellow-400/10 border-yellow-400/30';
-  }
-}
-
-function getAchievementIcon(icon: DriverProfileAchievementViewModel['icon']) {
-  switch (icon) {
-    case 'trophy':
-      return Trophy;
-    case 'medal':
-      return Medal;
-    case 'star':
-      return Star;
-    case 'crown':
-      return Crown;
-    case 'target':
-      return Target;
-    case 'zap':
-      return Zap;
-  }
-}
-
-export default function AchievementCard({ achievement }: AchievementCardProps) {
-  const Icon = getAchievementIcon(achievement.icon);
-  const rarityClasses = getRarityColor(achievement.rarity);
-
-  return (
-    <div className={`p-4 rounded-xl border ${rarityClasses} transition-all hover:scale-105`}>
-      <div className="flex items-start gap-3">
-        <div className={`flex h-10 w-10 items-center justify-center rounded-lg ${rarityClasses.split(' ')[1]}`}>
-          <Icon className={`w-5 h-5 ${rarityClasses.split(' ')[0]}`} />
-        </div>
-        <div className="flex-1 min-w-0">
-          <p className="text-white font-semibold text-sm">{achievement.title}</p>
-          <p className="text-gray-400 text-xs mt-0.5">{achievement.description}</p>
-          <p className="text-gray-500 text-xs mt-1">
-            {new Date(achievement.earnedAt).toLocaleDateString('en-US', {
-              month: 'short',
-              day: 'numeric',
-              year: 'numeric',
-            })}
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-}