1593965839

Committed 18 Dec 2024 10:58AM UTC coverage: 73.514% (+0.7%) from 72.829%

Build # 1593965839

Build Type

Pull #253

gitlab-ci

Committed by

mineralsfree

Commit Message

chore(gui): aligned tests with edit billing profile

Ticket: MEN-7466
Changelog: None

Signed-off-by: Mikita Pilinka <mikita.pilinka@northern.tech>

Pull Request Pull Request #253: MEN-7466-feat: updated billing section in My Organization settings

Run Details

4257 of 6185 branches covered (68.83%)

Branch coverage included in aggregate %.

53 of 87 new or added lines in 11 files covered. (60.92%)

43 existing lines in 11 files now uncovered.

40083 of 54130 relevant lines covered (74.05%)

22.98 hits per line

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

72.09

/frontend/src/js/common-ui/docslink.js

// Copyright 2023 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, { forwardRef, useState } from 'react';
import { useSelector } from 'react-redux';

import { Description as DescriptionIcon } from '@mui/icons-material';
import { Chip, Collapse, chipClasses } from '@mui/material';
import { makeStyles } from 'tss-react/mui';

import { TIMEOUTS } from '@northern.tech/store/constants';
import { getDocsVersion, getFeatures } from '@northern.tech/store/selectors';
import { useDebounce } from '@northern.tech/utils/debouncehook';

import { MenderTooltipClickable } from './mendertooltip';

const useStyles = makeStyles()(theme => ({
  iconAura: {
    position: 'absolute',
    top: -6,
    bottom: -4,
    left: -7,
    right: -6.5,
    border: `1px dashed ${theme.palette.text.disabled}`,
    borderRadius: '50%',
    '&.hovering': {
      borderColor: 'transparent'
    }
  },
  chip: {
    borderStyle: 'dashed',
    [`.${chipClasses.deleteIcon}`]: {
      fontSize: 'smaller'
    },
    '&.not-hovering': {
      borderColor: 'transparent',
      color: theme.palette.text.disabled,
      [`.${chipClasses.deleteIcon}`]: {
        color: theme.palette.text.disabled
      },
      [`.${chipClasses.label}`]: {
        paddingLeft: 0,
        visibility: 'collapse'
      }
    }
  }
}));

export const DOCSTIPS = {
  deviceConfig: { id: 'deviceConfig', path: 'add-ons/configure' },
  dynamicGroups: { id: 'dynamicGroups', path: 'overview/device-group#dynamic-group' },
  limitedDeployments: { id: 'limitedDeployments', path: 'overview/deployment#deployment-to-dynamic-groups' },
  phasedDeployments: { id: 'phasedDeployments', path: 'overview/customize-the-update-process' },
  pausedDeployments: { id: 'pausedDeployments', path: 'overview/customize-the-update-process#synchronized-updates' },
  retryDeployments: { id: 'retryDeployments', path: 'overview/deployment' },
  releases: { id: 'releases', path: 'overview/artifact' },
  webhookSecret: { id: 'webhookSecret', path: 'server-integration/webhooks#signature-header' }
};

export const DocsTooltip = ({ anchor = {}, id = '', ...props }) => {
  const [isHovering, setIsHovering] = useState(false);
  const debouncedHovering = useDebounce(isHovering, TIMEOUTS.debounceDefault);
  const docsVersion = useSelector(getDocsVersion);
  const { isHosted } = useSelector(getFeatures);
  const { classes } = useStyles();
  const { content, path } = DOCSTIPS[id] || {};
  const target = `https://docs.mender.io/${docsVersion}${path}`;

  const onClick = () => {
    const docsParams = { headers: { 'x-mender-docs': docsVersion } };
    fetch(target, isHosted ? {} : docsParams);
    window.open(target, '_blank');
  };

  const hoverClass = debouncedHovering ? 'hovering' : 'not-hovering';
  return (
    <MenderTooltipClickable
      placement="bottom-start"
      disableFocusListener={false}
      disableHoverListener={false}
      disableTouchListener={false}
      style={anchor}
      title={content}
      {...props}
    >
      <Chip
        color="primary"
        className={`${classes.chip} ${hoverClass}`}
        label={
          <Collapse in={debouncedHovering} orientation="horizontal">
            Learn more
          </Collapse>
        }
        deleteIcon={
          <div className="relative">
            <DescriptionIcon fontSize="small" />
            <div className={`${classes.iconAura} ${hoverClass}`} />
          </div>
        }
        onClick={onClick}
        onDelete={onClick}
        onMouseOver={() => setIsHovering(true)}
        onMouseOut={() => setIsHovering(false)}
        variant="outlined"
      />
    </MenderTooltipClickable>
  );
};

export const DocsLink = forwardRef(({ children, className = '', path, title = '', ...remainder }, ref) => {
  const docsVersion = useSelector(getDocsVersion);
  const { isHosted } = useSelector(getFeatures);
  const target = `https://docs.mender.io/${docsVersion}${path}`;

  const onClickHandler = () => {
    const docsParams = { headers: { 'x-mender-docs': docsVersion } };
    fetch(target, isHosted ? {} : docsParams);
  };

  return (
    // eslint-disable-next-line react/jsx-no-target-blank
    <a className={className} {...remainder} href={target} onClick={onClickHandler} ref={ref} target="_blank" rel={isHosted ? 'noopener' : ''}>
      {children ? children : title}
    </a>
  );
});

DocsLink.displayName = 'DocsLink';

export default DocsLink;

1	// Copyright 2023 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, { forwardRef, useState } from 'react';
15	import { useSelector } from 'react-redux';
16
17	import { Description as DescriptionIcon } from '@mui/icons-material';
18	import { Chip, Collapse, chipClasses } from '@mui/material';
19	import { makeStyles } from 'tss-react/mui';
20
21	import { TIMEOUTS } from '@northern.tech/store/constants';
22	import { getDocsVersion, getFeatures } from '@northern.tech/store/selectors';
23	import { useDebounce } from '@northern.tech/utils/debouncehook';
24
25	import { MenderTooltipClickable } from './mendertooltip';
26
27	const useStyles = makeStyles()(theme => ({	125✔
28	iconAura: {
29	position: 'absolute',
30	top: -6,
31	bottom: -4,
32	left: -7,
33	right: -6.5,
34	border: `1px dashed ${theme.palette.text.disabled}`,
35	borderRadius: '50%',
36	'&.hovering': {
37	borderColor: 'transparent'
38	}
39	},
40	chip: {
41	borderStyle: 'dashed',
42	[`.${chipClasses.deleteIcon}`]: {
43	fontSize: 'smaller'
44	},
45	'&.not-hovering': {
46	borderColor: 'transparent',
47	color: theme.palette.text.disabled,
48	[`.${chipClasses.deleteIcon}`]: {
49	color: theme.palette.text.disabled
50	},
51	[`.${chipClasses.label}`]: {
52	paddingLeft: 0,
53	visibility: 'collapse'
54	}
55	}
56	}
57	}));
58
59	export const DOCSTIPS = {	125✔
60	deviceConfig: { id: 'deviceConfig', path: 'add-ons/configure' },
61	dynamicGroups: { id: 'dynamicGroups', path: 'overview/device-group#dynamic-group' },
62	limitedDeployments: { id: 'limitedDeployments', path: 'overview/deployment#deployment-to-dynamic-groups' },
63	phasedDeployments: { id: 'phasedDeployments', path: 'overview/customize-the-update-process' },
64	pausedDeployments: { id: 'pausedDeployments', path: 'overview/customize-the-update-process#synchronized-updates' },
65	retryDeployments: { id: 'retryDeployments', path: 'overview/deployment' },
66	releases: { id: 'releases', path: 'overview/artifact' },
67	webhookSecret: { id: 'webhookSecret', path: 'server-integration/webhooks#signature-header' }
68	};
69
70	export const DocsTooltip = ({ anchor = {}, id = '', ...props }) => {	125✔
71	const [isHovering, setIsHovering] = useState(false);	424✔
72	const debouncedHovering = useDebounce(isHovering, TIMEOUTS.debounceDefault);	424✔
73	const docsVersion = useSelector(getDocsVersion);	424✔
74	const { isHosted } = useSelector(getFeatures);	424✔
75	const { classes } = useStyles();	424✔
76	const { content, path } = DOCSTIPS[id] \|\| {};	424✔
77	const target = `https://docs.mender.io/${docsVersion}${path}`;	424✔
78
79	const onClick = () => {	424✔
UNCOV 80	const docsParams = { headers: { 'x-mender-docs': docsVersion } };	×
81	fetch(target, isHosted ? {} : docsParams);	×
82	window.open(target, '_blank');	×
83	};
84
85	const hoverClass = debouncedHovering ? 'hovering' : 'not-hovering';	424!
86	return (	424✔
87	<MenderTooltipClickable
88	placement="bottom-start"
89	disableFocusListener={false}
90	disableHoverListener={false}
91	disableTouchListener={false}
92	style={anchor}
93	title={content}
94	{...props}
95	>
96	<Chip
97	color="primary"
98	className={`${classes.chip} ${hoverClass}`}
99	label={
100	<Collapse in={debouncedHovering} orientation="horizontal">
101	Learn more
102	</Collapse>
103	}
104	deleteIcon={
105	<div className="relative">
106	<DescriptionIcon fontSize="small" />
107	<div className={`${classes.iconAura} ${hoverClass}`} />
108	</div>
109	}
110	onClick={onClick}
111	onDelete={onClick}
UNCOV 112	onMouseOver={() => setIsHovering(true)}	×
113	onMouseOut={() => setIsHovering(false)}	×
114	variant="outlined"
115	/>
116	</MenderTooltipClickable>
117	);
118	};
119
120	export const DocsLink = forwardRef(({ children, className = '', path, title = '', ...remainder }, ref) => {	125✔
121	const docsVersion = useSelector(getDocsVersion);	115✔
122	const { isHosted } = useSelector(getFeatures);	115✔
123	const target = `https://docs.mender.io/${docsVersion}${path}`;	115✔
124
125	const onClickHandler = () => {	115✔
UNCOV 126	const docsParams = { headers: { 'x-mender-docs': docsVersion } };	×
127	fetch(target, isHosted ? {} : docsParams);	×
128	};
129
130	return (	115✔
131	// eslint-disable-next-line react/jsx-no-target-blank
132	<a className={className} {...remainder} href={target} onClick={onClickHandler} ref={ref} target="_blank" rel={isHosted ? 'noopener' : ''}>	115✔
133	{children ? children : title}	115✔
134	</a>
135	);
136	});
137
138	DocsLink.displayName = 'DocsLink';	125✔
139
140	export default DocsLink;

mendersoftware / mender-server / 1593965839

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