widget flow
This commit is contained in:
Alma
parent
0865260a78
commit
f82a184c97
62
app/api/leantime/tasks/route.ts
Normal file
62
app/api/leantime/tasks/route.ts
Normal file
@ -0,0 +1,62 @@
|
||||
import { getServerSession } from "next-auth/next";
|
||||
import { authOptions } from "@/app/api/auth/[...nextauth]/route";
|
||||
import { NextResponse } from "next/server";
|
||||
|
||||
export async function GET() {
|
||||
const session = await getServerSession(authOptions);
|
||||
|
||||
if (!session) {
|
||||
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
|
||||
}
|
||||
|
||||
try {
|
||||
// Get user's tasks from Leantime
|
||||
const response = await fetch('https://agilite.slm-lab.net/api/jsonrpc', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-API-Key': process.env.LEANTIME_TOKEN || '',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
method: 'leantime.rpc.Tasks.Tasks.getAll',
|
||||
jsonrpc: '2.0',
|
||||
id: 1,
|
||||
params: {
|
||||
userId: session.user.id,
|
||||
status: ['not_started', 'in_progress'],
|
||||
limit: 10,
|
||||
sort: 'dueDate',
|
||||
order: 'ASC'
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch tasks from Leantime');
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (!data.result) {
|
||||
return NextResponse.json({ tasks: [] });
|
||||
}
|
||||
|
||||
// Transform the tasks to match our interface
|
||||
const tasks = data.result.map((task: any) => ({
|
||||
id: task.id,
|
||||
headline: task.headline,
|
||||
description: task.description,
|
||||
status: task.status,
|
||||
dueDate: task.dueDate,
|
||||
priority: task.priority
|
||||
}));
|
||||
|
||||
return NextResponse.json({ tasks });
|
||||
} catch (error) {
|
||||
console.error('Error fetching tasks:', error);
|
||||
return NextResponse.json(
|
||||
{ error: "Failed to fetch tasks" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,5 +1,6 @@
|
||||
import { QuoteCard } from "@/components/quote-card";
|
||||
import { Parole } from "@/components/parole";
|
||||
import { Flow } from "@/components/flow";
|
||||
|
||||
export const metadata = {
|
||||
title: "Enkun - Dashboard",
|
||||
@ -15,6 +16,9 @@ export default function DashboardPage() {
|
||||
<div className='col-span-6'>
|
||||
<Parole />
|
||||
</div>
|
||||
<div className='col-span-3'>
|
||||
<Flow />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
165
components/flow.tsx
Normal file
165
components/flow.tsx
Normal file
@ -0,0 +1,165 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { RefreshCw, Calendar, CheckCircle2, Clock } from "lucide-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useSession } from "next-auth/react";
|
||||
|
||||
interface Task {
|
||||
id: string;
|
||||
headline: string;
|
||||
description: string;
|
||||
status: string;
|
||||
dueDate: string;
|
||||
priority: number;
|
||||
}
|
||||
|
||||
export function Flow() {
|
||||
const [tasks, setTasks] = useState<Task[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
const router = useRouter();
|
||||
const { data: session } = useSession();
|
||||
|
||||
const fetchTasks = async (isRefresh = false) => {
|
||||
try {
|
||||
if (isRefresh) {
|
||||
setRefreshing(true);
|
||||
}
|
||||
const response = await fetch('/api/leantime/tasks', {
|
||||
cache: 'no-store',
|
||||
next: { revalidate: 0 },
|
||||
});
|
||||
|
||||
if (response.status === 401) {
|
||||
setError('Session expired. Please sign in again.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json();
|
||||
throw new Error(errorData.error || 'Failed to fetch tasks');
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
setTasks(data.tasks);
|
||||
setError(null);
|
||||
} catch (err) {
|
||||
console.error('Error fetching tasks:', err);
|
||||
const errorMessage = err instanceof Error ? err.message : 'Failed to fetch tasks';
|
||||
setError(errorMessage);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setRefreshing(false);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (session) {
|
||||
fetchTasks();
|
||||
// Set up polling every 5 minutes
|
||||
const interval = setInterval(() => fetchTasks(), 300000);
|
||||
return () => clearInterval(interval);
|
||||
}
|
||||
}, [session]);
|
||||
|
||||
const getPriorityColor = (priority: number) => {
|
||||
switch (priority) {
|
||||
case 1:
|
||||
return 'text-red-500';
|
||||
case 2:
|
||||
return 'text-yellow-500';
|
||||
case 3:
|
||||
return 'text-green-500';
|
||||
default:
|
||||
return 'text-gray-500';
|
||||
}
|
||||
};
|
||||
|
||||
const getStatusIcon = (status: string) => {
|
||||
switch (status.toLowerCase()) {
|
||||
case 'done':
|
||||
return <CheckCircle2 className="h-4 w-4 text-green-500" />;
|
||||
case 'in progress':
|
||||
return <Clock className="h-4 w-4 text-yellow-500" />;
|
||||
default:
|
||||
return <Calendar className="h-4 w-4 text-blue-500" />;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Card
|
||||
className="transition-transform duration-500 ease-in-out transform hover:scale-105 cursor-pointer bg-white/50 backdrop-blur-sm h-full"
|
||||
onClick={() => router.push('/flow')}
|
||||
>
|
||||
<CardHeader className="flex flex-row items-center justify-between pb-2">
|
||||
<CardTitle className="text-lg font-semibold">My Tasks</CardTitle>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
fetchTasks(true);
|
||||
}}
|
||||
disabled={refreshing}
|
||||
className={refreshing ? 'animate-spin' : ''}
|
||||
>
|
||||
<RefreshCw className="h-4 w-4" />
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="p-4">
|
||||
{loading && <p className="text-center text-muted-foreground">Loading tasks...</p>}
|
||||
{error && (
|
||||
<div className="text-center">
|
||||
<p className="text-red-500">Error: {error}</p>
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
fetchTasks(true);
|
||||
}}
|
||||
className="mt-2"
|
||||
>
|
||||
Try Again
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
{!loading && !error && (
|
||||
<div className="space-y-2 max-h-[300px] overflow-y-auto">
|
||||
{tasks.length === 0 ? (
|
||||
<p className="text-center text-muted-foreground">No tasks found</p>
|
||||
) : (
|
||||
tasks.map((task) => (
|
||||
<div
|
||||
key={task.id}
|
||||
className="flex items-start space-x-2 hover:bg-gray-50 p-2 rounded-lg transition-colors"
|
||||
>
|
||||
<div className="flex-shrink-0">
|
||||
{getStatusIcon(task.status)}
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-baseline justify-between">
|
||||
<p className="text-sm font-medium truncate">{task.headline}</p>
|
||||
<span className={`text-xs ${getPriorityColor(task.priority)}`}>
|
||||
{task.priority === 1 ? 'High' : task.priority === 2 ? 'Medium' : 'Low'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-xs text-gray-600 line-clamp-2">{task.description}</p>
|
||||
{task.dueDate && (
|
||||
<p className="text-xs text-gray-500 mt-1">
|
||||
Due: {new Date(task.dueDate).toLocaleDateString()}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
@ -115,7 +115,7 @@ export function Parole() {
|
||||
|
||||
return (
|
||||
<Card
|
||||
className="transition-transform duration-500 ease-in-out transform hover:scale-105 cursor-pointer bg-white/50 backdrop-blur-sm"
|
||||
className="transition-transform duration-500 ease-in-out transform hover:scale-105 cursor-pointer bg-white/50 backdrop-blur-sm h-full"
|
||||
onClick={() => router.push('/parole')}
|
||||
>
|
||||
<CardHeader className="flex flex-row items-center justify-between pb-2">
|
||||
@ -133,7 +133,7 @@ export function Parole() {
|
||||
<RefreshCw className="h-4 w-4" />
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<CardContent className="p-4">
|
||||
{loading && <p className="text-center text-muted-foreground">Loading messages...</p>}
|
||||
{error && (
|
||||
<div className="text-center">
|
||||
@ -151,13 +151,13 @@ export function Parole() {
|
||||
</div>
|
||||
)}
|
||||
{!loading && !error && (
|
||||
<div className="space-y-3 max-h-[400px] overflow-y-auto">
|
||||
<div className="space-y-2 max-h-[300px] overflow-y-auto">
|
||||
{messages.length === 0 ? (
|
||||
<p className="text-center text-muted-foreground">No messages found</p>
|
||||
) : (
|
||||
messages.map((message) => (
|
||||
<div key={message._id} className="flex items-start space-x-3 hover:bg-gray-50 p-2 rounded-lg transition-colors">
|
||||
<Avatar className="h-8 w-8">
|
||||
<div key={message._id} className="flex items-start space-x-2 hover:bg-gray-50 p-2 rounded-lg transition-colors">
|
||||
<Avatar className="h-6 w-6">
|
||||
<AvatarImage src={`https://ui-avatars.com/api/?name=${encodeURIComponent(message.u.name || message.u.username)}&background=random`} />
|
||||
<AvatarFallback>{(message.u.name || message.u.username).substring(0, 2).toUpperCase()}</AvatarFallback>
|
||||
</Avatar>
|
||||
|
||||
@ -137,8 +137,15 @@ export function AddUserButton({ userRole, handleAddUser }: AddUserButtonProps) {
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Admin">Admin</SelectItem>
|
||||
<SelectItem value="Teacher">Enseignant</SelectItem>
|
||||
<SelectItem value="Students">Étudiant</SelectItem>
|
||||
<SelectItem value="Apprentices">Apprentices</SelectItem>
|
||||
<SelectItem value="Coding">Coding</SelectItem>
|
||||
<SelectItem value="DataIntelligence">Data Intelligence</SelectItem>
|
||||
<SelectItem value="Entrepreneurship">Entrepreneurship</SelectItem>
|
||||
<SelectItem value="Expression">Expression</SelectItem>
|
||||
<SelectItem value="Investigation">Investigation</SelectItem>
|
||||
<SelectItem value="Lean">Lean</SelectItem>
|
||||
<SelectItem value="Mediation">Mediation</SelectItem>
|
||||
<SelectItem value="Mentors">Mentors</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user