@netdata/netdata-ui/dist/es6/organisms/documentation/general.js

netdata UI kit

function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React, { Fragment } from "react";
import styled from "styled-components";
import { getColor } from "../../theme";
import { H5, Text } from "../../components/typography";
import { Icon } from "../../components/icon";
import { Button } from "../../components/button";
import Flex from "../../components/templates/flex";
var Anchor = styled(Text).attrs({
  as: "a",
  target: "_blank"
}).withConfig({
  displayName: "general__Anchor",
  componentId: "sc-rybr76-0"
})(["&&&{text-decoration:none;color:", ";&:hover{color:", ";text-decoration:none;}}"], getColor("primary"), getColor("accent"));
var Section = function Section(_ref) {
  var icon = _ref.icon,
    title = _ref.title,
    content = _ref.content,
    url = _ref.url,
    children = _ref.children,
    testid = _ref.testid,
    label = _ref.label,
    labelTransform = _ref.labelTransform,
    onClick = _ref.onClick;
  return /*#__PURE__*/React.createElement(Flex, {
    width: "100%",
    column: true,
    gap: 2
  }, /*#__PURE__*/React.createElement(Flex, {
    gap: 2,
    alignItems: "center"
  }, /*#__PURE__*/React.createElement(Icon, {
    color: "text",
    name: icon,
    width: "18px",
    height: "18px"
  }), /*#__PURE__*/React.createElement(H5, {
    margin: [0]
  }, title)), /*#__PURE__*/React.createElement(Flex, {
    column: true,
    gap: 4,
    padding: [0, 2]
  }, /*#__PURE__*/React.createElement(Text, null, content), /*#__PURE__*/React.createElement(Button, _extends({
    width: "100%",
    onClick: onClick,
    label: label,
    "data-testid": testid
  }, labelTransform && {
    textTransform: labelTransform
  }, url && {
    as: "a",
    target: "_blank",
    href: url
  })), children));
};
var propsByApp = {
  cloud: {
    documentationUrl: "https://learn.netdata.cloud/",
    issuesUrl: "https://github.com/netdata/netdata-cloud/issues/new?labels=bug&template=submig-a-bug-for-netdata-cloud.md&title=%5BBUG%5D",
    issuesLabel: "Let us know about any bugs you’ve encountered in Netdata Cloud.",
    otherIssuesUrl: "https://github.com/netdata/netdata/issues/new?assignees=&labels=bug%2Cneeds+triage&template=BUG_REPORT.yml&title=%5BBug%5D%3A+",
    otherIssuesLabel: "Agent",
    communitySupportUrl: "https://www.netdata.cloud/community/"
  },
  agent: {
    documentationUrl: "https://learn.netdata.cloud/",
    issuesUrl: "https://github.com/netdata/netdata/issues/new?assignees=&labels=bug%2Cneeds+triage&template=BUG_REPORT.yml&title=%5BBug%5D%3A+",
    issuesLabel: "Let us know about any bugs you’ve encountered in Netdata Agent.",
    otherIssuesUrl: "https://github.com/netdata/netdata-cloud/issues/new?labels=bug&template=submig-a-bug-for-netdata-cloud.md&title=%5BBUG%5D",
    otherIssuesLabel: "Cloud",
    communitySupportUrl: "https://www.netdata.cloud/community/"
  }
};
var General = function General(_ref2) {
  var app = _ref2.app,
    onDashboardClick = _ref2.onDashboardClick,
    onVisitDocumentClick = _ref2.onVisitDocumentClick,
    onOpenIssueClick = _ref2.onOpenIssueClick,
    onOpenBugClick = _ref2.onOpenBugClick,
    onSupportClick = _ref2.onSupportClick,
    onGoToDemoClick = _ref2.onGoToDemoClick,
    _ref2$demoUrl = _ref2.demoUrl,
    demoUrl = _ref2$demoUrl === void 0 ? "https://app.netdata.cloud/spaces/netdata-demor" : _ref2$demoUrl;
  var _ref3 = propsByApp[app] || propsByApp.cloud,
    documentationUrl = _ref3.documentationUrl,
    issuesUrl = _ref3.issuesUrl,
    issuesLabel = _ref3.issuesLabel,
    communitySupportUrl = _ref3.communitySupportUrl,
    otherIssuesUrl = _ref3.otherIssuesUrl,
    otherIssuesLabel = _ref3.otherIssuesLabel;
  return /*#__PURE__*/React.createElement(Fragment, null, app === "agent" && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Section, {
    icon: "dashboard",
    title: "Dashboard",
    content: "Learn how to interact with graphs using your mouse or touch interface.",
    testid: "dashboard-info",
    label: "Learn to use the Dashboard",
    onClick: onDashboardClick
  }), /*#__PURE__*/React.createElement(Flex, {
    width: "100%",
    height: {
      min: "1px"
    },
    background: "disabled"
  })), /*#__PURE__*/React.createElement(Section, {
    icon: "documentation",
    title: "Documentation",
    content: "View how-tos, reference docs, and tutorials to help you get the most out of Netdata Cloud. ",
    url: documentationUrl,
    testid: "documentation-link",
    label: "Visit the docs",
    onClick: onVisitDocumentClick
  }), /*#__PURE__*/React.createElement(Section, {
    icon: "unknownError",
    title: "Report a Bug",
    content: issuesLabel,
    url: issuesUrl,
    testid: "documentation-report-bug-link",
    label: "Open a new Issue in GitHub",
    labelTransform: "none",
    onClick: onOpenIssueClick
  }, /*#__PURE__*/React.createElement(Text, null, "Found a bug with the Netdata ", otherIssuesLabel, "?", /*#__PURE__*/React.createElement(Anchor, {
    href: otherIssuesUrl,
    onClick: onOpenBugClick
  }, "Open an issue"), " ", "on GitHub")), /*#__PURE__*/React.createElement(Section, {
    icon: "community",
    title: "Community",
    content: "If you need help or would like to contribute to Netdata, join our Community and ask questions, discuss topics, or propose feature requests.",
    url: communitySupportUrl,
    testid: "documentation-community-support-link",
    label: "Join the Community",
    onClick: onSupportClick
  }), /*#__PURE__*/React.createElement(Section, {
    icon: "spaces_v2",
    title: "Public demo space",
    content: "Netdata has a public demo space where you can explore different monitoring use-cases. Jump into any that might interest you and put your hands-on our monitoring solution!",
    url: demoUrl,
    testid: "demo-link",
    label: "Go to demo",
    onClick: onGoToDemoClick
  }));
};
export default General;