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

Name	Size	Permission	Action
ui	[ DIR ]	drwxr-xr-x
About.tsx	2.85 KB	-rw-r--r--
AdminLayout.tsx	4.85 KB	-rw-r--r--
Contact.tsx	10.4 KB	-rw-r--r--
DataTable.tsx	4.98 KB	-rw-r--r--
Footer.tsx	12.02 KB	-rw-r--r--
Hero.tsx	11.92 KB	-rw-r--r--
NavLink.tsx	751 B	-rw-r--r--
Navigation.tsx	24.92 KB	-rw-r--r--
News.tsx	3.48 KB	-rw-r--r--
ParticleNetwork.tsx	4.09 KB	-rw-r--r--
ProtectedRoute.tsx	813 B	-rw-r--r--
QuantumCircuit.tsx	3.47 KB	-rw-r--r--
RebuildWebsiteButton.tsx	4.28 KB	-rw-r--r--
Research.tsx	3.68 KB	-rw-r--r--
StatsCard.tsx	4.87 KB	-rw-r--r--
Team.tsx	6.63 KB	-rw-r--r--

Code Editor : RebuildWebsiteButton.tsx

import { useState } from 'react';
import { Button } from './ui/button';
import { Alert, AlertDescription } from './ui/alert';
import { RefreshCw, CheckCircle2, XCircle, Clock } from 'lucide-react';
import { useAuth } from '../contexts/AuthContext';

const API_BASE_URL = import.meta.env.VITE_API_URL || 'http://localhost:5000';

export default function RebuildWebsiteButton() {
  const { token } = useAuth();
  const [isRebuilding, setIsRebuilding] = useState(false);
  const [status, setStatus] = useState<{
    type: 'success' | 'error' | 'info' | null;
    message: string;
  }>({ type: null, message: '' });

const handleRebuild = async () => {
    if (!token) {
      setStatus({ type: 'error', message: 'Not authenticated' });
      return;
    }

setIsRebuilding(true);
    setStatus({ type: 'info', message: 'Rebuilding website... This may take 30-60 seconds.' });

try {
      const response = await fetch(`${API_BASE_URL}/api/rebuild`, {
        method: 'POST',
        headers: {
          'Authorization': `Bearer ${token}`,
          'Content-Type': 'application/json'
        }
      });

const data = await response.json();

if (response.ok && data.success) {
        setStatus({
          type: 'success',
          message: `✅ Website rebuilt successfully in ${data.duration}s! Changes are now live.`
        });
      } else {
        throw new Error(data.error || 'Failed to rebuild website');
      }
    } catch (error: any) {
      console.error('Rebuild error:', error);
      setStatus({
        type: 'error',
        message: error.message || 'Failed to rebuild website. Please try again.'
      });
    } finally {
      setIsRebuilding(false);
    }
  };

return (
    <div className="space-y-4">
      <div className="flex items-start gap-4">
        <Button
          onClick={handleRebuild}
          disabled={isRebuilding}
          size="lg"
          className="bg-gradient-to-r from-blue-600 to-indigo-600 hover:from-blue-700 hover:to-indigo-700"
        >
          {isRebuilding ? (
            <>
              <RefreshCw className="mr-2 h-5 w-5 animate-spin" />
              Rebuilding...
            </>
          ) : (
            <>
              <RefreshCw className="mr-2 h-5 w-5" />
              Update Website
            </>
          )}
        </Button>

<div className="flex-1">
          <p className="text-sm text-gray-600 dark:text-gray-400">
            Click this button after making changes to publish them to the live website.
            The rebuild process takes 30-60 seconds.
          </p>
        </div>
      </div>

{status.type && (
        <Alert
          variant={status.type === 'error' ? 'destructive' : 'default'}
          className={
            status.type === 'success'
              ? 'border-green-500 bg-green-50 dark:bg-green-950'
              : status.type === 'info'
              ? 'border-blue-500 bg-blue-50 dark:bg-blue-950'
              : ''
          }
        >
          {status.type === 'success' && <CheckCircle2 className="h-4 w-4 text-green-600" />}
          {status.type === 'error' && <XCircle className="h-4 w-4" />}
          {status.type === 'info' && <Clock className="h-4 w-4 text-blue-600" />}
          <AlertDescription className={
            status.type === 'success'
              ? 'text-green-800 dark:text-green-200'
              : status.type === 'info'
              ? 'text-blue-800 dark:text-blue-200'
              : ''
          }>
            {status.message}
          </AlertDescription>
        </Alert>
      )}

<div className="bg-gray-50 dark:bg-gray-800 p-4 rounded-lg border border-gray-200 dark:border-gray-700">
        <h4 className="font-semibold mb-2 text-sm">How it works:</h4>
        <ol className="text-sm text-gray-600 dark:text-gray-400 space-y-1 list-decimal list-inside">
          <li>Make your changes using the admin panels above</li>
          <li>Click "Update Website" when you're ready to publish</li>
          <li>The system rebuilds the frontend with your new content</li>
          <li>Changes go live automatically in about 30-60 seconds</li>
        </ol>
        <p className="text-xs text-gray-500 dark:text-gray-500 mt-3">
          💡 Tip: You can make multiple changes before clicking "Update Website" to publish them all at once.
        </p>
      </div>
    </div>
  );
}

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.