• Home
  • Features
  • Pricing
  • Docs
  • Announcements
  • Sign In

mendersoftware / gui / 1113439055

19 Dec 2023 09:01PM UTC coverage: 82.752% (-17.2%) from 99.964%
1113439055

Pull #4258

gitlab-ci

mender-test-bot
chore: Types update

Signed-off-by: Mender Test Bot <mender@northern.tech>
Pull Request #4258: chore: Types update

4326 of 6319 branches covered (0.0%)

8348 of 10088 relevant lines covered (82.75%)

189.39 hits per line

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

66.67
/src/js/components/settings/addonselection.js
1
// Copyright 2021 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, { useMemo } from 'react';
15

16
import { Checkbox } from '@mui/material';
17

18
import { ADDONS, PLANS } from '../../constants/appConstants';
19
import InfoText from '../common/infotext';
20
import { useStyles } from './planselection';
21

22
export const AddOnSelection = ({ addons = [], features, onChange, updatedPlan = PLANS.os.id }) => {
5✔
23
  const { classes } = useStyles();
3✔
24
  const onAddOnClick = (e, name, enabled) => {
3✔
25
    if (e.target.tagName === 'A') {
×
26
      return;
×
27
    }
28
    let changedAddOns = addons.filter(item => item.name !== name);
×
29
    if (enabled) {
×
30
      changedAddOns.push({ name, enabled });
×
31
    }
32
    onChange(changedAddOns);
×
33
  };
34

35
  const isUpgrade = Object.keys(PLANS).indexOf(updatedPlan) < Object.keys(PLANS).length - 1;
3✔
36
  const relevantAddons = useMemo(
3✔
37
    () =>
38
      Object.entries(ADDONS).reduce((accu, [addOnName, addOn]) => {
2✔
39
        if (!addOn.needs.every(need => features[need])) {
6✔
40
          return accu;
2✔
41
        }
42
        const isEnabled = addons.some(orgAddOn => orgAddOn.enabled && addOnName === orgAddOn.name);
4!
43
        accu.push({ ...addOn, name: addOnName, isEnabled });
4✔
44
        return accu;
4✔
45
      }, []),
46
    // eslint-disable-next-line react-hooks/exhaustive-deps
47
    [JSON.stringify(addons), JSON.stringify(features)]
48
  );
49

50
  return (
3✔
51
    <>
52
      <h3 className="margin-top-large">Get more features with add-ons</h3>
53

54
      <div className="flexbox column">
55
        <p>
56
          Extend Mender features with our add-ons. Select one or more from the list and submit to request add-ons to be added to your plan. We&apos;ll adjust
57
          your subscription and confirm it with you.
58
        </p>
59
        {relevantAddons.map(addOn => {
60
          const isEligible = addOn.eligible.indexOf(updatedPlan) > -1;
6✔
61

62
          return (
6✔
63
            <div
64
              key={addOn.name}
65
              className={`planPanel ${classes.planPanel} addon ${isUpgrade ? 'upgrade' : ''} ${addOn.isEnabled ? 'active' : ''} ${isEligible ? '' : 'muted'}`}
18!
66
              onClick={e => (isEligible ? onAddOnClick(e, addOn.name, !addOn.isEnabled) : () => false)}
×
67
            >
68
              <Checkbox disabled={!isEligible} checked={addOn.isEnabled} />
69
              <div className="bold">{addOn.title}</div>
70
              {isUpgrade && (
12✔
71
                <div className="flexbox column">
72
                  <div className={`link-color bold ${classes.price}`}>{addOn[updatedPlan].price}</div>
73
                  <div>{addOn[updatedPlan].deviceCount}</div>
74
                </div>
75
              )}
76
              <InfoText variant="dense">{addOn.description}</InfoText>
77
              {/* eslint-disable-next-line react/jsx-no-target-blank */}
78
              <a className="margin-left-small" href="https://mender.io/plans/features" target="_blank" rel="noopener">
79
                Learn more
80
              </a>
81
            </div>
82
          );
83
        })}
84
      </div>
85
    </>
86
  );
87
};
88

89
export default AddOnSelection;
STATUS · Troubleshooting · Open an Issue · Sales · Support · CAREERS · ENTERPRISE · START FREE · SCHEDULE DEMO
ANNOUNCEMENTS · TWITTER · TOS & SLA · Supported CI Services · What's a CI service? · Automated Testing

© 2025 Coveralls, Inc