mirror of
https://github.com/ansible/awx.git
synced 2024-10-30 13:55:31 +03:00
flushing out notification template detail
This commit is contained in:
parent
fbd1147cff
commit
182dce3dc3
@ -1,5 +1,58 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect, useCallback } from 'react';
|
||||
import { t } from '@lingui/macro';
|
||||
import { withI18n } from '@lingui/react';
|
||||
import { Card, PageSection } from '@patternfly/react-core';
|
||||
import { Link, useParams } from 'react-router-dom';
|
||||
import useRequest from '../../util/useRequest';
|
||||
import ContentError from '../../components/ContentError';
|
||||
import { NotificationTemplatesAPI } from '../../api';
|
||||
import NotificationTemplateDetail from './NotificationTemplateDetail';
|
||||
|
||||
export default function NotificationTemplate() {
|
||||
return <div />;
|
||||
function NotificationTemplate({ i18n, setBreadcrumb }) {
|
||||
const { id: templateId } = useParams();
|
||||
const {
|
||||
result: template,
|
||||
isLoading,
|
||||
error,
|
||||
request: fetchTemplate,
|
||||
} = useRequest(
|
||||
useCallback(async () => {
|
||||
const { data } = await NotificationTemplatesAPI.readDetail(templateId);
|
||||
return data;
|
||||
}, [templateId]),
|
||||
null
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
fetchTemplate();
|
||||
}, [fetchTemplate]);
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<PageSection>
|
||||
<Card>
|
||||
<ContentError error={error}>
|
||||
{error.response.status === 404 && (
|
||||
<span>
|
||||
{i18n._(t`Notification Template not found.`)}{' '}
|
||||
<Link to="/notification_templates">
|
||||
{i18n._(t`View all Notification Templates.`)}
|
||||
</Link>
|
||||
</span>
|
||||
)}
|
||||
</ContentError>
|
||||
</Card>
|
||||
</PageSection>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<PageSection>
|
||||
<Card>
|
||||
<NotificationTemplateDetail template={template} isLoading={isLoading} />
|
||||
</Card>
|
||||
</PageSection>
|
||||
);
|
||||
}
|
||||
|
||||
export default withI18n()(NotificationTemplate);
|
||||
|
@ -0,0 +1,48 @@
|
||||
import React, { Fragment, useState, useEffect, useCallback } from 'react';
|
||||
import { Link, useHistory, useParams } from 'react-router-dom';
|
||||
import { withI18n } from '@lingui/react';
|
||||
import {
|
||||
Button,
|
||||
Chip,
|
||||
TextList,
|
||||
TextListItem,
|
||||
TextListItemVariants,
|
||||
TextListVariants,
|
||||
Label,
|
||||
} from '@patternfly/react-core';
|
||||
import { t } from '@lingui/macro';
|
||||
|
||||
import AlertModal from '../../../components/AlertModal';
|
||||
import { CardBody, CardActionsRow } from '../../../components/Card';
|
||||
import ChipGroup from '../../../components/ChipGroup';
|
||||
import ContentError from '../../../components/ContentError';
|
||||
import ContentLoading from '../../../components/ContentLoading';
|
||||
import CredentialChip from '../../../components/CredentialChip';
|
||||
import {
|
||||
Detail,
|
||||
DetailList,
|
||||
DeletedDetail,
|
||||
UserDateDetail,
|
||||
} from '../../../components/DetailList';
|
||||
import DeleteButton from '../../../components/DeleteButton';
|
||||
import ErrorDetail from '../../../components/ErrorDetail';
|
||||
import LaunchButton from '../../../components/LaunchButton';
|
||||
import { VariablesDetail } from '../../../components/CodeMirrorInput';
|
||||
import { JobTemplatesAPI } from '../../../api';
|
||||
import useRequest, { useDismissableError } from '../../../util/useRequest';
|
||||
|
||||
function NotificationTemplateDetail({ i18n, template }) {
|
||||
return (
|
||||
<CardBody>
|
||||
<DetailList gutter="sm">
|
||||
<Detail
|
||||
label={i18n._(t`Name`)}
|
||||
value={template.name}
|
||||
dataCy="nt-detail-name"
|
||||
/>
|
||||
</DetailList>
|
||||
</CardBody>
|
||||
);
|
||||
}
|
||||
|
||||
export default withI18n()(NotificationTemplateDetail);
|
@ -0,0 +1 @@
|
||||
export default from './NotificationTemplateDetail';
|
@ -105,12 +105,8 @@ function NotificationTemplatesList({ i18n }) {
|
||||
isDefault: true,
|
||||
},
|
||||
{
|
||||
name: i18n._(t`Created By (Username)`),
|
||||
key: 'created_by__username',
|
||||
},
|
||||
{
|
||||
name: i18n._(t`Modified By (Username)`),
|
||||
key: 'modified_by__username',
|
||||
name: i18n._(t`Type`),
|
||||
key: 'notification_type',
|
||||
},
|
||||
]}
|
||||
toolbarSortColumns={[
|
||||
@ -118,6 +114,10 @@ function NotificationTemplatesList({ i18n }) {
|
||||
name: i18n._(t`Name`),
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
name: i18n._(t`Type`),
|
||||
key: 'notification_type',
|
||||
},
|
||||
]}
|
||||
renderToolbar={props => (
|
||||
<DataListToolbar
|
||||
|
@ -2,8 +2,8 @@ import React from 'react';
|
||||
import { withI18n } from '@lingui/react';
|
||||
import { t } from '@lingui/macro';
|
||||
import { Link } from 'react-router-dom';
|
||||
import styled from 'styled-components';
|
||||
import {
|
||||
Badge as PFBadge,
|
||||
Button,
|
||||
DataListAction as _DataListAction,
|
||||
DataListCheck,
|
||||
@ -12,15 +12,26 @@ import {
|
||||
DataListItemRow,
|
||||
Tooltip,
|
||||
} from '@patternfly/react-core';
|
||||
import { PencilAltIcon, BellIcon } from '@patternfly/react-icons';
|
||||
import DataListCell from '../../../components/DataListCell';
|
||||
|
||||
export default function NotificationTemplatesListItem({
|
||||
const DataListAction = styled(_DataListAction)`
|
||||
align-items: center;
|
||||
display: grid;
|
||||
grid-gap: 16px;
|
||||
grid-template-columns: 40px 40px;
|
||||
`;
|
||||
|
||||
function NotificationTemplateListItem({
|
||||
template,
|
||||
detailUrl,
|
||||
isSelected,
|
||||
onSelect,
|
||||
i18n,
|
||||
}) {
|
||||
const labelId = `check-action-${template.id}`;
|
||||
const sendTestNotification = () => {};
|
||||
const labelId = `template-name-${template.id}`;
|
||||
|
||||
return (
|
||||
<DataListItem key={template.id} aria-labelledby={labelId} id={template.id}>
|
||||
<DataListItemRow>
|
||||
@ -37,9 +48,42 @@ export default function NotificationTemplatesListItem({
|
||||
<b>{template.name}</b>
|
||||
</Link>
|
||||
</DataListCell>,
|
||||
<DataListCell key="type">
|
||||
{template.notification_type}
|
||||
</DataListCell>,
|
||||
]}
|
||||
/>
|
||||
<DataListAction aria-label="actions" aria-labelledby={labelId}>
|
||||
{template.summary_fields.user_capabilities.edit ? (
|
||||
<Tooltip
|
||||
content={i18n._(t`Edit Notification Template`)}
|
||||
position="top"
|
||||
>
|
||||
<Button
|
||||
aria-label={i18n._(t`Edit Notification Template`)}
|
||||
variant="plain"
|
||||
component={Link}
|
||||
to={`/notification_templates/${template.id}/edit`}
|
||||
>
|
||||
<PencilAltIcon />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
) : (
|
||||
<div />
|
||||
)}
|
||||
<Tooltip content={i18n._(t`Test Notification`)} position="top">
|
||||
<Button
|
||||
aria-label={i18n._(t`Test Notification`)}
|
||||
variant="plain"
|
||||
onClick={sendTestNotification}
|
||||
>
|
||||
<BellIcon />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</DataListAction>
|
||||
</DataListItemRow>
|
||||
</DataListItem>
|
||||
);
|
||||
}
|
||||
|
||||
export default withI18n()(NotificationTemplateListItem);
|
||||
|
@ -62,12 +62,10 @@ function OrganizationListItem({
|
||||
/>
|
||||
<DataListItemCells
|
||||
dataListCells={[
|
||||
<DataListCell key="divider">
|
||||
<span id={labelId}>
|
||||
<Link to={`${detailUrl}`}>
|
||||
<b>{organization.name}</b>
|
||||
</Link>
|
||||
</span>
|
||||
<DataListCell key="name" id={labelId}>
|
||||
<Link to={`${detailUrl}`}>
|
||||
<b>{organization.name}</b>
|
||||
</Link>
|
||||
</DataListCell>,
|
||||
<DataListCell key="related-field-counts">
|
||||
<ListGroup>
|
||||
@ -85,11 +83,7 @@ function OrganizationListItem({
|
||||
</DataListCell>,
|
||||
]}
|
||||
/>
|
||||
<DataListAction
|
||||
aria-label="actions"
|
||||
aria-labelledby={labelId}
|
||||
id={labelId}
|
||||
>
|
||||
<DataListAction aria-label="actions" aria-labelledby={labelId}>
|
||||
{organization.summary_fields.user_capabilities.edit ? (
|
||||
<Tooltip content={i18n._(t`Edit Organization`)} position="top">
|
||||
<Button
|
||||
|
@ -78,7 +78,7 @@ function TemplateListItem({
|
||||
/>
|
||||
<DataListItemCells
|
||||
dataListCells={[
|
||||
<DataListCell key="divider">
|
||||
<DataListCell key="name" id={labelId}>
|
||||
<span>
|
||||
<Link to={`${detailUrl}`}>
|
||||
<b>{template.name}</b>
|
||||
@ -105,11 +105,7 @@ function TemplateListItem({
|
||||
</DataListCell>,
|
||||
]}
|
||||
/>
|
||||
<DataListAction
|
||||
aria-label="actions"
|
||||
aria-labelledby={labelId}
|
||||
id={labelId}
|
||||
>
|
||||
<DataListAction aria-label="actions" aria-labelledby={labelId}>
|
||||
{canLaunch && template.type === 'job_template' && (
|
||||
<Tooltip content={i18n._(t`Launch Template`)} position="top">
|
||||
<LaunchButton resource={template}>
|
||||
|
Loading…
Reference in New Issue
Block a user