foreman_host_reports 0.0.4 → 1.0.0

data/webpack/src/components/ReportsTab/ReportsTable.js

@@ -0,0 +1,117 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {
+  TableComposable,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
+} from '@patternfly/react-table';
+import {
+  EmptyState,
+  EmptyStateIcon,
+  Spinner,
+  Title,
+  Grid,
+} from '@patternfly/react-core';
+import { SearchIcon, ExclamationCircleIcon } from '@patternfly/react-icons';
+import { STATUS } from 'foremanReact/constants';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { getColumns } from './helpers';
+
+const ReportsTable = ({ reports, status, fetchReports }) => {
+  const columns = getColumns(fetchReports);
+  let tableBody = null;
+  let tableHead = null;
+  let emptyState = null;
+
+  if (status === STATUS.RESOLVED) {
+    if (reports.length) {
+      tableHead = (
+        <Thead>
+          <Tr>
+            {columns.map(({ width, title }, columnIndex) => (
+              <Th key={columnIndex} width={width}>
+                {title}
+              </Th>
+            ))}
+          </Tr>
+        </Thead>
+      );
+      tableBody = (
+        <Tbody>
+          {reports.map((row, rowIndex) => (
+            <Tr key={rowIndex}>
+              {columns.map(({ title, formatter }, cellIndex) => (
+                <Td key={`${rowIndex}_${cellIndex}`} dataLabel={title}>
+                  {formatter(row)}
+                </Td>
+              ))}
+            </Tr>
+          ))}
+        </Tbody>
+      );
+    } else {
+      emptyState = (
+        <Grid>
+          <EmptyState>
+            <EmptyStateIcon icon={SearchIcon} />
+            <Title size="lg" headingLevel="h4">
+              {__('No results found')}
+            </Title>
+          </EmptyState>
+        </Grid>
+      );
+    }
+  } else if (status === STATUS.FAILURE) {
+    emptyState = (
+      <Grid>
+        <EmptyState>
+          <EmptyStateIcon
+            icon={
+              <ExclamationCircleIcon color="var(--pf-global--palette--red-200)" />
+            }
+          />
+          <Title size="lg" headingLevel="h4">
+            {__('Something went wrong')}
+          </Title>
+        </EmptyState>
+      </Grid>
+    );
+  } else if (status === STATUS.PENDING) {
+    emptyState = (
+      <Grid>
+        <EmptyState>
+          <EmptyStateIcon variant="container" component={Spinner} />
+          <Title size="lg" headingLevel="h4">
+            {__('Loading')}
+          </Title>
+        </EmptyState>
+      </Grid>
+    );
+  }
+
+  return (
+    <React.Fragment>
+      <TableComposable aria-label="Reports table" variant="compact">
+        {tableHead}
+        {tableBody}
+      </TableComposable>
+      {emptyState}
+    </React.Fragment>
+  );
+};
+
+ReportsTable.propTypes = {
+  reports: PropTypes.array,
+  status: PropTypes.string,
+  fetchReports: PropTypes.func.isRequired,
+};
+
+ReportsTable.defaultProps = {
+  reports: [],
+  status: null,
+};
+
+export default ReportsTable;

data/webpack/src/components/ReportsTab/helpers.js

@@ -0,0 +1,155 @@
+/* eslint-disable camelcase */
+/* eslint-disable react/prop-types */
+import React, { useState } from 'react';
+import { useDispatch } from 'react-redux';
+import {
+  Dropdown,
+  DropdownItem,
+  KebabToggle,
+  FlexItem,
+  Flex,
+  Tooltip,
+} from '@patternfly/react-core';
+import {
+  ExclamationCircleIcon,
+  SyncAltIcon,
+  CheckCircleIcon,
+  BanIcon,
+  TagIcon,
+} from '@patternfly/react-icons';
+import { openConfirmModal } from 'foremanReact/components/ConfirmModal';
+import { APIActions } from 'foremanReact/redux/API';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { reportToShowFormatter } from '../../Router/HostReports/IndexPage/Components/HostReportsTable/Components/Formatters';
+
+const FailedIcon = ({ label, withMargin = false }) => (
+  <span style={withMargin ? { marginRight: '15px' } : {}}>
+    <ExclamationCircleIcon color="var(--pf-global--palette--red-100)" /> {label}
+  </span>
+);
+
+const ChangedIcon = ({ label, withMargin = false }) => (
+  <span style={withMargin ? { marginRight: '15px' } : {}}>
+    <SyncAltIcon color="var(--pf-global--palette--orange-300)" /> {label}
+  </span>
+);
+
+const NochangeIcon = ({ label }) => (
+  <>
+    <CheckCircleIcon color="var(--pf-global--success-color--100)" /> {label}
+  </>
+);
+
+export const statusSummaryFormatter = ({ change, nochange, failure }) => {
+  const summary = [];
+  if (failure)
+    summary.push(<FailedIcon key="failed" label={failure} withMargin />);
+  if (change)
+    summary.push(<ChangedIcon key="changed" label={change} withMargin />);
+  if (nochange) summary.push(<NochangeIcon key="nochange" label={nochange} />);
+  return summary.length ? summary : '--';
+};
+
+export const globalStatusFormatter = ({ status }) => {
+  switch (status) {
+    case 'failure':
+      return <FailedIcon label={__('Fail')} />;
+    case 'change':
+      return <ChangedIcon label={__('Changed')} />;
+    case 'nochange':
+      return <NochangeIcon label={__('Unchanged')} />;
+    default:
+      return (
+        <>
+          <BanIcon /> {__('Empty')}
+        </>
+      );
+  }
+};
+
+export const keywordsFormatter = ({ keywords = [] }) => (
+  <>
+    <Tooltip content={<div>{keywords.join(',\n')}</div>}>
+      <TagIcon color={keywords.length ? '#6a6e73' : '#d2d2d2'} />{' '}
+      {keywords.length}
+    </Tooltip>
+  </>
+);
+
+export const ActionFormatter = ({ id, can_delete }, fetchReports) => {
+  const [isOpen, setOpen] = useState(false);
+  const dispatch = useDispatch();
+  const dispatchConfirm = () => {
+    dispatch(
+      openConfirmModal({
+        isWarning: true,
+        title: __('Delete report?'),
+        confirmButtonText: __('Delete report'),
+        onConfirm: () =>
+          dispatch(
+            APIActions.delete({
+              url: `/api/v2/host_reports/${id}`,
+              key: `report-${id}-DELETE`,
+              successToast: success => __('Report was successfully deleted'),
+              errorToast: error =>
+                __(`There was some issue deleting the report: ${error}`),
+              handleSuccess: fetchReports,
+            })
+          ),
+        message: __(
+          'Are you sure you want to delete this report? This action is irreversible.'
+        ),
+      })
+    );
+  };
+  const dropdownItems = [
+    <DropdownItem
+      key="action"
+      component="button"
+      onClick={dispatchConfirm}
+      disabled={!can_delete}
+    >
+      {__('Delete')}
+    </DropdownItem>,
+  ];
+  return (
+    <Flex>
+      <FlexItem align={{ default: 'alignRight' }}>
+        <Dropdown
+          onSelect={v => setOpen(!v)}
+          toggle={<KebabToggle onToggle={setOpen} id="toggle-action" />}
+          isOpen={isOpen}
+          isPlain
+          dropdownItems={dropdownItems}
+        />
+      </FlexItem>
+    </Flex>
+  );
+};
+
+export const getColumns = fetchReports => [
+  {
+    title: __('Reported at'),
+    formatter: ({ reported_at, can_view, id }) =>
+      reportToShowFormatter()(reported_at, {
+        rowData: { canEdit: can_view, id },
+      }),
+    width: 25,
+  },
+  {
+    title: __('Status'),
+    formatter: globalStatusFormatter,
+    width: 25,
+  },
+  {
+    title: __('Summary'),
+    formatter: statusSummaryFormatter,
+    width: 25,
+  },
+  { title: __('Keywords'), formatter: keywordsFormatter, width: 15 },
+  {
+    title: null,
+    formatter: data => ActionFormatter(data, fetchReports),
+    width: 10,
+  },
+];

data/webpack/src/components/ReportsTab/index.js

@@ -0,0 +1,132 @@
+/* eslint-disable camelcase */
+import React, { useEffect, useCallback } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { useHistory } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import URI from 'urijs';
+import SearchBar from 'foremanReact/components/SearchBar';
+import Pagination from 'foremanReact/components/Pagination';
+import { get } from 'foremanReact/redux/API';
+import { Grid, GridItem } from '@patternfly/react-core';
+import {
+  selectAPIStatus,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { useForemanSettings } from 'foremanReact/Root/Context/ForemanContext';
+import { HOST_REPORTS_SEARCH_PROPS } from '../../Router/HostReports/IndexPage/constants';
+import ReportsTable from './ReportsTable';
+
+const ReportsTab = ({ hostName }) => {
+  const dispatch = useDispatch();
+  const history = useHistory();
+  const API_KEY = `get-reports-${hostName}`;
+  const { reports, itemCount } = useSelector(state =>
+    selectAPIResponse(state, API_KEY)
+  );
+  const { perPage: settingsPerPage = 20 } = useForemanSettings() || {};
+  const status = useSelector(state => selectAPIStatus(state, API_KEY));
+  const fetchReports = useCallback(
+    ({ search: searchParam, per_page: perPageParam, page: pageParam } = {}) => {
+      const {
+        page: urlPage,
+        perPage: urlPerPage,
+        search: urlSearch,
+      } = getUrlParams();
+      const search = searchParam !== undefined ? searchParam : urlSearch;
+      const page = pageParam || urlPage;
+      const per_page = perPageParam || urlPerPage;
+      dispatch(
+        get({
+          key: API_KEY,
+          url: '/host_reports',
+          params: {
+            page,
+            per_page,
+            search: getServerQuery(search),
+          },
+        })
+      );
+      updateUrl({ page, per_page, search });
+    },
+    [API_KEY, dispatch, getServerQuery, getUrlParams, updateUrl]
+  );
+
+  useEffect(() => {
+    fetchReports();
+  }, [fetchReports, history.location]);
+
+  const onPaginationChange = ({ page, per_page }) => {
+    const { search } = getUrlParams();
+    updateUrl({ page, per_page, search });
+  };
+
+  const getServerQuery = useCallback(
+    search => {
+      const serverQuery = [`host = ${hostName}`];
+      if (search) {
+        serverQuery.push(`AND (${search})`);
+      }
+      return serverQuery.join(' ').trim();
+    },
+    [hostName]
+  );
+
+  const getUrlParams = useCallback(() => {
+    const params = { page: 1, perPage: settingsPerPage, search: '' };
+    const urlSearch = history.location?.search;
+    const urlParams = urlSearch && new URLSearchParams(urlSearch);
+    if (urlParams) {
+      params.search = urlParams.get('search') || params.search;
+      params.page = Number(urlParams.get('page')) || params.page;
+      params.perPage = Number(urlParams.get('per_page')) || params.perPage;
+    }
+    return params;
+  }, [history.location, settingsPerPage]);
+
+  const updateUrl = useCallback(
+    ({ page, per_page, search = '' }) => {
+      const uri = new URI();
+      uri.search({ page, per_page, search });
+      history.push({ search: uri.search() });
+    },
+    [history]
+  );
+
+  return (
+    <Grid id="new_host_details_insights_tab" hasGutter>
+      <GridItem span={6}>
+        <SearchBar
+          data={HOST_REPORTS_SEARCH_PROPS}
+          onSearch={search => fetchReports({ search, page: 1 })}
+        />
+      </GridItem>
+      <GridItem span={6}>
+        <Pagination
+          variant="top"
+          itemCount={itemCount}
+          onChange={onPaginationChange}
+        />
+      </GridItem>
+      <GridItem>
+        <ReportsTable
+          reports={reports}
+          status={status}
+          fetchReports={fetchReports}
+        />
+      </GridItem>
+      <GridItem>
+        <Pagination
+          variant="bottom"
+          itemCount={itemCount}
+          onChange={onPaginationChange}
+        />
+      </GridItem>
+    </Grid>
+  );
+};
+
+ReportsTab.propTypes = {
+  hostName: PropTypes.string.isRequired,
+};
+
+export default ReportsTab;

metadata

@@ -1,29 +1,15 @@
 --- !ruby/object:Gem::Specification
 name: foreman_host_reports
 version: !ruby/object:Gem::Version
-  version: 0.0.4
+  version: 1.0.0
 platform: ruby
 authors:
 - Lukas Zapletal
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-10-22 00:00:00.000000000 Z
-dependencies:
-- !ruby/object:Gem::Dependency
-  name: rdoc
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
+date: 2022-02-21 00:00:00.000000000 Z
+dependencies: []
 description: Fast and efficient reporting capabilities
 email:
 - lukas-x@zapletalovi.com
@@ -34,11 +20,14 @@ files:
 - LICENSE
 - README.md
 - app/controllers/api/v2/host_reports_controller.rb
+- app/controllers/concerns/foreman_host_reports/controller/hosts_controller_extensions.rb
 - app/controllers/concerns/foreman_host_reports/controller/parameters/host_report.rb
 - app/controllers/host_reports_controller.rb
+- app/helpers/concerns/foreman_host_reports/hosts_helper_extensions.rb
 - app/models/concerns/foreman_host_reports/host_extensions.rb
 - app/models/concerns/foreman_host_reports/smart_proxy_extensions.rb
 - app/models/host_report.rb
+- app/models/host_status/host_report_status.rb
 - app/models/report_keyword.rb
 - app/views/api/v2/host_reports/base.json.rabl
 - app/views/api/v2/host_reports/create.json.rabl
@@ -49,6 +38,7 @@ files:
 - db/migrate/20210112183526_add_host_reports.rb
 - db/migrate/20210616133601_create_report_keywords.rb
 - db/migrate/20211011141813_change_status_column.rb
+- db/migrate/20220113064436_rename_status_summaries.rb
 - db/seeds.d/60-reports_feature.rb
 - lib/foreman_host_reports.rb
 - lib/foreman_host_reports/engine.rb
@@ -61,6 +51,7 @@ files:
 - package.json
 - test/controllers/api/v2/host_reports_controller_test.rb
 - test/factories/foreman_host_reports_factories.rb
+- test/model/host_report_status_test.rb
 - test/snapshots/foreman-web.json
 - test/test_plugin_helper.rb
 - test/unit/foreman_host_reports_test.rb
@@ -71,7 +62,7 @@ files:
 - webpack/__mocks__/foremanReact/components/ForemanModal/ForemanModalActions.js
 - webpack/__mocks__/foremanReact/components/ForemanModal/ForemanModalHooks.js
 - webpack/__mocks__/foremanReact/components/ForemanModal/index.js
-- webpack/__mocks__/foremanReact/components/Pagination/PaginationWrapper.js
+- webpack/__mocks__/foremanReact/components/Pagination/index.js
 - webpack/__mocks__/foremanReact/components/common/EmptyState.js
 - webpack/__mocks__/foremanReact/components/common/dates/RelativeDateTime.js
 - webpack/__mocks__/foremanReact/components/common/forms/ForemanForm.js
@@ -84,6 +75,7 @@ files:
 - webpack/__mocks__/foremanReact/redux/actions/toasts.js
 - webpack/__mocks__/foremanReact/routes/common/PageLayout/PageLayout.js
 - webpack/__mocks__/foremanReact/routes/common/PageLayout/components/ExportButton/ExportButton.js
+- webpack/fills.js
 - webpack/global_index.js
 - webpack/global_test_setup.js
 - webpack/index.js
@@ -116,6 +108,8 @@ files:
 - webpack/src/Router/HostReports/ShowPage/Components/HostReportMetrics/HostReportMetrics.scss
 - webpack/src/Router/HostReports/ShowPage/Components/HostReportMetrics/index.js
 - webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/Ansible.js
+- webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/Components/EmptyLogsRow.js
+- webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/Components/RawMsgModal.js
 - webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/Puppet.js
 - webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/helpers.js
 - webpack/src/Router/HostReports/ShowPage/Components/ReportLogs/index.js
@@ -125,10 +119,14 @@ files:
 - webpack/src/Router/HostReports/ShowPage/index.js
 - webpack/src/Router/HostReports/constants.js
 - webpack/src/Router/routes.js
+- webpack/src/components/ReportsTab/ReportsTable.js
+- webpack/src/components/ReportsTab/helpers.js
+- webpack/src/components/ReportsTab/index.js
 homepage: https://github.com/theforeman/foreman_host_reports
 licenses:
 - GPL-3.0
-metadata: {}
+metadata:
+  is_foreman_plugin: 'true'
 post_install_message:
 rdoc_options: []
 require_paths:
@@ -153,5 +151,6 @@ test_files:
 - test/unit/foreman_host_reports_test.rb
 - test/controllers/api/v2/host_reports_controller_test.rb
 - test/snapshots/foreman-web.json
+- test/model/host_report_status_test.rb
 - test/test_plugin_helper.rb
 - webpack/src/Router/HostReports/IndexPage/__tests__/HostReportsIndexPage.test.js

data/webpack/__mocks__/foremanReact/components/Pagination/PaginationWrapper.js

@@ -1,4 +0,0 @@
-import React from 'react';
-
-const PaginationWrapper = () => <></>;
-export default PaginationWrapper;