/ var / www / html / cqt / src / pages / [ HOME SHELL ]

Name	Size	Permission	Action
AboutPage.tsx	464 B	-rw-r--r--
AdminDashboard.tsx	6.63 KB	-rw-r--r--
AdminLogin.tsx	4.9 KB	-rw-r--r--
ContactPage.tsx	403 B	-rw-r--r--
CourseDetailPage.tsx	17.14 KB	-rw-r--r--
CoursesManager.tsx	15.6 KB	-rw-r--r--
EducationPage.tsx	23.77 KB	-rw-r--r--
Index.tsx	1.25 KB	-rw-r--r--
LabsManager.tsx	13.28 KB	-rw-r--r--
LabsPage.tsx	12.33 KB	-rw-r--r--
NewsDetailPage.tsx	10.51 KB	-rw-r--r--
NewsManager.tsx	11.66 KB	-rw-r--r--
NewsPage.tsx	11.77 KB	-rw-r--r--
NotFound.tsx	727 B	-rw-r--r--
PersonPage.tsx	1.67 KB	-rw-r--r--
PublicationsManager.tsx	12.17 KB	-rw-r--r--
PublicationsPage.tsx	15.17 KB	-rw-r--r--
ResearchDetailPage.tsx	16.93 KB	-rw-r--r--
ResearchManager.tsx	15.75 KB	-rw-r--r--
ResearchPage.tsx	14.3 KB	-rw-r--r--
TeamManager.tsx	12.4 KB	-rw-r--r--
TeamPage.tsx	781 B	-rw-r--r--
WorkshopDetailPage.tsx	19.23 KB	-rw-r--r--
WorkshopsManager.tsx	16.05 KB	-rw-r--r--
WorkshopsPage.tsx	7.63 KB	-rw-r--r--

Code Editor : AdminDashboard.tsx

import { useEffect, useState } from 'react';
import { useAPI } from '../hooks/useAPI';
import { Card, CardContent, CardHeader, CardTitle } from '../components/ui/card';
import { FlaskConical, Newspaper, GraduationCap, Users, TrendingUp, Calendar } from 'lucide-react';
import { motion } from 'framer-motion';
import RebuildWebsiteButton from '../components/RebuildWebsiteButton';

interface Stats {
  research: number;
  news: number;
  courses: number;
  workshops: number;
  team: number;
}

const AdminDashboard = () => {
  const api = useAPI();
  const [stats, setStats] = useState<Stats>({
    research: 0,
    news: 0,
    courses: 0,
    workshops: 0,
    team: 0
  });
  const [isLoading, setIsLoading] = useState(true);

useEffect(() => {
    const fetchStats = async () => {
      try {
        const [research, news, courses, workshops, team] = await Promise.all([
          api.research.getAll(),
          api.news.getAll(),
          api.courses.getAll(),
          api.workshops.getAll(),
          api.team.getAll()
        ]);

setStats({
          research: research.length,
          news: news.length,
          courses: courses.length,
          workshops: workshops.length,
          team: team.length
        });
      } catch (error) {
        console.error('Error fetching stats:', error);
      } finally {
        setIsLoading(false);
      }
    };

fetchStats();
  }, []);

const statCards = [
    { 
      title: 'Research Projects', 
      value: stats.research, 
      icon: FlaskConical, 
      color: 'from-blue-500 to-cyan-500',
      bgColor: 'bg-blue-500/10'
    },
    { 
      title: 'News Articles', 
      value: stats.news, 
      icon: Newspaper, 
      color: 'from-purple-500 to-pink-500',
      bgColor: 'bg-purple-500/10'
    },
    { 
      title: 'Courses', 
      value: stats.courses, 
      icon: GraduationCap, 
      color: 'from-green-500 to-emerald-500',
      bgColor: 'bg-green-500/10'
    },
    { 
      title: 'Workshops', 
      value: stats.workshops, 
      icon: Calendar, 
      color: 'from-orange-500 to-yellow-500',
      bgColor: 'bg-orange-500/10'
    },
    { 
      title: 'Team Members', 
      value: stats.team, 
      icon: Users, 
      color: 'from-red-500 to-rose-500',
      bgColor: 'bg-red-500/10'
    },
    { 
      title: 'Total Content', 
      value: stats.research + stats.news + stats.courses + stats.workshops + stats.team, 
      icon: TrendingUp, 
      color: 'from-indigo-500 to-purple-500',
      bgColor: 'bg-indigo-500/10'
    }
  ];

return (
    <div className="space-y-6">
      {/* Header */}
      <div>
        <h1 className="text-4xl font-bold bg-gradient-to-r from-blue-400 to-purple-400 bg-clip-text text-transparent mb-2">
          Dashboard
        </h1>
        <p className="text-slate-400">Welcome back! Here's an overview of your content.</p>
      </div>

{/* Stats Grid */}
      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
        {statCards.map((card, index) => {
          const Icon = card.icon;
          
          return (
            <motion.div
              key={card.title}
              initial={{ opacity: 0, y: 20 }}
              animate={{ opacity: 1, y: 0 }}
              transition={{ delay: index * 0.1 }}
            >
              <Card className="bg-slate-800/50 backdrop-blur-xl border-slate-700 hover:border-slate-600 transition-all duration-300 hover:scale-[1.02] hover:shadow-xl">
                <CardHeader className="flex flex-row items-center justify-between pb-2">
                  <CardTitle className="text-sm font-medium text-slate-400">
                    {card.title}
                  </CardTitle>
                  <div className={`p-2 rounded-lg ${card.bgColor}`}>
                    <Icon className={`w-5 h-5 bg-gradient-to-r ${card.color} bg-clip-text text-transparent`} />
                  </div>
                </CardHeader>
                <CardContent>
                  <div className={`text-3xl font-bold bg-gradient-to-r ${card.color} bg-clip-text text-transparent`}>
                    {isLoading ? '...' : card.value}
                  </div>
                  <p className="text-xs text-slate-500 mt-1">
                    Total {card.title.toLowerCase()}
                  </p>
                </CardContent>
              </Card>
            </motion.div>
          );
        })}
      </div>

{/* Quick Actions */}
      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-8">
        {/* Update Website Section */}
        <Card className="bg-gradient-to-br from-indigo-900/50 to-blue-900/50 backdrop-blur-xl border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Publish Changes</CardTitle>
          </CardHeader>
          <CardContent>
            <RebuildWebsiteButton />
          </CardContent>
        </Card>

<Card className="bg-gradient-to-br from-blue-900/50 to-purple-900/50 backdrop-blur-xl border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Quick Actions</CardTitle>
          </CardHeader>
          <CardContent className="space-y-3">
            <a href="/admin/research" className="block p-3 bg-slate-800/50 rounded-lg hover:bg-slate-700/50 transition-colors">
              <p className="text-white font-medium">Create New Research Project</p>
              <p className="text-sm text-slate-400">Add a new research project to showcase</p>
            </a>
            <a href="/admin/news" className="block p-3 bg-slate-800/50 rounded-lg hover:bg-slate-700/50 transition-colors">
              <p className="text-white font-medium">Publish News Article</p>
              <p className="text-sm text-slate-400">Share latest updates and announcements</p>
            </a>
            <a href="/admin/courses" className="block p-3 bg-slate-800/50 rounded-lg hover:bg-slate-700/50 transition-colors">
              <p className="text-white font-medium">Add New Course</p>
              <p className="text-sm text-slate-400">Create educational course content</p>
            </a>
          </CardContent>
        </Card>
      </div>

{/* Recent Activity */}
      <div className="grid grid-cols-1 gap-6">
        <Card className="bg-gradient-to-br from-slate-900/50 to-slate-800/50 backdrop-blur-xl border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Recent Activity</CardTitle>
          </CardHeader>
          <CardContent>
            <p className="text-slate-400 text-sm">
              Activity tracking coming soon. This will show recent content updates, edits, and additions.
            </p>
          </CardContent>
        </Card>
      </div>
    </div>
  );
};

export default AdminDashboard;

Urban Research Lab

Urban Research Lab

The Urban Research Lab (URL) at IIIT-Delhi was established in 2020, during a time when the pandemic brought the complexities of urban life more visible than ever. What started as an initiative by faculty and students has grown into a collaborative space for critically exploring and reimagining the urban questions through research, dialogue, and interdisciplinary engagement.