conten view tempalte tiem fix

This commit is contained in:
IGNY8 VPS (Salman)
2026-01-19 17:47:09 +00:00
parent c61eae051b
commit 8eb4d40cf1
2 changed files with 103 additions and 33 deletions

View File

@@ -21,6 +21,7 @@ import { ArrowLeftIcon, CalendarIcon, TagIcon, FileTextIcon, CheckCircleIcon, XC
import { useNavigate } from 'react-router-dom';
import Button from '../components/ui/button/Button';
import { useToast } from '../components/ui/toast/ToastContainer';
import { formatDateTime, formatDateTimeLocal, getDatePartsInAccountTimezone, toUtcISOStringFromLocal } from '../utils/date';
interface ContentViewTemplateProps {
content: Content | null;
@@ -632,16 +633,17 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
// Initialize schedule datetime when content loads
useEffect(() => {
if (content?.scheduled_publish_at) {
// Convert ISO string to datetime-local format (YYYY-MM-DDTHH:mm)
const date = new Date(content.scheduled_publish_at);
const localDateTime = date.toISOString().slice(0, 16);
const localDateTime = formatDateTimeLocal(content.scheduled_publish_at);
setScheduleDateTime(localDateTime);
} else if (content?.site_status === 'failed') {
// Default to tomorrow at 9 AM for failed items without a schedule
const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
tomorrow.setHours(9, 0, 0, 0);
setScheduleDateTime(tomorrow.toISOString().slice(0, 16));
// Default to tomorrow at 9 AM (account timezone) for failed items without a schedule
const todayParts = getDatePartsInAccountTimezone(new Date());
const baseDate = new Date(Date.UTC(todayParts.year, todayParts.month - 1, todayParts.day));
baseDate.setUTCDate(baseDate.getUTCDate() + 1);
const year = baseDate.getUTCFullYear();
const month = String(baseDate.getUTCMonth() + 1).padStart(2, '0');
const day = String(baseDate.getUTCDate()).padStart(2, '0');
setScheduleDateTime(`${year}-${month}-${day}T09:00`);
}
}, [content?.scheduled_publish_at, content?.site_status]);
@@ -651,7 +653,11 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
setIsUpdatingSchedule(true);
try {
const isoDateTime = new Date(scheduleDateTime).toISOString();
const isoDateTime = toUtcISOStringFromLocal(scheduleDateTime);
if (!isoDateTime) {
toast.error('Invalid schedule date/time.');
return;
}
// Use reschedule endpoint for failed items, schedule endpoint for scheduled items
const endpoint = content.site_status === 'failed'
@@ -875,20 +881,6 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
);
}
const formatDate = (dateString: string) => {
try {
return new Date(dateString).toLocaleDateString('en-US', {
year: 'numeric',
month: 'long',
day: 'numeric',
hour: '2-digit',
minute: '2-digit',
});
} catch {
return dateString;
}
};
const getStatusColor = (status: string) => {
const statusLower = status.toLowerCase();
if (statusLower === 'generated' || statusLower === 'published' || statusLower === 'complete') {
@@ -974,7 +966,7 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
<div>
<p className="text-xs text-gray-500 dark:text-gray-400">Generated</p>
<p className="text-sm font-medium text-gray-900 dark:text-white">
{formatDate(content.generated_at)}
{formatDateTime(content.generated_at)}
</p>
</div>
</div>
@@ -984,7 +976,7 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
<div>
<p className="text-xs text-gray-500 dark:text-gray-400">Last Updated</p>
<p className="text-sm font-medium text-gray-900 dark:text-white">
{formatDate(content.updated_at)}
{formatDateTime(content.updated_at)}
</p>
</div>
</div>
@@ -1225,14 +1217,16 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
setIsEditingSchedule(false);
// Reset to original value or tomorrow if failed
if (content.scheduled_publish_at) {
const date = new Date(content.scheduled_publish_at);
setScheduleDateTime(date.toISOString().slice(0, 16));
setScheduleDateTime(formatDateTimeLocal(content.scheduled_publish_at));
} else if (content.site_status === 'failed') {
// Default to tomorrow for failed items
const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
tomorrow.setHours(9, 0, 0, 0);
setScheduleDateTime(tomorrow.toISOString().slice(0, 16));
const todayParts = getDatePartsInAccountTimezone(new Date());
const baseDate = new Date(Date.UTC(todayParts.year, todayParts.month - 1, todayParts.day));
baseDate.setUTCDate(baseDate.getUTCDate() + 1);
const year = baseDate.getUTCFullYear();
const month = String(baseDate.getUTCMonth() + 1).padStart(2, '0');
const day = String(baseDate.getUTCDate()).padStart(2, '0');
setScheduleDateTime(`${year}-${month}-${day}T09:00`);
}
}}
>
@@ -1243,10 +1237,10 @@ export default function ContentViewTemplate({ content, loading, onBack }: Conten
<>
<span className="text-sm text-gray-500 dark:text-gray-400">
{content.site_status === 'failed' && (
content.scheduled_publish_at ? `Was scheduled: ${formatDate(content.scheduled_publish_at)}` : 'Not scheduled'
content.scheduled_publish_at ? `Was scheduled: ${formatDateTime(content.scheduled_publish_at)}` : 'Not scheduled'
)}
{content.site_status === 'scheduled' && (
content.scheduled_publish_at ? formatDate(content.scheduled_publish_at) : ''
content.scheduled_publish_at ? formatDateTime(content.scheduled_publish_at) : ''
)}
</span>
<button

View File

@@ -19,6 +19,28 @@ const getDatePartsInTimezone = (date: Date, timeZone: string) => {
return { year, month, day };
};
export const getDatePartsInAccountTimezone = (date: Date = new Date()) =>
getDatePartsInTimezone(date, getAccountTimezone());
const getTimeZoneOffset = (date: Date, timeZone: string): number => {
const formatter = new Intl.DateTimeFormat('en-US', {
timeZone,
hour12: false,
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
});
const parts = formatter.formatToParts(date);
const values = Object.fromEntries(parts.map((part) => [part.type, part.value]));
const localIso = `${values.year}-${values.month}-${values.day}T${values.hour}:${values.minute}:${values.second}Z`;
const localDate = new Date(localIso);
return (localDate.getTime() - date.getTime()) / 60000;
};
export function formatRelativeDate(dateString: string | Date): string {
if (!dateString) {
return 'Today';
@@ -162,3 +184,57 @@ export function formatTime(
});
}
/**
* Format date/time to datetime-local value using account timezone
* @param dateString - ISO date string or Date object
*/
export function formatDateTimeLocal(
dateString: string | Date | null | undefined
): string {
if (!dateString) return '';
const date = typeof dateString === 'string' ? new Date(dateString) : dateString;
if (isNaN(date.getTime())) return '';
const timeZone = getAccountTimezone();
const formatter = new Intl.DateTimeFormat('en-US', {
timeZone,
hour12: false,
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
});
const parts = formatter.formatToParts(date);
const values = Object.fromEntries(parts.map((part) => [part.type, part.value]));
return `${values.year}-${values.month}-${values.day}T${values.hour}:${values.minute}`;
}
/**
* Convert a datetime-local value (in account timezone) to a UTC ISO string
* @param dateTimeLocal - datetime-local value (YYYY-MM-DDTHH:mm)
*/
export function toUtcISOStringFromLocal(
dateTimeLocal: string,
timeZone: string = getAccountTimezone()
): string | null {
if (!dateTimeLocal) return null;
const [datePart, timePart] = dateTimeLocal.split('T');
if (!datePart || !timePart) return null;
const [year, month, day] = datePart.split('-').map((value) => parseInt(value, 10));
const [hour, minute] = timePart.split(':').map((value) => parseInt(value, 10));
if ([year, month, day, hour, minute].some((value) => Number.isNaN(value))) {
return null;
}
const utcDate = new Date(Date.UTC(year, month - 1, day, hour, minute, 0));
const offsetMinutes = getTimeZoneOffset(utcDate, timeZone);
const adjustedDate = new Date(utcDate.getTime() - offsetMinutes * 60000);
return adjustedDate.toISOString();
}