skatespots/SkateSpots
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions 1

fix: add editor icon + colored badges to Lab profile cards

Browse source 
Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
This commit is contained in:
shakespeare.diy 2026-06-16 11:11:16 +07:00
parent 4e227f0367
commit 223c311920
1 changed files with 17 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/pages/LabPage.tsx
View file

@ -387,6 +387,7 @@ function ProfileCard({ profile }: { profile: LabProfile }) {
const isCoach = profile.profileType === 'coach'; const isCoach = profile.profileType === 'coach';
const isFilmer = profile.profileType === 'filmer'; const isFilmer = profile.profileType === 'filmer';
const isEditor = profile.profileType === 'editor';
// Get skill labels based on profile type // Get skill labels based on profile type
const getSkillLabel = (skill: string) => { const getSkillLabel = (skill: string) => {
@ -394,6 +395,9 @@ function ProfileCard({ profile }: { profile: LabProfile }) {
if (isFilmer) { if (isFilmer) {
return FILMING_SERVICE_LABELS[skill] || FILMING_SKILL_LABELS[skill] || skill; return FILMING_SERVICE_LABELS[skill] || FILMING_SKILL_LABELS[skill] || skill;
} }
if (isEditor) {
return EDITOR_SERVICE_LABELS[skill] || EDITOR_SKILL_LABELS[skill] || skill;
}
return skill; return skill;
}; };
@ -407,6 +411,7 @@ function ProfileCard({ profile }: { profile: LabProfile }) {
<h3 className="font-black text-xl uppercase text-white">{displayName}</h3> <h3 className="font-black text-xl uppercase text-white">{displayName}</h3>
{isCoach && <GraduationCap className="h-5 w-5 text-red-500" />} {isCoach && <GraduationCap className="h-5 w-5 text-red-500" />}
{isFilmer && <Video className="h-5 w-5 text-orange-500" />} {isFilmer && <Video className="h-5 w-5 text-orange-500" />}
{isEditor && <Scissors className="h-5 w-5 text-purple-500" />}
</div> </div>
{nip05 && ( {nip05 && (
<div className="flex items-center gap-1 text-xs"> <div className="flex items-center gap-1 text-xs">
@ -440,7 +445,18 @@ function ProfileCard({ profile }: { profile: LabProfile }) {
{profile.skills.length > 0 && ( {profile.skills.length > 0 && (
<div className="flex flex-wrap gap-1 mb-3"> <div className="flex flex-wrap gap-1 mb-3">
{profile.skills.slice(0, 3).map((skill: string) => ( {profile.skills.slice(0, 3).map((skill: string) => (
<Badge key={skill} variant="secondary" className="text-xs bg-gray-800 border-gray-700"> <Badge
key={skill}
variant="secondary"
className={cn(
'text-xs',
isEditor
? 'bg-purple-900/50 border-purple-700 text-purple-300'
: isFilmer
? 'bg-orange-900/50 border-orange-700 text-orange-300'
: 'bg-gray-800 border-gray-700'
)}
>
{getSkillLabel(skill)} {getSkillLabel(skill)}
</Badge> </Badge>
))} ))}