Index: pages/dashboard/admin/+Page.tsx
===================================================================
--- pages/dashboard/admin/+Page.tsx	(revision e09fe6ff3ab0ade0c931236df5aa4b711ed8e058)
+++ pages/dashboard/admin/+Page.tsx	(revision e09fe6ff3ab0ade0c931236df5aa4b711ed8e058)
@@ -0,0 +1,232 @@
+import React, { useEffect, useState } from 'react';
+import {
+    Container, Grid, Paper, Typography, Box, Avatar, Divider, Button,
+    CircularProgress, Table, TableBody, TableCell, TableHead, TableRow,
+    Chip, IconButton, TextField, Dialog, DialogTitle, DialogContent, DialogActions
+} from '@mui/material';
+import AdminPanelSettingsIcon from '@mui/icons-material/AdminPanelSettings';
+import CheckCircleIcon from '@mui/icons-material/CheckCircle';
+import CancelIcon from '@mui/icons-material/Cancel';
+import BuildIcon from '@mui/icons-material/Build';
+import MemoryIcon from '@mui/icons-material/Memory';
+
+import {
+    getAdminInfoAndData,
+    onSetBuildApprovalStatus,
+    onSetComponentSuggestionStatus
+} from './adminDashboard.telefunc';
+
+import BuildCard from '../../../components/BuildCard';
+import BuildDetailsDialog from '../../../components/BuildDetailsDialog';
+
+export default function AdminDashboard() {
+    const [data, setData] = useState<any>(null);
+    const [loading, setLoading] = useState(true);
+    const [selectedBuildId, setSelectedBuildId] = useState<number | null>(null);
+
+    const [suggestionDialog, setSuggestionDialog] = useState<{ open: boolean, id: number | null, action: 'approved' | 'rejected' }>({ open: false, id: null, action: 'approved' });
+    const [adminComment, setAdminComment] = useState("");
+
+    const loadData = () => {
+        getAdminInfoAndData()
+            .then(res => { setData(res); setLoading(false); })
+            .catch(err => {
+                console.error(err);
+                alert("Failed to load admin data. Are you an admin?");
+            });
+    };
+
+    useEffect(() => { loadData(); }, []);
+
+    const handleBuildReview = async (buildId: number, isApproved: boolean) => {
+        if (!confirm(`Are you sure you want to ${isApproved ? 'APPROVE' : 'REJECT'} this build?`)) return;
+        try {
+            await onSetBuildApprovalStatus({ buildId, isApproved });
+            loadData();
+        } catch (e) { alert("Action failed"); }
+    };
+
+    const openSuggestionReview = (id: number, action: 'approved' | 'rejected') => {
+        setSuggestionDialog({ open: true, id, action });
+        setAdminComment(action === 'approved' ? "Approved by admin." : "Rejected: ");
+    };
+
+    const submitSuggestionReview = async () => {
+        if (!suggestionDialog.id) return;
+        try {
+            await onSetComponentSuggestionStatus({
+                suggestionId: suggestionDialog.id,
+                status: suggestionDialog.action,
+                adminComment: adminComment
+            });
+            // console.error("Test za admincomment: ", adminComment);
+            setSuggestionDialog({ ...suggestionDialog, open: false });
+            loadData();
+        } catch (e) { alert("Failed to update suggestion"); }
+    };
+
+    if (loading) return <Box sx={{ p: 5, textAlign: 'center' }}><CircularProgress /></Box>;
+    if (!data) return <Box sx={{ p: 5, textAlign: 'center' }}>Access Denied</Box>;
+
+    return (
+        <Container maxWidth="xl" sx={{ mt: 4, mb: 10 }}>
+            <Grid container spacing={4}>
+                <Grid item xs={12} md={3}>
+                    <Paper elevation={3} sx={{ p: 4, display: 'flex', flexDirection: 'column', alignItems: 'center', height: '100%', bgcolor: '#1e1e1e', color: 'white' }}>
+                        <Avatar sx={{ width: 120, height: 120, mb: 2, bgcolor: 'error.main' }}>
+                            <AdminPanelSettingsIcon sx={{ fontSize: 70 }} />
+                        </Avatar>
+                        <Typography variant="h5" fontWeight="bold">{data.admin.username}</Typography>
+                        <Typography variant="body2" sx={{ opacity: 0.7, mb: 3 }}>{data.admin.email}</Typography>
+
+                        <Chip label="ADMINISTRATOR" color="error" variant="outlined" sx={{ fontWeight: 'bold' }} />
+                        <Divider sx={{ width: '100%', my: 3, bgcolor: 'rgba(255,255,255,0.1)' }} />
+
+                        <Box sx={{ width: '100%', textAlign: 'center' }}>
+                            <Typography variant="h3" fontWeight="bold" color="primary.main">
+                                {data.pendingBuilds?.length || 0}
+                            </Typography>
+                            <Typography variant="caption">Pending Builds</Typography>
+                        </Box>
+                    </Paper>
+                </Grid>
+
+                <Grid item xs={12} md={9}>
+                    <Grid container spacing={4} direction="column">
+                        <Grid item xs={12}>
+                            <Paper sx={{ p: 3, borderLeft: '6px solid #9c27b0' }}>
+                                <Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>
+                                    <MemoryIcon color="secondary" sx={{ mr: 1 }} />
+                                    <Typography variant="h6" fontWeight="bold">
+                                        Suggested Components ({data.componentSuggestions?.length || 0})
+                                    </Typography>
+                                </Box>
+
+                                {data.componentSuggestions?.length === 0 ? (
+                                    <Typography color="text.secondary">No pending suggestions.</Typography>
+                                ) : (
+                                    <Table size="small">
+                                        <TableHead>
+                                            <TableRow>
+                                                <TableCell>Link/Description</TableCell>
+                                                <TableCell>Type</TableCell>
+                                                <TableCell>User</TableCell>
+                                                <TableCell align="right">Actions</TableCell>
+                                            </TableRow>
+                                        </TableHead>
+                                        <TableBody>
+                                            {data.componentSuggestions.map((sug: any) => (
+                                                <TableRow key={sug.id}>
+                                                    <TableCell sx={{ maxWidth: 300 }}>
+                                                        <a href={sug.link} title={sug.link} style={{textDecoration: 'none', color: 'inherit'}}>
+                                                            {sug.description || sug.link}
+                                                        </a>
+                                                    </TableCell>
+                                                    <TableCell>{sug.componentType}</TableCell>
+                                                    <TableCell>{sug.userId}</TableCell>
+                                                    <TableCell align="right">
+                                                        <IconButton size="small" color="success" onClick={() => openSuggestionReview(sug.id, 'approved')}>
+                                                            <CheckCircleIcon />
+                                                        </IconButton>
+                                                        <IconButton size="small" color="error" onClick={() => openSuggestionReview(sug.id, 'rejected')}>
+                                                            <CancelIcon />
+                                                        </IconButton>
+                                                    </TableCell>
+                                                </TableRow>
+                                            ))}
+                                        </TableBody>
+                                    </Table>
+                                )}
+                            </Paper>
+                        </Grid>
+
+                        <Grid item xs={12}>
+                            <Paper sx={{ p: 3, borderLeft: '6px solid #ed6c02', bgcolor: '#121212' }}>
+                                <Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>
+                                    <BuildIcon color="warning" sx={{ mr: 1 }} />
+                                    <Typography variant="h6" fontWeight="bold">
+                                        Builds Waiting for Approval ({data.pendingBuilds?.length || 0})
+                                    </Typography>
+                                </Box>
+
+                                {data.pendingBuilds?.length === 0 ? (
+                                    <Typography color="text.secondary">No pending builds.</Typography>
+                                ) : (
+                                    <Grid container spacing={2}>
+                                        {data.pendingBuilds.map((build: any) => (
+                                            <Grid item xs={12} md={4} key={build.id}>
+                                                <Box sx={{ position: 'relative' }}>
+                                                    <BuildCard
+                                                        build={build}
+                                                        onClick={() => setSelectedBuildId(build.id)}
+                                                    />
+                                                    <Box sx={{
+                                                        mt: 1, display: 'flex', gap: 1,
+                                                        justifyContent: 'center', bgcolor: '#121212', p: 1, borderRadius: 1
+                                                    }}>
+                                                        <Button variant="contained" color="success" size="small" onClick={() => handleBuildReview(build.id, true)}>
+                                                            Approve
+                                                        </Button>
+                                                        <Button variant="contained" color="error" size="small" onClick={() => handleBuildReview(build.id, false)}>
+                                                            Reject
+                                                        </Button>
+                                                    </Box>
+                                                </Box>
+                                            </Grid>
+                                        ))}
+                                    </Grid>
+                                )}
+                            </Paper>
+                        </Grid>
+
+                        <Grid item xs={12}>
+                            <Paper sx={{ p: 3, borderLeft: '6px solid #2e7d32' }}>
+                                <Typography variant="h6" fontWeight="bold" gutterBottom>
+                                    My Builds / Sandbox
+                                </Typography>
+                                {data.userBuilds?.length === 0 ? (
+                                    <Typography color="text.secondary">No builds created by admin.</Typography>
+                                ) : (
+                                    <Grid container spacing={2}>
+                                        {data.userBuilds.slice(0, 4).map((build: any) => (
+                                            <Grid item xs={12} md={3} key={build.id}>
+                                                <BuildCard
+                                                    build={build}
+                                                    onClick={() => setSelectedBuildId(build.id)}
+                                                />
+                                            </Grid>
+                                        ))}
+                                    </Grid>
+                                )}
+                            </Paper>
+                        </Grid>
+
+                    </Grid>
+                </Grid>
+            </Grid>
+
+            <Dialog open={suggestionDialog.open} onClose={() => setSuggestionDialog({...suggestionDialog, open: false})}>
+                <DialogTitle>Review Suggestion</DialogTitle>
+                <DialogContent>
+                    <Typography gutterBottom>Status: <b>{suggestionDialog.action.toUpperCase()}</b></Typography>
+                    <TextField
+                        fullWidth label="Admin Comment" multiline rows={3}
+                        value={adminComment} onChange={(e) => setAdminComment(e.target.value)}
+                    />
+                </DialogContent>
+                <DialogActions>
+                    <Button onClick={() => setSuggestionDialog({...suggestionDialog, open: false})}>Cancel</Button>
+                    <Button variant="contained" onClick={submitSuggestionReview}>Submit</Button>
+                </DialogActions>
+            </Dialog>
+
+            <BuildDetailsDialog
+                open={!!selectedBuildId}
+                buildId={selectedBuildId}
+                currentUser={data.admin?.id}
+                onClose={() => setSelectedBuildId(null)}
+                onClone={() => alert("Clone disabled in admin view")}
+            />
+        </Container>
+    );
+}