47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import { Building2 } from "lucide-react";
|
|
import { getCurrentUserProjectId, getCurrentUserRole } from "../../../api/auth";
|
|
import { fetchProject } from "../../../api/projects";
|
|
|
|
interface Project {
|
|
id: string;
|
|
name: string;
|
|
}
|
|
|
|
export default function ProjectBadge() {
|
|
const [project, setProject] = useState<Project | null>(null);
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
useEffect(() => {
|
|
const loadProject = async () => {
|
|
const projectId = getCurrentUserProjectId();
|
|
const role = getCurrentUserRole();
|
|
|
|
if (role?.toUpperCase() !== 'ADMIN' && projectId) {
|
|
try {
|
|
const projectData = await fetchProject(projectId);
|
|
setProject(projectData);
|
|
} catch (err) {
|
|
console.error("Error loading user project:", err);
|
|
}
|
|
}
|
|
setLoading(false);
|
|
};
|
|
|
|
loadProject();
|
|
}, []);
|
|
|
|
if (loading || !project) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-2 px-3 py-1.5 bg-blue-50 border border-blue-200 rounded-lg text-sm">
|
|
<Building2 size={16} className="text-blue-600" />
|
|
<span className="text-blue-900 font-medium">
|
|
Proyecto: <span className="font-semibold">{project.name}</span>
|
|
</span>
|
|
</div>
|
|
);
|
|
}
|