@carbon/ibm-security
Version:
Carbon for Cloud & Cognitive IBM Security UI components
159 lines (158 loc) • 12.9 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.Default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _iconsReact = require("@carbon/icons-react");
var _classnames2 = _interopRequireDefault(require("classnames"));
var _carbonComponentsReact = require("carbon-components-react");
var _react = _interopRequireDefault(require("react"));
var _storybook = require("../../../.storybook");
var _ = require("../..");
var _stories = _interopRequireWildcard(require("./stories"));
var _excluded = ["className", "direction", "nested"];
/**
* @file Overview page layout stories.
* @copyright IBM Security 2020 - 2021
*/
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
var decorators = _stories.default.decorators,
parameters = _stories.default.parameters;
var _default = exports.default = {
title: (0, _storybook.pageLayouts)('Overview'),
parameters: parameters,
decorators: decorators
}; // TODO: Remove workaround for https://github.ibm.com/security/design-core-experience/issues/241
var withBorder = function withBorder(WrappedComponent) {
return function (_ref) {
var className = _ref.className,
direction = _ref.direction,
nested = _ref.nested,
other = (0, _objectWithoutProperties2.default)(_ref, _excluded);
var namespace = 'container__border';
return /*#__PURE__*/_react.default.createElement(WrappedComponent, (0, _extends2.default)({
className: (0, _classnames2.default)(namespace, className, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(namespace, "--").concat(direction), direction), "".concat(namespace, "--nested"), nested))
}, other));
};
};
var RowWithContainer = (0, _stories.withContainer)(_carbonComponentsReact.Row);
var RowWithBorderContainer = withBorder((0, _stories.withContainer)(_carbonComponentsReact.Row));
var ColumnWithBorder = withBorder(_carbonComponentsReact.Column);
var DescriptionListModuleWithBorder = withBorder(_.DescriptionListModule);
var Default = exports.Default = function Default() {
return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Grid, null, /*#__PURE__*/_react.default.createElement(_.ActionBarModule, null, /*#__PURE__*/_react.default.createElement(_.Tag, {
type: "gray"
}, "Closed"), "ID: 12\xA0\xA0|\xA0\xA0Result: Completed"), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Row, null, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, {
lg: 12
}, /*#__PURE__*/_react.default.createElement(RowWithBorderContainer, {
direction: "bottom",
narrow: true
}, /*#__PURE__*/_react.default.createElement(ColumnWithBorder, {
direction: "right"
}, /*#__PURE__*/_react.default.createElement(_.DescriptionListModule, null, /*#__PURE__*/_react.default.createElement(_.TitleBarModule, {
title: "General settings and scope",
subsection: true
}), /*#__PURE__*/_react.default.createElement(_.TypeLayout, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutBody, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Name"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "ServiceNow entitlements review")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Description"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Sample description of the ServiceNow entitlements review campaign that may need to go to several lines.")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Type"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "User entitlements")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Priority"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Medium")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Applications"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, "ServiceNow 1"), /*#__PURE__*/_react.default.createElement("li", null, "ServiceNow 2"), /*#__PURE__*/_react.default.createElement("li", null, "ServiceNow 3")))), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Include only"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "All users and groups included")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Except for"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "No users and groups excluded")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Reviewer"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "User manager")))))), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, null, /*#__PURE__*/_react.default.createElement(DescriptionListModuleWithBorder, {
direction: "bottom",
nested: true
}, /*#__PURE__*/_react.default.createElement(_.TitleBarModule, {
title: "Schedule",
subsection: true
}), /*#__PURE__*/_react.default.createElement(_.TypeLayout, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutBody, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Start date"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Jul 1 2019 at 12:00PM CST")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Duration"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "20 days")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Frequency"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "This campaign repeats every 3 months"))))), /*#__PURE__*/_react.default.createElement(_.DescriptionListModule, null, /*#__PURE__*/_react.default.createElement(_.TitleBarModule, {
title: "Campaign end",
subsection: true
}), /*#__PURE__*/_react.default.createElement(_.TypeLayout, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutBody, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Reminders"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Start 10 days before campaign ends")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Campaign end"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Take no action on entitlements not reviewed"))))))), /*#__PURE__*/_react.default.createElement(RowWithContainer, {
narrow: true
}, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, null, /*#__PURE__*/_react.default.createElement(_.TitleBarModule, {
title: "Campaign results",
subsection: true
}))), /*#__PURE__*/_react.default.createElement(_.ICAModule, null, function (_ref2) {
var getLayoutProps = _ref2.getLayoutProps;
return /*#__PURE__*/_react.default.createElement(RowWithContainer, {
narrow: true
}, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, getLayoutProps({
lg: 3,
md: 2,
sm: 2
}), /*#__PURE__*/_react.default.createElement(_.ICA, {
label: "Reviews complete",
value: 300
})), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, getLayoutProps({
lg: 3,
md: 2,
sm: 2
}), /*#__PURE__*/_react.default.createElement(_.ICA, {
label: "Approved",
value: 241
})), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, getLayoutProps({
lg: 3,
md: 2,
sm: 2
}), /*#__PURE__*/_react.default.createElement(_.ICA, {
label: "Rejected",
value: 28
})));
}), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Row, {
narrow: true
}, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, null, /*#__PURE__*/_react.default.createElement(_.DataTablePagination, {
headers: [{
header: 'Reviewer',
key: 'reviewer'
}, {
header: 'Approved',
key: 'approved'
}, {
header: 'Rejected',
key: 'rejected'
}, {
header: 'Not reviewed',
key: 'notReviewed'
}, {
header: 'Completion',
key: 'completion'
}],
pageSize: 5,
pageSizes: [5, 10, 25, 50],
rows: [{
approved: 5,
completion: '10%',
id: '0',
notReviewed: 54,
rejected: 0,
reviewer: 'john@cse-bank.com'
}, {
approved: 64,
completion: '92%',
id: '1',
notReviewed: 6,
rejected: 5,
reviewer: 'maria@cse-bank.com'
}, {
approved: 71,
completion: '100%',
id: '2',
notReviewed: 0,
rejected: 0,
reviewer: 'rogelio@cse-bank.com'
}]
})))), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, {
lg: 4
}, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Row, {
narrow: true
}, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, null, /*#__PURE__*/_react.default.createElement(_.ButtonClusterModule, null, /*#__PURE__*/_react.default.createElement(_.Button, {
kind: "ghost",
renderIcon: _iconsReact.Copy16
}, "Duplicate campaign"), /*#__PURE__*/_react.default.createElement(_.Button, {
kind: "ghost",
renderIcon: _iconsReact.Activity16
}, "View activity report")))), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Row, null, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, null, /*#__PURE__*/_react.default.createElement(_.DescriptionListModule, null, /*#__PURE__*/_react.default.createElement(_.TitleBarModule, {
title: "Details",
subsection: true
}), /*#__PURE__*/_react.default.createElement(_.TypeLayout, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutBody, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Created by"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, "Scott Damon"), /*#__PURE__*/_react.default.createElement("li", null, "scottd@cse-bank.com")))), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Created on"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Jun 21 2018")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Modified on"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "\u2013")), /*#__PURE__*/_react.default.createElement(_.TypeLayoutRow, null, /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Closed on"), /*#__PURE__*/_react.default.createElement(_.TypeLayoutCell, null, "Jul 15 2018"))))))))));
};