be-components 7.4.7 → 7.5.1

package/lib/module/BetRouter/components/admin/JobManager.js

@@ -0,0 +1,888 @@
+import React, { useEffect, useState } from 'react';
+import { View, Text, Button } from "../../../Components/Themed";
+import { ActivityIndicator, TouchableOpacity, ScrollView, TextInput, Modal } from 'react-native';
+import { useColors } from '../../../constants/useColors';
+import { BetRouterApi } from '../../api';
+import { Icons } from '../../../Components';
+const JobManager = () => {
+  const Colors = useColors();
+
+  // State
+  const [loading, setLoading] = useState(true);
+  const [jobs, setJobs] = useState([]);
+  const [statusJobs, setStatusJobs] = useState([]); // Jobs related to statuses
+  const [recentStatuses, setRecentStatuses] = useState([]);
+  const [statusesLoading, setStatusesLoading] = useState(false);
+  const [statusesPage, setStatusesPage] = useState(0);
+  const [hasMoreStatuses, setHasMoreStatuses] = useState(false);
+  const [totalStatusCount, setTotalStatusCount] = useState(0);
+
+  // Modal states
+  const [showCreateModal, setShowCreateModal] = useState(false);
+  const [showEditModal, setShowEditModal] = useState(false);
+  const [showChildStatusModal, setShowChildStatusModal] = useState(false);
+  const [selectedJob, setSelectedJob] = useState(null);
+  const [selectedParentStatus, setSelectedParentStatus] = useState(null);
+  const [childStatuses, setChildStatuses] = useState([]);
+
+  // Form states
+  const [formData, setFormData] = useState({
+    job_key: '',
+    name: '',
+    description: '',
+    frequency: '',
+    frequency_type: 'minutes'
+  });
+  const STATUSES_PER_PAGE = 50;
+  useEffect(() => {
+    loadJobs();
+    loadRecentStatuses(0);
+  }, []);
+  const loadJobs = async () => {
+    setLoading(true);
+    try {
+      const result = await BetRouterApi.BetRouter.JobApi.getJobs();
+      if (result.jobs) {
+        setJobs(result.jobs);
+      }
+    } catch (error) {
+      console.error('Failed to load jobs:', error);
+      alert('Error loading jobs: ' + error.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const loadRecentStatuses = async offset => {
+    setStatusesLoading(true);
+    try {
+      const result = await BetRouterApi.BetRouter.JobApi.getRecentStatuses(STATUSES_PER_PAGE, offset);
+      if (result.statuses) {
+        setRecentStatuses(result.statuses);
+        setStatusJobs(result.jobs || []); // Store the jobs related to these statuses
+        setTotalStatusCount(result.count || 0);
+        setHasMoreStatuses(false);
+      }
+    } catch (error) {
+      console.error('Failed to load job statuses:', error);
+    } finally {
+      setStatusesLoading(false);
+    }
+  };
+  const handlePageChange = newPage => {
+    setStatusesPage(newPage);
+    loadRecentStatuses(newPage * STATUSES_PER_PAGE);
+  };
+  const handleCreateJob = async () => {
+    try {
+      if (!formData.job_key || !formData.name || !formData.frequency) {
+        alert('Please fill in all required fields');
+        return;
+      }
+      const frequency = parseInt(formData.frequency);
+      if (isNaN(frequency) || frequency <= 0) {
+        alert('Frequency must be a positive number');
+        return;
+      }
+      await BetRouterApi.BetRouter.JobApi.createJob(formData.job_key, formData.name, formData.description, frequency, formData.frequency_type);
+      alert(`Job "${formData.name}" created successfully!`);
+      setShowCreateModal(false);
+      resetForm();
+      loadJobs();
+    } catch (error) {
+      console.error('Failed to create job:', error);
+      alert('Error creating job: ' + error.message);
+    }
+  };
+  const handleUpdateJob = async () => {
+    if (!selectedJob) return;
+    try {
+      const frequency = parseInt(formData.frequency);
+      if (isNaN(frequency) || frequency <= 0) {
+        alert('Frequency must be a positive number');
+        return;
+      }
+      await BetRouterApi.BetRouter.JobApi.updateJob(selectedJob.router_job_id, {
+        name: formData.name,
+        description: formData.description,
+        frequency: frequency,
+        frequency_type: formData.frequency_type
+      });
+      alert(`Job "${formData.name}" updated successfully!`);
+      setShowEditModal(false);
+      resetForm();
+      loadJobs();
+    } catch (error) {
+      console.error('Failed to update job:', error);
+      alert('Error updating job: ' + error.message);
+    }
+  };
+  const handleDeleteJob = async job => {
+    if (!confirm(`Are you sure you want to delete job "${job.name}"?`)) {
+      return;
+    }
+    try {
+      await BetRouterApi.BetRouter.JobApi.deleteJob(job.router_job_id);
+      alert(`Job "${job.name}" deleted successfully!`);
+      loadJobs();
+    } catch (error) {
+      console.error('Failed to delete job:', error);
+      alert('Error deleting job: ' + error.message);
+    }
+  };
+  const handleRunJob = async job => {
+    try {
+      setLoading(true);
+      await BetRouterApi.BetRouter.JobApi.queueJob(job.job_key);
+      alert(`Job "${job.name}" queued successfully! Created status record(s).`);
+      loadRecentStatuses(statusesPage * STATUSES_PER_PAGE);
+      loadJobs(); // Refresh to update last_success_datetime
+    } catch (error) {
+      console.error('Failed to queue job:', error);
+      alert('Error running job: ' + error.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleViewChildStatuses = async parentStatus => {
+    try {
+      setSelectedParentStatus(parentStatus);
+      // Child statuses reference their parent via parent_job_id
+      // Filter recentStatuses to find children of this parent
+      const children = recentStatuses.filter(s => s.parent_job_id === parentStatus.job_status_id);
+      setChildStatuses(children);
+      setShowChildStatusModal(true);
+    } catch (error) {
+      console.error('Failed to load child statuses:', error);
+      alert('Error loading child job statuses: ' + error.message);
+    }
+  };
+  const openEditModal = job => {
+    setSelectedJob(job);
+    setFormData({
+      job_key: job.job_key,
+      name: job.name,
+      description: job.description,
+      frequency: job.frequency.toString(),
+      frequency_type: job.frequency_type
+    });
+    setShowEditModal(true);
+  };
+  const resetForm = () => {
+    setFormData({
+      job_key: '',
+      name: '',
+      description: '',
+      frequency: '',
+      frequency_type: 'minutes'
+    });
+    setSelectedJob(null);
+  };
+
+  // Helper to look up job details for a status
+  const getJobForStatus = status => {
+    return statusJobs.find(job => job.router_job_id === status.router_job_id);
+  };
+  const getStatusIcon = status => {
+    switch (status) {
+      case 'success':
+        return '✅';
+      case 'failed':
+        return '❌';
+      case 'in_progress':
+        return '⏳';
+      case 'scheduled':
+        return '📅';
+      default:
+        return '⚪';
+    }
+  };
+  const getStatusColor = status => {
+    switch (status) {
+      case 'success':
+        return Colors.text.success;
+      case 'failed':
+        return Colors.text.error;
+      case 'in_progress':
+        return Colors.text.warning;
+      default:
+        return Colors.text.descriptionLight;
+    }
+  };
+  const formatDuration = (start, end) => {
+    if (!end) return 'In progress...';
+    const duration = new Date(end).getTime() - new Date(start).getTime();
+    const seconds = Math.floor(duration / 1000);
+    if (seconds < 60) return `${seconds}s`;
+    const minutes = Math.floor(seconds / 60);
+    return `${minutes}m ${seconds % 60}s`;
+  };
+  const formatLastRun = datetime => {
+    if (!datetime) return 'Never';
+    const diff = Date.now() - new Date(datetime).getTime();
+    const minutes = Math.floor(diff / 60000);
+    const hours = Math.floor(minutes / 60);
+    const days = Math.floor(hours / 24);
+    if (days > 0) return `${days} day${days > 1 ? 's' : ''} ago`;
+    if (hours > 0) return `${hours} hour${hours > 1 ? 's' : ''} ago`;
+    if (minutes > 0) return `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
+    return 'Just now';
+  };
+  const renderFormModal = isEdit => /*#__PURE__*/React.createElement(Modal, {
+    visible: isEdit ? showEditModal : showCreateModal,
+    animationType: "slide",
+    transparent: true,
+    onRequestClose: () => {
+      isEdit ? setShowEditModal(false) : setShowCreateModal(false);
+      resetForm();
+    }
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    activeOpacity: 1,
+    onPress: () => {
+      isEdit ? setShowEditModal(false) : setShowCreateModal(false);
+      resetForm();
+    },
+    style: {
+      flex: 1,
+      backgroundColor: 'rgba(0,0,0,0.5)',
+      justifyContent: 'center',
+      alignItems: 'center',
+      padding: 20
+    }
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    activeOpacity: 1,
+    onPress: e => e.stopPropagation(),
+    style: {
+      width: '100%',
+      maxWidth: 500
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "body",
+    style: {
+      borderRadius: 8,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      overflow: 'hidden'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "header",
+    style: {
+      padding: 16,
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h1",
+    size: 18
+  }, isEdit ? 'Edit Job' : 'Create New Job'), /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: () => {
+      isEdit ? setShowEditModal(false) : setShowCreateModal(false);
+      resetForm();
+    }
+  }, /*#__PURE__*/React.createElement(Icons.CloseIcon, {
+    size: 20,
+    color: Colors.text.h1
+  }))), /*#__PURE__*/React.createElement(ScrollView, {
+    style: {
+      maxHeight: 500
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 16
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 13,
+    style: {
+      marginBottom: 6
+    }
+  }, "Job Key *"), /*#__PURE__*/React.createElement(TextInput, {
+    style: {
+      backgroundColor: Colors.views.input,
+      borderRadius: 6,
+      padding: 10,
+      color: Colors.text.h1,
+      marginBottom: 16,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      fontSize: 13
+    },
+    value: formData.job_key,
+    onChangeText: text => setFormData({
+      ...formData,
+      job_key: text
+    }),
+    placeholder: "loadContests",
+    placeholderTextColor: Colors.text.descriptionLight,
+    editable: !isEdit
+  }), /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 13,
+    style: {
+      marginBottom: 6
+    }
+  }, "Name *"), /*#__PURE__*/React.createElement(TextInput, {
+    style: {
+      backgroundColor: Colors.views.input,
+      borderRadius: 6,
+      padding: 10,
+      color: Colors.text.h1,
+      marginBottom: 16,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      fontSize: 13
+    },
+    value: formData.name,
+    onChangeText: text => setFormData({
+      ...formData,
+      name: text
+    }),
+    placeholder: "Load Contests",
+    placeholderTextColor: Colors.text.descriptionLight
+  }), /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 13,
+    style: {
+      marginBottom: 6
+    }
+  }, "Description"), /*#__PURE__*/React.createElement(TextInput, {
+    style: {
+      backgroundColor: Colors.views.input,
+      borderRadius: 6,
+      padding: 10,
+      color: Colors.text.h1,
+      marginBottom: 16,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      minHeight: 70,
+      fontSize: 13
+    },
+    value: formData.description,
+    onChangeText: text => setFormData({
+      ...formData,
+      description: text
+    }),
+    placeholder: "Loads contests for all active leagues",
+    placeholderTextColor: Colors.text.descriptionLight,
+    multiline: true,
+    textAlignVertical: "top"
+  }), /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 13,
+    style: {
+      marginBottom: 6
+    }
+  }, "Frequency *"), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flexDirection: 'row',
+      gap: 8,
+      marginBottom: 20
+    }
+  }, /*#__PURE__*/React.createElement(TextInput, {
+    style: {
+      flex: 1,
+      backgroundColor: Colors.views.input,
+      borderRadius: 6,
+      padding: 10,
+      color: Colors.text.h1,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      fontSize: 13
+    },
+    value: formData.frequency,
+    onChangeText: text => setFormData({
+      ...formData,
+      frequency: text
+    }),
+    placeholder: "15",
+    placeholderTextColor: Colors.text.descriptionLight,
+    keyboardType: "number-pad"
+  }), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flex: 1,
+      gap: 4
+    }
+  }, ['minutes', 'hours', 'days'].map(type => /*#__PURE__*/React.createElement(TouchableOpacity, {
+    key: type,
+    onPress: () => setFormData({
+      ...formData,
+      frequency_type: type
+    }),
+    style: {
+      padding: 8,
+      backgroundColor: formData.frequency_type === type ? Colors.buttons.background.action : Colors.views.header,
+      borderRadius: 4,
+      borderWidth: 1,
+      borderColor: formData.frequency_type === type ? Colors.buttons.background.action : Colors.borders.light
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: formData.frequency_type === type ? 'h2' : 'description',
+    size: 11,
+    style: {
+      textAlign: 'center',
+      color: formData.frequency_type === type ? Colors.text.white : Colors.text.description
+    }
+  }, type))))), /*#__PURE__*/React.createElement(Button, {
+    type: "success",
+    title: isEdit ? 'Update Job' : 'Create Job',
+    onPress: isEdit ? handleUpdateJob : handleCreateJob
+  })))))));
+  const renderChildStatusModal = () => /*#__PURE__*/React.createElement(Modal, {
+    visible: showChildStatusModal,
+    animationType: "slide",
+    transparent: true,
+    onRequestClose: () => {
+      setShowChildStatusModal(false);
+      setSelectedParentStatus(null);
+      setChildStatuses([]);
+    }
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    activeOpacity: 1,
+    onPress: () => {
+      setShowChildStatusModal(false);
+      setSelectedParentStatus(null);
+      setChildStatuses([]);
+    },
+    style: {
+      flex: 1,
+      backgroundColor: 'rgba(0,0,0,0.5)',
+      justifyContent: 'center',
+      alignItems: 'center',
+      padding: 20
+    }
+  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+    activeOpacity: 1,
+    onPress: e => e.stopPropagation(),
+    style: {
+      width: '100%',
+      maxWidth: 600
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "body",
+    style: {
+      borderRadius: 8,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      overflow: 'hidden'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "header",
+    style: {
+      padding: 16
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h1",
+    size: 18
+  }, "Child Jobs"), selectedParentStatus && /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 11,
+    style: {
+      marginTop: 4
+    }
+  }, getJobForStatus(selectedParentStatus)?.name || selectedParentStatus.router_job_id, " - ", new Date(selectedParentStatus.start_datetime).toLocaleString())), /*#__PURE__*/React.createElement(TouchableOpacity, {
+    onPress: () => {
+      setShowChildStatusModal(false);
+      setSelectedParentStatus(null);
+      setChildStatuses([]);
+    }
+  }, /*#__PURE__*/React.createElement(Icons.CloseIcon, {
+    size: 20,
+    color: Colors.text.h1
+  })))), /*#__PURE__*/React.createElement(ScrollView, {
+    style: {
+      maxHeight: 500
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 16
+    }
+  }, childStatuses.length === 0 ? /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 40,
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "description"
+  }, "No child jobs found")) : childStatuses.map((status, index) => {
+    const job = getJobForStatus(status);
+    return /*#__PURE__*/React.createElement(View, {
+      key: status.job_status_id,
+      transparent: true,
+      style: {
+        padding: 12,
+        backgroundColor: Colors.views.header,
+        borderRadius: 6,
+        marginBottom: 8,
+        borderLeftWidth: 3,
+        borderLeftColor: getStatusColor(status.status)
+      }
+    }, /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        marginBottom: 6
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      theme: "h2",
+      size: 14
+    }, index + 1, ". ", job?.name || status.router_job_id), /*#__PURE__*/React.createElement(Text, {
+      size: 16
+    }, getStatusIcon(status.status))), /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11,
+      style: {
+        marginBottom: 3
+      }
+    }, "Job Key: ", job?.job_key || 'Unknown'), /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11,
+      style: {
+        marginBottom: 3
+      }
+    }, "Started: ", new Date(status.start_datetime).toLocaleTimeString()), /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11
+    }, "Duration: ", formatDuration(status.start_datetime, status.end_datetime)));
+  })))))));
+  if (loading) {
+    return /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        padding: 40,
+        alignItems: 'center'
+      }
+    }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+      size: "large",
+      color: Colors.text.h1
+    }));
+  }
+  const totalPages = Math.ceil(totalStatusCount / STATUSES_PER_PAGE);
+  return /*#__PURE__*/React.createElement(View, {
+    transparent: true
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      marginBottom: 24
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h1",
+    size: 24
+  }, "Job Manager"), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 14,
+    style: {
+      marginTop: 8
+    }
+  }, "Manage automated background jobs")), /*#__PURE__*/React.createElement(Button, {
+    type: "success",
+    title: "+ New Job",
+    onPress: () => setShowCreateModal(true)
+  }))), /*#__PURE__*/React.createElement(View, {
+    type: "body",
+    style: {
+      borderRadius: 8,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      overflow: 'hidden',
+      marginBottom: 24
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "header",
+    style: {
+      padding: 16
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 16
+  }, "Configured Jobs"), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 12,
+    style: {
+      marginTop: 4
+    }
+  }, jobs.length, " job", jobs.length !== 1 ? 's' : '', " configured")), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 16
+    }
+  }, jobs.length === 0 ? /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 40,
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "description"
+  }, "No jobs configured yet")) : jobs.map(job => /*#__PURE__*/React.createElement(View, {
+    key: job.router_job_id,
+    transparent: true,
+    style: {
+      padding: 12,
+      backgroundColor: Colors.views.header,
+      borderRadius: 6,
+      marginBottom: 8
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flexDirection: 'row',
+      justifyContent: 'space-between'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flex: 1,
+      marginRight: 12
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 14
+  }, job.name), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 11,
+    style: {
+      marginTop: 4
+    }
+  }, job.description), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 11,
+    style: {
+      marginTop: 6
+    }
+  }, "Runs every ", job.frequency, " ", job.frequency_type), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 11,
+    style: {
+      marginTop: 2
+    }
+  }, "Last success: ", formatLastRun(job.last_success_datetime))), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      gap: 6,
+      minWidth: 100
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "success",
+    title: "Run Now",
+    onPress: () => handleRunJob(job),
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  }), /*#__PURE__*/React.createElement(Button, {
+    type: "action",
+    title: "Edit",
+    onPress: () => openEditModal(job),
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  }), /*#__PURE__*/React.createElement(Button, {
+    type: "error",
+    title: "Delete",
+    onPress: () => handleDeleteJob(job),
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  }))))))), /*#__PURE__*/React.createElement(View, {
+    type: "body",
+    style: {
+      borderRadius: 8,
+      borderWidth: 1,
+      borderColor: Colors.borders.light,
+      overflow: 'hidden'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    type: "header",
+    style: {
+      padding: 16,
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    transparent: true
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "h2",
+    size: 16
+  }, "Job Execution History"), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 12,
+    style: {
+      marginTop: 4
+    }
+  }, "Recent job runs and their status")), /*#__PURE__*/React.createElement(Button, {
+    type: "action",
+    title: "Refresh",
+    onPress: () => loadRecentStatuses(statusesPage * STATUSES_PER_PAGE),
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  })), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 16
+    }
+  }, statusesLoading ? /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 40,
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+    size: "large",
+    color: Colors.text.h1
+  })) : recentStatuses.length === 0 ? /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      padding: 40,
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React.createElement(Text, {
+    theme: "description"
+  }, "No job executions yet")) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 11,
+    style: {
+      marginBottom: 12
+    }
+  }, "Showing ", statusesPage * STATUSES_PER_PAGE + 1, "-", Math.min((statusesPage + 1) * STATUSES_PER_PAGE, totalStatusCount), " of ", totalStatusCount, " executions"), recentStatuses.map(status => {
+    const job = getJobForStatus(status);
+    const isParent = !!status.parent_job_id === false; // If it has no parent, it could be a parent
+    const childCount = recentStatuses.filter(s => s.parent_job_id === status.job_status_id).length;
+    return /*#__PURE__*/React.createElement(View, {
+      key: status.job_status_id,
+      transparent: true,
+      style: {
+        padding: 12,
+        backgroundColor: Colors.views.header,
+        borderRadius: 6,
+        marginBottom: 8,
+        borderLeftWidth: 3,
+        borderLeftColor: getStatusColor(status.status)
+      }
+    }, /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        flexDirection: 'row',
+        justifyContent: 'space-between'
+      }
+    }, /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        flex: 1,
+        marginRight: 12
+      }
+    }, /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 8,
+        marginBottom: 4
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      size: 16
+    }, getStatusIcon(status.status)), /*#__PURE__*/React.createElement(Text, {
+      theme: "h2",
+      size: 14
+    }, job?.name || status.router_job_id), isParent && childCount > 0 && /*#__PURE__*/React.createElement(View, {
+      transparent: true,
+      style: {
+        backgroundColor: Colors.buttons.background.action,
+        paddingHorizontal: 6,
+        paddingVertical: 2,
+        borderRadius: 3
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      size: 9,
+      style: {
+        color: Colors.text.white
+      }
+    }, "PARENT"))), /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11,
+      style: {
+        marginTop: 2
+      }
+    }, "Started: ", new Date(status.start_datetime).toLocaleString()), /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11,
+      style: {
+        marginTop: 2
+      }
+    }, "Duration: ", formatDuration(status.start_datetime, status.end_datetime)), isParent && childCount > 0 && /*#__PURE__*/React.createElement(Text, {
+      theme: "description",
+      size: 11,
+      style: {
+        marginTop: 2
+      }
+    }, childCount, " child job", childCount > 1 ? 's' : '', " executed")), isParent && childCount > 0 && /*#__PURE__*/React.createElement(Button, {
+      type: "action",
+      title: "View Children",
+      onPress: () => handleViewChildStatuses(status),
+      style: {
+        paddingVertical: 6,
+        paddingHorizontal: 10
+      }
+    })));
+  }), totalPages > 1 && /*#__PURE__*/React.createElement(View, {
+    transparent: true,
+    style: {
+      flexDirection: 'row',
+      justifyContent: 'center',
+      alignItems: 'center',
+      gap: 12,
+      marginTop: 16
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "action",
+    title: "Previous",
+    onPress: () => handlePageChange(statusesPage - 1),
+    disabled: statusesPage === 0,
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  }), /*#__PURE__*/React.createElement(Text, {
+    theme: "description",
+    size: 12
+  }, "Page ", statusesPage + 1, " of ", totalPages), /*#__PURE__*/React.createElement(Button, {
+    type: "action",
+    title: "Next",
+    onPress: () => handlePageChange(statusesPage + 1),
+    disabled: !hasMoreStatuses,
+    style: {
+      paddingVertical: 6,
+      paddingHorizontal: 12
+    }
+  }))))), renderFormModal(false), renderFormModal(true), renderChildStatusModal());
+};
+export default JobManager;
+//# sourceMappingURL=JobManager.js.map