kunthawat/ALwrity
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update frontend components: TeamHuddleWidget, useAgentHuddleFeed, TeamActivityPage

Browse Source
This commit is contained in:
ajaysi
2026-03-04 09:19:53 +05:30
parent 45fb9636e2
commit 1d36ebe2f9
6 changed files with 43 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
frontend/src/pages/TeamActivityPage.tsx
View File

@@ -1,114 +1,4 @@
import React from 'react';
<<<<<<< HEAD
import {
Box,
Chip,
Divider,
Paper,
Stack,
Typography,
List,
ListItem,
ListItemText,
} from '@mui/material';
const activeRuns = [
{ id: 'run-9142', title: 'Q4 SEO Pillar Refresh', owner: 'SEO Specialist', progress: '67%' },
{ id: 'run-9143', title: 'LinkedIn Carousel Draft', owner: 'Content Strategist', progress: '42%' },
{ id: 'run-9144', title: 'Competitor Monitoring Sweep', owner: 'Competitor Analyst', progress: '88%' },
];
const timelineEvents = [
{ time: '09:20', detail: 'Strategy Architect approved updated campaign goals.' },
{ time: '09:35', detail: 'Social Manager queued 6 posts for review.' },
{ time: '10:05', detail: 'SEO Specialist flagged ranking drop on "AI copy tools".' },
{ time: '10:24', detail: 'Content Strategist generated new briefing packet.' },
];
const alerts = [
{ severity: 'high', label: '2 content briefs are blocked on missing references.' },
{ severity: 'medium', label: 'SERP volatility increased for 3 tracked keywords.' },
];
const approvals = [
{ id: 'ap-112', action: 'Publish LinkedIn thread for Campaign Alpha', requestedBy: 'Social Manager' },
{ id: 'ap-113', action: 'Approve budget reallocation to ad creatives', requestedBy: 'Strategy Architect' },
];
export default function TeamActivityPage() {
return (
<Box sx={{ p: { xs: 2, md: 3 } }}>
<Typography variant="h4" sx={{ fontWeight: 700, mb: 1 }}>
Team Activity
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 3 }}>
Real-time view of active agent workstreams, timelines, alerts, and pending approvals.
</Typography>
<Stack spacing={2.5}>
<Paper sx={{ p: 2.5 }}>
<Typography variant="h6" sx={{ fontWeight: 700, mb: 1.5 }}>Active Runs</Typography>
<Stack spacing={1}>
{activeRuns.map((run) => (
<Stack key={run.id} direction="row" justifyContent="space-between" alignItems="center">
<Box>
<Typography sx={{ fontWeight: 600 }}>{run.title}</Typography>
<Typography variant="caption" color="text.secondary">{run.owner}</Typography>
</Box>
<Chip size="small" label={run.progress} color="primary" variant="outlined" />
</Stack>
))}
</Stack>
</Paper>
<Paper sx={{ p: 2.5 }}>
<Typography variant="h6" sx={{ fontWeight: 700, mb: 1.5 }}>Event Timeline</Typography>
<List disablePadding>
{timelineEvents.map((event, index) => (
<React.Fragment key={`${event.time}-${event.detail}`}>
{index > 0 && <Divider sx={{ my: 1 }} />}
<ListItem disableGutters sx={{ py: 0 }}>
<ListItemText
primary={<Typography sx={{ fontWeight: 600 }}>{event.detail}</Typography>}
secondary={<Typography variant="caption">{event.time}</Typography>}
/>
</ListItem>
</React.Fragment>
))}
</List>
</Paper>
<Paper sx={{ p: 2.5 }}>
<Typography variant="h6" sx={{ fontWeight: 700, mb: 1.5 }}>Alerts</Typography>
<Stack spacing={1}>
{alerts.map((alert) => (
<Chip
key={alert.label}
label={alert.label}
color={alert.severity === 'high' ? 'error' : 'warning'}
variant="outlined"
sx={{ justifyContent: 'flex-start' }}
/>
))}
</Stack>
</Paper>
<Paper sx={{ p: 2.5 }}>
<Typography variant="h6" sx={{ fontWeight: 700, mb: 1.5 }}>Approvals Requiring Action</Typography>
<Stack spacing={1}>
{approvals.map((approval) => (
<Box key={approval.id}>
<Typography sx={{ fontWeight: 600 }}>{approval.action}</Typography>
<Typography variant="caption" color="text.secondary">Requested by {approval.requestedBy}</Typography>
</Box>
))}
</Stack>
</Paper>
</Stack>
</Box>
);
}
=======
import { Box, Card, CardContent, Chip, Divider, Grid, List, ListItem, ListItemText, Typography } from '@mui/material';
import { useAgentHuddleFeed } from '../hooks/useAgentHuddleFeed';
@@ -174,4 +64,3 @@ const TeamActivityPage: React.FC = () => {
};
export default TeamActivityPage;
>>>>>>> pr-368