spinner added in contetn calednar page

This commit is contained in:
IGNY8 VPS (Salman)
2026-01-19 15:46:47 +00:00
parent e7219a2390
commit 27afc63d88

View File

@@ -14,6 +14,7 @@ import PageMeta from '../../components/common/PageMeta';
import PageHeader from '../../components/common/PageHeader';
import ComponentCard from '../../components/common/ComponentCard';
import { Card } from '../../components/ui/card';
import { Spinner } from '../../components/ui/spinner';
import Button from '../../components/ui/button/Button';
import IconButton from '../../components/ui/button/IconButton';
import { ButtonGroup, ButtonGroupItem } from '../../components/ui/button-group/ButtonGroup';
@@ -169,50 +170,36 @@ export default function ContentCalendar() {
const loadQueue = useCallback(async () => {
if (!activeSite?.id) return;
const siteId = activeSite.id;
const safeFetch = async (url: string) => {
try {
const response = await fetchAPI(url);
return response?.results || [];
} catch (error: any) {
return [];
}
};
try {
setLoading(true);
// IMPORTANT: Since content is ordered by -created_at, we need to fetch items by specific site_status
// Otherwise old scheduled/failed items will be on later pages and won't load
// NOTE: fetchAPI doesn't support params object - must use URL query strings
const [scheduledItems, failedItems, reviewItems, approvedItems, publishedItems] = await Promise.all([
safeFetch(`/v1/writer/content/?site_id=${siteId}&page_size=1000&site_status=scheduled`),
safeFetch(`/v1/writer/content/?site_id=${siteId}&page_size=1000&site_status=failed`),
safeFetch(`/v1/writer/content/?site_id=${siteId}&page_size=100&status=review`),
safeFetch(`/v1/writer/content/?site_id=${siteId}&page_size=100&status=approved&site_status=not_published`),
safeFetch(`/v1/writer/content/?site_id=${siteId}&page_size=100&site_status=published&ordering=-updated_at`),
]);
const siteId = activeSite.id;
// Fetch scheduled items (all of them, regardless of page)
const scheduledResponse = await fetchAPI(
`/v1/writer/content/?site_id=${siteId}&page_size=1000&site_status=scheduled`
);
// Fetch failed items (all of them)
const failedResponse = await fetchAPI(
`/v1/writer/content/?site_id=${siteId}&page_size=1000&site_status=failed`
);
// Fetch review items (for review count display)
const reviewResponse = await fetchAPI(
`/v1/writer/content/?site_id=${siteId}&page_size=100&status=review`
);
// Fetch approved items (for sidebar drag-drop) - not yet published to site
const approvedResponse = await fetchAPI(
`/v1/writer/content/?site_id=${siteId}&page_size=100&status=approved&site_status=not_published`
);
// Fetch published items (site_status=published) for display
const publishedResponse = await fetchAPI(
`/v1/writer/content/?site_id=${siteId}&page_size=100&site_status=published&ordering=-updated_at`
);
// Combine all results, removing duplicates by ID
const allItems = [
...(scheduledResponse.results || []),
...(failedResponse.results || []),
...(reviewResponse.results || []),
...(approvedResponse.results || []),
...(publishedResponse.results || []),
...scheduledItems,
...failedItems,
...reviewItems,
...approvedItems,
...publishedItems,
];
// Remove duplicates by ID
const uniqueItems = Array.from(
new Map(allItems.map(item => [item.id, item])).values()
);
@@ -604,7 +591,14 @@ export default function ContentCalendar() {
<div className="flex gap-6">
{/* Main Calendar/List View */}
<div className="flex-1">
{queueItems.length === 0 && approvedItems.length === 0 ? (
{loading ? (
<Card className="p-12 text-center">
<div className="flex flex-col items-center gap-4">
<Spinner size="lg" />
<p className="text-gray-600 dark:text-gray-400">Loading calendar...</p>
</div>
</Card>
) : queueItems.length === 0 && approvedItems.length === 0 ? (
<Card className="p-12 text-center">
<CalendarIcon className="w-12 h-12 mx-auto text-gray-400 mb-4" />
<h3 className="text-lg font-medium text-gray-900 dark:text-white mb-2">