foreman_remote_execution 14.1.4 → 15.0.1

data/webpack/JobInvocationDetail/JobAdditionInfo.js

@@ -0,0 +1,214 @@
+/* eslint-disable max-lines */
+/* eslint-disable camelcase */
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import {
+  ExpandableSection,
+  DataList,
+  DataListCell,
+  DataListItemCells,
+  DataListItem,
+  DataListItemRow,
+} from '@patternfly/react-core';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { TARGETING_TYPES } from './JobInvocationConstants';
+
+const ItemsParser = ({ items }) => (
+  <>
+    {items.map(
+      ({ title, value, wrappedValue }, index) =>
+        value && (
+          <DataListItem key={index}>
+            <DataListItemRow>
+              <DataListItemCells
+                dataListCells={[
+                  <DataListCell width={1} key={0}>
+                    {title}
+                  </DataListCell>,
+                  <DataListCell width={4} key={1}>
+                    {wrappedValue || value}
+                  </DataListCell>,
+                ]}
+              />
+            </DataListItemRow>
+          </DataListItem>
+        )
+    )}
+  </>
+);
+const Schedule = ({ data }) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const {
+    concurrency_level,
+    scheduling,
+    time_to_pickup,
+    execution_timeout_interval,
+  } = data;
+  if (
+    !concurrency_level &&
+    !scheduling &&
+    !time_to_pickup &&
+    !execution_timeout_interval
+  )
+    return null;
+  const items = [
+    { title: __('Concurrency level limited to'), value: concurrency_level },
+    { title: __('Scheduled to start before'), value: scheduling?.start_before },
+    { title: __('Scheduled to start at'), value: scheduling?.start_at },
+    {
+      title: __('Timeout to kill after'),
+      value: execution_timeout_interval,
+      wrappedValue: `${execution_timeout_interval} ${__('seconds')}`,
+    },
+    {
+      title: __('Time to pickup'),
+      value: time_to_pickup,
+      wrappedValue: `${time_to_pickup} ${__('seconds')}`,
+    },
+  ];
+  return (
+    <ExpandableSection
+      toggleText={__('Schedule')}
+      onToggle={setIsExpanded}
+      isExpanded={isExpanded}
+    >
+      <DataList isCompact>
+        <ItemsParser items={items} />
+      </DataList>
+    </ExpandableSection>
+  );
+};
+const Recurring = ({ data }) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const { recurrence } = data;
+
+  if (!recurrence) return null;
+  const items = [
+    {
+      title: __('ID'),
+      value: recurrence.id,
+      wrappedValue: (
+        <a href={`/foreman_tasks/recurring_logics/${recurrence.id}`}>
+          {recurrence.id}
+        </a>
+      ),
+    },
+    { title: __('Cron line'), value: recurrence.cron_line },
+    // TODO { title:__('Action') , value: {format_task_input(recurring_logic.tasks.last)} },
+    { title: __('Last occurrence'), value: recurrence.last_occurrence },
+    { title: __('Next occurrence'), value: recurrence.next_occurrence },
+    { title: __('Current iteration'), value: recurrence.iteration },
+    { title: __('Iteration limit'), value: recurrence.max_iteration },
+    { title: __('Repeat until'), value: recurrence.end_time },
+    // TODO { title:__('State') , value: {recurring_logic_state(recurring_logic)}  },
+    { title: __('Purpose'), value: recurrence.purpose },
+    { title: __('Task count'), value: recurrence.task_count },
+  ];
+  return (
+    <ExpandableSection
+      toggleText={__('Recurring logic')}
+      onToggle={setIsExpanded}
+      isExpanded={isExpanded}
+    >
+      <DataList isCompact>
+        <ItemsParser items={items} />
+      </DataList>
+    </ExpandableSection>
+  );
+};
+const TargetHosts = ({ data }) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const {
+    targeting,
+    job_location: location,
+    job_organization: organization,
+  } = data;
+
+  const targetingSelectioning = targeting.bookmark_name
+    ? `${__('Bookmark')} ${targeting.bookmark_name}`
+    : __('Manual selection');
+  const items = [
+    {
+      title: __('Organization'),
+      value: true,
+      wrappedValue: organization || __('Any organization'),
+    },
+    {
+      title: __('Location'),
+      value: true,
+      wrappedValue: location || __('Any location'),
+    },
+    {
+      title: __('Execution order'),
+      value: true,
+      wrappedValue: targeting.randomized_ordering
+        ? __('Randomized')
+        : __('Alphabetical'),
+    },
+  ];
+  return (
+    <ExpandableSection
+      toggleText={__('Target Hosts')}
+      onToggle={setIsExpanded}
+      isExpanded={isExpanded}
+    >
+      <span>{targetingSelectioning}</span>{' '}
+      <span>
+        {__('using ')}
+        <b>{TARGETING_TYPES[targeting.targeting_type].toLowerCase()}</b>
+      </span>
+      <pre>{targeting.search_query}</pre>
+      <DataList isCompact>
+        <ItemsParser items={items} />
+      </DataList>
+    </ExpandableSection>
+  );
+};
+const Inputs = ({ data }) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+  const inputs =
+    data?.pattern_template_invocations?.[0]?.template_invocation_input_values;
+
+  if (!inputs) return null;
+  return (
+    <ExpandableSection
+      toggleText={__('User Inputs')}
+      onToggle={setIsExpanded}
+      isExpanded={isExpanded}
+    >
+      <DataList isCompact>
+        <ItemsParser
+          items={inputs.map(({ template_input_name: title, value }) => ({
+            title,
+            value: true,
+            wrappedValue: value,
+          }))}
+        />
+      </DataList>
+    </ExpandableSection>
+  );
+};
+export const JobAdditionInfo = ({ data }) => (
+  <>
+    <Recurring data={data} />
+    <TargetHosts data={data} />
+    <Inputs data={data} />
+    <Schedule data={data} />
+  </>
+);
+
+JobAdditionInfo.propTypes = {
+  data: PropTypes.shape({
+    recurrence: PropTypes.object,
+    targeting: PropTypes.object,
+  }).isRequired,
+};
+
+Recurring.propTypes = JobAdditionInfo.propTypes;
+TargetHosts.propTypes = JobAdditionInfo.propTypes;
+Inputs.propTypes = JobAdditionInfo.propTypes;
+Schedule.propTypes = JobAdditionInfo.propTypes;
+
+ItemsParser.propTypes = {
+  items: PropTypes.array.isRequired,
+};

data/webpack/JobInvocationDetail/JobInvocationConstants.js

@@ -19,6 +19,15 @@ export const JOB_INVOCATION_HOSTS = 'JOB_INVOCATION_HOSTS';
 export const currentPermissionsUrl = foremanUrl(
   '/api/v2/permissions/current_permissions'
 );
+export const GET_TEMPLATE_INVOCATION = 'GET_TEMPLATE_INVOCATION';
+export const showTemplateInvocationUrl = (hostID, jobID) =>
+  `/show_template_invocation_by_host/${hostID}/job_invocation/${jobID}`;
+
+export const templateInvocationPageUrl = (hostID, jobID) =>
+  `/job_invocations_detail/${jobID}/host_invocation/${hostID}`;
+
+export const jobInvocationDetailsUrl = id =>
+  `/experimental/job_invocations_detail/${id}`;
 
 export const STATUS = {
   PENDING: 'pending',
@@ -33,6 +42,14 @@ export const STATUS_UPPERCASE = {
   PENDING: 'PENDING',
 };
 
+export const STATUS_TITLES = {
+  ALL_STATUSES: { id: 'all_statuses', title: __('All statuses') },
+  SUCCESS: { id: 'success', title: __('Succeeded') },
+  FAILED: { id: 'failed', title: __('Failed') },
+  PENDING: { id: 'pending', title: __('In Progress') },
+  CANCELLED: { id: 'cancelled', title: __('Cancelled') },
+};
+
 export const DATE_OPTIONS = {
   day: 'numeric',
   month: 'short',
@@ -52,7 +69,7 @@ const Columns = () => {
         return { title: __('Failed'), status: 1 };
       case 'planned':
         return { title: __('Scheduled'), status: 2 };
-      case 'running':
+      case 'running' || 'pending':
         return { title: __('Pending'), status: 3 };
       case 'cancelled':
         return { title: __('Cancelled'), status: 4 };
@@ -65,18 +82,25 @@ const Columns = () => {
   const hostDetailsPageUrl = useForemanHostDetailsPageUrl();
 
   return {
+    expand: {
+      title: '',
+      weight: 0,
+      wrapper: () => null,
+    },
     name: {
       title: __('Name'),
       wrapper: ({ name }) => (
         <a href={`${hostDetailsPageUrl}${name}`}>{name}</a>
       ),
+      isSorted: true,
       weight: 1,
     },
-    groups: {
+    hostgroup: {
       title: __('Host group'),
       wrapper: ({ hostgroup_id, hostgroup_name }) => (
         <a href={`/hostgroups/${hostgroup_id}/edit`}>{hostgroup_name}</a>
       ),
+      isSorted: true,
       weight: 2,
     },
     os: {
@@ -86,6 +110,7 @@ const Columns = () => {
           {operatingsystem_name}
         </a>
       ),
+      isSorted: true,
       weight: 3,
     },
     smart_proxy: {
@@ -93,6 +118,7 @@ const Columns = () => {
       wrapper: ({ smart_proxy_name, smart_proxy_id }) => (
         <a href={`/smart_proxies/${smart_proxy_id}`}>{smart_proxy_name}</a>
       ),
+      isSorted: true,
       weight: 4,
     },
     status: {
@@ -109,7 +135,19 @@ const Columns = () => {
       },
       weight: 5,
     },
+    actions: {
+      title: '',
+      weight: 6,
+      wrapper: () => null,
+    },
   };
 };
 
 export default Columns;
+
+const STATIC_TYPE = 'static_query';
+const DYNAMIC_TYPE = 'dynamic_query';
+export const TARGETING_TYPES = {
+  [STATIC_TYPE]: __('Static Query'),
+  [DYNAMIC_TYPE]: __('Dynamic Query'),
+};

data/webpack/JobInvocationDetail/JobInvocationDetail.scss

@@ -38,3 +38,73 @@
     height: $chart_size;
   }
 }
+.job-additional-info {
+  padding: 0;
+  margin-bottom: -10px;
+}
+.job-details-table-section {
+  section:nth-child(1) {
+    padding: 0;
+  }
+}
+
+.template-invocation {
+  &.output-in-table-view {
+    div.invocation-output {
+      overflow: auto;
+      max-height: 25em;
+    }
+  }
+  div.invocation-output {
+    display: block;
+    padding: 9.5px;
+    margin: 0 0 10px;
+    font-size: 12px;
+    word-break: break-all;
+    word-wrap: break-word;
+    color: rgba(255, 255, 255, 1);
+    background-color: rgba(47, 47, 47, 1);
+    border: 1px solid #000000;
+    border-radius: 0px;
+    font-family: Menlo, Monaco, Consolas, monospace;
+
+    div.printable {
+      min-height: 50px;
+    }
+
+    div.line.stderr,
+    div.line.error,
+    div.line.debug {
+      color: red;
+    }
+
+    div.line span.counter {
+      float: left;
+      clear: left;
+    }
+
+    div.line div.content {
+      position: relative;
+      margin-left: 50px;
+      white-space: pre-wrap;
+    }
+
+    a {
+      color: #ffffff;
+    }
+
+    a.scroll-link{
+      position: relative;
+      bottom: 10px;
+      float: right;
+    }
+  }
+
+  .template-invocation-preview {
+    margin-top: 10px;
+  }
+
+  .pf-c-toggle-group {
+    margin-bottom: 10px;
+  }
+}