1057188406

Committed 01 Nov 2023 04:24AM UTC coverage: 82.824% (-17.1%) from 99.964%

Build # 1057188406

Build Type

Pull #4134

gitlab-ci

Committed by

web-flow

Commit Message

chore: Bump uuid from 9.0.0 to 9.0.1

Bumps [uuid](https://github.com/uuidjs/uuid) from 9.0.0 to 9.0.1.
- [Changelog](https://github.com/uuidjs/uuid/blob/main/CHANGELOG.md)
- [Commits](https://github.com/uuidjs/uuid/compare/v9.0.0...v9.0.1)

---
updated-dependencies:
- dependency-name: uuid
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>

Pull Request Pull Request #4134: chore: Bump uuid from 9.0.0 to 9.0.1

Run Details

4349 of 6284 branches covered (0.0%)

8313 of 10037 relevant lines covered (82.82%)

200.97 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

93.55

/src/js/components/settings/webhooks/activity.js

// Copyright 2022 Northern.tech AS
//
//    Licensed under the Apache License, Version 2.0 (the "License");
//    you may not use this file except in compliance with the License.
//    You may obtain a copy of the License at
//
//        http://www.apache.org/licenses/LICENSE-2.0
//
//    Unless required by applicable law or agreed to in writing, software
//    distributed under the License is distributed on an "AS IS" BASIS,
//    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//    See the License for the specific language governing permissions and
//    limitations under the License.
import React, { useEffect, useMemo, useState } from 'react';

// material ui
import { ArrowDropDown as ArrowDropDownIcon, ArrowDropUp as ArrowDropUpIcon, Circle as CircleIcon } from '@mui/icons-material';
import { Accordion, AccordionDetails, AccordionSummary, accordionClasses } from '@mui/material';
import { accordionSummaryClasses } from '@mui/material/AccordionSummary';
import { makeStyles } from 'tss-react/mui';

import { DEVICE_LIST_DEFAULTS } from '../../../constants/deviceConstants';
import { toggle } from '../../../helpers';
import Pagination from '../../common/pagination';
import Time from '../../common/time';

const useStyles = makeStyles()(theme => ({
  activityList: {
    display: 'flexbox',
    flexDirection: 'column',
    ['.header']: {
      padding: `0px ${theme.spacing(2)}`,
      marginBottom: theme.spacing()
    },
    [`.header, .${accordionSummaryClasses.content}`]: {
      display: 'grid',
      gridTemplateColumns: '1fr 2fr 1fr 50px'
    },
    [`.${accordionSummaryClasses.content}`]: {
      cursor: 'pointer',
      [`&>time, &>.trigger-type`]: {
        color: theme.palette.secondary.main
      },
      [`&>:last-child`]: {
        paddingRight: 'initial'
      }
    },
    [`.${accordionClasses.root}`]: {
      backgroundColor: theme.palette.background.default
    }
  },
  divider: { marginTop: theme.spacing(), marginBottom: theme.spacing() }
}));

const triggerMap = {
  'device-decommissioned': 'Device decommissioned',
  'device-provisioned': 'Device provisioned',
  'device-status-changed': 'Device status updated'
};

const iconStyles = {
  status: { fontSize: 12, marginRight: 8 },
  dropDown: { justifySelf: 'right', marginRight: 8 }
};

const DeliveryStatus = ({ entry, webhook = {} }) => {
  const { delivery_statuses = [] } = entry;

  const status = useMemo(() => {
    const status = delivery_statuses.find(status => status.integration_id === webhook.id) ?? delivery_statuses[0];
    if (status) {
      return { code: status.status_code, signal: status.success ? 'green' : 'red' };
    }
    return { code: 418, signal: 'disabled' };
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [JSON.stringify(delivery_statuses), webhook.id]);

  return (
    <div className="flexbox center-aligned">
      <CircleIcon className={status.signal} style={iconStyles.status} />
      <div className={status.code >= 400 ? 'muted' : ''}>{status.code}</div>
    </div>
  );
};

const columns = [
  { key: 'created_ts', title: 'Time', render: ({ entry }) => <Time value={entry.time} /> },
  { key: 'trigger', title: 'Event trigger', render: ({ entry }) => <div className="trigger-type">{triggerMap[entry.type] ?? entry.type}</div> },
  { key: 'status', title: 'Status', render: ({ entry, webhook }) => <DeliveryStatus entry={entry} webhook={webhook} /> },
  {
    key: 'details',
    title: 'Details',
    render: ({ isExpanded }) => (isExpanded ? <ArrowDropUpIcon style={iconStyles.dropDown} /> : <ArrowDropDownIcon style={iconStyles.dropDown} />)
  }
];

const ListItem = ({ entry = {}, webhook }) => {
  const [isExpanded, setIsExpanded] = useState(false);
  const { data = {} } = entry;

  return (
    <Accordion square expanded={isExpanded}>
      <AccordionSummary onClick={() => setIsExpanded(toggle)}>
        {columns.map(({ key, render: Column }) => (
          <Column key={key} entry={entry} isExpanded={isExpanded} webhook={webhook} />
        ))}
      </AccordionSummary>
      <AccordionDetails>
        <code>{JSON.stringify(data)}</code>
      </AccordionDetails>
    </Accordion>
  );
};

const { page: defaultPage, perPage: defaultPerPage } = DEVICE_LIST_DEFAULTS;
const WebhookActivity = ({ events = [], getWebhookEvents, eventTotal, webhook }) => {
  const { classes } = useStyles();
  const [page, setPage] = useState(defaultPage);

  useEffect(() => {
    getWebhookEvents({ page, perPage: defaultPerPage });
  }, [getWebhookEvents, page]);

  return (
    <div className={classes.activityList}>
      {events.length ? (
        <>
          <div className="header">
            {columns.map(({ key, title }) => (
              <div key={key}>{title}</div>
            ))}
          </div>
          <div className="body">
            {events.map(entry => (
              <ListItem key={entry.id} entry={entry} webhook={webhook} />
            ))}
            {eventTotal > defaultPerPage && (
              <Pagination
                className="margin-top-none"
                count={eventTotal ? eventTotal : defaultPerPage}
                showCountInfo={false}
                rowsPerPageOptions={[defaultPerPage]}
                page={page}
                rowsPerPage={defaultPerPage}
                onChangePage={setPage}
              />
            )}
          </div>
        </>
      ) : (
        <div className="margin-top-large flexbox centered disabled">No webhook activity yet.</div>
      )}
    </div>
  );
};

export default WebhookActivity;

1	// Copyright 2022 Northern.tech AS
2	//
3	// Licensed under the Apache License, Version 2.0 (the "License");
4	// you may not use this file except in compliance with the License.
5	// You may obtain a copy of the License at
6	//
7	// http://www.apache.org/licenses/LICENSE-2.0
8	//
9	// Unless required by applicable law or agreed to in writing, software
10	// distributed under the License is distributed on an "AS IS" BASIS,
11	// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12	// See the License for the specific language governing permissions and
13	// limitations under the License.
14	import React, { useEffect, useMemo, useState } from 'react';
15
16	// material ui
17	import { ArrowDropDown as ArrowDropDownIcon, ArrowDropUp as ArrowDropUpIcon, Circle as CircleIcon } from '@mui/icons-material';
18	import { Accordion, AccordionDetails, AccordionSummary, accordionClasses } from '@mui/material';
19	import { accordionSummaryClasses } from '@mui/material/AccordionSummary';
20	import { makeStyles } from 'tss-react/mui';
21
22	import { DEVICE_LIST_DEFAULTS } from '../../../constants/deviceConstants';
23	import { toggle } from '../../../helpers';
24	import Pagination from '../../common/pagination';
25	import Time from '../../common/time';
26
27	const useStyles = makeStyles()(theme => ({	6✔
28	activityList: {
29	display: 'flexbox',
30	flexDirection: 'column',
31	['.header']: {
32	padding: `0px ${theme.spacing(2)}`,
33	marginBottom: theme.spacing()
34	},
35	[`.header, .${accordionSummaryClasses.content}`]: {
36	display: 'grid',
37	gridTemplateColumns: '1fr 2fr 1fr 50px'
38	},
39	[`.${accordionSummaryClasses.content}`]: {
40	cursor: 'pointer',
41	[`&>time, &>.trigger-type`]: {
42	color: theme.palette.secondary.main
43	},
44	[`&>:last-child`]: {
45	paddingRight: 'initial'
46	}
47	},
48	[`.${accordionClasses.root}`]: {
49	backgroundColor: theme.palette.background.default
50	}
51	},
52	divider: { marginTop: theme.spacing(), marginBottom: theme.spacing() }
53	}));
54
55	const triggerMap = {	6✔
56	'device-decommissioned': 'Device decommissioned',
57	'device-provisioned': 'Device provisioned',
58	'device-status-changed': 'Device status updated'
59	};
60
61	const iconStyles = {	6✔
62	status: { fontSize: 12, marginRight: 8 },
63	dropDown: { justifySelf: 'right', marginRight: 8 }
64	};
65
66	const DeliveryStatus = ({ entry, webhook = {} }) => {	6✔
67	const { delivery_statuses = [] } = entry;	2!
68
69	const status = useMemo(() => {	2✔
70	const status = delivery_statuses.find(status => status.integration_id === webhook.id) ?? delivery_statuses[0];	2✔
71	if (status) {	2!
72	return { code: status.status_code, signal: status.success ? 'green' : 'red' };	2!
73	}
74	return { code: 418, signal: 'disabled' };	×
75	// eslint-disable-next-line react-hooks/exhaustive-deps
76	}, [JSON.stringify(delivery_statuses), webhook.id]);
77
78	return (	2✔
79	<div className="flexbox center-aligned">
80	<CircleIcon className={status.signal} style={iconStyles.status} />
81	<div className={status.code >= 400 ? 'muted' : ''}>{status.code}</div>	2!
82	</div>
83	);
84	};
85
86	const columns = [	6✔
87	{ key: 'created_ts', title: 'Time', render: ({ entry }) => <Time value={entry.time} /> },	2✔
88	{ key: 'trigger', title: 'Event trigger', render: ({ entry }) => <div className="trigger-type">{triggerMap[entry.type] ?? entry.type}</div> },	2!
89	{ key: 'status', title: 'Status', render: ({ entry, webhook }) => <DeliveryStatus entry={entry} webhook={webhook} /> },	2✔
90	{
91	key: 'details',
92	title: 'Details',
93	render: ({ isExpanded }) => (isExpanded ? <ArrowDropUpIcon style={iconStyles.dropDown} /> : <ArrowDropDownIcon style={iconStyles.dropDown} />)	2!
94	}
95	];
96
97	const ListItem = ({ entry = {}, webhook }) => {	6!
98	const [isExpanded, setIsExpanded] = useState(false);	2✔
99	const { data = {} } = entry;	2!
100
101	return (	2✔
102	<Accordion square expanded={isExpanded}>
103	<AccordionSummary onClick={() => setIsExpanded(toggle)}>	×
104	{columns.map(({ key, render: Column }) => (
105	<Column key={key} entry={entry} isExpanded={isExpanded} webhook={webhook} />	8✔
106	))}
107	</AccordionSummary>
108	<AccordionDetails>
109	<code>{JSON.stringify(data)}</code>
110	</AccordionDetails>
111	</Accordion>
112	);
113	};
114
115	const { page: defaultPage, perPage: defaultPerPage } = DEVICE_LIST_DEFAULTS;	6✔
116	const WebhookActivity = ({ events = [], getWebhookEvents, eventTotal, webhook }) => {	6!
117	const { classes } = useStyles();	1✔
118	const [page, setPage] = useState(defaultPage);	1✔
119
120	useEffect(() => {	1✔
121	getWebhookEvents({ page, perPage: defaultPerPage });	1✔
122	}, [getWebhookEvents, page]);
123
124	return (	1✔
125	<div className={classes.activityList}>
126	{events.length ? (	1!
127	<>
128	<div className="header">
129	{columns.map(({ key, title }) => (
130	<div key={key}>{title}</div>	4✔
131	))}
132	</div>
133	<div className="body">
134	{events.map(entry => (
135	<ListItem key={entry.id} entry={entry} webhook={webhook} />	2✔
136	))}
137	{eventTotal > defaultPerPage && (	1!
138	<Pagination
139	className="margin-top-none"
140	count={eventTotal ? eventTotal : defaultPerPage}	×
141	showCountInfo={false}
142	rowsPerPageOptions={[defaultPerPage]}
143	page={page}
144	rowsPerPage={defaultPerPage}
145	onChangePage={setPage}
146	/>
147	)}
148	</div>
149	</>
150	) : (
151	<div className="margin-top-large flexbox centered disabled">No webhook activity yet.</div>
152	)}
153	</div>
154	);
155	};
156
157	export default WebhookActivity;

mendersoftware / gui / 1057188406

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous