/ 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 : PublicationsManager.tsx

import { useEffect, useState } from 'react';
import { useAPI } from '../hooks/useAPI';
import DataTable from '../components/DataTable';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '../components/ui/dialog';
import { Button } from '../components/ui/button';
import { Input } from '../components/ui/input';
import { Label } from '../components/ui/label';
import { Textarea } from '../components/ui/textarea';
import { useToast } from '../hooks/use-toast';
import { Loader2 } from 'lucide-react';

interface Publication {
  id: string;
  title: string;
  authors: string[] | string;
  journal?: string;
  conference?: string;
  year: string;
  volume?: string;
  pages?: string;
  doi?: string;
  abstract: string;
  category: string;
  type: string;
  citations?: number;
  pdf?: string;
  featured?: boolean;
}

const PublicationsManager = () => {
  const api = useAPI();
  const { toast } = useToast();
  const [data, setData] = useState<Publication[]>([]);
  const [isLoading, setIsLoading] = useState(true);
  const [isDialogOpen, setIsDialogOpen] = useState(false);
  const [isSaving, setIsSaving] = useState(false);
  const [editingItem, setEditingItem] = useState<Publication | null>(null);
  const [formData, setFormData] = useState<Partial<Publication>>({});
  const [pdfFile, setPdfFile] = useState<File | null>(null);

useEffect(() => {
    fetchData();
  }, []);

const fetchData = async () => {
    try {
      const result = await api.publications.getAll();
      setData(result);
    } catch (error: any) {
      toast({
        title: 'Error',
        description: error.message || 'Failed to fetch publications',
        variant: 'destructive'
      });
    } finally {
      setIsLoading(false);
    }
  };

const handleCreate = () => {
    setEditingItem(null);
    setFormData({ featured: false, citations: 0 });
    setPdfFile(null);
    setIsDialogOpen(true);
  };

const handleEdit = (item: Publication) => {
    setEditingItem(item);
    setFormData({
      ...item,
      authors: Array.isArray(item.authors) ? item.authors.join(', ') : item.authors
    } as any);
    setPdfFile(null);
    setIsDialogOpen(true);
  };

const handleDelete = async (id: string) => {
    if (!confirm('Are you sure you want to delete this publication?')) return;

try {
      await api.publications.delete(id);
      toast({
        title: 'Success',
        description: 'Publication deleted successfully'
      });
      fetchData();
    } catch (error: any) {
      toast({
        title: 'Error',
        description: error.message || 'Failed to delete publication',
        variant: 'destructive'
      });
    }
  };

const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    setIsSaving(true);

try {
      // Process authors field (convert comma-separated string to array)
      const authorsArray = typeof formData.authors === 'string' 
        ? formData.authors.split(',').map((a: string) => a.trim())
        : Array.isArray(formData.authors) ? formData.authors : [];
      
      const processedData = {
        ...formData,
        authors: authorsArray,
        citations: formData.citations ? Number(formData.citations) : 0,
        featured: Boolean(formData.featured)
      };

if (editingItem) {
        await api.publications.updateWithFile(editingItem.id, processedData, pdfFile || undefined);
        toast({
          title: 'Success',
          description: 'Publication updated successfully'
        });
      } else {
        await api.publications.createWithFile(processedData, pdfFile || undefined);
        toast({
          title: 'Success',
          description: 'Publication created successfully'
        });
      }

setIsDialogOpen(false);
      fetchData();
    } catch (error: any) {
      toast({
        title: 'Error',
        description: error.message || 'Failed to save publication',
        variant: 'destructive'
      });
    } finally {
      setIsSaving(false);
    }
  };

const columns = [
    { key: 'title', label: 'Title' },
    { key: 'authors', label: 'Authors', render: (item: Publication) => Array.isArray(item.authors) ? item.authors.join(', ') : item.authors },
    { key: 'year', label: 'Year' },
    { key: 'category', label: 'Category' },
    { key: 'type', label: 'Type' },
    { key: 'citations', label: 'Citations' },
  ];

return (
    <div className="container mx-auto py-8">
      <div className="mb-6 flex justify-between items-center">
        <h1 className="text-3xl font-bold">Publications Manager</h1>
        <Button onClick={handleCreate}>Add Publication</Button>
      </div>

<DataTable
        columns={columns}
        data={data}
        onEdit={handleEdit}
        onDelete={handleDelete}
        onCreate={handleCreate}
        isLoading={isLoading}
        searchKeys={['title', 'authors']}
      />

<Dialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
        <DialogContent className="max-w-3xl max-h-[90vh] overflow-y-auto">
          <DialogHeader>
            <DialogTitle>{editingItem ? 'Edit Publication' : 'Add Publication'}</DialogTitle>
            <DialogDescription>
              {editingItem ? 'Update publication details' : 'Create a new publication entry'}
            </DialogDescription>
          </DialogHeader>

<form onSubmit={handleSubmit} className="space-y-4">
            <div className="grid grid-cols-2 gap-4">
              <div className="col-span-2">
                <Label htmlFor="title">Title *</Label>
                <Input
                  id="title"
                  value={formData.title || ''}
                  onChange={(e) => setFormData({ ...formData, title: e.target.value })}
                  required
                />
              </div>

<div className="col-span-2">
                <Label htmlFor="authors">Authors * (comma-separated)</Label>
                <Input
                  id="authors"
                  value={formData.authors || ''}
                  onChange={(e) => setFormData({ ...formData, authors: e.target.value } as any)}
                  placeholder="John Doe, Jane Smith"
                  required
                />
              </div>

<div>
                <Label htmlFor="journal">Journal</Label>
                <Input
                  id="journal"
                  value={formData.journal || ''}
                  onChange={(e) => setFormData({ ...formData, journal: e.target.value })}
                />
              </div>

<div>
                <Label htmlFor="conference">Conference</Label>
                <Input
                  id="conference"
                  value={formData.conference || ''}
                  onChange={(e) => setFormData({ ...formData, conference: e.target.value })}
                />
              </div>

<div>
                <Label htmlFor="year">Year *</Label>
                <Input
                  id="year"
                  value={formData.year || ''}
                  onChange={(e) => setFormData({ ...formData, year: e.target.value })}
                  required
                />
              </div>

<div>
                <Label htmlFor="volume">Volume</Label>
                <Input
                  id="volume"
                  value={formData.volume || ''}
                  onChange={(e) => setFormData({ ...formData, volume: e.target.value })}
                />
              </div>

<div>
                <Label htmlFor="pages">Pages</Label>
                <Input
                  id="pages"
                  value={formData.pages || ''}
                  onChange={(e) => setFormData({ ...formData, pages: e.target.value })}
                  placeholder="123-145"
                />
              </div>

<div>
                <Label htmlFor="doi">DOI</Label>
                <Input
                  id="doi"
                  value={formData.doi || ''}
                  onChange={(e) => setFormData({ ...formData, doi: e.target.value })}
                  placeholder="10.1000/example"
                />
              </div>

<div>
                <Label htmlFor="category">Category *</Label>
                <select
                  id="category"
                  className="w-full h-10 px-3 border border-gray-300 rounded-md"
                  value={formData.category || ''}
                  onChange={(e) => setFormData({ ...formData, category: e.target.value })}
                  required
                >
                  <option value="">Select category</option>
                  <option value="Quantum Computing">Quantum Computing</option>
                  <option value="Quantum Communication">Quantum Communication</option>
                  <option value="Quantum Hardware">Quantum Hardware</option>
                  <option value="Quantum Algorithms">Quantum Algorithms</option>
                  <option value="Quantum Sensing">Quantum Sensing</option>
                </select>
              </div>

<div>
                <Label htmlFor="type">Type *</Label>
                <select
                  id="type"
                  className="w-full h-10 px-3 border border-gray-300 rounded-md"
                  value={formData.type || ''}
                  onChange={(e) => setFormData({ ...formData, type: e.target.value })}
                  required
                >
                  <option value="">Select type</option>
                  <option value="Journal Article">Journal Article</option>
                  <option value="Conference Paper">Conference Paper</option>
                  <option value="Review Article">Review Article</option>
                  <option value="Preprint">Preprint</option>
                </select>
              </div>

<div>
                <Label htmlFor="citations">Citations</Label>
                <Input
                  id="citations"
                  type="number"
                  value={formData.citations || 0}
                  onChange={(e) => setFormData({ ...formData, citations: parseInt(e.target.value) || 0 })}
                />
              </div>

<div className="flex items-center space-x-2">
                <input
                  type="checkbox"
                  id="featured"
                  checked={formData.featured || false}
                  onChange={(e) => setFormData({ ...formData, featured: e.target.checked })}
                  className="w-4 h-4"
                />
                <Label htmlFor="featured">Featured Publication</Label>
              </div>

<div className="col-span-2">
                <Label htmlFor="abstract">Abstract *</Label>
                <Textarea
                  id="abstract"
                  value={formData.abstract || ''}
                  onChange={(e) => setFormData({ ...formData, abstract: e.target.value })}
                  rows={4}
                  required
                />
              </div>

<div className="col-span-2">
                <Label htmlFor="pdf">PDF File</Label>
                <Input
                  id="pdf"
                  type="file"
                  accept=".pdf,application/pdf"
                  onChange={(e) => setPdfFile(e.target.files?.[0] || null)}
                />
                {editingItem?.pdf && !pdfFile && (
                  <p className="text-sm text-slate-400 mt-1">
                    Current: <a href={editingItem.pdf} target="_blank" rel="noopener noreferrer" className="text-blue-400 hover:underline">{editingItem.pdf}</a>
                  </p>
                )}
                {pdfFile && (
                  <p className="text-sm text-green-400 mt-1">New file selected: {pdfFile.name}</p>
                )}
              </div>
            </div>

<div className="flex justify-end gap-2 pt-4">
              <Button type="button" variant="outline" onClick={() => setIsDialogOpen(false)}>
                Cancel
              </Button>
              <Button type="submit" disabled={isSaving}>
                {isSaving && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
                {editingItem ? 'Update' : 'Create'}
              </Button>
            </div>
          </form>
        </DialogContent>
      </Dialog>
    </div>
  );
};

export default PublicationsManager;

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.