![\"Zerodai\"](\"/images/brand/circle-green/Logo){kind=logo}
)\r\n :\r\n (\r\n \r\n ));\r\n }\r\n}\r\n","import React, { Component } from \"react\";\r\n\r\nimport { AppLogo } from \"./AppLogo\";\r\n\r\nexport class AppNavHome extends Component {\r\n static displayName = AppNavHome.name;\r\n\r\n render() {\r\n const { appName, home, routing } = this.props;\r\n return (\r\n \r\n {\r\n ev.preventDefault();\r\n routing.push(home.url);\r\n }}\r\n href=\"#\"\r\n title={appName || \"Zerodai\"}\r\n >\r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport { css } from '@uifabric/utilities/lib/css';\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\n\r\nexport class AppNavLink extends Component {\r\n static displayName = AppNavLink.name;\r\n\r\n render () {\r\n const { item, routing, selectedItemId } = this.props; \r\n return (\r\n routing.push(item.url)} title={item.title}>\r\n { item.icon && {appName || \"Zerodai\"}
\r\n \r\n \r\n \r\n this._onMenuToggle()} menuProps={menuProps}> \r\n { user && (\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _getCustomElements() {\r\n return (\r\n \r\n
\r\n ); \r\n }\r\n }\r\n);","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\nimport Moment from 'react-moment';\r\n\r\nimport { IconButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { FontIcon } from 'office-ui-fabric-react/lib/Icon';\r\nimport { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';\r\n\r\nimport './AppHeader.css';\r\n\r\nconst dropDownClassName = cx(\r\n 'ms-ContextualMenu-list',\r\n css`\r\n overflow: hidden;\r\n `\r\n);\r\n\r\nconst iconClassName = cx(\r\n dropDownClassName,\r\n css`\r\n color: var(--nav-color-accent);\r\n font-size: 50px;\r\n `\r\n);\r\n\r\nconst iconRedClassName = cx(\r\n css`\r\n color: red;\r\n `\r\n);\r\n\r\nexport const AppHeaderNotification = observer(\r\n class AppHeaderNotification extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n get menuProps() {\r\n const { layoutStore } = this.props;\r\n return {\r\n onMenuDismissed: () => {\r\n layoutStore.markAllNotificationsRead()\r\n },\r\n items: [\r\n {\r\n key: 'section1',\r\n itemType: ContextualMenuItemType.Section,\r\n sectionProps: {\r\n topDivider: true,\r\n bottomDivider: true,\r\n title: 'Notifications',\r\n items: layoutStore.notifications.map(N => {\r\n return {\r\n key: N.message,\r\n text: \r\n {!N.read &&
,\r\n onClick: () => {},\r\n }\r\n }),\r\n },\r\n }\r\n ]\r\n }\r\n };\r\n\r\n render () {\r\n const { layoutStore, hide } = this.props;\r\n return (<>\r\n {!hide && \r\n {layoutStore.notifications.length < 1 &&
}\r\n \r\n );\r\n }\r\n }\r\n);","import React, { useCallback } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Breadcrumb } from \"office-ui-fabric-react/lib/Breadcrumb\";\r\nimport { IconButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { ProgressIndicator } from \"office-ui-fabric-react/lib/ProgressIndicator\";\r\nimport { Image, ImageFit } from \"office-ui-fabric-react/lib/Image\";\r\n\r\nimport { ConfigModules } from \"../../config/stores/ConfigModules\";\r\n\r\nimport { TaskSummaryBadge } from \"../../workflows/containers/utilities/TaskSummaryBadge\";\r\n\r\nimport { PersonalMenu } from \"./PersonalMenu\";\r\nimport { AppHeaderNotification } from \"./AppHeaderNotification\";\r\n\r\nimport \"./AppHeader.css\";\r\n\r\nconst progressClassName = cx(\r\n \"cygraph-Progress-bar\",\r\n css`\r\n height: 2px;\r\n width: 100%;\r\n position: absolute;\r\n bottom: 0px;\r\n left: 0;\r\n right: 0;\r\n z-index: 11;\r\n\r\n & > div {\r\n padding: 0;\r\n }\r\n\r\n & .ms-ProgressIndicator-progressTrack {\r\n background-color: transparent;\r\n }\r\n `\r\n);\r\n\r\nconst breadcrumbClassName = cx(\r\n \"cygraph-AppHeader-breadcrumb\",\r\n css`\r\n margin: 0;\r\n\r\n & .ms-Breadcrumb-itemLink,\r\n & .ms-Breadcrumb-item {\r\n font-size: 14px;\r\n border-radius: 5px;\r\n }\r\n `\r\n);\r\n\r\nexport const AppHeader = observer(({ page, routing, user, authProvider, layoutStore, configProvider }) => {\r\n const config = configProvider.get(ConfigModules.Core);\r\n const showAnimation = false;\r\n\r\n const getCustomDivider = useCallback((_) => {\r\n return (\r\n \r\n /\r\n \r\n );\r\n }, []);\r\n\r\n return (\r\n \r\n 1 ? 1 : 0}\r\n maxDisplayedItems={5}\r\n dividerAs={getCustomDivider}\r\n ariaLabel=\"Page level breadcrumb\"\r\n overflowAriaLabel=\"More links\"\r\n />\r\n ) : (\r\n
\r\n )}\r\n \r\n \r\n
\r\n\r\n {page.breadcrumb ? (\r\n \r\n \r\n
\r\n {!showAnimation && page.subTitle}
\r\n {page.status && {page.status}
}\r\n \r\n \r\n {page.externalLink && page.externalLink.url && page.externalLink.title && (\r\n \r\n {page.externalLink.title} \r\n \r\n )}\r\n\r\n page.toggleSidebar()}\r\n disabled={false}\r\n />\r\n )}\r\n \r\n
\r\n \r\n// 1 ? 1 : 0}\r\n// maxDisplayedItems={5}\r\n// dividerAs={this._getCustomDivider}\r\n// ariaLabel=\"Page level breadcrumb\"\r\n// overflowAriaLabel=\"More links\"\r\n// />\r\n// ) : (\r\n//
\r\n// )}\r\n// \r\n// \r\n//
\r\n// {false && (\r\n// <>\r\n// page.onTitleClick()} className=\"app__title\">\r\n// {page.subTitle && \r\n// \r\n//
\r\n// {!this.state.showAnimation && page.subTitle}
\r\n// {page.status && {page.status}
}\r\n// \r\n// \r\n// {page.externalLink && page.externalLink.url && page.externalLink.title && (\r\n// \r\n// {page.externalLink.title} \r\n// \r\n// )}\r\n\r\n// page.toggleSidebar()}\r\n// disabled={false}\r\n// />\r\n// )}\r\n// \r\n//
\r\n// \r\n {!layoutStore.hideNavigation && (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n {title}\r\n \r\n {children ? (\r\n {children} \r\n ) : (\r\n \r\n {value}\r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n \r\n View all \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {Array.from({ length: 3 }).map((item, i) => (\r\n \r\n \r\n ))}\r\n \r\n
\r\n );\r\n }\r\n\r\n return (\r\n \r\n \r\n {items &&\r\n items.map((item, i) => (\r\n \r\n \r\n ))}\r\n \r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { FontIcon } from \"@ui/elements/Icon\";\r\n\r\nconst EntityIcons = {\r\n \"work-item\": {\r\n iconName: \"ExternalTFVC\",\r\n color: \"var(--green-8)\",\r\n backgroundColor: \"var(--green-1)\",\r\n },\r\n assessment: {\r\n iconName: \"WorkItem\",\r\n color: \"var(--purple-8)\",\r\n backgroundColor: \"var(--purple-1)\",\r\n },\r\n risk: {\r\n iconName: \"ReportHacked\",\r\n color: \"var(--red-8)\",\r\n backgroundColor: \"var(--red-1)\",\r\n },\r\n exception: {\r\n iconName: \"Shield\",\r\n color: \"var(--orange-8)\",\r\n backgroundColor: \"var(--orange-1)\",\r\n },\r\n help: {\r\n iconName: \"Unknown\",\r\n color: \"var(--blue-8)\",\r\n backgroundColor: \"var(--blue-1)\",\r\n },\r\n};\r\nexport const EntityIcon = observer(({ type, size }) => {\r\n const { iconName, color, backgroundColor } = EntityIcons[type];\r\n return (\r\n \r\n \r\n \r\n \r\n {url && (\r\n \r\n \r\n )}\r\n \r\n \r\n \r\n {title}\r\n \r\n \r\n {description}\r\n \r\n \r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { ModuleNames, isModuleEnabled } from \"../../../configProvider\";\r\nimport { isUserInAllRoles } from \"@modules/identity/stores/PrincipalContextUtilities\";\r\n\r\nimport { BoxPanel } from \"@modules/base/components/BoxPanel\";\r\n\r\nimport { QuickLinkItemView } from \"@modules/home/components/QuickLinkItemView\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-QuickLinkListView-root\",\r\n css`\r\n & .quickLink {\r\n min-height: 200px;\r\n height: 100%;\r\n padding: 25px;\r\n }\r\n & > r-grid {\r\n grid-column-gap: 0;\r\n grid-row-gap: 0;\r\n margin-bottom: 0;\r\n }\r\n & > r-grid > r-cell {\r\n cursor: pointer;\r\n border-bottom: 1px solid var(--border-color);\r\n }\r\n & > r-grid > r-cell:nth-child(odd) {\r\n border-right: 1px solid var(--border-color);\r\n }\r\n & > r-grid > r-cell.lastRow {\r\n border-bottom: 0;\r\n }\r\n & > r-grid > r-cell:hover {\r\n box-shadow: rgb(0 0 0 / 11%) 0px 3.2px 15px 0px, rgb(0 0 0 / 11%) 0px 0.6px 1.8px 0px;\r\n }\r\n `\r\n);\r\n\r\nexport const QuickLinkListView = observer(({ className }) => {\r\n const { principalContext, routing } = useStores();\r\n const user = principalContext.current;\r\n\r\n const showRisks = isModuleEnabled(ModuleNames.Risks) && isUserInAllRoles(user, [\"admin\", \"agent\"]);\r\n const isAgent = isUserInAllRoles(user, [\"agent\"]);\r\n const quickLinks = buildQuickLinks(isAgent, showRisks);\r\n const oddLength = quickLinks.length % 2 === 1;\r\n\r\n return (\r\n \r\n \r\n {closedDate ? strings.closed : strings[level]}
\r\n ),\r\n };\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { DueIndicator } from \"@modules/base/components/DueIndicator\";\r\n\r\nexport const TaskDueDateIndicator = observer(({ className, children, definition, defaultValue }) => {\r\n if (!definition || !definition.dueDate || definition.status === \"Cancelled\") {\r\n return defaultValue || null;\r\n }\r\n\r\n return (\r\n \r\n {precision === \"d\" ? diffInDays : diffInMonths}\r\n {precision}\r\n
\r\n \r\n {children}\r\n {children}
;\r\n }\r\n }\r\n);\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { useStores } from \"@hooks/useStores\";\r\nimport { Constants } from \"@api/graph/serviceBase\";\r\n\r\nimport { Persona, PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\n\r\nexport const PhotoPersona = observer((props) => {\r\n const { authProvider } = useStores();\r\n const [photo, setPhoto] = useState(null);\r\n\r\n useEffect(() => {\r\n if (props.principalId) {\r\n authProvider.getAccessToken().then((token) => {\r\n setPhoto(\r\n `${Constants.baseUrl}/principals/${props.principalId}/photo/$value?token=${token.accessToken}`\r\n );\r\n });\r\n }\r\n }, [authProvider, props.principalId]);\r\n\r\n return \r\n \r\n {definition.title}\r\n \r\n\r\n {definition.description && (\r\n \r\n \r\n \r\n )}\r\n\r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\n\r\nimport { PrimaryButton, DefaultButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nexport function TaskResponseActions({ task, onResponse, disabled }) {\r\n const getResponseOptions = () => {\r\n if (!task) {\r\n return [];\r\n }\r\n\r\n if (task.useCase == \"Approval\") {\r\n return [\r\n {\r\n label: \"Approve\",\r\n value: \"Approved\",\r\n success: true,\r\n },\r\n {\r\n label: \"Reject\",\r\n value: \"Rejected\",\r\n success: false,\r\n },\r\n ];\r\n } else if (task.useCase == \"Confirmation\") {\r\n return [\r\n {\r\n label: \"Yes\",\r\n value: \"Yes\",\r\n success: true,\r\n },\r\n {\r\n label: \"No\",\r\n value: \"No\",\r\n success: false,\r\n },\r\n ];\r\n } else if (task.useCase == \"Completion\") {\r\n return [\r\n {\r\n label: \"Mark as completed\",\r\n value: \"Mark as completed\",\r\n success: true,\r\n },\r\n ];\r\n } else if (task.settings) {\r\n return task.settings.responses;\r\n } else {\r\n return [];\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {getResponseOptions().map((r) => {\r\n if (r.success) {\r\n return \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n
\r\n\r\n {assignmentsWithNotes.length ? (\r\n \r\n \r\n {assignmentsWithNotes.map((assignment) => {\r\n const closedDate = moment.utc(assignment.closed);\r\n return (\r\n
\r\n ) : null}\r\n \r\n \r\n formOptions.task.context && formOptions.task.context.type !== \"trigger\" ? (\r\n \r\n {formOptions.task.context.label}\r\n \r\n ) : null\r\n }\r\n >\r\n {\r\n formData.success = response.success;\r\n formData.response = response.value;\r\n onSave();\r\n }}\r\n onDismiss={onDismiss}\r\n disabled={!isValid && saving}\r\n />\r\n )}\r\n \r\n
\r\n \r\n )}\r\n \r\n );\r\n});\r\n","import React from \"react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport {\r\n PrimaryButton as FabricPrimaryButton,\r\n IconButton as FabricIconButton,\r\n DefaultButton as FabricDefaultButton,\r\n ActionButton as FabricActionButton,\r\n CommandButton as FabricCommandButton,\r\n} from \"office-ui-fabric-react/lib/Button\";\r\nimport { Spinner, SpinnerSize } from \"office-ui-fabric-react/lib/Spinner\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-GhostButton-root\",\r\n css`\r\n border: 1px solid var(--background-color);\r\n background-color: transparent;\r\n padding: 0 10px;\r\n font-size: 13px;\r\n\r\n & .ms-Button-label {\r\n font-weight: normal;\r\n }\r\n\r\n &:hover {\r\n background-color: var(--white);\r\n border: 1px solid var(--border-color-dark);\r\n }\r\n `\r\n);\r\n\r\nconst PrimaryButton = (props) => {\r\n return \r\n {option.title}\r\n {isOptionSelected &&
\r\n {option.description}\r\n \r\n );\r\n })}\r\n \r\n )}\r\n \r\n );\r\n }\r\n}\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport moment from \"moment\";\r\n\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\r\nimport { Toggle } from \"office-ui-fabric-react/lib/Toggle\";\r\n\r\nimport { BigTextField } from \"@modules/base/components/BigTextField\";\r\nimport { RichDropdown } from \"@modules/base/richdropdown/RichDropdown\";\r\nimport { PrincipalPicker } from \"@modules/identity/containers/PrincipalPicker\";\r\n\r\nexport const TaskDefinitionEditForm = observer(({ disabled, formData, formOptions }) => {\r\n return (\r\n <>\r\n \r\n \r\n \r\n
\r\n ))}\r\n {!loading && tasks.length === 0 && You have no tasks assigned to you.
}\r\n {!loading &&\r\n tasks.map((task) => (\r\n \r\n \r\n onRespond(task)} onClickEnabled={true}>\r\n {task.title}\r\n \r\n \r\n\r\n \r\n \r\n
\r\n ))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {item.code} - {item.title}\r\n \r\n \r\n \r\n Last activity {moment.utc(item.modified).format(\"DD MMM YYYY\")} by {item.modifiedBy.name} -{\" \"}\r\n {item.status}\r\n \r\n \r\n {item.type}\r\n \r\n \r\n {includeRole && (\r\n \r\n \r\n {item.role}\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\nimport { Shimmer, ShimmerElementType } from \"@ui/elements/Shimmer\";\r\n\r\nexport const CombinedSearchShimmer = observer(({ className, includeRole }) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {includeRole && (\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useBoolean } from \"@fluentui/react-hooks\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { CombinedSearchItemView } from \"@modules/home/components/CombinedSearchItemView\";\r\nimport { CombinedSearchShimmer } from \"@modules/home/components/CombinedSearchShimmer\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-CombinedSearchListView-root\",\r\n css`\r\n & .wrapper {\r\n padding: var(--spacing-s);\r\n }\r\n\r\n & .showMore {\r\n text-align: left;\r\n margin-top: 10px;\r\n\r\n & a {\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n & .item {\r\n min-height: 40px;\r\n margin-bottom: var(--spacing-xs);\r\n\r\n & .description {\r\n color: var(--text-color-lightest);\r\n }\r\n & .role {\r\n color: var(--text-color-lightest);\r\n text-transform: lowercase;\r\n }\r\n }\r\n `\r\n);\r\n\r\nexport const CombinedSearchListView = observer(({ className, loading, items, show, includeRole }) => {\r\n const [minimal, { toggle }] = useBoolean(true);\r\n\r\n if (loading) {\r\n return (\r\n \r\n {Array.from({ length: show || 10 }).map((v, i) => (\r\n
\r\n );\r\n }\r\n\r\n if (!loading && items.length === 0) {\r\n return No recent activities found.
;\r\n }\r\n\r\n return (\r\n \r\n {items.slice(0, Math.min(items.length, show || items.length)).map((item) => (\r\n
\r\n );\r\n});\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\n\r\nimport { ModuleNames, isModuleEnabled } from \"../../../configProvider\";\r\nimport { isUserInAllRoles } from \"@modules/identity/stores/PrincipalContextUtilities\";\r\nimport { ObservableSeparator } from \"@modules/base/components/ObservableSeparator\";\r\n\r\nimport { CombinedSearchListView } from \"@modules/home/components/CombinedSearchListView\";\r\nimport { runRecentSearch } from \"./recentActivities\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-RecentActivitiesView-root\",\r\n \"card\",\r\n css`\r\n padding: 15px 25px 20px !important;\r\n `\r\n);\r\n\r\nexport const RecentActivitiesView = observer(({ className }) => {\r\n const [loading, setLoading] = useState(false);\r\n const [items, setItems] = useState([]);\r\n\r\n const { principalContext, workItemStore, assessmentStore, riskStore } = useStores();\r\n const user = principalContext.current;\r\n\r\n const showRisks = isModuleEnabled(ModuleNames.Risks) && isUserInAllRoles(user, [\"admin\", \"agent\"]);\r\n\r\n useEffect(() => {\r\n setLoading(true);\r\n if (user) {\r\n runRecentSearch({ showRisks, user, workItemStore, assessmentStore, riskStore }).then((result) => {\r\n setItems(result);\r\n setLoading(false);\r\n });\r\n }\r\n }, [user]);\r\n\r\n return (\r\n \r\n
\r\n {isCalloutVisible && (\r\n \r\n \r\n \r\n Search results\r\n \r\n \r\n\r\n {!loading && items.length === 0 && (\r\n \r\n Type keywords into the search box to start searching.\r\n \r\n )}\r\n\r\n
\r\n \r\n )}\r\n \r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Text } from \"@ui/elements/Text\";\r\n\r\nimport { tenantInfo } from \"../../../configProvider\";\r\n\r\nimport { AppPage } from \"@modules/layout/containers/AppPage\";\r\n\r\nimport { PageInstanceViewer } from \"@modules/pages/containers/utilities/PageInstanceViewer\";\r\n\r\nimport { KeyStatisticListView } from \"@modules/home/components/KeyStatisticListView\";\r\nimport { QuickLinkListView } from \"@modules/home/components/QuickLinkListView\";\r\nimport { SimpleTaskListView } from \"@modules/home/components/SimpleTaskListView\";\r\nimport { SimpleProfileView } from \"@modules/home/components/SimpleProfileView\";\r\nimport { RecentActivitiesView } from \"@modules/home/components/RecentActivitiesView\";\r\nimport { CombinedSearchField } from \"@modules/home/components/CombinedSearchField\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-HomeOverview-root\",\r\n css`\r\n & .header,\r\n & .search {\r\n color: #ffffff;\r\n height: 40px;\r\n margin-bottom: var(--spacing-s);\r\n }\r\n & .bg {\r\n background-color: var(--nav-background);\r\n height: 215px;\r\n position: absolute;\r\n width: 100%;\r\n top: 0;\r\n left: 0px;\r\n z-index: 9;\r\n border-radius: var(--border-radius);\r\n }\r\n & .parts {\r\n z-index: 99;\r\n }\r\n\r\n & .left,\r\n & .right {\r\n z-index: 99;\r\n }\r\n `\r\n);\r\n\r\nexport const HomeOverview = observer(() => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {tenantInfo.name} \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {title} \r\n \r\n {(columns !== 1 || !!description) && (\r\n \r\n {typeof description === \"string\" ? {description} : description}\r\n \r\n )}\r\n {children} \r\n \r\n
\r\n );\r\n});\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\n\r\nimport { Nav } from 'office-ui-fabric-react/lib/Nav';\r\nimport { CommandBarButton } from 'office-ui-fabric-react/lib/Button';\r\n\r\nconst rootClassName = cx(\r\n 'cygraph-NavigationList-root',\r\n css` \r\n\r\n `\r\n);\r\n\r\nexport const NavigationList = observer(\r\n class NavigationList extends Component {\r\n\r\n render () {\r\n const { className } = this.props;\r\n\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { useCallback, useMemo, useState, useEffect } from \"react\";\r\nimport { toJS, observable, values } from \"mobx\";\r\nimport isHotkey from \"is-hotkey\";\r\nimport { Editable, withReact, useSlate, Slate, ReactEditor } from \"slate-react\";\r\nimport { Editor, Transforms, createEditor } from \"slate\";\r\nimport { withHistory } from \"slate-history\";\r\n\r\nimport { Button, Icon, Toolbar, debounce } from \"./helpers\";\r\nimport { Element, Leaf } from \"./withBase\";\r\nimport { withLinks, LinkButton, UnlinkButton } from \"./withLinks\";\r\n\r\nconst HOTKEYS = {\r\n \"mod+b\": \"bold\",\r\n \"mod+i\": \"italic\",\r\n \"mod+u\": \"underline\",\r\n \"mod+`\": \"code\",\r\n};\r\n\r\nconst LIST_TYPES = [\"numbered-list\", \"bulleted-list\"];\r\n\r\nconst getSafeValue = (value) => {\r\n if (!value) {\r\n const defaultValue = [\r\n {\r\n type: \"paragraph\",\r\n children: [{ text: \"\" }],\r\n },\r\n ];\r\n\r\n return defaultValue;\r\n }\r\n\r\n return toJS(value);\r\n};\r\n\r\nconst RichTextEditor = ({ value, required, disabled, placeholder, className, onChange, onKeyPress }) => {\r\n const debouncedOnChange = debounce(onChange ? onChange : () => undefined, 500);\r\n\r\n const [state, setState] = useState(getSafeValue(value));\r\n\r\n useEffect(() => {\r\n if (!value) {\r\n ReactEditor.deselect(editor);\r\n setState(getSafeValue(null));\r\n }\r\n }, [value]);\r\n\r\n useEffect(() => {\r\n debouncedOnChange(state);\r\n }, [state]);\r\n\r\n const renderElement = useCallback((props) => \r\n
\r\n \r\n {photo && \r\n {user.name}\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { FocusTrapCallout, Callout } from \"office-ui-fabric-react/lib/Callout\";\r\nimport { PrimaryButton, DefaultButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { FocusZone } from \"office-ui-fabric-react/lib/FocusZone\";\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\n\r\nimport { RichTextField, isNotNullOrEmpty } from \"@modules/editors/components/RichTextField\";\r\n\r\nconst wrapperClassName = cx(\"cygraph-PopConfirm-wrapper\", css``);\r\n\r\nconst calloutClassName = cx(\r\n \"cygraph-PopConfirm-callout\",\r\n css`\r\n padding: var(--spacing-xs);\r\n max-width: 380px;\r\n\r\n & .content {\r\n margin-bottom: var(--spacing-xxs);\r\n }\r\n\r\n & button {\r\n font-size: var(--font-size-xxs);\r\n height: 24px;\r\n min-width: 50px;\r\n font-weight: normal;\r\n }\r\n `\r\n);\r\n\r\nexport const PopConfirm = observer(\r\n class PopConfirm extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = { visible: false, comment: null };\r\n }\r\n\r\n render() {\r\n const { children, focusTrap, disabled } = this.props;\r\n\r\n return (\r\n <>\r\n \r\n {label && }\r\n \r\n
\r\n {this._createCallout(focusTrap ? FocusTrapCallout : Callout)}
}\r\n \r\n );\r\n }\r\n\r\n _createCallout(CalloutType) {\r\n const { title, subText, onConfirm, onCancel, okText, cancelText, disabled, commentBox, comments } = this.props;\r\n\r\n return (\r\n \r\n {title && (\r\n
\r\n \r\n {title} \r\n
\r\n )}\r\n {subText && (\r\n \r\n
\r\n )}\r\n {subText}
\r\n\r\n \r\n this._onRenderOverflowButton(overflowItems)\r\n }\r\n onRenderItem={(item) => this._onRenderItem(item)}\r\n />\r\n
\r\n );\r\n }\r\n\r\n _onRenderItem(item) {\r\n if (item.confirmProps) {\r\n return (\r\n \r\n \r\n {user.name} \r\n \r\n \r\n {title}\r\n \r\n {subTitle && (\r\n \r\n {subTitle}\r\n \r\n )}\r\n
\r\n );\r\n }\r\n\r\n _getActionSetItems() {\r\n const { user } = this.props;\r\n\r\n const items = [];\r\n const overflowItems = [];\r\n\r\n return { items, overflowItems };\r\n }\r\n }\r\n);\r\n","import React, { useEffect } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\nimport Moment from \"react-moment\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { ComboBox } from \"office-ui-fabric-react/lib/ComboBox\";\r\n\r\nimport { AppPage } from \"@modules/layout/containers/AppPage\";\r\nimport { BoxPanel } from \"@modules/base/components/BoxPanel\";\r\nimport { FieldSetView } from \"@modules/base/components/FieldSetView\";\r\n\r\nimport { PersonalAccountSideNav } from \"@modules/accounts/components/core/PersonalAccountSideNav\";\r\nimport { PersonalAccountHeader } from \"@modules/accounts/components/core/PersonalAccountHeader\";\r\n\r\nexport const AccountOverviewPage = observer(() => {\r\n const { accountStore, themeProvider, routing } = useStores();\r\n const { loading, breadcrumb, error, user, photo } = accountStore.overviewStore;\r\n\r\n useEffect(() => {\r\n accountStore.overviewStore.loadOverview({});\r\n }, []);\r\n\r\n return (\r\n {user.name}
\r\n {user.email}
\r\n {user.jobTitle}
\r\n {user.department || \"N/A\"}
\r\n {user.preferredLanguage || \"N/A\"}
\r\n {user.provider}
\r\n {user.userPrincipalName}
\r\n \r\n
\r\n {user.defaultPortfolio || \"N/A\"}
\r\n {user.roles.join(\", \")}
\r\n \r\n {selectedField.items\r\n .filter(item =>{\r\n if (filter) {\r\n return item.text.toLowerCase().includes(filter.toLowerCase())\r\n } else {\r\n return true\r\n }\r\n })\r\n .map(item => {\r\n return this.onCheckBoxChange(item.key, checked)}\r\n />\r\n })}\r\n
)\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { cx, css} from 'emotion';\r\nimport {\r\n Checkbox,\r\n} from 'office-ui-fabric-react';\r\n\r\nimport { PrincipalPicker } from '../../../../identity/containers/PrincipalPicker';\r\n\r\nconst checkBoxClassName = cx(css`\r\n padding: 5px;\r\n`);\r\n\r\n\r\nexport class CalloutPersonPicker extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n showCallout: false,\r\n optionFilter: '',\r\n }\r\n }\r\n\r\n onCheckBoxChange = (element, checked) => {\r\n const { selectedField, onCheckBoxChange } = this.props;\r\n if (onCheckBoxChange) onCheckBoxChange(selectedField, element.id, checked);\r\n }\r\n\r\n onPersonPicked = (person) => {\r\n const { selectedField, onAddPerson } = this.props;\r\n if (onAddPerson) onAddPerson(person, selectedField);\r\n }\r\n\r\n render () {\r\n const { selectedField, filter, dataTest } = this.props;\r\n return (\r\n \r\n {selectedField.items\r\n .filter(item =>{\r\n if (filter) {\r\n return item.name.toLowerCase().includes(filter.toLowerCase())\r\n } else {\r\n return true\r\n }\r\n })\r\n .map(item => {\r\n return {this.onCheckBoxChange(item, checked)}}\r\n />\r\n })}\r\n this.onPersonPicked(user)}\r\n selected={null}\r\n />\r\n
)\r\n }\r\n}","import React, { Component, Fragment, useRef } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\n\r\nimport { TagPicker } from 'office-ui-fabric-react/lib/Pickers';\r\nimport { Spinner, SpinnerSize } from 'office-ui-fabric-react/lib/Spinner';\r\nimport { Label } from 'office-ui-fabric-react/lib/Label';\r\nimport { IconButton } from 'office-ui-fabric-react/lib/Button';\r\n\r\nconst containerClassName = css` \r\n& .ms-BasePicker-text {\r\n background-color: var(--white);\r\n min-height: 32px;\r\n}\r\n& .ms-Persona-presence {\r\n top: 6px;\r\n right: 0;\r\n}\r\n`;\r\n\r\nconst labelDivContainerClassName = cx(css`\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n\r\n & button.ms-Button--icon {\r\n margin-top: -3px;\r\n min-width: 30px;\r\n }\r\n\r\n & span.ms-Button-flexContainer {\r\n justify-content: flex-end;\r\n }\r\n`);\r\n\r\nexport class AsyncPicker extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n }\r\n\r\n getTextFromItem = (item) => {\r\n const { textField } = this.props;\r\n return 'item[textField]';\r\n }\r\n\r\n filterSuggestedTags = async (filterText, tagList) => {\r\n const { api, idField, textField, preTextField, pickedField, selected } = this.props;\r\n const results = await api(filterText);\r\n return results\r\n .filter(item => !selected.includes(item[idField]))\r\n .map(item => ({ \r\n key: item[idField],\r\n name: preTextField ? `${item[preTextField]} ${item[textField] ? `- ${item[textField]}` : ``}` : (item[textField] || item[idField]), picked: item[pickedField], data: item \r\n }))\r\n };\r\n\r\n onItemSelected = (item) => {\r\n const { onItemPicked } = this.props;\r\n if (onItemPicked) onItemPicked(item)\r\n return null\r\n }\r\n\r\n onItemsChange = (items) => {\r\n const { onItemsChange } = this.props;\r\n if (onItemsChange) onItemsChange(items)\r\n }\r\n\r\n render () {\r\n const { label, required, disabled, className, selected, multiple, loading, placeholder, maxPicks, onClearFilter, showClearFilter } = this.props;\r\n\r\n const pickerSuggestionsProps = {\r\n suggestionsHeaderText: 'Suggested items',\r\n mostRecentlyUsedHeaderText: 'Suggested items',\r\n noResultsFoundText: 'No matching items found',\r\n loadingText: 'Loading...',\r\n showRemoveButtons: false,\r\n suggestionsAvailableAlertText: 'Suggestions available',\r\n suggestionsContainerAriaLabel: 'Suggested items'\r\n };\r\n\r\n const items = multiple ? (selected || []) : (selected ? [selected] : []);\r\n // console.log('selected', selected)\r\n return (\r\n \r\n {\r\n return {\r\n key: F.id,\r\n name: F.name,\r\n data: F,\r\n }\r\n }) : []}\r\n />\r\n
\r\n );\r\n }\r\n};","import React, { Component, Fragment } from 'react';\r\nimport { cx, css} from 'emotion';\r\nimport { Checkbox } from 'office-ui-fabric-react';\r\nimport { AsyncPicker } from '@baseComponents/asyncPicker/AsyncPicker';\r\n\r\nconst checkBoxClassName = cx(css`\r\n padding: 5px;\r\n`);\r\n\r\nexport class CalloutAsyncPicker extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n showCallout: false,\r\n optionFilter: '',\r\n }\r\n if (props.selectedItems) {\r\n props.selectedField.items = props.selectedItems;\r\n }\r\n }\r\n\r\n onCheckBoxChange = (element, checked) => {\r\n const { selectedField, onCheckBoxChange } = this.props;\r\n if (onCheckBoxChange) onCheckBoxChange(selectedField, element, checked);\r\n }\r\n\r\n onItemPicked = (item) => {\r\n const { selectedField, onAddItem } = this.props;\r\n if (onAddItem) onAddItem(item, selectedField);\r\n }\r\n\r\n render () {\r\n const { selectedField, filter, dataTest, api, idField, textField, pickedField, labelField, preTextField, selectedItems } = this.props;\r\n return (\r\n \r\n
\r\n \r\n { label && }\r\n { loading &&
\r\n \r\n {showClearFilter && selected && selected.length > 0 && {\r\n if (onClearFilter) onClearFilter()\r\n }}\r\n />}\r\n
\r\n \r\n {selectedItems && selectedItems\r\n .filter(item =>{\r\n if (filter) {\r\n return (item.text || item.name).toLowerCase().includes(filter.toLowerCase())\r\n } else {\r\n return true\r\n }\r\n })\r\n .map(item => {\r\n return {this.onCheckBoxChange(item, checked)}}\r\n />\r\n })}\r\n this.onItemPicked(item)}\r\n selected={[]}\r\n api={api}\r\n idField={idField}\r\n textField={textField}\r\n pickedField={pickedField}\r\n preTextField={preTextField}\r\n />\r\n
)\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\nimport { cx, css} from 'emotion';\r\nimport {\r\n Callout,\r\n CommandBarButton,\r\n ActionButton,\r\n Stack,\r\n DirectionalHint,\r\n Separator,\r\n SearchBox,\r\n } from 'office-ui-fabric-react';\r\nimport { CalloutDropDown } from '../components/callouts/CalloutDropDown';\r\nimport { CalloutPersonPicker } from '../components/callouts/CalloutPersonPicker';\r\nimport { CalloutAsyncPicker } from '../components/callouts/CalloutAsyncPicker';\r\n\r\n\r\nconst calloutClassName = cx(\r\n 'ms-Callout-main',\r\n css `\r\n width: 255px;\r\n padding: 10px;\r\n background-color: var(--white);\r\n `\r\n);\r\n\r\nconst upperPartClassName = cx(\r\n css `\r\n max-height: 150px;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n `\r\n);\r\n\r\nexport class CalloutContainer extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n showCallout: false,\r\n optionFilter: '',\r\n }\r\n }\r\n\r\n renderTitle = (targerClassName) => {\r\n const { selectedField, labelField } = this.props;\r\n let selectedItems = [];\r\n if (selectedField.fieldType === 'asyncPicker') {\r\n selectedItems = selectedField.selectedItems;\r\n } else {\r\n selectedItems = selectedField.items ? selectedField.items.filter(I => I.checked): []; \r\n }\r\n if (selectedItems && selectedItems.length > 0) {\r\n const label = labelField ? (selectedItems[0].data ? selectedItems[0].data[labelField] : selectedItems[0][labelField]) : (selectedItems[0].text || selectedItems[0].name);\r\n return this._toggleVisibility()} \r\n ref={trigger => (this._trigger = trigger)}\r\n >\r\n this._toggleVisibility()}\r\n text={filtersNumber ? `Filter / ${filtersNumber}` : `Filters`}\r\n />\r\n
\r\n {this.state.visible && !disabled && (\r\n \r\n {\r\n this._toggleVisibility();\r\n if(onCancel) {\r\n onCancel();\r\n }\r\n }}\r\n setInitialFocus={true}>\r\n \r\n {children}\r\n {filtersNumber > 0 ? \r\n \r\n
\r\n )}\r\n \r\n }\r\n}","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Icon } from \"office-ui-fabric-react/lib/Icon\";\r\n\r\nimport { ModuleNames, getModuleConfig } from \"../../../../configProvider\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-RiskHeatmap-root\",\r\n css`\r\n & th.title {\r\n }\r\n & th.legend {\r\n font-weight: normal;\r\n &.legend-x div {\r\n height: 20px;\r\n }\r\n &.legend-y div {\r\n width: 20px;\r\n transform: rotate(-90deg);\r\n -webkit-transform: rotate(-90deg);\r\n -moz-transform: rotate(-90deg);\r\n -ms-transform: rotate(-90deg);\r\n -o-transform: rotate(-90deg);\r\n filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);\r\n }\r\n }\r\n\r\n & th.axis {\r\n font-weight: normal;\r\n background: var(--border-color);\r\n\r\n &.axis-x div {\r\n height: 20px;\r\n }\r\n &.axis-y div {\r\n width: 20px;\r\n }\r\n }\r\n\r\n & td.cell {\r\n width: 60px;\r\n height: 60px;\r\n margin-right: 2px;\r\n text-align: center;\r\n\r\n &.tiny {\r\n width: 25px;\r\n height: 25px;\r\n & .selected.marker {\r\n font-size: 10px;\r\n font-weight: 600;\r\n width: 20px;\r\n }\r\n }\r\n\r\n &.mini {\r\n width: 40px;\r\n height: 40px;\r\n }\r\n\r\n &.medium {\r\n width: 100px;\r\n height: 100px;\r\n\r\n & .selected.marker {\r\n font-size: 16px;\r\n font-weight: 600;\r\n }\r\n }\r\n\r\n &.large {\r\n width: 120px;\r\n height: 120px;\r\n\r\n & .selected.marker {\r\n font-size: 18px;\r\n font-weight: 600;\r\n }\r\n }\r\n\r\n &:not(.disabled) {\r\n cursor: pointer;\r\n }\r\n\r\n &.disabled {\r\n opacity: 1;\r\n }\r\n\r\n &.Minor {\r\n background: var(--green-6);\r\n &:not(.disabled):hover {\r\n background: var(--green-5);\r\n }\r\n }\r\n &.Moderate {\r\n background: var(--yellow-6);\r\n &:not(.disabled):hover {\r\n background: var(--yellow-5);\r\n }\r\n }\r\n &.Major {\r\n background: var(--orange-6);\r\n &:not(.disabled):hover {\r\n background: var(--orange-5);\r\n }\r\n }\r\n &.Critical {\r\n background: var(--red-6);\r\n &:not(.disabled):hover {\r\n background: var(--red-5);\r\n }\r\n }\r\n & .selected {\r\n font-size: 20px;\r\n color: var(--white);\r\n\r\n &.marker {\r\n font-size: 11px;\r\n background: var(--white);\r\n color: var(--text-color-dark);\r\n padding: 3px 3px;\r\n margin: 2px 0;\r\n border-radius: 12px;\r\n display: inline-block;\r\n width: 45px;\r\n }\r\n }\r\n }\r\n `\r\n);\r\n\r\nexport const RiskHeatmap = observer(\r\n class RiskHeatmap extends Component {\r\n render() {\r\n const { score, scores, title, disabled, onChange, size } = this.props;\r\n const riskModule = getModuleConfig(ModuleNames.Risks);\r\n const invert = !riskModule.invertAxis;\r\n\r\n //const { score, likelihood, impact, description } = this.props.score;\r\n const matrix = this._createMatrix(riskModule);\r\n // console.log(JSON.stringify(scores))\r\n return (\r\n \r\n \r\n \r\n {title && (\r\n
\r\n
\r\n );\r\n }\r\n\r\n _getScore(cell) {\r\n const score = cell.impact * cell.likelihood;\r\n\r\n if (score >= 8 && cell.impact >= 3) {\r\n return \"Critical\";\r\n }\r\n if (score <= 2) {\r\n return \"Minor\";\r\n }\r\n if (score <= 4 && cell.impact <= 3) {\r\n return \"Moderate\";\r\n }\r\n return \"Major\";\r\n }\r\n\r\n _createMatrix(riskModule) {\r\n const maxImpact = riskModule.maxImpact || 4;\r\n const maxLikelihood = riskModule.maxLikelihood || 4;\r\n const invert = !riskModule.invertAxis;\r\n const scoreCompute = riskModule.score || this._getScore;\r\n\r\n const maxY = invert ? maxImpact : maxLikelihood;\r\n const maxX = invert ? maxLikelihood : maxImpact;\r\n const matrix = [];\r\n\r\n for (let y = maxY; y >= 1; y--) {\r\n const inner = [];\r\n for (let x = 1; x <= maxX; x++) {\r\n const cell = {\r\n likelihood: invert ? y : x,\r\n impact: invert ? x : y,\r\n };\r\n cell.score = scoreCompute(cell);\r\n inner.push(cell);\r\n }\r\n matrix.push(inner);\r\n }\r\n\r\n return matrix;\r\n }\r\n }\r\n);\r\n","import React from 'react';\r\nimport { Dropdown as FabricDropDown } from 'office-ui-fabric-react/lib/Dropdown';\r\n\r\nconst Dropdown = (props) => {\r\n\r\n return (\r\n | \r\n {title}\r\n | \r\n|
|---|---|
| \r\n {!invert ? \"Impact\" : \"Likelihood\"} \r\n | \r\n |
| \r\n {invert ? row[0].likelihood : row[0].impact} \r\n | \r\n {row.map((cell, xi) => (\r\n |
| \r\n {matrix[0].map((cell, ci) => (\r\n | \r\n {invert ? cell.impact : cell.likelihood} \r\n | \r\n ))}\r\n
| \r\n | \r\n {invert ? \"Impact\" : \"Likelihood\"} \r\n | \r\n
\r\n \r\n \r\n {loading && \r\n {readOnly ? (\r\n selectedRegistry ? (\r\n selectedRegistry.name\r\n ) : (\r\n \"Not defined\"\r\n )\r\n ) : (\r\n true))\r\n .filter((r) => (except || []).indexOf(r.id) === -1)\r\n .map((p) => ({ key: p.id, text: p.name, data: p }))}\r\n onChange={(event, option, index, value) => {\r\n if (multiple) {\r\n if (option) {\r\n const newSelected = [...selectedRegistryIds];\r\n const index = newSelected.indexOf(option.key);\r\n if (index == -1) {\r\n newSelected.push(option.key);\r\n } else {\r\n newSelected.splice(index, 1);\r\n }\r\n pickerStore.setSelectedWithIds(newSelected);\r\n\r\n if (onChange) {\r\n onChange(registries.filter((r) => newSelected.indexOf(r.id) != -1));\r\n }\r\n }\r\n } else {\r\n pickerStore.setSelectedWithId(option ? option.key : null);\r\n if (onChange) {\r\n onChange(option ? option.data : null);\r\n }\r\n }\r\n }}\r\n />\r\n )}\r\n
\r\n );\r\n }\r\n }\r\n )\r\n);\r\n","import React, { Component } from 'react';\r\nimport { cx , css} from 'emotion';\r\nimport { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';\r\nimport { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';\r\nimport { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';\r\nimport { Label } from 'office-ui-fabric-react/lib/Label';\r\nimport { IconButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { CalloutContainer } from './CalloutContainer';\r\nimport { PrincipalPicker } from '@identity/containers/PrincipalPicker';\r\nimport { AsyncPicker} from '@baseComponents/asyncPicker/AsyncPicker';\r\nimport { BarContainer } from './BarContainer';\r\nimport { RiskHeatmap } from '@modules/risks/components/reviews/RiskHeatmap';\r\nimport { Stack } from '@ui/';\r\nimport { GroupedList } from '@ui/';\r\nimport { SelectionMode } from '@uifabric/utilities';\r\nimport { RegistryPicker } from '@modules/risks/containers/pickers/RegistryPicker';\r\n\r\nconst filterBarClassName = cx(css`\r\n .ms-FocusZone {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n }\r\n`);\r\n\r\n\r\nconst labelDivContainerClassName = cx(css`\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n\r\n & button.ms-Button--icon {\r\n margin-top: -3px;\r\n min-width: 30px;\r\n }\r\n\r\n & span.ms-Button-flexContainer {\r\n justify-content: flex-end;\r\n }\r\n\r\n & div[role=\"alertdialog\"] {\r\n min-height: 65px;\r\n }\r\n`);\r\n\r\nconst GroupedListClassName = cx(css`\r\n .ms-List[role=\"grid\"] {\r\n margin-left: 50px;\r\n }\r\n r-cell > r-grid {\r\n font-size: 14px;\r\n }\r\n i[role=\"presentation\"] {\r\n margin-left: 0px;\r\n }\r\n .ms-Button.ms-Button--icon {\r\n padding-left: 0px\r\n }\r\n .ms-Button-flexContainer {\r\n justify-content: flex-start\r\n }\r\n .ms-List[role=\"rowgroup\"] {\r\n background-color: var(--background-color);\r\n padding: 6px;\r\n }\r\n`)\r\n\r\nconst groupHeaderClassName = cx(css`\r\n cursor: pointer;\r\n display: flex;\r\n font-size: 14px;\r\n font-weight: 400;\r\n align-items: center;\r\n margin-top: 15px;\r\n :hover {\r\n background-color: var(--background-color);\r\n }\r\n\r\n div {\r\n user-select: none;\r\n }\r\n\r\n`);\r\n\r\nconst groupIconButtonClassName = cx(css`\r\n padding-left: 4px !important;\r\n button {\r\n width: 20px;\r\n }\r\n`);\r\n\r\nexport class MiniBar extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isCalloutVisible: false\r\n }\r\n this.debounceTimer = null;\r\n this.debounceTimeout = 1000;\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const selectedField = {};\r\n // console.lo`g`('componentWillReceiveProps', nextProps.fields);\r\n nextProps.fields.forEach(field => {\r\n switch (field.fieldType) {\r\n case 'dropdown':\r\n field.items = field && field.items ? field.items.map(I => { return {\r\n key: I.key,\r\n text: I.text,\r\n checked: field.selectedItems ? (field.selectedItems.map(I => I.toString().toLowerCase()).includes(I.key.toString().toLowerCase())) : I.checked\r\n }}) : []\r\n selectedField[`K-${field.fieldName}`] = field.items.filter(i=>i.checked).map(i=>i.key);\r\n // console.log(field.fieldName, selectedField[`K-${field.fieldName}`], field.items)\r\n break;\r\n }\r\n })\r\n // console.log(`componentWillReceiveProps selectedField`, selectedField);\r\n this.setState({\r\n ...selectedField\r\n })\r\n }\r\n \r\n onFiltersChange(newField) {\r\n const {onFiltersChange, fields} = this.props\r\n let selectedfields = [];\r\n //if there is new field, replace it in the fields(this comes from props) value\r\n selectedfields = fields.map(F => {\r\n if (newField && F.fieldName === newField.fieldName) {\r\n return newField\r\n } else {\r\n return F\r\n }\r\n })\r\n // console.log('onFiltersChange', fields, newField, selectedfields) \r\n // debugger\r\n if (onFiltersChange) (onFiltersChange(selectedfields))\r\n }\r\n\r\n toggleIsCalloutVisible () {\r\n this.setState({\r\n isCalloutVisible: !this.state.isCalloutVisible\r\n })\r\n }\r\n\r\n debounce(func, args) {\r\n if (this.debounceTimer) clearTimeout(this.debounceTimer)\r\n const context = this;\r\n // console.log('SETTIMEOUT', context, args)\r\n // debugger\r\n this.debounceTimer = setTimeout(() => {\r\n // console.log('CALL', context, args)\r\n func.call(context, args)\r\n }, this.debounceTimeout)\r\n }\r\n\r\n onPersonaChange = (field, elements) => {\r\n if (elements) {\r\n field.items = [];\r\n elements.forEach(E => {\r\n E.checked = true;\r\n if (!E.id) E.id = E.key;\r\n if (!field.items) field.items = [];\r\n field.items.push(E);\r\n })\r\n }\r\n this.onFiltersChange();\r\n }\r\n\r\n onItemPicked = (field, item) => {\r\n if (item) {\r\n item.checked = true;\r\n if (!item.id) item.id = item.key;\r\n if (!field.items) field.items = [];\r\n field.items.push(item);\r\n }\r\n this.onFiltersChange();\r\n }\r\n\r\n onItemsChange = (field, items) => {\r\n if (items) {\r\n field.items = items.map(I => {\r\n return {\r\n checked: true,\r\n data: I.data,\r\n id: I.key,\r\n key: I.key,\r\n name: I.name,\r\n }\r\n })\r\n } else {\r\n field.items = []\r\n }\r\n this.onFiltersChange();\r\n }\r\n\r\n getMinibarField(field) {\r\n const { disabled } = this.props;\r\n switch (field.fieldType) {\r\n case 'text':\r\n return {\r\n key: field.fieldName,\r\n text: field.fieldName,\r\n onRender: () => {\r\n return (\r\n \r\n \r\n {checkedItems && {\r\n field.items = field.items.map(F => {F.checked = false; return F});\r\n this.setState({\r\n [`K-${field.fieldName}`]: []\r\n })\r\n // console.log('FILTERS BEFORE DEBOUNCE', this.state[`K-${field.fieldName}`])\r\n // this.debounce(this.onFiltersChange)\r\n this.onFiltersChange(field)\r\n }}\r\n />}\r\n
\r\n )\r\n }}\r\n options={field.items}\r\n onChange = {(ev, element) => {\r\n // debugger\r\n field.items.find(I => I.key === element.key).checked = element.selected;\r\n this.setState({\r\n [`K-${field.fieldName}`]: field.items.filter(i=>i.checked).map(i=>i.key)\r\n })\r\n // console.log('onChange: FILTERS BEFORE DEBOUNCE', this.state[`K-${field.fieldName}`])\r\n this.debounce(this.onFiltersChange, field)\r\n // this.onFiltersChange(field)\r\n }}\r\n />\r\n );\r\n case 'asyncPicker':\r\n // console.log('field.items', field.items);\r\n // if (field.items && field.items.length > 0) {\r\n // debugger\r\n // }\r\n return \r\n this.onItemPicked(field, item)}\r\n selected={field.items || []}\r\n api={field.searchApi}\r\n idField={field.idField || 'id'}\r\n textField={field.textField || 'name'}\r\n pickedField={field.pickedField}\r\n preTextField={field.preTextField}\r\n onItemsChange={(items) => this.onItemsChange(field, items)}\r\n onClearFilter={() => { \r\n field.items = [];\r\n this.onFiltersChange();\r\n }}\r\n />\r\n
\r\n case 'group':\r\n const groupStateName = `isGroup${field.fieldName}Collapsed`;\r\n if (typeof this.state[groupStateName] === 'undefined') {\r\n this.setState({[groupStateName]:true});\r\n }\r\n return <>\r\n {\r\n this.setState({[groupStateName]:!this.state[groupStateName]});\r\n }}>\r\n
\r\n \r\n )\r\n }\r\n return null\r\n }\r\n }\r\n }\r\n />\r\n \r\n default:\r\n return null\r\n }\r\n }\r\n\r\n get items() {\r\n return [];\r\n };\r\n\r\n isFilterChanged = (field) => {\r\n if ((field.fieldType === 'text') && (field.value && field.value !== '')) {\r\n return true\r\n }\r\n if (field.fieldType === 'personPicker' && field.items && field.items.length > 0) {\r\n return true\r\n }\r\n if (field.fieldType === 'dropdown' && ( (field.selectedItems && field.selectedItems.length > 0) || ( field.items && field.items.length > 0 && field.items.filter(I => I.checked).length > 0 ) ) ) {\r\n return true\r\n }\r\n if (field.fieldType === 'asyncPicker' && field.items && field.items.length > 0) {\r\n return true\r\n }\r\n if (field.fieldType === 'registryPicker' && field.selectedItems.length > 0) {\r\n return true\r\n }\r\n }\r\n\r\n getChangedFilters = () => {\r\n const { fields, calloutFilters } = this.props;\r\n let count = 0;\r\n if (fields && calloutFilters) \r\n {\r\n calloutFilters.forEach(F => {\r\n const field = fields.find(field => field.fieldName === F);\r\n if (field.fieldType === 'group') {\r\n let groupCount = 0\r\n field.fields.forEach(groupField => {\r\n const gfield = fields.find(field => field.fieldName === groupField);\r\n if (this.isFilterChanged(gfield)) {\r\n count++;\r\n groupCount++;\r\n }\r\n })\r\n field.numberOfSelectedFields = groupCount;\r\n } else {\r\n if (this.isFilterChanged(field)) count++\r\n }\r\n })\r\n }\r\n return count\r\n }\r\n\r\n get farItems() {\r\n const { fields, onHideFilterBar, filters, calloutFilters, onClearAll, hideCloseBarButton, showOpenExtendedPanelButton, onShowExtendedPanelClick, onOpenCalloutPanel } = this.props;\r\n const items = [];\r\n\r\n if (fields && filters) {\r\n filters.forEach(F => {\r\n const element = fields.find(field => field.fieldName === F);\r\n if (element) {\r\n items.push(this.getMinibarField(element));\r\n }\r\n })\r\n }\r\n\r\n if (calloutFilters && fields) {\r\n items.push({\r\n showToGuest: true,\r\n key: 'openCalloutPanel',\r\n text: 'Open filter search',\r\n ariaLabel: 'Open filter search',\r\n onClick: this.onOpenCalloutPanel,\r\n onRender: (item) => {\r\n const filtersNumber = this.getChangedFilters();\r\n return \r\n
\r\n \r\n {props.group.name}\r\n
\r\n \r\n \r\n \r\n Available filters \r\n \r\n \r\n\r\n
\r\n\r\n {items.map((I,idx) => {\r\n return {I}
\r\n })}\r\n\r\n {/* {filters.includes('keywords') && \r\n {minibarFilters && minibarFilters.length > 0 && (\r\n 0 && !!!hideOpenPanelIcon}\r\n onShowExtendedPanelClick={() => {\r\n this.setState({ isExtendPanelOpen: true });\r\n }}\r\n />\r\n )}\r\n {panelFilters && panelFilters.length > 0 && !!!hideOpenPanelIcon && (\r\n {\r\n this.setState({ isExtendPanelOpen: false });\r\n }}\r\n filters={panelFilters}\r\n fields={fields}\r\n onFiltersChange={this.onFiltersChange}\r\n />\r\n )}\r\n
\r\n ) : null;\r\n }\r\n }\r\n )\r\n);\r\n","import React from \"react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { FilterBar } from \"@modules/base/filterBar/FilterBar\";\r\n\r\nconst taskFilterBarClassName = cx(\r\n \"cygraph-TaskFilterBar-root\",\r\n css`\r\n & .ms-FocusZone.ms-CommandBar {\r\n padding: 0;\r\n align-items: flex-start;\r\n }\r\n `\r\n);\r\n\r\nexport function TaskFilterBar({ className, query, onChange, standalone }) {\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nconst onRenderExpandedCard = (item) => {\r\n const { principal, activities } = item;\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Contact Details \r\n {principal.email && (\r\n \r\n \r\n Recent Activities (beta) \r\n {!activities || activities.length == 0 ? (\r\n \"No recent activities\"\r\n ) : (\r\n {\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport const UserHoverCard = observer(\r\n class UserHoverCard extends Component {\r\n render() {\r\n const { children, plain, principal, activities, onCardVisible } = this.props;\r\n\r\n const expandingCardProps = {\r\n onRenderCompactCard: onRenderCompactCard,\r\n onRenderExpandedCard: onRenderExpandedCard,\r\n renderData: { principal, activities },\r\n };\r\n\r\n const plainCardProps = {\r\n onRenderPlainCard: onRenderCompactCard,\r\n renderData: { principal, activities },\r\n };\r\n\r\n return (\r\n \r\n
\r\n )}\r\n {principal.userPrincipalName && (\r\n \r\n
\r\n )}\r\n \r\n
\r\n );\r\n }}\r\n />\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n {personas.map((persona, index) => (\r\n \r\n \r\n ))}\r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport moment from \"moment\";\r\nimport Moment from \"react-moment\";\r\n\r\nimport { MessageBar } from \"office-ui-fabric-react/lib/MessageBar\";\r\nimport { DetailsListLayoutMode, SelectionMode, ConstrainMode } from \"office-ui-fabric-react/lib/DetailsList\";\r\nimport { ShimmeredDetailsList } from \"office-ui-fabric-react/lib/ShimmeredDetailsList\";\r\nimport { PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { IconButton, DefaultButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { TruncatedText } from \"@modules/base/components/TruncatedText\";\r\nimport { BoxPanel } from \"@modules/base/components/BoxPanel\";\r\nimport { RoutingLink } from \"@modules/base/components/RoutingLink\";\r\nimport { WrappedContent } from \"@modules/base/components/WrappedContent\";\r\nimport { ListItemReveal } from \"@modules/base/components/ListItemReveal\";\r\nimport { UserHoverCard } from \"@modules/identity/containers/utilities/UserHoverCard\";\r\nimport { PhotoPersona } from \"@modules/identity/containers/utilities/PhotoPersona\";\r\nimport { PhotoPersonaStrip } from \"@modules/identity/containers/utilities/PhotoPersonaStrip\";\r\n\r\nimport { WorkflowContextLink } from \"@modules/workflows/components/core/WorkflowContextLink\";\r\nimport { TaskDueDateIndicator } from \"@modules/workflows/components/tasks/TaskDueDateIndicator\";\r\n\r\nexport const TaskDefinitionGridView = observer(\r\n ({ loading, tasks, canEdit, onEdit, canRespond, onRespond, displayColumns, displayContextLink }) => {\r\n const columns = [\r\n {\r\n key: \"title\",\r\n name: \"Task\",\r\n fieldName: \"title\",\r\n minWidth: 310,\r\n isRowHeader: true,\r\n isResizable: true,\r\n data: \"string\",\r\n onRender: (item) => {\r\n const canEditActual = canEdit(item);\r\n const canRespondActual = canRespond(item);\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _getVariantClassName() {\r\n const { variant } = this.props;\r\n\r\n switch(variant){\r\n case 'red':\r\n return css`\r\n background-color: var(--red);\r\n `;\r\n case 'orange':\r\n return css`\r\n background-color: var(--orange);\r\n `;\r\n case 'green':\r\n return css`\r\n background-color: var(--green);\r\n `;\r\n case 'blue':\r\n return css`\r\n background-color: var(--blue);\r\n `;\r\n case 'pink':\r\n return css`\r\n background-color: var(--pink);\r\n `;\r\n case 'yellow':\r\n return css`\r\n background-color: var(--yellow);\r\n `;\r\n case 'purple':\r\n return css`\r\n background-color: var(--purple);\r\n `;\r\n default:\r\n return css`\r\n background-color: var(--grey);\r\n `;\r\n }\r\n }\r\n }\r\n);\r\n\r\n","import React, { Component, Fragment } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\n\r\nimport Moment from 'react-moment';\r\n\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { MessageBar } from 'office-ui-fabric-react/lib/MessageBar';\r\nimport { IconButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { DetailsListLayoutMode, Selection, SelectionMode, ConstrainMode } from 'office-ui-fabric-react/lib/DetailsList';\r\nimport { ShimmeredDetailsList } from 'office-ui-fabric-react/lib/ShimmeredDetailsList';\r\nimport { ContextualMenu } from 'office-ui-fabric-react/lib/ContextualMenu';\r\n\r\nimport { BoxPanel } from '../../base/components/BoxPanel';\r\nimport { RoutingLink } from '../../base/components/RoutingLink';\r\nimport { WrappedContent } from '../../base/components/WrappedContent';\r\nimport { StatusBadge } from '../../base/components/StatusBadge';\r\n\r\nexport const SystemGridView = observer(\r\n class SystemGridView extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {};\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n selectionDetails: this._getSelectionDetails()\r\n });\r\n }\r\n });\r\n\r\n this._columns = [\r\n {\r\n key: 'name',\r\n name: 'Name',\r\n fieldName: 'name',\r\n minWidth: 310,\r\n isRowHeader: true,\r\n isResizable: true,\r\n onColumnClick: this._onColumnClick,\r\n data: 'string',\r\n onRender: (item) => {\r\n return (\r\n { children }
\r\n \r\n
\r\n
\r\n );\r\n },\r\n isPadded: true\r\n },\r\n {\r\n key: 'detailsUrl',\r\n name: 'URL',\r\n fieldName: 'detailsUrl',\r\n minWidth: 40,\r\n maxWidth: 40,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: 'string',\r\n onRender: (item) => {\r\n return (item.detailsUrl && {item.pattern.name}
\r\nv{item.pattern.version}
\r\n\r\n Asset \r\n {system ? system.name : ''} \r\n
\r\n );\r\n }\r\n }\r\n);","import React from \"react\";\r\nimport { cx } from \"emotion\";\r\n\r\nexport const Sidebar = ({ className, children, detached, float, variant, transparent, dataTest }) => {\r\n return detached ? (\r\n \r\n
\r\n ) : (\r\n {children}
\r\n {children}
\r\n \r\n );\r\n};\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\n\r\nexport const SidebarProperties = observer(\r\n class SidebarProperties extends Component {\r\n render () {\r\n const { title, icon, open, properties, children, dataTest } = this.props\r\n return (\r\n \r\n \r\n { icon &&
\r\n
\r\n );\r\n }\r\n }\r\n);","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport * as moment from \"moment\";\r\n\r\nimport { Persona, PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\nimport { Link } from \"office-ui-fabric-react/lib/Link\";\r\n\r\nimport { TooltipHost } from \"@ui/elements/Tooltip\";\r\n\r\nimport { RoutingLink } from \"@modules/base/components/RoutingLink\";\r\nimport { PhotoPersona } from \"@modules/identity/containers/utilities/PhotoPersona\";\r\n\r\nexport const SidebarProperty = observer(\r\n class SidebarProperty extends Component {\r\n render() {\r\n const { label, tooltip } = this.props;\r\n return (\r\n \r\n { icon &&
\r\n \r\n {\r\n properties && Object.entries(properties).map(([key, value]) => {\r\n return (\r\n
\r\n \r\n \r\n
\r\n );\r\n })\r\n }\r\n { children }\r\n { value }
\r\n \r\n {label && }\r\n {tooltip ? (\r\n
\r\n );\r\n }\r\n\r\n _getValueFormatted() {\r\n const { value, type, url } = this.props;\r\n\r\n if (!value) {\r\n return \"Not Set\";\r\n }\r\n\r\n switch (type || \"string\") {\r\n case \"string\":\r\n return url ? \r\n {this._getValueFormatted()} \r\n
\r\n ) : (\r\n {this._getValueFormatted()}
\r\n )}\r\n {system ? system.summary : ''}
\r\n Assessment StatusUp-to-date
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n Next assessment date: February 12th 2020
\r\n Total assessments: 1
\r\n Advisories
\r\n \r\n
\r\n 2
\r\n Open
\r\n \r\n
\r\n 4
\r\n In Progress
\r\n \r\n
\r\n 10
\r\n Closed
\r\n \r\n { item.target.type &&
{item.patternVersion.name}
\r\nv{item.patternVersion.version}
\r\n{name}
\r\n {item.finalCompliance || 'Pending'}
\r\n \r\n
\r\n );\r\n }\r\n\r\n _onLinkClick = (item) => {\r\n if(item && item.url) {\r\n this.props.routing.push(item.url);\r\n }\r\n };\r\n }\r\n)));","export const WellKnownFieldNames = {\r\n Id: \"id\",\r\n Name: \"name\",\r\n StaticName: \"staticName\",\r\n Created: \"created\",\r\n CreatedBy: \"createdBy\",\r\n Modified: \"modified\",\r\n ModifiedBy: \"modifiedBy\",\r\n Page: \"page\",\r\n Code: \"code\",\r\n Portfolio: \"portfolio\",\r\n};\r\n\r\nexport const WellKnownSectionIds = {\r\n AssetBuiltIn: \"eaeac16c-b9f5-4049-9aca-0ccc91985915\",\r\n EntityBuiltIn: \"e44bcc55-40e3-4eec-b07e-0424fa85ff16\",\r\n};\r\n\r\nexport const PropertyTypes = {\r\n /// \r\n\r\n settingsStore.setKeywords(null)}\r\n onChange={(e, newValue) => settingsStore.setKeywords(newValue)} />\r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n Property Settings \r\n\r\n {formData.type == PropertyTypes.Lookup && (\r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\nimport { withRouter } from 'react-router';\r\n\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { PrimaryButton, DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';\r\n\r\nimport { ObservablePanel } from '../../../base/components/ObservablePanel';\r\n\r\nimport { PropertyEditForm } from '../../components/core/PropertyEditForm';\r\n\r\nexport const PropertyNewPanel = inject('propertyStore')(withRouter(observer(\r\n class PropertyNewPanel extends Component {\r\n \r\n render () {\r\n const store = this.props.propertyStore.newStore;\r\n const { visible, formData, formOptions, isValid } = store;\r\n \r\n return (\r\n \r\n (formData.name = value)}\r\n />\r\n
\r\n \r\n (formData.description = value)}\r\n />\r\n
\r\n \r\n ({\r\n key: section.id,\r\n text: section.name,\r\n }))}\r\n onChange={(ev, item) => (formData.section = { id: item.key })}\r\n selectedKey={formData.section ? formData.section.id : null}\r\n useComboBoxAsMenuWidth\r\n />\r\n
\r\n \r\n (formData.order = value)}\r\n />\r\n
\r\n \r\n ({\r\n key: key,\r\n text: PropertyTypes[key],\r\n }))}\r\n onChange={(ev, item) => {\r\n if (formData.type !== item.key) {\r\n formData.schema = {};\r\n }\r\n formData.type = item.key;\r\n }}\r\n selectedKey={formData.type}\r\n useComboBoxAsMenuWidth\r\n />\r\n
\r\n \r\n ({ key: key, text: EntityTypes[key] }))}\r\n onChange={(ev, item) => {\r\n formData.schema.entity = item.key;\r\n }}\r\n selectedKey={formData.schema.entity}\r\n useComboBoxAsMenuWidth\r\n />\r\n
\r\n )}\r\n\r\n {formData.type == PropertyTypes.Number && (\r\n \r\n \r\n \r\n {\r\n if (!value) {\r\n formData.schema.decimalPlaces = null;\r\n } else {\r\n formData.schema.decimalPlaces = parseInt(value);\r\n }\r\n }}\r\n />\r\n \r\n \r\n {\r\n if (!value) {\r\n formData.schema.default = null;\r\n } else if (formData.schema.decimalPlaces === 0) {\r\n formData.schema.default = parseInt(value);\r\n } else {\r\n formData.schema.default = parseFloat(value);\r\n }\r\n }}\r\n />\r\n \r\n \r\n {\r\n if (!value) {\r\n formData.schema.min = null;\r\n } else if (formData.schema.decimalPlaces === 0) {\r\n formData.schema.min = parseInt(value);\r\n } else {\r\n formData.schema.min = parseFloat(value);\r\n }\r\n }}\r\n />\r\n \r\n \r\n {\r\n if (!value) {\r\n formData.schema.max = null;\r\n } else if (formData.schema.decimalPlaces === 0) {\r\n formData.schema.max = parseInt(value);\r\n } else {\r\n formData.schema.max = parseFloat(value);\r\n }\r\n }}\r\n />\r\n \r\n \r\n
\r\n )}\r\n\r\n {formData.type == PropertyTypes.Choice && (\r\n <>\r\n \r\n (formData.schema.options = value.split(\"\\n\"))}\r\n />\r\n
\r\n \r\n (formData.schema.default = value)}\r\n />\r\n
\r\n \r\n )}\r\n\r\n {formData.type == PropertyTypes.Text && (\r\n <>\r\n \r\n \r\n \r\n {\r\n formData.schema.richText = checked;\r\n if (checked) {\r\n formData.schema.maxLength = null;\r\n }\r\n }}\r\n />\r\n \r\n \r\n {\r\n if (!value) {\r\n formData.schema.maxLength = null;\r\n } else {\r\n formData.schema.maxLength = parseInt(value);\r\n }\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n
\r\n \r\n )}\r\n\r\n {formData.type == PropertyTypes.Date && (\r\n \r\n (formData.schema.default = value)}\r\n />\r\n
\r\n \r\n (formData.schema.default = value)}\r\n />\r\n
\r\n )}\r\n\r\n {formData.type == PropertyTypes.Boolean && (\r\n \r\n (formData.schema.default = checked)}\r\n />\r\n
\r\n )}\r\n\r\n \r\n (formData.required = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.readOnly = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.multiValue = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.hidden = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.searchable = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.active = checked)}\r\n />\r\n
\r\n\r\n \r\n (formData.default = checked)}\r\n />\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\nimport { withRouter } from 'react-router';\r\n\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { PrimaryButton, DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';\r\n\r\nimport { ObservablePanel } from '../../../base/components/ObservablePanel';\r\n\r\nimport { PropertySectionEditForm } from '../../components/sections/PropertySectionEditForm';\r\n\r\nexport const PropertySectionNewPanel = inject('propertyStore')(withRouter(observer(\r\n class PropertySectionNewPanel extends Component {\r\n \r\n render () {\r\n const store = this.props.propertyStore.sectionNewStore;\r\n const { visible, formData, formOptions, isValid } = store;\r\n \r\n return (\r\n \r\n (formData.name = value)}\r\n />\r\n
\r\n \r\n (formData.order = value)}\r\n />\r\n
\r\n \r\n
\r\n
\r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component, Fragment } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\n\r\nimport { ComingSoon } from '@baseComponents/ComingSoon';\r\nimport { BoxPanel } from '@baseComponents/BoxPanel';\r\n\r\nexport const AssetWorkflowsTab = inject('assetStore', 'routing')(observer(\r\n class AssetWorkflowsTab extends Component {\r\n\r\n componentWillMount() {\r\n const { assetStore, routing } = this.props;\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { assetStore, routing } = nextProps;\r\n }\r\n \r\n render () {\r\n const { assetStore, routing } = this.props;\r\n\r\n return (\r\n \r\n ![\"Coming](\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2ODMuODA5IiBoZWlnaHQ9IjY5Mi40OCIgdmlld0JveD0iMCAwIDY4My44MDkgNjkyLjQ4Ij48ZGVmcz48c3R5bGU+LmF7b3BhY2l0eTowLjA1O30uYiwuYywuZHtmaWxsOiM3ZDUyOTk7fS5iLC5ze29wYWNpdHk6MC41O30uZHtvcGFjaXR5OjAuNzt9LmUsLmd7ZmlsbDojYTY2ZGNjO30uZXtvcGFjaXR5OjAuMjE7fS5me29wYWNpdHk6MC40O30uaCwuaywudHtmaWxsOm5vbmU7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fS5oLC5re3N0cm9rZTojMDcyNzMzO3N0cm9rZS1saW5lY2FwOnJvdW5kO30uaHtzdHJva2Utd2lkdGg6NS44cHg7fS5pe29wYWNpdHk6MC41NDt9LmosLnB7ZmlsbDojZjg5ODVmO30ua3tzdHJva2Utd2lkdGg6Mi41NzhweDt9LmwsLm0sLm57ZmlsbDojZmY4NzdkO30ubXtvcGFjaXR5OjAuMjt9Lm4sLnB7b3BhY2l0eTowLjM7fS5hYSwubywueHtmaWxsOiMzMzk1OWY7fS5xe2ZpbGw6IzBjMWQyNTt9LnIsLnMsLncsLnl7ZmlsbDojZmZjOTM3O30udHtzdHJva2U6I2JmOTcyOTtzdHJva2Utd2lkdGg6MS4yODlweDt9LnV7ZmlsbDojYmY5NzI5O30udntmaWxsOiM4MTNlYzE7fS52LC56e29wYWNpdHk6MC42Mzt9Lnd7b3BhY2l0eTowLjQ5O30ueHtvcGFjaXR5OjAuMTk7fS55e29wYWNpdHk6MC41Mzt9Lnp7ZmlsbDojYTQ1YmRkO30uYWF7b3BhY2l0eTowLjE4O308L3N0eWxlPjwvZGVmcz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTM5Ljk5NSAtOTcuMDYxKSI+PGcgY2xhc3M9ImEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDkzOS45OTUgMTAzLjIxNSkiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1MjAuNDAyIDk0LjUxNykgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDI0LjM3OCA5NC41MTcpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImIiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyOC4zNTQgOTQuNTE3KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJjIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODEuNzgxIDQ1LjI3Mikgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTcyLjcwNCAxNDMuNzYzKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0NzcuODA1IDE0My43NjMpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImIiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM4MS43ODEgMTQzLjc2Mykgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjg1Ljc1OCAxNDMuNzYzKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJjIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1NjkuODk4IDI0Mi4yNTQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImQiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ3NC45OTkgMjQyLjI1NCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzc4Ljk3NSAyNDIuMjU0KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyODIuOTUyIDI0Mi4yNTQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDUyNy4zMDIgMTkzLjAwOCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDMyLjQwMiAxOTMuMDA4KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJjIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMzYuMzc4IDE5My4wMDgpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImQiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI0MC4zNTUgMTkzLjAwOCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTI3LjMwMiAyOTEuNDk5KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MzIuNDAyIDI5MS40OTkpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMzNi4zNzggMjkxLjQ5OSkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQwLjM1NSAyOTEuNDk5KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1MjUuMzAzIDM5MS45MDkpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQyOS4yNzkgMzkxLjkwOSkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzMzLjI1NiAzOTEuOTA5KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJjIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1NzcuNjA2IDM0Mi42NjMpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImQiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ4Mi43MDYgMzQyLjY2Mykgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzg2LjY4MiAzNDIuNjYzKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOTAuNjU5IDM0Mi42NjMpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImQiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5My4zMTggMzQyLjY2Mykgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTU4LjMzNCA0OTEuMjkxKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMDQuMzc0IDU0MS41NjQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImIiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5My4zMTggNDQxLjAxOCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iZCIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjMyLjMzMSA5NC41MTcpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzNi4zMDcgOTQuNTE3KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJkIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxODguNDYzIDE0My40MDMpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDkyLjQzOSAxODYuNTQxKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJkIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxODQuNjA3IDI0Mi4yNTQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDU3Ny42MDYgNDQxLjE1NCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDgyLjcwNiA0NDEuMTU0KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODYuNjgyIDQ0MS4xNTQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5MC42NTkgNDQxLjE1NCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjgzLjgwOSA1NDEuNTY0KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2NDEuMjEyIDQ5Mi4zMTgpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDU4Ny4zNDQgNTQxLjU2NCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iZCIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDkyLjQ0NSA1NDEuNTY0KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzOTYuNDIxIDU0MS41NjQpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImIiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwMC4zOTcgNTQxLjU2NCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTQ0Ljc0NyA0OTIuMzE4KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0NDkuODQ4IDQ5Mi4zMTgpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM1My44MjQgNDkyLjMxOCkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjU3LjgwMSA0OTIuMzE4KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0NDkuODQ4IDU5MC44MDkpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImMiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM1My44MjQgNTkwLjgwOSkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iZCIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjU3LjgwMSA1OTAuODA5KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMDQuMzc0IDYzNy4wODEpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImQiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ5Mi40NDUgNjM3LjA4MSkgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYiIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzk2LjQyMSA2MzcuMDgxKSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJiIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMDAuMzk3IDYzNy4wODEpIHJvdGF0ZSgxODApIi8+PHJlY3QgY2xhc3M9ImIiIHdpZHRoPSI5Mi40MzkiIGhlaWdodD0iNDUuMjcyIiByeD0iMi4zMDkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ0OS44NDggNjg2LjMyNikgcm90YXRlKDE4MCkiLz48cmVjdCBjbGFzcz0iYyIgd2lkdGg9IjkyLjQzOSIgaGVpZ2h0PSI0NS4yNzIiIHJ4PSIyLjMwOSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzUzLjgyNCA2ODYuMzI2KSByb3RhdGUoMTgwKSIvPjxyZWN0IGNsYXNzPSJkIiB3aWR0aD0iOTIuNDM5IiBoZWlnaHQ9IjQ1LjI3MiIgcng9IjIuMzA5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNTcuODAxIDY4Ni4zMjYpIHJvdGF0ZSgxODApIi8+PC9nPjwvZz48ZWxsaXBzZSBjbGFzcz0iZSIgY3g9IjI0Mi45MTYiIGN5PSIxMi42MTUiIHJ4PSIyNDIuOTE2IiByeT0iMTIuNjE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5ODkuNTA1IDc2Mi42NjEpIi8+PGcgY2xhc3M9ImYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDk5OS4xNjcgOTcuMDYxKSI+PHBhdGggY2xhc3M9ImciIGQ9Ik0xMTAzLjYxOCwyNzkuNjkxYzIyLjg3OS0yMC45NzksMzQuMjEtNjEuNzg2LDU3LjU1NC04MS45MjEsNy4wNzItNi4xLDcuMTcyLTI3LjI4OCwyMC44MTQtMjIuOTIzcS0yLjUsNC4wMTktNS4wMDcsOC4wMzljMTEuMTk1LTIuMiwxMC4wMTgtMTYuMDg1LDE3LjA4OC0yMi4xODMsNC4xMjUsMy44OTMsNi4xODQsNS44MzcsOS45Miw1LjEtMy4zNDIsNS4zNjItMTAuNDEzLDExLjQ1OC0xMS42OTIsMTguNzcybDYuMTc3LDUuODNjNS40MDgtMy40MTcsNi4yOTUtMTUuMzUxLDExLjY5LTE4Ljc3Mmw4LjI1LDcuNzg2YzIuMDU4LDEuOTQzLDMuNzI4LS43NCw1LjQtMy40MTktMS42NjksMi42NzktNS4wMTEsOC4wNDYtNi42NzksMTAuNzI1bDguMjQsNy43NzhjMi4wNjcsMS45NSwzLjczNC0uNzI5LDUuNDA2LTMuNDEzLDQuMTIxLDMuODg5LDkuOTE0LDUuMSwxMC4zLDkuNzI0cS0yLjUwOCw0LjAyOC01LjAxMSw4LjA0NmM4Ljc0NC04Ljc4MSwyMi4zODctNC40MiwyOC41NzEsMS40MTctMy43MzcuNzM4LDIuNDUxLDYuNTc2LTEuMjgxLDcuMzA4LDExLjE5MS0yLjIwNywyNC40NDQtMi40NzIsMTkuODIzLDEwLjE5NC01Mi4yNTUsOTkuNjg4LTEyMC42MTEsMTg4LjQzOC0xODMuMTc2LDI3OC40LTUuNCwzLjQxNS03Ljg0OS0zLjE2Mi0xMS45NzItNy4wNTMsNi42NzUtMTAuNzE4LDE1LjQxOC0xOS41LDE2LjMtMzEuNDMyLDEuNjctMi42ODEtOS45MS01LjEwNS0xMi4zNzEtMTEuNjc4LDEuNjctMi42ODMsNS4wMDktOC4wNDYsNi42ODEtMTAuNzMxLTQuNTEtOC41MDktMTQuMDMxLTguOTgtMTguNTQ1LTE3LjVzNi4yOS0xNS4zNDUsMy44MzUtMjEuOTE5Yy45LTExLjkzOS05LjUxOS0uNDctMTQuNTI4LDcuNTczLTIuNDU0LTYuNTctMy4zMzksNS4zNjQtNy40NjMsMS40NzMtOC4yNDItNy43OC0xNi40OS0xNS41NjUtMTUuOTkxLTMyLjEyNC0uMzkzLTQuNjI5LTguMjQ0LTcuNzgyLTEyLjM2NS0xMS42NzFDMTA1My42MjksMzM4Ljk0LDEwNzUuMzM3LDMwNC4wODEsMTEwMy42MTgsMjc5LjY5MVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04OTcuMTY5IC0yNy43MDUpIi8+PHBhdGggY2xhc3M9ImciIGQ9Ik05NjkuNTg5LDUyNi4xNTljMjcuMTIzLTQyLjIxMSw1Ny4zLTgzLjM0Niw4Ny44ODktMTIzLjk0NiwyLjI0NC0zLjc5Myw0LjYzNS03LjUyMSw0LjU4OS05LjY0MiwzLjY4LTEwLjEtNi43MTksNC4wMDYtMTIuMzYxLDEyLjg0Mi0uMDkyLTQuMi0zLjc2Miw1Ljg5My01LjczNCw0LjYzMy0yLjA4OC0xLjMzMy00LjE2NS0yLjY4My00Ljk4OC01LjY3NmE2LjY3LDYuNjcsMCwwLDEtMS41OTUuMzA1cS42NDktLjkyMiwxLjMtMS44NDNhMTMuNzQyLDEzLjc0MiwwLDAsMS0uMDcxLTEuODU0Yy00LjUxLDQuMDIzLTYuMDE2LDEwLjE3MS0xMC4yMTksMTQuNDEzLTEuOTEyLTEuMzUtMi44NjctMi4wMjMtNS4xNjYtLjgsMi42NzktMy44LDcuNjUzLTguODE3LDkuMzc1LTEzLjI5MWwtMi44NjMtMi4wMjFjLTMuNjM5LDMuMTI0LTUuNzQzLDEwLjE2Ny05LjM3NywxMy4yOTEtLjk1Ny0uNjc1LTIuODY5LTIuMDIzLTMuODI0LTIuN3MtMi4yOTQsMS4yMjUtMy42MzIsMy4xMjJsNS4zNTQtNy41OTQtMy44MjItMi43Yy0uOTU3LS42NzUtMi4yOTUsMS4yMjMtMy42MzYsMy4xMjItMS45MS0xLjM0OC01LjE2MS0uOC00Ljc3Ny0zLjM2OWw0LjAxOS01LjdjLTYuMzE1LDYuOTE5LTEzLjc3Miw3LjM0OC0xNi42MzksNS4zMjUsMi4zLTEuMjI3LS41NzItMy4yNSwxLjcyNC00LjQ3Mi02Ljg4NiwzLjY3Mi0xNC43MjcsNi42NzEtMTAuMzIzLTEuNTk1LDQzLjk5NC02OC40NjcsOTYuMDI1LTEzNC4xMTMsMTQ0LjgtMTk5LjIwOSwzLjYzNi0zLjEyMiw0LjIuMTMsNi4xMTcsMS40NzctNS4zNTQsNy41ODgtMTEuNjY3LDE0LjUwOS0xMy43NzEsMjEuNTUyLTEuMzM5LDEuOSw1LjE2LjgsNS43MzksNC4wNDZsLTUuMzYsNy42YzEuNTI3LDMuOTE4LDcuMDc0LDIuMTQyLDguNiw2LjA2N3MtNS43MzgsMTAuMTYzLTUuMTY2LDEzLjQxYy0xLjExOCwzLjczMi41MTIsMywyLjg4LjY0OCwxMy43NTUtMjEuNzg4LDI3LjAwOC00NS4yMzEsNDEuOC02My41NDYsNi42MzEtOC4yMTEsMTIuMDg5LTI1LjQ1NSwyMC43NzktMjguMnEtMi44MTgsNC40MTctNS42NCw4LjgzNmM4LjYtNi45NDQsMTEuMjg1LTE3LjY3NSwxNy45MTMtMjUuODgsMS45NzMsMS4yNTgsMi45NTcsMS44ODcsNS44MjktLjQzMy0zLjc2NCw1LjktMTAuMzkyLDE0LjEtMTMuMTcsMjAuNjI2bDIuOTU1LDEuODg3YzQuNzUyLTUuMjY0LDguNDIyLTE1LjM2LDEzLjE3LTIwLjYyNi45ODkuNjMxLDIuOTU5LDEuODkxLDMuOTQ2LDIuNTJzMi44NjctMi4zMTgsNC43NDYtNS4yNmwtNy41MjMsMTEuNzgyYy45ODQuNjI5LDIuOTU3LDEuODg5LDMuOTQyLDIuNTE2czIuODY3LTIuMzExLDQuNzUyLTUuMjYyYzEuOTcsMS4yNiw1LjgyNC0uNDI4LDQuOTI4LDMuMTQ3cS0yLjgyOCw0LjQyNi01LjY0NSw4Ljg0YzUuMDA3LTYuNTY0LDEwLjA2OS0xMC4yLDE0LTExLjcwOSw1LjQtOC44MTcsMTAuOTUyLTE3LjMzMywxNy4yOTMtMjQuMzUyLDQuNzM4LTUuMjQ1LDcuMDQzLTE3LjU1MiwxNC40NzItMTguMzE5bC0zLjc0OSw1Ljg3YzYuNzA4LTMuOTgxLDcuNS0xMS43NDQsMTIuMjM2LTE2Ljk4OCwxLjk3MywxLjI1OCwyLjk1OSwxLjg4Nyw1LjIuNTU4LTIuNSwzLjkxNi03LjIzOSw5LjE1OS04Ljc1NCwxMy43MDlsMi45NTUsMS44ODVjMy40OTItMy4yODcsNS4yNjgtMTAuNDIsOC43NTQtMTMuNzA3bDMuOTQ2LDIuNTE4Yy45ODQuNjI5LDIuMjM2LTEuMzI5LDMuNDg2LTMuMjg1LTEuMjUsMS45NTYtMy43NTEsNS44NzQtNSw3LjgzMmwzLjk0MSwyLjUxNmMuOTg4LjYzMSwyLjIzOC0xLjMyNSwzLjQ5LTMuMjg1LDEuOTcxLDEuMjU4LDUuMTkzLjU1OCw0LjkyOCwzLjE0NXEtMS44NzgsMi45NDMtMy43NTEsNS44NzZjNS45ODctNy4yLDEzLjQxNi03Ljk3MiwxNi4zNzUtNi4wODUtMi4yNCwxLjMzMS43MTksMy4yMi0xLjUxNyw0LjU0Nyw2LjcwOC0zLjk4NSwxNC40LTcuMzQzLDEwLjM4NiwxLjExNi00MC44LDcwLjQyMS04OS43NTEsMTM4LjM5LTEzNS40ODIsMjA1LjY2Mi0zLjQ4OCwzLjI4Ny00LjIuMDY1LTYuMTc3LTEuMTkzLDUtNy44MjgsMTAuOTg2LTE1LjAzLDEyLjc2NC0yMi4xNjIsMS4yNTItMS45Ni01LjE5MS0uNTY0LTUuOTE4LTMuNzgsMS4yNTItMS45NTgsMy43NTEtNS44NzQsNS03LjgzNS0xLjcwNS0zLjg0My03LjE2NC0xLjgxNC04Ljg3MS01LjY2NXM1LjI2Ni0xMC40MTUsNC41NDUtMTMuNjM0YzEuNzgyLTcuMTM3LTUuNDU5LDIuMDI5LTkuMjA4LDcuOS0uMDA4LS4wMzYtLjAxOS0uMDUyLS4wMjUtLjA4Ni0yMC4zLDMxLjE1NC00MC45Nyw2Mi4xNjYtNjEuNjU4LDkzLjAzNmEzLjg4MSwzLjg4MSwwLDAsMSwuNjMxLDEuMDQxYzEuNTMsMy45MTgtNS43MzksMTAuMTYzLTUuMTY2LDEzLjQxLTIuMTExLDcuMDQ3LDUuNTQ0LTEuNzc2LDkuNTYxLTcuNDcxLjU3NSwzLjI0NSwyLjY3OS0zLjgsNC41OTEtMi40NDcsMy44MjIsMi43LDcuNjQ5LDUuMzk0LDUuMTU4LDE1LjAwNy0uMzgyLDIuNTc1LDMuODI0LDIuNyw1LjczNiw0LjA0Ni0xNi4wNjgsMjIuNzgxLTMzLjQ3OCw0Ny40NjEtNTMuMzY4LDY3LjU0MS0xNi4yNTYsMTYuOTYxLTI4LjM0MSw0Mi44MjYtNDQuNzYxLDU5LjQtNC45NzQsNS4wMjItNy44NDMsMTcuMjA5LTE1LjMsMTcuNjMzcTIuMDA2LTIuODQ2LDQuMDE3LTUuNjkzYy02Ljg4NiwzLjY2OC04LjAzMywxMS4zODktMTMuMDA3LDE2LjQwOS0xLjkxMi0xLjM1LTIuODY3LTIuMDIzLTUuMTY2LS44LDIuNjc5LTMuOCw3LjY1My04LjgxNyw5LjM3NS0xMy4yOTFsLTIuODYzLTIuMDIxYy0zLjYzOCwzLjEyNC01Ljc0MywxMC4xNjctOS4zNzcsMTMuMjkxLS45NTctLjY3NS0yLjg2OS0yLjAyMy0zLjgyNC0yLjdzLTIuMjk1LDEuMjI1LTMuNjMyLDMuMTIybDUuMzU0LTcuNTk0LTMuODItMi43Yy0uOTU5LS42NzUtMi4zLDEuMjIyLTMuNjM4LDMuMTIyLTEuOTEtMS4zNDgtNS4xNjItLjgtNC43NzctMy4zNzFxMi4wMTMtMi44NDksNC4wMTktNS42OTVjLTYuMzE1LDYuOTE5LTEzLjc3Miw3LjM0OC0xNi42MzksNS4zMjMsMi4zLTEuMjI1LS41Ny0zLjI0NywxLjcyNC00LjQ3Qzk3My4wMjYsNTMxLjQyNSw5NjUuMTg1LDUzNC40MjQsOTY5LjU4OSw1MjYuMTU5WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTk2OC4zMSAtOTcuMDYxKSIvPjwvZz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDEwLjUzOSAxMjUuODUyKSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUxLjk0OCAyNjUuNzM2KSI+PGxpbmUgY2xhc3M9ImgiIHgyPSIxNTAuMjM3IiB5Mj0iMzgyLjMzNyIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTUwLjIzNyIgeTI9IjM4Mi4zMzciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzMy44OTIpIi8+PGxpbmUgY2xhc3M9ImgiIHgyPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNi4wNTUgNjYuMzA3KSIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTEuMTY3IDEzMC4xNykiLz48bGluZSBjbGFzcz0iaCIgeDI9IjEzNy4zODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDc2Ljc1NSAxOTEuMTY4KSIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTYuMDk2IDI0Ny42NjEpIi8+PGxpbmUgY2xhc3M9ImgiIHgyPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTguMTMgMzA0LjE1NCkiLz48ZyBjbGFzcz0iaSI+PGxpbmUgY2xhc3M9ImgiIHgyPSIxNTAuMjM3IiB5Mj0iMzgyLjMzNyIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTUwLjIzNyIgeTI9IjM4Mi4zMzciIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzMy44OTIpIi8+PGxpbmUgY2xhc3M9ImgiIHgyPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNi4wNTUgNjYuMzA3KSIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTEuMTY3IDEzMC4xNykiLz48bGluZSBjbGFzcz0iaCIgeDI9IjEzNy4zODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDc2Ljc1NSAxOTEuMTY4KSIvPjxsaW5lIGNsYXNzPSJoIiB4Mj0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTYuMDk2IDI0Ny42NjEpIi8+PGxpbmUgY2xhc3M9ImgiIHgyPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTguMTMgMzA0LjE1NCkiLz48L2c+PC9nPjxwYXRoIGNsYXNzPSJqIiBkPSJNMTA3NS40MTMsMTgxLjk4Yy0yMS40NDEsNC4wNjctMzMuNzIzLTIwLjM2OS0zMy43MjMtMjAuMzY5bC04LjUzNSwxMS4wMzYsMi40MTgsNy43ODZhMjYuNDY2LDI2LjQ2NiwwLDAsMCwxMy4wOCw4LjI4OGM2LjMzOCw1Ljk5Myw0LjAzMywxNi43ODUsNC4wMzMsMTYuNzg1czE0LjgzNS0yLjA3MywyMS4yNy00LjAyMWwxLjM1NC00LjYxNmMtMi45MjQtMi4wMTUtNS4zMjEtNC4xNTktNS4yNzktOS45QTE5LjE1NywxOS4xNTcsMCwwLDAsMTA3NS40MTMsMTgxLjk4WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwOS4wMTYgLTU1LjUwNykiLz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDI2NS43MzYpIj48bGluZSBjbGFzcz0iaCIgeDE9IjE1MC4yMzciIHkyPSIzODIuMzM3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMzMuODkyKSIvPjxsaW5lIGNsYXNzPSJoIiB4MT0iMTUwLjIzNyIgeTI9IjM4Mi4zMzciLz48bGluZSBjbGFzcz0iayIgeDE9IjE1MC4yMzciIHkyPSIzODIuMzM3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjA5OCkiLz48bGluZSBjbGFzcz0iaCIgeDE9IjEzNy4zODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyMC42ODUgNjYuMzA3KSIvPjxsaW5lIGNsYXNzPSJoIiB4MT0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTUuNTc0IDEzMC4xNykiLz48bGluZSBjbGFzcz0iaCIgeDE9IjEzNy4zODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDY5Ljk4NSAxOTEuMTY4KSIvPjxsaW5lIGNsYXNzPSJoIiB4MT0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTAuNjQ1IDI0Ny42NjEpIi8+PGxpbmUgY2xhc3M9ImgiIHgxPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOC42MSAzMDQuMTU0KSIvPjxsaW5lIGNsYXNzPSJrIiB4MT0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjUuOTE3IDMwNi44NDgpIi8+PGxpbmUgY2xhc3M9ImsiIHgxPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0Ny4xNjYgMjUwLjM1NSkiLz48bGluZSBjbGFzcz0iayIgeDE9IjEzNy4zODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDY4LjMzMSAxOTQuODI0KSIvPjxsaW5lIGNsYXNzPSJrIiB4MT0iMTM3LjM4OCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOTMuMjA3IDEzMi44NDEpIi8+PGxpbmUgY2xhc3M9ImsiIHgxPSIxMzcuMzg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTkuMzM5IDcwLjQ1MikiLz48L2c+PHBhdGggY2xhc3M9ImwiIGQ9Ik0xMDg3LjUsMjU0LjI2NSwxMDc0LjQ3OCwzMjQuM3MtMjAuMiw5NS4zMDYtMjAuMiwxMDIuNDg4LDIyLDE2LjQ3NiwyMS4xLDIwLjUxNS0zNS45MTMtMi4yNDQtMzkuNS00LjA0LDMuMjc5LTEyLjk3NSwzLjI3OS0xOC4zNjMtOC4yMTctNTAuNzcxLTYuNDItNjkuNjI3YzEuMzI3LTEzLjk0NSw2LjU4NS0yNy44OSw5LjIzMy0zNC4yMDdhMTUuMDU3LDE1LjA1NywwLDAsMCwxLjA3LTcuNTA4Yy0xLjc1NS0xNS42OS03LjMyMy03Mi45NTYsMi43MTQtOTAuNzE1QzEwNTcuNDE5LDIwMi4xOTIsMTA4Ny41LDI1NC4yNjUsMTA4Ny41LDI1NC4yNjVaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTA5Ljc2MSA1Ljk0MikiLz48cGF0aCBjbGFzcz0ibSIgZD0iTTEwODcuNSwyNTQuMjY1LDEwNzQuNDc4LDMyNC4zcy0yMC4yLDk1LjMwNi0yMC4yLDEwMi40ODgsMjIsMTYuNDc2LDIxLjEsMjAuNTE1LTM1LjkxMy0yLjI0NC0zOS41LTQuMDQsMy4yNzktMTIuOTc1LDMuMjc5LTE4LjM2My04LjIxNy01MC43NzEtNi40Mi02OS42MjdjMS4zMjctMTMuOTQ1LDYuNTg1LTI3Ljg5LDkuMjMzLTM0LjIwN2ExNS4wNTcsMTUuMDU3LDAsMCwwLDEuMDctNy41MDhjLTEuNzU1LTE1LjY5LTcuMzIzLTcyLjk1NiwyLjcxNC05MC43MTVDMTA1Ny40MTksMjAyLjE5MiwxMDg3LjUsMjU0LjI2NSwxMDg3LjUsMjU0LjI2NVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05MDkuNzYxIDUuOTQyKSIvPjxwYXRoIGNsYXNzPSJuIiBkPSJNMTA0Mi45NjMsNDExLjMwOGMuOTQ3LTExLjc2Nyw5Ljk4Ny04Ny42NTEsMTEuNDMzLTk3LjMsMS41NjMtMTAuNDM2LTUuODQ1LTc1Ljc2Mi01Ljg0NS03NS43NjJsNi4zLTcuNGgxNS4yNTVjMy42MjIsNS4zODUsNS45NTYsOS40MjcsNS45NTYsOS40MjdMMTA2My4wNDYsMzEwLjNTMTA0NC42MSwzOTcuMjc1LDEwNDIuOTYzLDQxMS4zMDhaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtODk4LjMyOCAxOS45MzgpIi8+PHBhdGggY2xhc3M9ImwiIGQ9Ik0xMDU4LjU0MywyMTYuMjkyYzQxLjYyMi0yLjI4LDczLjE4OCwyNyw4NC4wMjEsMzkuNTQ5LDYuNDc0LDcuNSw3LjA4MiwxMy4xNTcsNi44NjEsMTguNmguMDM3czEuOTUyLDguMDgxLTE3LjkxMSw0NS43OTFjMCwwLTI2LjYsNDcuNDczLTI0LjI0MSw1NC41NDMsMCwwLC4zMzYsNi43MzMsMTEuNDQ2LDkuNDI3czEyLjEyLDcuNzQ1LDkuMDksNy43NDUtMzcuMDM1LjMzNi0zOC43MTktMi4zNTcsMy4xNjYtMTEuNzg0LDMuMTY2LTE2LjgzNWMwLTE2LjEwNi40Mi0zMi4zLDMuMDIxLTQ4LjIyMy42Ni00LjAzMyw1Ljg2NC0zMC4wNjEsMTEuNjQ5LTM5LjM4NmEzLjY3MywzLjY3MywwLDAsMC0xLjc5MS01LjM3OWMtMTYuNjg3LTYuNS00Ni40MjYtMjIuNTYzLTU0LjQyNi0yOS41YTExMC40LDExMC40LDAsMCwxLTE0LjIxMS0xNC41N1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05MDUuMzMyIDMuOTQ0KSIvPjxwYXRoIGNsYXNzPSJvIiBkPSJNMTA4Ny41LDE5MS4yODFsLTMuMjQxLTEwLjU4OXMtNi41MjIsMS4yMzktMTMuNjYxLDEyLjgxNC0yNy4xNjksNjguNjUzLTUxLjIxLDg0Ljg1NWMwLDAtNS45NTgsNi40Ni0xMC44NDIsOS4zMmE3LjE5LDcuMTksMCwwLDAtMy4yNjYsNS42NTVjLS4zNjQsNC4yMjYsMTUuOTQ5LTUuNzA5LDIwLjYwNy04LjE3OSwwLDAsMzQuMTc0LTE0LjMwOSw0OC40ODMtMzUuNTJTMTA4Ny41LDE5MS4yODEsMTA4Ny41LDE5MS4yODFaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTM5LjM5NyAtMzQuNzE0KSIvPjxwYXRoIGNsYXNzPSJqIiBkPSJNMTA0Ni4wNTcsMTUzLjlzNy4zMjktMS41MzQsMTMuNywyLjUzMyw5LjkzNyw5Ljg2OCwxMi43MjIsMTAuOTY1YTE0LjExOCwxNC4xMTgsMCwwLDAsNC4zOTMsMS4xNTFzLjk2MywyLS44NzEsNC41NDNjMCwwLDYuMjQ0LDguNTMzLDIuNjI3LDE1LjMwOC00LjQxOCw4LjI3NS0xMy44MTMsMTEuNzExLTIyLjk0NiwxMC4yLTkuMTU5LTEuNTE5LTE0LjQxOS00LjQxNi0yMC4yNjktMTEuNzEzUzEwMjguMzU4LDE1Ny4wNTYsMTA0Ni4wNTcsMTUzLjlaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTEwLjc4NiAtNjQuMjE5KSIvPjxwYXRoIGNsYXNzPSJwIiBkPSJNMTA3NS40MTMsMTgxLjk4Yy0yMS40NDEsNC4wNjctMzMuNzIzLTIwLjM2OS0zMy43MjMtMjAuMzY5bC04LjUzNSwxMS4wMzYsMi40MTgsNy43ODZhMjYuNDY2LDI2LjQ2NiwwLDAsMCwxMy4wOCw4LjI4OGM2LjMzOCw1Ljk5Myw0LjAzMywxNi43ODUsNC4wMzMsMTYuNzg1czE0LjgzNS0yLjA3MywyMS4yNy00LjAyMWwxLjM1NC00LjYxNmMtMi45MjQtMi4wMTUtNS4zMjEtNC4xNTktNS4yNzktOS45QTE5LjE1NywxOS4xNTcsMCwwLDAsMTA3NS40MTMsMTgxLjk4WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwOS4wMTYgLTU1LjUwNykiLz48cGF0aCBjbGFzcz0icSIgZD0iTTEwMzkuMjIsMTYyLjk0MXMxMy42NTUtOC41ODEsMjguNS0xMC45MTdjMCwwLC4xNzYsMi4zNDktNy4wMjQsNS4zNjQtMy41ODQsMS41LDcuNjcyLTEuMDcsNy42NzItMS4wN3MtMS42MzYsOS4zNjgtMjIuMzQ4LDE2Ljg0NlMxMDM5LjIyLDE2Mi45NDEsMTAzOS4yMiwxNjIuOTQxWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwNy4zOTIgLTY1Ljk1NSkiLz48cGF0aCBjbGFzcz0icSIgZD0iTTEwMzYuMzYsMTU4LjkyNXMxNi40NjEtMy43MDUsOS4yMDUsMTcuMTIxYy0yLjY0OCw3LjYsMTMuOCwxMy42NjcsMTEuNjA5LDIyLjIxOC0xLjE1Myw0LjUtMy4yNzYsNi4yOTItMy4yNzYsNi4yOTJzLjQ5MS0zLjAwNy02Ljk4NC03LjMzMS0xNS4yNzQtMTAuMS0xNi42NTYtMjAuNzkxQTIxLjM3MSwyMS4zNzEsMCwwLDEsMTAzNi4zNiwxNTguOTI1WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkxMi4zNTggLTU4LjcxMykiLz48cGF0aCBjbGFzcz0icSIgZD0iTTEwNDYuNTgsMTk0Ljc3OWEzMC44OTQsMzAuODk0LDAsMCwxLDMuMiw3LjEyMiwzMC4xNzUsMzAuMTc1LDAsMCwwLTIuOTQtMS45MjVjLTcuNDc1LTQuMzI2LTE1LjI3NC0xMC4xLTE2LjY1Ni0yMC43OTEtLjAxMy0uMS0uMDEzLS4xOTQtLjAyMy0uMjk1bDI5LjI5NC0yMi43NDVTMTAzNS42MzIsMTc2LjMsMTA0Ni41OCwxOTQuNzc5WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkxMi4yODEgLTYxLjQ2MykiLz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDkuNDQ1IDc1LjQ3NikiPjxwYXRoIGNsYXNzPSJyIiBkPSJNMTA3NS4yLDE1MS44NjJzLTI1LjQxLDMzLjI1LTQyLjE3Miw0OC4xODRhLjcyOC43MjgsMCwwLDEtMS4xNTQtLjgyMWwuOC0yLjAxNWEzLjMsMy4zLDAsMCwwLS40MjItMy4xOTNjLTMuNDg4LTQuNjcxLTEyLjk3My0yMC4yLDIuMjU3LTM0LjU2Nyw1LjMwNi01LjAwNywxNC4xMi05LjU4MiwyNi4wMy0zLjgzN2E2LjE1OCw2LjE1OCwwLDAsMCw3LjA1Ny0xLjMyMWMzLjI1NC0zLjMzNSw3LjkyNS03LjgxNiw5LjA2OC03LjNDMTA3OC40NjUsMTQ3LjgxNiwxMDc1LjIsMTUxLjg2MiwxMDc1LjIsMTUxLjg2MloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDI2LjEyNCAtMTQ2Ljk1NSkiLz48cGF0aCBjbGFzcz0icyIgZD0iTTEwNTAuODA5LDE2NC40MzFjLTEwLjgzMyw2LjUtMTkuMTIyLjU3LTIzLjg4Ni00LjkzMi0yLjg4LDEwLjIyNywyLjgsMTkuMzI2LDUuMzI3LDIyLjcxNGEzLjMsMy4zLDAsMCwxLC40MjIsMy4xOTNsLS44LDIuMDE1YS43MjguNzI4LDAsMCwwLDEuMTU0LjgyMWM4LjU5My03LjY1NywxOS40NTQtMjAuMTIsMjgtMzAuNDU2QzEwNTguNjM3LDE1OS41MjUsMTA1NS4zNSwxNjEuNywxMDUwLjgwOSwxNjQuNDMxWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwMjYuMTE5IC0xMzUuMTUyKSIvPjwvZz48cGF0aCBjbGFzcz0iaiIgZD0iTTEwNDIuNzEzLDE2Ni4zMnMtNy4xNTctMS4wODktNy4wNTcsMy4zMzksNS41MzMsOC4xLDguNjU2LDYuMzkxIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTA2LjI5MyAtNTAuNTA1KSIvPjxwYXRoIGNsYXNzPSJ0IiBkPSJNMTAzOS4yMjIsMjgwLjMxN2w5LjUyMS0xMi42NDVzLTEuMjcxLTM0LjUtMjkuODUtMzMuMDI0YzAsMC0yMS44MDcuNS0yMS44MDcsMzYuMlMxMDM5LjIyMiwyODAuMzE3LDEwMzkuMjIyLDI4MC4zMTdaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTQ4LjMyMyAyNC4wMzUpIi8+PHBhdGggY2xhc3M9Im8iIGQ9Ik0xMDg1Ljg0NSwxOTEuMjgxbC0zLjI0MS0xMC41ODlzLTYuNTIyLDEuMjM5LTEzLjY2MSwxMi44MTQtMjcuMTY5LDY4LjY1My01MS4yMSw4NC44NTVjMCwwLTUuOTU4LDYuNDYtMTAuODQyLDkuMzItMS40ODQuODcxLDE1LjM5MS43MjksMTYuNTY5LTMuNDc5LDAsMCwzNC45NDUtMTMuMzU0LDQ5LjI1NC0zNC41NjVTMTA4NS44NDUsMTkxLjI4MSwxMDg1Ljg0NSwxOTEuMjgxWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkzNy43MzkgLTM0LjcxNCkiLz48cGF0aCBjbGFzcz0iaiIgZD0iTTEwMDguNDg1LDI0NS40NzVjNC44ODQtMi44NjEsMTAuODQyLTkuMzIsMTAuODQyLTkuMzIsNS41NTctMy43NDUsMTAuODk0LTkuNjg2LDE1LjkxNC0xNi43MzMsNC40ODIsMi4zNTksOS45LDYuMjA3LDEyLjUwOSwxMS44MzJhMjI4LjIsMjI4LjIsMCwwLDEtMjMuOTk1LDEzLjAyOGMtMy42MzYsNy4wNzYtNS42NzQsNS40LTUuNjc0LDUuNC0yLjI3LS41ODUtMy45MzMuOTk1LTUuMDkxLDIuOTY1LTIuMzcsNC4wNDItOC43NTQsMS40MjktNy40OS0zLjA4MkE2LjgsNi44LDAsMCwxLDEwMDguNDg1LDI0NS40NzVaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTM5LjMzMiA3LjQ5MykiLz48cGF0aCBjbGFzcz0icSIgZD0iTTEwODAuMDIsMjkyLjA2NWMxLjY4MiwzLjcsOC4wNzksOC42MTIsMTEuNDQ2LDkuNDI3LDExLjExMSwyLjY5NCwxMi4xMjEsNy43NDUsOS4wOSw3Ljc0NXMtMzcuMDM1LjMzNi0zOC43MTktMi4zNTdjLTEuMTE2LTEuNzg3LDEuNjU3LTEwLjQ0NSwyLjk2Ny0xNC44MTRDMTA3Mi45OTIsMjk0LjI0LDEwNzYuMTQ4LDI5NC43NTksMTA4MC4wMiwyOTIuMDY1WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTg3OC4wNDIgODYuNjU3KSIvPjxwYXRoIGNsYXNzPSJxIiBkPSJNMTAzNy4zOTUsMzE5LjIxNmMxNC4wMTIsMy45NSwxNS42NTItMS4zMDgsMTUuNjUyLTEuMzA4LDAsNy4xODMsMjIsMTYuNDc0LDIxLjEsMjAuNTE1cy0zNS45MTMtMi4yNDQtMzkuNS00LjA0MkMxMDMxLjY2MiwzMzIuODk0LDEwMzUuODcsMzI0Ljk1NywxMDM3LjM5NSwzMTkuMjE2WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwOC41MzIgMTE0LjgyKSIvPjxwYXRoIGNsYXNzPSJvIiBkPSJNMTAzMy42LDMyMC4xMTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05MDguNTMyIDExNy4yMjEpIi8+PHBhdGggY2xhc3M9InIiIGQ9Ik0xMDUwLjM0MSwyNTAuNTM0djYxLjY2MWMwLDEuODIyLTEyLjAzNSw0LjQ4Ny0yNi44NzksNC40ODdzLTI2Ljg3OC0yLjY2NC0yNi44NzgtNC40ODdWMjUwLjUzNFoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05NDguODcgNDEuMzk4KSIvPjxwYXRoIGNsYXNzPSJ1IiBkPSJNOTk2LjU4NCwyNTIuMjU2YzAsMS44MjQsMTIuMDMzLDMuMywyNi44NzgsMy4zczI2Ljg3OS0xLjQ3NywyNi44NzktMy4zLTEyLjAzNS0zLjMtMjYuODc5LTMuM1M5OTYuNTg0LDI1MC40MzQsOTk2LjU4NCwyNTIuMjU2WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTk0OC44NyAzOS42NzYpIi8+PHBhdGggY2xhc3M9InYiIGQ9Ik0xMDQzLjEsMjUyLjE5MWMtNC4wMTYsMS4wNDEtMTIuNjI5LDEuNzY0LTIyLjYzNiwxLjc2NHMtMTguNjIyLS43MjMtMjIuNjM2LTEuNzY0YzQuMDE0LTEuMDQzLDEyLjYyOC0xLjc2NiwyMi42MzYtMS43NjZTMTAzOS4wODMsMjUxLjE0OCwxMDQzLjEsMjUyLjE5MVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05NDcuNTE2IDQxLjI3OSkiLz48cGF0aCBjbGFzcz0icSIgZD0iTTEwNDEuMzUxLDMxOS40NjRjLS40NzQsMi43NjUtLjMzOSw3LjYyMyw0LjgxOSwxMS44Nyw1LjY2Nyw0LjY2NiwxOS41NDQsNi42NSwyNi41MjMsNy4zNzUtNi43NDgsMS43NDUtMzQuODUzLTMuNDA4LTM4LjA1Mi01LjAwOS0yLjk3OC0xLjQ4OCwxLjIyOS05LjQyNSwyLjc1NC0xNS4xNjVDMTAzOC44NTQsMzE4Ljk0NiwxMDQwLjE0OSwzMTkuMjM2LDEwNDEuMzUxLDMxOS40NjRaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTA4LjUzMiAxMTUuNTAyKSIvPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIyNi42MjIgMTcuMTgpIj48cGF0aCBjbGFzcz0icSIgZD0iTTEwODYuOTEzLDI0Mi42YTQuNzEzLDQuNzEzLDAsMCwwLDQuNy00LjVsNS4zMDYtMTE0LjExNmE0LjcxMyw0LjcxMywwLDAsMC05LjQxNy0uNDM5TDEwODIuMiwyMzcuNjcyYTQuNzExLDQuNzExLDAsMCwwLDQuNDg5LDQuOTI2QzEwODYuNzY1LDI0Mi42LDEwODYuODM4LDI0Mi42LDEwODYuOTEzLDI0Mi42WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwODIuMTk1IC0xMTkuMDU5KSIvPjxwYXRoIGNsYXNzPSJxIiBkPSJNMTA4Ny41MDcsMTIzLjQ0MWE0LjcwOSw0LjcwOSwwLDAsMSwzLjM1Mi00LjI3OCw0LjYxLDQuNjEsMCwwLDAtLjExOS44bC01LjMwNiwxMTQuMTE2YTQuNzEzLDQuNzEzLDAsMCwwLDQuNDg5LDQuOTI4Yy4wNzUsMCwuMTUxLjAwNi4yMjQuMDA2YTQuNzE1LDQuNzE1LDAsMCwwLDEuMzU2LS4yMjIsNC43MDksNC43MDksMCwwLDEtNC41ODksMy43Yy0uMDc1LDAtLjE0OSwwLS4yMjQtLjAwNmE0LjcxMSw0LjcxMSwwLDAsMS00LjQ4OS00LjkyNloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDgyLjE5NSAtMTE4Ljk0NikiLz48L2c+PHBhdGggY2xhc3M9InEiIGQ9Ik0xMDYxLjgzNywzMDYuODc5Yy0xLjExNi0xLjc4NywxLjY1Ny0xMC40NDUsMi45NjctMTQuODE0bC40NjguMTIzYy43LDQuMDI5LDMuMTM5LDEyLjQzLDExLjQ1LDEzLjQwOCwxMC45OCwxLjI5NCwyMy44MzQsMy42NCwyMy44MzQsMy42NEMxMDk3LjUyNiwzMDkuMjM3LDEwNjMuNTIyLDMwOS41NzMsMTA2MS44MzcsMzA2Ljg3OVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NzguMDQyIDg2LjY1NykiLz48cGF0aCBjbGFzcz0ibyIgZD0iTTExMzQuODQ1LDE1Mi45NzJzLTkuNSwyOC42NjUtMjQuMTM5LDQzLjNTMTA3Ny4wMjcsMjI4LjU4NiwxMDUwLjIsMjMyYzAsMC00Ljg3OSwxLjk1Mi00Ljg3OSw4LjI5NHMtOC4yOTIsNjAtOC43ODEsODUuMzY5YzAsMCwyNi44MzMsMTQuMTQ4LDY1LjM3LTEwLjczMWwtNS44NTMtNTkuNTE2czQwLjgwNy0yMS43NjMsNDkuNDIxLTkxLjk1NGEzNy4xNjQsMzcuMTY0LDAsMCwwLC4xMjMtOS44OTMsNC4wMzQsNC4wMzQsMCwwLDEsMS42MDktMy44YzUuMjQ1LTQuNDM3LDcuMDE1LTguNzE0LDMuNzg5LTE0LjcyOWEyLjgsMi44LDAsMCwwLTQuOTg0LjIsMTAuODM2LDEwLjgzNiwwLDAsMS03Ljg4OSw2LjQxNkMxMTI5LjgzLDE0My4xMTgsMTEzMi43NiwxNDUuNDQsMTEzNC44NDUsMTUyLjk3MloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05MDUuMzMyIC04Ni4wMjIpIi8+PHBhdGggY2xhc3M9InciIGQ9Ik0xMDUwLjM0MSwzMDEuNzY0djcuMzc1YzAsMS44MjItMTIuMDM1LDQuNDg3LTI2Ljg3OSw0LjQ4N3MtMjYuODc4LTIuNjY0LTI2Ljg3OC00LjQ4N3YtNTUuOEMxMDAwLjkwOCwyODAuNTUxLDEwMTYuNCwzMDAuODI0LDEwNTAuMzQxLDMwMS43NjRaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTQ4Ljg3IDQ0LjQ1MykiLz48cGF0aCBjbGFzcz0ieCIgZD0iTTEwOTYuMDUyLDE5MS45bDUuODUzLDU5LjUxNnMtMzIuNjg0LDI0LjQ4Ni02NS4zNywxMC43MzFDMTAzNi41MzYsMjYyLjE0NCwxMDkwLjg0OSwyNDkuNDE4LDEwOTYuMDUyLDE5MS45WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwNS4zMzIgLTIyLjUwMykiLz48cGF0aCBjbGFzcz0iaiIgZD0iTTEwODcuNzU2LDE1Mi45NzJjLTIuMDg2LTcuNTMyLTUuMDE2LTkuODUzLDMuMjc3LTExLjMxNmExMC44MzYsMTAuODM2LDAsMCwwLDcuODg5LTYuNDE2LDIuOCwyLjgsMCwwLDEsNC45ODQtLjJjMy4yMjYsNi4wMTQsMS40NTcsMTAuMjkyLTMuNzg5LDE0LjcyOWE0LjAzNSw0LjAzNSwwLDAsMC0xLjYwOSwzLjgsMzcuMTY0LDM3LjE2NCwwLDAsMS0uMTIzLDkuODkzYy0uNjc1LDUuNS0xLjU2NywxMC42NzItMi42LDE1LjU5MmE0My41MjksNDMuNTI5LDAsMCwxLTE2LjAzNS02Ljk0OUExNjguODI1LDE2OC44MjUsMCwwLDAsMTA4Ny43NTYsMTUyLjk3MloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NTguMjQzIC04Ni4wMjIpIi8+PHBhdGggY2xhc3M9InAiIGQ9Ik0xMDQyLjcxMywxNjYuMzJzLTcuMTU3LTEuMDg5LTcuMDU3LDMuMzM5LDUuNTMzLDguMSw4LjY1Niw2LjM5MSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTkwNi4yOTMgLTUwLjUwNSkiLz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMDYuMTQ4IDAuMzc1KSI+PHBhdGggY2xhc3M9InIiIGQ9Ik0xMDc1LjM3MSwxMzEuMmw1NC4zMTEsMi41MjRhMy4xMTQsMy4xMTQsMCwwLDAsMy4yNTgtMi45NzhsLjYwNi0xMy45NTNhMy4xMTYsMy4xMTYsMCwwLDAtMi45Ny0zLjI0OGwtNi44MDctLjMxOC00Ny41LTIuMjA5YTMuMTE5LDMuMTE5LDAsMCwwLTMuMjYsMi45OGwtLjYsMTMuOTUxQTMuMTE2LDMuMTE2LDAsMCwwLDEwNzUuMzcxLDEzMS4yWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwNzIuMzk5IC0xMTEuMDE3KSIvPjxwYXRoIGNsYXNzPSJ5IiBkPSJNMTA3Mi40LDEyMy4yODZsLjM0Ny03Ljk4N2M0LjcwNiwyLjI4LDEzLjgzOCw1LjI0MywzMC4yMjQsNS45NDUsMTkuNDg5LjgzNCwyNy4zNzgtMS44LDMwLjMyNS0zLjRsLS4zNTgsOC4yMzZhMy4xMTQsMy4xMTQsMCwwLDEtMy4yNTgsMi45NzhsLTU0LjMxMS0yLjUyNEEzLjExNiwzLjExNiwwLDAsMSwxMDcyLjQsMTIzLjI4NloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDcyLjM5OSAtMTA2LjM1MSkiLz48L2c+PHBhdGggY2xhc3M9InoiIGQ9Ik0xMTM0LjYsMTIxbC4xMTctMy43MmE0LjUsNC41LDAsMCwwLTQuMzQ3LTQuNjQxbC01Mi43MDgtMS44Yy0zLjY0MSwwLTQuNTM5LDEuNzEyLTQuODMzLDQuMTM0bC0uMzcsMy4wMzZhMi4xLDIuMSwwLDAsMCwyLjUsMi4zNTcsMS43MiwxLjcyLDAsMCwwLDEuMjg1LTEuNjc4Yy4zNDctMy4wMDUsMy42MjQtMy4yMiwzLjM1MiwxLjIxOC0uNDk1LDguMTEyLDIuMzEyLDEwLjcsNC45NzIsOC4wOTRzMy4wMDUtMTEuOTcsNC4wNDYtOS41NDIuMjk1LDcuMzEyLDQuODM2LDYuOTIxYzIuNTU4LS4yMjEsMi43OTQtOS4yMzUsMy4xNDEtNi40NTlzLjkyNiw0Ljk3MiwyLjg5LDQuNjI1LDEuNTY1LTIuMzc2LDMuMDY2LTEuODQ5YzIuNS44NzYsMi4yMjQsOC4xNzcsNi4yOSw4LjE4OCw2LjMyNi4wMTcsMy4xMy0xMC43MzEsNS43OTEtOS4zNDNzNC4wMTcsNC40MzcsNy4yODMsMy41ODRjMy4zNzUtLjg4NCwzLjQ4MS05LjI4OSw3LjEwNy02LjI2N0MxMTMxLjI1NSwxMTkuNzI2LDExMzMuNDE4LDEyNi42NjYsMTEzNC42LDEyMVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NjYuMjA2IC0xMTAuODM4KSIvPjxwYXRoIGNsYXNzPSJhYSIgZD0iTTExMTYuNTQ1LDE0Mi44NzVzLTE4LjA5Myw3Mi43MzYtNjMuMjE3LDc0LjQxMmwuMDEtMS41M2MxNi4wNTItNy4yNjQsMjguNjczLTE5LjE4OCwzOS4wNjgtMjkuNTgzQzExMDcuMDQxLDE3MS41NCwxMTE2LjU0NSwxNDIuODc1LDExMTYuNTQ1LDE0Mi44NzVaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtODg3LjAzMyAtNzUuOTI1KSIvPjxwYXRoIGNsYXNzPSJ6IiBkPSJNMTA0Ni4xNzUsMjUxLjE5NGEzLjY2NSwzLjY2NSwwLDAsMSw0LjMwNSwzLjg1OGMtLjQxOCw1Ljg3OC0xLjQzNiwxMi4xNzctMy43LDEwLjExLTMuMzA4LTMuMDE4LTMuMTA4LTEyLjUtNi4yMjEtOC44ODQtMi44MzYsMy4yOTMtNi44NTcsMTQuNDY1LTguNSw1LjEzNXMtNS4zODUtOC02LjQzMi01LjI2Yy0xLjM3MywzLjU4NC44MjEsMTQuODU2LTMuNDA4LDE0Ljg1Ni01LjA4NCwwLTMuMDUxLTE0LTcuMDY4LTE0Ljg1Ni0zLjYyOC0uNzczLTIuMDYyLDQuMTc3LTUuMTY0LDguNDQxLTMuNzM2LDUuMTM1LTQuNTgxLTguNDQxLTYuNzcxLTguNDQxLTQuNzEyLDAtNC42MDYsNy4xNDktNi4yMzIsMy43NTktLjktMS44ODEtLjg0NC00LjY0MS0uNjEyLTYuNzI1YTIuNzM4LDIuNzM4LDAsMCwxLDMuMTg3LTIuMzkzQzEwMDYuNTg0LDI1MS45ODYsMTAyNi4yNDcsMjU0LjY0MiwxMDQ2LjE3NSwyNTEuMTk0WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTk0OS4yNjYgNDEuNjM5KSIvPjxwYXRoIGNsYXNzPSJuIiBkPSJNMTA3NS45NDYsMjQ2LjZzMTEuMzEyLDMuMjM1LDcuNjA5LDYuODczYy0xMy41NzcsMTMuMzQxLTE5LjkwOSw0OC44NjktMjAuMiw2Ny40OTMsMCwwLDEuMDUzLTMzLjk2NSw4LjcxLTU0LjY3NSwwLDAsMi44LTkuNzksNS42NzItMTQuMzEzQzEwNzcuNzM3LDI1MS45OCwxMDc5LjYyNiwyNDguMSwxMDc1Ljk0NiwyNDYuNloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC04NzYuMTA2IDM3LjExMikiLz48L2c+PC9nPjwvc3ZnPg==\")
\r\n
\r\n { title || 'Coming Soon' }
\r\n { children }\r\n \r\n \r\n Asset Management\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n this._onUpdate(null)}\r\n onClear={() => this._onUpdate(null)}\r\n onSearch={this._onUpdate}\r\n />\r\n
\r\n );\r\n }\r\n\r\n _onUpdate = (keywords) => {\r\n const { routing, onSearch, url, queryKey } = this.props;\r\n\r\n if (url) {\r\n let fullUrl = url;\r\n if (keywords) {\r\n const key = encodeURIComponent(queryKey || \"query\");\r\n fullUrl = `${url}${url.indexOf(\"?\") !== -1 ? \"&\" : \"?\"}${key}=${JsonQueryString.encode({\r\n keywords,\r\n })}`;\r\n }\r\n routing.push(fullUrl);\r\n } else if (onSearch) {\r\n onSearch(keywords);\r\n }\r\n };\r\n }\r\n )\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { PrimaryButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { ObservableSeparator } from \"@baseComponents/ObservableSeparator\";\r\nimport { NavigationList } from \"@baseComponents/NavigationList\";\r\nimport { BigSearchBox } from \"@baseComponents/BigSearchBox\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-AssetSideNav-root\",\r\n css`\r\n & .container {\r\n padding: 10px 0;\r\n }\r\n & .sidebar--inner {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n & .navigation {\r\n flex-grow: 1;\r\n margin-bottom: 15px;\r\n overflow: auto;\r\n }\r\n & .launch-pad button {\r\n width: 100%;\r\n text-align: left;\r\n height: 40px;\r\n font-size: 15px;\r\n }\r\n `\r\n);\r\n\r\nconst bigSearchBoxClassName = cx(\r\n \"row--l\",\r\n css`\r\n margin-bottom: 15px !important;\r\n `\r\n);\r\n\r\nexport class AssetSideNav extends Component {\r\n render() {\r\n const { className, hideAgentActions, loading, query, savedQueries, onNewAsset } =\r\n this.props;\r\n\r\n const navLinkGroups = [\r\n {\r\n name: \"Asset Management\",\r\n key: \"/assets\",\r\n url: \"/assets/dashboard\",\r\n hideGrouping: true,\r\n links: [\r\n /* {\r\n name: 'Asset Dashboard',\r\n key: '/assets/dashboard',\r\n url: '/assets/dashboard',\r\n iconProps: { iconName: 'ViewDashboard' }\r\n }, */\r\n {\r\n name: \"Browse Assets\",\r\n key: \"/assets/browse\",\r\n url: \"/assets/browse\",\r\n iconProps: { iconName: \"ViewList\" },\r\n },\r\n {\r\n name: \"My Watchlist\",\r\n key: \"/assets/watchlist\",\r\n url: \"/assets/watchlist\",\r\n iconProps: { iconName: \"FavoriteList\" },\r\n },\r\n ],\r\n },\r\n ];\r\n\r\n const savedQueriesGroup = [\r\n {\r\n name: \"Risk Registries\",\r\n key: \"/risks/boards\",\r\n hideGrouping: true,\r\n links: (savedQueries || []).map((savedQuery) => ({\r\n name: savedQuery.name,\r\n url: `/assets/queries/${savedQuery.id}`,\r\n iconProps: { iconName: \"Taskboard\" },\r\n key: savedQuery.id,\r\n data: savedQuery,\r\n })),\r\n },\r\n ];\r\n\r\n return loading ? null : (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useId } from \"@fluentui/react-hooks\";\r\n\r\nimport { useStores } from \"../../../../hooks/useStores\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { ComboBox } from \"office-ui-fabric-react/lib/ComboBox\";\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Spinner, SpinnerSize } from \"office-ui-fabric-react/lib/Spinner\";\r\n\r\nexport const SimplePatternPicker = ({ className, multiple, disabled, required, placeholder, label, selected, onChange }) => {\r\n const { patternStore } = useStores();\r\n const [patterns, setPatterns] = useState([]);\r\n const [selectedKeys, setSelectedKeys] = useState([]);\r\n const [loading, setLoading] = useState(false);\r\n const pickerId = useId(\"comboBox\");\r\n\r\n useEffect(() => {\r\n async function fetchData() {\r\n setLoading(true);\r\n const result = await patternStore.modellingService.getPatterns({ pageSize: 250, startIndex: 0 });\r\n setPatterns(result.items);\r\n setLoading(false);\r\n }\r\n fetchData();\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (selected) {\r\n if (multiple) {\r\n setSelectedKeys(selected.map((p) => p.id));\r\n } else {\r\n setSelectedKeys([selected.id]);\r\n }\r\n } else {\r\n setSelectedKeys([]);\r\n }\r\n }, [selected, multiple]);\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n Asset\r\n
\r\n Management\r\n \r\n
\r\n\r\n \r\n Management\r\n
\r\n
\r\n\r\n {!hideAgentActions && onNewAsset && (\r\n \r\n Saved Queries \r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {loading && \r\n ({ key: p.id, text: p.name, data: p }))}\r\n onChange={(event, option, index, value) => {\r\n if (multiple) {\r\n if (option) {\r\n const newSelected = [...selectedKeys];\r\n const index = newSelected.indexOf(option.key);\r\n if (index == -1) {\r\n newSelected.push(option.key);\r\n } else {\r\n newSelected.splice(index, 1);\r\n }\r\n\r\n if (onChange) {\r\n onChange(patterns.filter((r) => newSelected.indexOf(r.id) != -1));\r\n }\r\n }\r\n } else {\r\n if (onChange) {\r\n onChange(option ? option.data : null);\r\n }\r\n }\r\n }}\r\n />\r\n
\r\n );\r\n};\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport moment from \"moment\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Dropdown } from \"office-ui-fabric-react/lib/Dropdown\";\r\nimport { Toggle } from \"office-ui-fabric-react/lib/Toggle\";\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\nimport { Slider } from \"office-ui-fabric-react/lib/Slider\";\r\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\r\n\r\nimport { RichTextField, isNotNullOrEmpty } from \"@modules/editors/components/RichTextField\";\r\nimport RichTextViewer from \"@modules/editors/components/RichTextViewer\";\r\nimport { PortfolioPicker } from \"@modules/portfolios/containers/pickers/PortfolioPicker\";\r\nimport { SimplePatternPicker } from \"@modules/patterns/containers/pickers/SimplePatternPicker\";\r\nimport { SimpleEntityPicker } from \"@modules/entities/containers/pickers/SimpleEntityPicker\";\r\n\r\nimport { EntityTypes } from \"../../stores/PropertyContants\";\r\n\r\nexport const PropertyField = observer(\r\n class PropertyField extends Component {\r\n render() {\r\n const { property } = this.props;\r\n\r\n switch (property.type) {\r\n case \"Number\":\r\n return this._renderNumberField();\r\n case \"Boolean\":\r\n return this._renderBooleanField();\r\n case \"Text\":\r\n return this._renderTextField();\r\n case \"Date\":\r\n return this._renderDateField();\r\n case \"Lookup\":\r\n return this._renderLookupField();\r\n case \"Choice\":\r\n return this._renderChoiceField();\r\n }\r\n\r\n return null;\r\n }\r\n\r\n _renderNumberField() {\r\n const { property, data, readOnly } = this.props;\r\n\r\n const value = data[property.staticName];\r\n const schema = property.schema;\r\n const dp = schema && schema.decimalPlaces ? schema.decimalPlaces : 0;\r\n\r\n /* if(readOnly) {\r\n if(typeof(value) === 'undefined' || value == null) {\r\n return this._renderReadOnly(property.name, 'N/A');\r\n }\r\n return this._renderReadOnly(property.name, value.toFixed(dp));\r\n } */\r\n\r\n if (schema && schema.slider) {\r\n return (\r\n \r\n \r\n
\r\n );\r\n } else {\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _renderChoiceField() {\r\n const { property, data, readOnly } = this.props;\r\n\r\n const value = data[property.staticName];\r\n const schema = property.schema;\r\n /*\r\n if(readOnly) {\r\n if(typeof(value) === 'undefined' || value == null) {\r\n return this._renderReadOnly(property.name, 'N/A');\r\n } else {\r\n return this._renderReadOnly(property.name, value);\r\n }\r\n }\r\n */\r\n return (\r\n Not Implemented
\r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { WellKnownFieldNames, WellKnownSectionIds } from \"../../../properties/stores/PropertyContants\";\r\nimport { PropertyField } from \"../../../properties/components/core/PropertyField\";\r\nimport { BigTextField } from \"@baseComponents/BigTextField\";\r\nimport { ObservableSeparator } from \"@baseComponents/ObservableSeparator\";\r\n\r\nexport const AssetEditForm = observer(\r\n class AssetEditForm extends Component {\r\n render() {\r\n const { formData, formOptions } = this.props;\r\n const { properties, sections } = formOptions;\r\n\r\n if (!properties || properties.length == 0 || !sections || sections.length == 0) {\r\n return null;\r\n }\r\n\r\n const editable = properties.filter(\r\n (p) => !p.readOnly && !p.hidden && p.staticName != WellKnownFieldNames.Name\r\n );\r\n const groupedBySections = editable.reduce((acc, curr) => {\r\n if (!acc[curr.section.id]) acc[curr.section.id] = [];\r\n acc[curr.section.id].push(curr);\r\n return acc;\r\n }, {});\r\n\r\n return (\r\n <>\r\n {value}
\r\n \r\n (formData.name = value)}\r\n />\r\n
\r\n \r\n {groupedBySections[section.id] && (\r\n
\r\n ))}\r\n \r\n );\r\n }\r\n\r\n _getColumnSpan(property) {\r\n return property.type == \"Text\" &&\r\n property.schema &&\r\n (property.schema.richText || property.schema.maxLength > 400)\r\n ? 6\r\n : 3;\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\nimport { PrimaryButton, DefaultButton, IconButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { Dialog, DialogType, DialogFooter } from \"office-ui-fabric-react/lib/Dialog\";\r\n\r\nimport { ObservablePanel } from \"@baseComponents/ObservablePanel\";\r\n\r\nimport { AssetEditForm } from \"../../components/core/AssetEditForm\";\r\n\r\nexport const AssetNewPanel = inject(\r\n \"assetStore\",\r\n \"routing\"\r\n)(\r\n withRouter(\r\n observer(\r\n class AssetNewPanel extends Component {\r\n render() {\r\n const { newStore } = this.props.assetStore;\r\n const { formData, formOptions, visible, isCloseDialogOpen, loading, isValid, isDirty } = newStore;\r\n return (\r\n <>\r\n \r\n {section.id !== WellKnownSectionIds.AssetBuiltIn && (\r\n {section.name} \r\n )}\r\n \r\n {groupedBySections[section.id].map((property) => (\r\n \r\n \r\n
\r\n )}\r\n {item.pattern.name}
\r\nv{item.pattern.currentVersion}
\r\n\r\n \r\n \r\n \r\n \r\n )}\r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\nimport { Label } from \"@ui/elements/Label\";\r\nimport { TooltipHost } from \"@ui/elements/Tooltip\";\r\nimport { FontIcon } from \"@ui/elements/Icon\";\r\n\r\nexport const ExtendedLabel = ({ label, required, disabled, children, htmlFor, description }) => {\r\n return (\r\n \r\n
\r\n {buttonRef.current && (\r\n \r\n
\r\n {buttonRef.current && (\r\n \r\n
\r\n {buttonRef.current && (\r\n \r\n {keywordsFilter && (\r\n {\r\n value[keywordsFilter.name] = val;\r\n debouncedOnChange(value, keywordsFilter);\r\n }}\r\n label={keywordsFilter.label}\r\n disabled={disabled || keywordsFilter.disabled}\r\n />\r\n )}\r\n \r\n \r\n \r\n \r\n Filters \r\n {context && (\r\n \r\n {context.processing ? (\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n {visible &&\r\n filters.map((filter) => (\r\n \r\n \r\n )}\r\n
\r\n );\r\n});\r\n\r\nexport const FilterBarField = observer(({ disabled, filter, value, onChange, context }) => {\r\n const { type, name, ...rest } = filter;\r\n return (\r\n \r\n
\r\n {buttonRef.current && (\r\n \r\n \r\n {onNavigateBack && (\r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n Asset \r\n \r\n \r\n \r\n \r\n {asset.code} - {asset.name}\r\n \r\n
\r\n );\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { Sidebar } from '@baseComponents/Sidebar';\r\nimport { SidebarProperties } from '@baseComponents/SidebarProperties';\r\nimport { SidebarProperty } from '@baseComponents/SidebarProperty';\r\n\r\nexport const AssetSidebar = observer(\r\n class AssetSidebar extends Component {\r\n\r\n render () {\r\n const { asset } = this.props;\r\n return (\r\n \r\n \r\n \r\n \r\n {asset.primarySupplier && (\r\n \r\n \r\n )}\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { Pivot, PivotItem, PivotLinkFormat } from \"office-ui-fabric-react/lib/Pivot\";\r\n\r\nexport const PivotRouting = observer(({ children, onLinkClick, ...rest }) => {\r\n const { routing } = useStores();\r\n\r\n return (\r\n \r\n \r\n {asset.summary || \"Not set\"} \r\n
\r\n \r\n \r\n \r\n {asset.code || \"Not set\"}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.alias || \"Not set\"}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.detailsUrl ? (\r\n \r\n \r\n Link \r\n ) : (\r\n \"Not set\"\r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.state}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.portfolio && asset.portfolio.name}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.pattern && asset.pattern.name}\r\n \r\n
\r\n \r\n \r\n \r\n {asset.operationalSince ? (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n// \r\n// {viewerStore.asset.summary || \"Not set\"} \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.code || \"Not set\"}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.alias || \"Not set\"}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.detailsUrl ? (\r\n// \r\n// \r\n// Link \r\n// ) : (\r\n// \"Not set\"\r\n// )}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.state}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.portfolio && viewerStore.asset.portfolio.name}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.pattern && viewerStore.asset.pattern.name}\r\n// \r\n//
\r\n// \r\n// \r\n// \r\n// {viewerStore.asset.operationalSince ? (\r\n// \r\n//
\r\n// \r\n//
\r\n// \r\n//
\r\n// \r\n {item.notes &&
\r\n {index+1} out of {scores.length}\r\n
\r\n )\r\n };\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n };","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { DueIndicator } from '../../../base/components/DueIndicator';\r\n\r\nexport const WorkItemDueIndicator = observer(\r\n class WorkItemDueIndicator extends Component {\r\n\r\n render () {\r\n const { className, workItem } = this.props;\r\n\r\n if(!workItem || !workItem.dueDate || workItem.status == 'Cancelled') {\r\n return null;\r\n }\r\n \r\n return (\r\n \r\n {\r\n scores.map((s, i) => (\r\n \r\n ))\r\n }\r\n {!hideName &&
\r\n \r\n {priority ? priority : 'None'}
}\r\n \r\n {startDate && (\r\n <>\r\n \r\n {strings.started}{\" \"}\r\n
\r\n \r\n )}\r\n {closedDate && (\r\n \r\n {\" \"}\r\n {strings.closed}{\" \"}\r\n
\r\n ),\r\n };\r\n\r\n return (\r\n \r\n \r\n )}\r\n {closedDate && (\r\n \r\n {\" \"}\r\n {strings.closed}{\" \"}\r\n
\r\n \r\n \r\n {precision === \"d\" ? diffInDays : diffInMonths}\r\n {precision}\r\n
\r\n \r\n \r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { AgeIndicator } from '../../../base/components/AgeIndicator';\r\n\r\nexport const WorkItemAgeIndicator = observer(\r\n class WorkItemAgeIndicator extends Component {\r\n\r\n render () {\r\n const { className, workItem } = this.props;\r\n if(!workItem) {\r\n return null;\r\n }\r\n return (\r\n {item.patternVersion.name}
\r\nv{item.patternVersion.version}
\r\n\r\n \r\n Entity Management\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { WellKnownFieldNames, WellKnownSectionIds } from \"@modules/properties/stores/PropertyContants\";\r\nimport { PropertyField } from \"@modules/properties/components/core/PropertyField\";\r\nimport { BigTextField } from \"@baseComponents//BigTextField\";\r\nimport { ObservableSeparator } from \"@baseComponents/ObservableSeparator\";\r\n\r\nexport const EntityEditForm = observer(\r\n class EntityEditForm extends Component {\r\n render() {\r\n const { formData, formOptions } = this.props;\r\n const { properties, sections } = formOptions;\r\n\r\n if (!properties || properties.length == 0 || !sections || sections.length == 0) {\r\n return null;\r\n }\r\n\r\n const editable = properties.filter(\r\n (p) => !p.readOnly && !p.hidden && p.staticName != WellKnownFieldNames.Name\r\n );\r\n const groupedBySections = editable.reduce((acc, curr) => {\r\n if (!acc[curr.section.id]) acc[curr.section.id] = [];\r\n acc[curr.section.id].push(curr);\r\n return acc;\r\n }, {});\r\n\r\n return (\r\n <>\r\n \r\n
\r\n \r\n \r\n Entity\r\n
\r\n Management\r\n \r\n
\r\n\r\n \r\n Management\r\n
\r\n
\r\n\r\n {!hideAgentActions && onNewEntity && (\r\n \r\n Saved Queries \r\n
\r\n \r\n
\r\n )}\r\n \r\n (formData.name = value)}\r\n />\r\n
\r\n \r\n {groupedBySections[section.id] && (\r\n
\r\n ))}\r\n \r\n );\r\n }\r\n\r\n _getColumnSpan(property) {\r\n return property.type == \"Text\" &&\r\n property.schema &&\r\n (property.schema.richText || property.schema.maxLength > 400)\r\n ? 6\r\n : 3;\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\nimport { withRouter } from 'react-router';\r\n\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { PrimaryButton, DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog'\r\n\r\nimport { ObservablePanel } from '../../../base/components/ObservablePanel';\r\n\r\nimport { EntityEditForm } from '../../components/core/EntityEditForm';\r\n\r\nexport const EntityNewPanel = inject('entityStore', 'routing')(withRouter(observer(\r\n class EntityNewPanel extends Component {\r\n\r\n render () {\r\n const { newStore } = this.props.entityStore;\r\n const { formData, formOptions, visible, isCloseDialogOpen, loading, isValid, isDirty } = newStore;\r\n return (\r\n <>\r\n \r\n {section.id !== WellKnownSectionIds.EntityBuiltIn && (\r\n {section.name} \r\n )}\r\n \r\n {groupedBySections[section.id].map((property) => (\r\n \r\n \r\n
\r\n )}\r\n \r\n \r\n {onNavigateBack && (\r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n Entity \r\n \r\n \r\n \r\n \r\n {entity.code ? (\r\n <>\r\n {entity.code} - {entity.name}\r\n \r\n ) : (\r\n entity.name\r\n )}\r\n \r\n
\r\n );\r\n }\r\n\r\n _getActionSetItems() {\r\n const { hideAllActions, hideAgentActions, canEdit, onEdit, canUpload, onUpload } = this.props;\r\n\r\n const items = [];\r\n const overflowItems = [];\r\n\r\n if (hideAllActions) {\r\n return { items, overflowItems };\r\n }\r\n\r\n if (!hideAgentActions) {\r\n items.push({\r\n key: \"edit\",\r\n name: \"Edit\",\r\n iconOnly: true,\r\n iconProps: { iconName: \"Edit\" },\r\n disabled: !canEdit || !canEdit(),\r\n ariaLabel: \"Edit\",\r\n onClick: onEdit,\r\n });\r\n }\r\n\r\n items.push({\r\n key: \"upload\",\r\n name: \"Upload\",\r\n iconOnly: true,\r\n iconProps: { iconName: \"Upload\" },\r\n disabled: !canUpload || !canUpload(),\r\n ariaLabel: \"Upload\",\r\n onClick: () => onUpload({ internalOnly: false }),\r\n });\r\n\r\n return { items, overflowItems };\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { Sidebar } from '@baseComponents/Sidebar';\r\nimport { SidebarProperties } from '@baseComponents/SidebarProperties';\r\nimport { SidebarProperty } from '@baseComponents/SidebarProperty';\r\n\r\nexport const EntitySidebar = observer(\r\n class EntitySidebar extends Component {\r\n\r\n render () {\r\n const { entity } = this.props;\r\n return (\r\n \r\n \r\n {entity.summary || \"Not set\"} \r\n
\r\n \r\n \r\n \r\n {entity.code || \"Not set\"}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.alias || \"Not set\"}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.website ? (\r\n \r\n \r\n Link \r\n ) : (\r\n \"Not set\"\r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.state}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.portfolio && entity.portfolio.name}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.businessCriticality}\r\n \r\n
\r\n \r\n \r\n \r\n {entity.industry ? entity.industry.name : \"Not set\"}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n ),\r\n };\r\n\r\n return (\r\n \r\n {score.likelihood} out of {maxLikelihood}\r\n
\r\n \r\n {score.impact} out of {maxImpact}\r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport Moment from \"react-moment\";\r\n\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { MessageBar } from \"office-ui-fabric-react/lib/MessageBar\";\r\nimport { DetailsListLayoutMode, Selection, SelectionMode, ConstrainMode } from \"office-ui-fabric-react/lib/DetailsList\";\r\nimport { ShimmeredDetailsList } from \"office-ui-fabric-react/lib/ShimmeredDetailsList\";\r\nimport { ContextualMenu } from \"office-ui-fabric-react/lib/ContextualMenu\";\r\nimport { Persona, PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\n\r\nimport { BoxPanel } from \"../../../base/components/BoxPanel\";\r\nimport { RoutingLink } from \"../../../base/components/RoutingLink\";\r\nimport { WrappedContent } from \"../../../base/components/WrappedContent\";\r\nimport { PhotoPersona } from \"../../../identity/containers/utilities/PhotoPersona\";\r\n\r\nimport { RiskScore } from \"../reviews/RiskScore\";\r\n\r\nexport const RiskGridView = observer(\r\n class RiskGridView extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {};\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n selectionDetails: this._getSelectionDetails(),\r\n });\r\n },\r\n });\r\n }\r\n\r\n render() {\r\n const { risks, loading, className, onRiskClick, disableSelection, query } = this.props;\r\n const { contextualMenuProps } = this.state;\r\n\r\n const columns = [\r\n {\r\n key: \"name\",\r\n name: \"Name\",\r\n fieldName: \"name\",\r\n minWidth: 310,\r\n isRowHeader: true,\r\n isResizable: true,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return (\r\n \r\n {scores.map((s, i) => (\r\n \r\n ))}\r\n
\r\n \r\n {score && score.score ? score.score : \"None\"}
\r\n \r\n {item.target.type && (\r\n
\r\n {item.review.treatmentsCount} \r\n {item.review.treatmentEffectiveness != 'Unknown' && item.review.treatmentEffectiveness != 0 && (\r\n
\r\n ) : null;\r\n },\r\n isPadded: true\r\n }, */\r\n {\r\n key: \"assigned\",\r\n name: \"Assigned\",\r\n fieldName: \"assigned\",\r\n minWidth: 200,\r\n maxWidth: 230,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { PureComponent } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\n\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { Card } from '@uifabric/react-cards';\r\n\r\nimport { RoutingLink } from '../../../base/components/RoutingLink';\r\n\r\nconst rootClassName = cx(\r\n 'cygraph-RegistryCardView-root',\r\n css` \r\n max-width: 100%;\r\n padding: 0 0 var(--spacing-xs) 0;\r\n user-select: none;\r\n background: var(--white);\r\n \r\n & > .ms-CardItem {\r\n margin-top: 3px;\r\n padding: 0 var(--spacing-xs);\r\n }\r\n\r\n & > .headerItem {\r\n margin-top: 0;\r\n padding: var(--spacing-xs);\r\n }\r\n\r\n & > .scoreItem {\r\n padding: var(--spacing-xs);\r\n }\r\n\r\n &.selected {\r\n & > .headerItem {\r\n /*background: #e7e4f1;*/\r\n }\r\n }\r\n\r\n & .counter {\r\n & .count {\r\n font-size: var(--font-size-xl);\r\n border-radius: 70px;\r\n width: 70px;\r\n height: 70px;\r\n line-height: 60px;\r\n text-align: center;\r\n padding: 0;\r\n border: 4px solid var(--nav-color-accent);\r\n font-weight: 600;\r\n }\r\n & .text {\r\n font-size: var(--font-size-xs);\r\n margin-top: var(--spacing-xxs);\r\n }\r\n }\r\n `\r\n);\r\n\r\n\r\nexport const RegistryCardView = observer(\r\n class RegistryCardView extends PureComponent {\r\n \r\n render () {\r\n const { registry, className, onRegistryClick, selected } = this.props;\r\n return (\r\n \r\n
\r\n \r\n \r\n Risk\r\n
\r\n Management\r\n \r\n
\r\n\r\n \r\n Management\r\n
\r\n
\r\n\r\n {onNewRisk && (\r\n \r\n Risk Registries \r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {\r\n ev.stopPropagation();\r\n routing.push(url);\r\n }}>\r\n {registry.name}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {registry.openCount}
Total Open
\r\n \r\n \r\n
\r\n {registry.pendingReviewCount}
Pending Review
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Registries {loading && loading...}\r\n \r\n\r\n \r\n {registries.map((registry) => {\r\n return (\r\n
\r\n );\r\n }\r\n\r\n _getMediumScreenColumns() {\r\n const { vertical } = this.props;\r\n\r\n if (vertical) {\r\n return 1;\r\n }\r\n\r\n return 2;\r\n }\r\n\r\n _getLargeScreenColumns() {\r\n const { registries, vertical } = this.props;\r\n\r\n if (vertical) {\r\n return 1;\r\n }\r\n\r\n if (registries.length % 3 == 0) {\r\n return 3;\r\n }\r\n\r\n if (registries.length % 4 == 0) {\r\n return 4;\r\n }\r\n\r\n return 3;\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { TagPicker, ValidationState } from \"office-ui-fabric-react/lib/Pickers\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-ControlPicker-container\",\r\n css`\r\n & .ms-BasePicker-text {\r\n background-color: var(--white);\r\n min-height: 32px;\r\n }\r\n & .ms-Persona-coin {\r\n width: 20px;\r\n }\r\n & .ms-Persona-initials {\r\n display: none;\r\n }\r\n & .ms-Persona-presence {\r\n top: 6px;\r\n right: 0;\r\n }\r\n `\r\n);\r\n\r\nconst calloutClassName = cx(\r\n \"cygraph-ControlPicker-callout\",\r\n css`\r\n & .ms-Persona {\r\n width: 300px;\r\n }\r\n & .ms-Persona-coin {\r\n width: 10px;\r\n }\r\n & .ms-Persona-initials {\r\n display: none;\r\n }\r\n & .ms-Persona-presence {\r\n top: -4px;\r\n right: 14px;\r\n }\r\n `\r\n);\r\n\r\nconst personaClassName = cx(\r\n \"cygraph-ControlPicker-persona\",\r\n css`\r\n height: 20px;\r\n & .ms-Persona {\r\n width: 300px;\r\n }\r\n & .ms-Persona-coin {\r\n width: 10px;\r\n }\r\n & .ms-Persona-initials {\r\n display: none;\r\n }\r\n & .ms-Persona-presence {\r\n top: 7px;\r\n right: 18px;\r\n }\r\n `\r\n);\r\n\r\nexport const ControlPicker = observer(\r\n class ControlPicker extends Component {\r\n render() {\r\n const {\r\n label,\r\n placeholder,\r\n readOnly,\r\n required,\r\n itemLimit,\r\n disabled,\r\n className,\r\n onSelected,\r\n onFilter,\r\n selected,\r\n multiple,\r\n loading,\r\n } = this.props;\r\n\r\n const suggestionProps = {\r\n suggestionsHeaderText: \"Suggested controls\",\r\n mostRecentlyUsedHeaderText: \"Suggested controls\",\r\n noResultsFoundText: \"No controls found\",\r\n loadingText: \"Loading...\",\r\n showRemoveButtons: false,\r\n suggestionsAvailableAlertText: \"Control picker suggestions available\",\r\n suggestionsContainerAriaLabel: \"Suggested controls\",\r\n };\r\n\r\n const items = multiple ? selected || [] : selected ? [selected] : [];\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n })}\r\n \r\n \r\n \r\n\r\n item.name}\r\n selectedItems={items.map((s) => this._getOptionFromControl(s))}\r\n onResolveSuggestions={(text, current, limit) => {\r\n return onFilter(text, current, limit).then((result) => {\r\n return result.map((s) => this._getOptionFromControl(s));\r\n });\r\n }}\r\n //onEmptyInputFocus={returnMostRecentlyUsed}\r\n pickerSuggestionsProps={suggestionProps}\r\n className={\"cygraph-ControlPicker\"}\r\n onValidateInput={this._validateInput}\r\n removeButtonAriaLabel={\"Remove\"}\r\n itemLimit={multiple ? itemLimit : 1}\r\n inputProps={{\r\n placeholder: placeholder,\r\n }}\r\n pickerCalloutProps={{\r\n className: calloutClassName,\r\n }}\r\n onChange={(items) => {\r\n if (onSelected) {\r\n const current = items.map((i) => i.data);\r\n onSelected(multiple ? current : current.length ? current[0] : null);\r\n }\r\n return items;\r\n }}\r\n resolveDelay={300}\r\n disabled={disabled}\r\n />\r\n
\r\n );\r\n }\r\n\r\n _getOptionFromControl(control) {\r\n return {\r\n key: control.id,\r\n name: control.name,\r\n data: control,\r\n };\r\n }\r\n\r\n _validateInput(input) {\r\n if (input.indexOf(\"@\") !== -1) {\r\n return ValidationState.valid;\r\n } else if (input.length > 1) {\r\n return ValidationState.warning;\r\n } else {\r\n return ValidationState.invalid;\r\n }\r\n }\r\n }\r\n);\r\n","import { observable, action, flow } from \"mobx\";\r\n\r\nimport { ControlService } from \"../../../api/modelling\";\r\nimport { ControlStore } from \"./ControlStore\";\r\n\r\nexport class ControlPickerStore {\r\n private parentStore: ControlStore;\r\n private controlService: ControlService;\r\n\r\n @observable public selectedControls: any[] = [];\r\n @observable public controls: any[] = [];\r\n @observable public loading: boolean = false;\r\n\r\n constructor(parentStore: ControlStore) {\r\n this.parentStore = parentStore;\r\n this.controlService = parentStore.controlService;\r\n }\r\n\r\n public loadControls = flow(function* (options) {\r\n this.loading = true;\r\n const o = Object.assign({ pageSize: 25, startIndex: 0 }, options);\r\n\r\n try {\r\n const result = yield this.controlService.getControls(o);\r\n this.controls = result.items;\r\n return result.items;\r\n } catch (e) {\r\n console.error(e);\r\n this.error = e;\r\n } finally {\r\n this.loading = false;\r\n }\r\n });\r\n\r\n public loadControlsByIds = flow(function* (ids) {\r\n this.loading = true;\r\n\r\n try {\r\n const result = yield Promise.all(\r\n ids.map((id) => {\r\n return this.controlService.getControl(id);\r\n })\r\n );\r\n this.controls = result;\r\n } catch (e) {\r\n console.error(e);\r\n this.error = e;\r\n } finally {\r\n this.loading = false;\r\n }\r\n });\r\n\r\n @action\r\n public setSelected(assets: any[]) {\r\n this.selectedControls = assets;\r\n }\r\n\r\n @action\r\n public setSelectedWithId(id: string | null) {\r\n if (!id) {\r\n this.selectedControls = [];\r\n } else {\r\n if (this.selectedControls.length == 1 && this.selectedControls[0].id == id) {\r\n return;\r\n }\r\n return this.loadControlsByIds([id]);\r\n }\r\n }\r\n\r\n @action\r\n public setSelectedWithIds(ids: string[] | null) {\r\n if (ids == null || ids.length == 0) {\r\n this.selectedControls = [];\r\n } else {\r\n return this.loadControlsByIds(ids);\r\n }\r\n }\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { PrimaryButton, ActionButton, DefaultButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { Callout } from \"office-ui-fabric-react/lib/Callout\";\r\n\r\nimport { RichDropdown } from \"../../../base/richdropdown/RichDropdown\";\r\n\r\nconst calloutClassName = cx(css``);\r\n\r\nconst controlPickerContainerClassName = cx(css`\r\n display: flex;\r\n`);\r\n\r\nexport const ControlHierarchyPicker = inject(\"controlStore\")(\r\n observer(\r\n class ControlHierarchyPicker extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isControlsCalloutOpen: false,\r\n selectedMainControl: null,\r\n selectedLevel1Control: null,\r\n selectedLevel2Control: null,\r\n textSearch: \"\",\r\n };\r\n props.controlStore.mapEditStore.loadControls({ cache: true });\r\n }\r\n componentWillReceiveProps(props) {\r\n this.preSelectOptions(props);\r\n }\r\n\r\n preSelectOptions(props) {\r\n const { selected, controlStore } = props;\r\n const { mapEditStore } = controlStore;\r\n const { controls } = mapEditStore;\r\n if (controls && selected && selected.length === 1) {\r\n // console.log(selected[0].id)\r\n controls.forEach((mainControl) => {\r\n mainControl.children.forEach((level1Control) => {\r\n level1Control.children.forEach((level2Control) => {\r\n if (level2Control.id === selected[0].id) {\r\n // console.log('Found', level2Control, level1Control, mainControl);\r\n this.setState({\r\n selectedMainControl: {\r\n title: mainControl.name,\r\n key: mainControl.id,\r\n description: mainControl.description ? \r\n C.name).join(\", \")}\r\n onRenderSuffix={() => (\r\n {\r\n this.preSelectOptions(this.props);\r\n this.setState({\r\n isControlsCalloutOpen: true,\r\n });\r\n }}\r\n />\r\n )}\r\n />\r\n
\r\n {this.state.isControlsCalloutOpen && (\r\n \r\n {\r\n this.setState({\r\n textSearch: value\r\n })\r\n }}\r\n value={this.state.textSearch}\r\n />\r\n
*/}\r\n\r\n \r\n {\r\n this.setState({\r\n selectedMainControl: item,\r\n selectedLevel1Control: null,\r\n selectedLevel2Control: null,\r\n });\r\n }}\r\n />\r\n \r\n this.setState({\r\n selectedLevel1Control: item,\r\n selectedLevel2Control: null,\r\n })\r\n }\r\n />\r\n \r\n this.setState({\r\n selectedLevel2Control: item,\r\n })\r\n }\r\n />\r\n
\r\n \r\n \r\n \r\n this.onCloseDialog()}\r\n text=\"Close\"\r\n disabled={this.props.saving}\r\n />\r\n this.onControlPicked()}\r\n text=\"Done\"\r\n />\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n );\r\n }\r\n }\r\n )\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\n\r\nimport { ControlPicker as StatelessControlPicker } from '../../components/core/ControlPicker';\r\n\r\nimport { ControlPickerStore } from '../../stores/ControlPickerStore';\r\n\r\nexport const ControlPicker = inject('controlStore')(observer(\r\n class ControlPicker extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = { \r\n pickerStore: new ControlPickerStore(this.props.controlStore),\r\n }\r\n }\r\n\r\n componentWillMount() {\r\n const { pickerStore } = this.state;\r\n const { multiple, selected, selectedId, selectedIds } = this.props;\r\n\r\n if(typeof(selected) !== 'undefined') {\r\n pickerStore.setSelected(multiple ? (selected || []) : (selected ? [selected] : []));\r\n } else if(!multiple) {\r\n pickerStore.setSelectedWithId(selectedId);\r\n } else {\r\n pickerStore.setSelectedWithIds(selectedIds);\r\n }\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { pickerStore } = this.state;\r\n const { multiple, selected, selectedId, selectedIds } = nextProps;\r\n\r\n if(typeof(selected) !== 'undefined') {\r\n if(selected != this.props.selected) {\r\n pickerStore.setSelected(multiple ? (selected || []) : (selected ? [selected] : []));\r\n }\r\n } else if(!multiple) {\r\n if(selectedId != this.props.selectedId) {\r\n pickerStore.setSelectedWithId(selectedId);\r\n }\r\n } else {\r\n if(selectedIds != this.props.selectedIds) {\r\n pickerStore.setSelectedWithIds(selectedIds);\r\n }\r\n }\r\n }\r\n \r\n render () {\r\n const { pickerStore } = this.state;\r\n const { className, label, required, placeholder, readOnly, multiple, itemCount, disabled, onChange } = this.props;\r\n const { selectedControls, loading } = pickerStore;\r\n \r\n const selected = multiple ? selectedControls : (selectedControls.length ? selectedControls[0] : null);\r\n\r\n return (\r\n \r\n \r\n \r\n {loading && \r\n (except || []).indexOf(r.id) === -1)\r\n .map((p) => ({ key: p.id, text: p.name, data: p }))}\r\n onChange={(event, option, index, value) => {\r\n if (multiple) {\r\n if (option) {\r\n const newSelected = [...selectedCategoryIds];\r\n const index = newSelected.indexOf(option.key);\r\n if (index == -1) {\r\n newSelected.push(option.key);\r\n } else {\r\n newSelected.splice(index, 1);\r\n }\r\n pickerStore.setSelectedWithIds(newSelected);\r\n\r\n if (onChange) {\r\n onChange(\r\n categories.filter(\r\n (r) => newSelected.indexOf(r.id) != -1\r\n )\r\n );\r\n }\r\n }\r\n } else {\r\n pickerStore.setSelectedWithId(option ? option.key : null);\r\n if (onChange) {\r\n onChange(option ? option.data : null);\r\n }\r\n }\r\n }}\r\n />\r\n
\r\n );\r\n }\r\n }\r\n )\r\n);\r\n","import React, { useState, useRef } from \"react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { Callout } from \"office-ui-fabric-react/lib/Callout\";\r\n\r\nconst triggerClassName = cx(\r\n \"cygraph-MoreInfoCallout-trigger\",\r\n css`\r\n display: inline-block;\r\n `\r\n);\r\n\r\nconst calloutClassName = cx(\r\n \"cygraph-MoreInfoCallout-callout\",\r\n css`\r\n .content {\r\n padding: var(--spacing-xxs);\r\n }\r\n `\r\n);\r\n\r\nexport function MoreInfoCallout({ label, disabled, iconProps, children, onCancel }) {\r\n const [visible, setVisible] = useState(false);\r\n const triggerElement = useRef(null);\r\n\r\n const toggleVisibility = () => {\r\n setVisible(!visible);\r\n };\r\n\r\n const onCalloutDismiss = () => {\r\n toggleVisibility();\r\n if (onCancel) {\r\n onCancel();\r\n }\r\n };\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nimport { MoreInfoCallout } from \"../../../base/components/MoreInfoCallout\";\r\nimport { MarkdownViewer } from \"../../../editors/components/MarkdownViewer\";\r\n\r\nexport function RiskScoreTooltip({ tooltip }) {\r\n return tooltip ? (\r\n \r\n \r\n {label}\r\n \r\n
\r\n {visible && !disabled && (\r\n {children}
\r\n \r\n )}\r\n \r\n
\r\n );\r\n }\r\n\r\n _onChange(score) {\r\n const { onChange } = this.props;\r\n if (onChange) {\r\n onChange(score);\r\n this._onDismiss();\r\n } else {\r\n this.setState((prevState) => {\r\n prevState.selectedScore = score;\r\n prevState.showPicker = false;\r\n return prevState;\r\n });\r\n }\r\n }\r\n\r\n _onClick(event) {\r\n this.setState((prevState) => {\r\n prevState.showPicker = !prevState.showPicker;\r\n return prevState;\r\n });\r\n }\r\n\r\n _onDismiss() {\r\n this.setState((prevState) => {\r\n prevState.showPicker = false;\r\n return prevState;\r\n });\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\r\nimport { Dropdown } from \"office-ui-fabric-react/lib/Dropdown\";\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\n\r\nimport { RichTextField } from \"../../../editors/components/RichTextField\";\r\nimport { ControlPicker } from \"../../../controls/containers/pickers/ControlPicker\";\r\nimport { ControlHierarchyPicker } from \"../../../controls/containers/pickers/ControlHierarchyPicker\";\r\n\r\nimport { RiskCategoryPicker } from \"../../containers/pickers/RiskCategoryPicker\";\r\nimport { RiskScoreTooltip } from \"./RiskScoreTooltip\";\r\nimport { RiskScoreField } from \"./RiskScoreField\";\r\n\r\nexport const ReviewEditForm = observer(\r\n class ReviewEditForm extends Component {\r\n render() {\r\n const { formData, formOptions } = this.props;\r\n const isExceptionTemplate = formOptions.typeTemplate === \"zerodai:risks:exception\";\r\n const isControlException = isExceptionTemplate && formOptions.typeName === \"Control Exception\";\r\n\r\n return (\r\n \r\n \r\n this._onDismiss()}\r\n setInitialFocus={true}\r\n >\r\n \r\n this._onChange(score)} />\r\n \r\n \r\n )}\r\n
\r\n this._onClick(e)} ref={(el) => (this._buttonElement = el)}>\r\n
\r\n {!disabled && this.state.showPicker && (\r\n \r\n \r\n {isExceptionTemplate ? null : (\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {isControlException && (\r\n \r\n {\r\n formData.category = category;\r\n }}\r\n />\r\n \r\n )}\r\n\r\n {isControlException && (\r\n \r\n {\r\n formData.controls = [controls];\r\n }}\r\n />\r\n {/* {\r\n formData.controls = controls;\r\n }}\r\n /> */}\r\n \r\n )}\r\n {isControlException && (\r\n \r\n {\r\n formData.policyDescription = val;\r\n }}\r\n />\r\n \r\n )}\r\n\r\n {isControlException && (\r\n \r\n (formData.businessAppetite = op.key)}\r\n options={[\"Minor\", \"Moderate\", \"Major\", \"Critical\"].map((p) => ({\r\n key: p,\r\n text: p,\r\n }))}\r\n />\r\n \r\n )}\r\n\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\n\r\nimport { isUserAuthenticated, isUserInAnyRoles, isUserInAllRoles } from '../../stores/PrincipalContextUtilities';\r\n\r\nexport const SecurityTrimmed = inject('rootStore', 'principalContext')(observer(\r\n class SecurityTrimmed extends React.Component {\r\n\r\n render () {\r\n const { principalContext, any, all, allowGuest, predicate } = this.props;\r\n \r\n if((allowGuest && isUserAuthenticated(principalContext.current)) \r\n || (any && isUserInAnyRoles(principalContext.current, any)) \r\n || (all && isUserInAllRoles(principalContext.current, all))\r\n || (predicate && predicate(principalContext.current))) {\r\n return this.props.children;\r\n }\r\n\r\n return null;\r\n }\r\n }\r\n));\r\n","import { observable, action } from \"mobx\";\r\n\r\nimport { RiskStore } from \"./RiskStore\";\r\n\r\nexport class RiskTargetPickerStore {\r\n\r\n private parentStore: RiskStore;\r\n\r\n @observable public targetType: string;\r\n @observable public targetId: string;\r\n @observable public targetName: string;\r\n @observable public targetData: any;\r\n\r\n constructor(parentStore: RiskStore) {\r\n this.parentStore = parentStore;\r\n }\r\n\r\n @action\r\n public setTargetType(targetType) {\r\n this.targetType = targetType;\r\n this.setTargetData(null);\r\n }\r\n\r\n @action\r\n public setTargetData(targetData) {\r\n if(targetData) {\r\n this.targetData = targetData;\r\n this.targetId = targetData.id;\r\n this.targetName = targetData.name;\r\n } else {\r\n this.targetId = null;\r\n this.targetName = null;\r\n this.targetData = null;\r\n }\r\n }\r\n}\r\n","import React, { Component, Fragment } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\n\r\nimport { ComboBox } from 'office-ui-fabric-react/lib/ComboBox';\r\n\r\nimport { AssetPicker } from '../../../assets/containers/pickers/AssetPicker';\r\nimport { RiskTargetPickerStore } from '../../stores/RiskTargetPickerStore';\r\n\r\nexport const RiskTargetPicker = inject('riskStore')(observer(\r\n class RiskTargetPicker extends Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = { \r\n pickerStore: new RiskTargetPickerStore(this.props.riskStore),\r\n }\r\n }\r\n\r\n componentWillMount() {\r\n const { pickerStore } = this.state;\r\n const { selected } = this.props;\r\n\r\n if(typeof(selected) !== 'undefined') {\r\n pickerStore.setTargetType(selected ? selected.type : null);\r\n if(selected) {\r\n pickerStore.setTargetData(selected);\r\n }\r\n }\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { pickerStore } = this.state;\r\n const { selected } = nextProps;\r\n\r\n if(typeof(selected) !== 'undefined') {\r\n pickerStore.setTargetType(selected ? selected.type : null);\r\n if(selected) {\r\n pickerStore.setTargetData(selected);\r\n }\r\n }\r\n }\r\n \r\n render () {\r\n const { pickerStore } = this.state;\r\n const { label, required, placeholder, onChange, disableType, disabled, className } = this.props;\r\n const { targetType, targetId } = pickerStore;\r\n \r\n return (\r\n \r\n {\r\n formData.grossScore = Object.assign({}, formData.grossScore, score);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {\r\n formData.grossScore.description = val;\r\n }}\r\n />\r\n
\r\n \r\n {\r\n formData.treatments = [\r\n {\r\n type: \"Mitigate\",\r\n description: val,\r\n },\r\n ];\r\n }}\r\n />\r\n
\r\n \r\n {\r\n formData.netScore = Object.assign({}, formData.netScore, score);\r\n if (isExceptionTemplate) {\r\n formData.grossScore = Object.assign({}, formData.grossScore, score);\r\n }\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {\r\n formData.netScore.description = val;\r\n if (isExceptionTemplate) {\r\n formData.grossScore.description = val;\r\n }\r\n }}\r\n />\r\n
\r\n \r\n {\r\n formData.nextReviewDue = val;\r\n }}\r\n />\r\n
\r\n \r\n \r\n \r\n ({ key: p, text: p }))}\r\n onChange={(event, option) => {\r\n pickerStore.setTargetType(option.key);\r\n if(onChange) {\r\n onChange({\r\n type: option.key,\r\n }, null);\r\n }\r\n }} />\r\n \r\n \r\n { targetType == 'Asset' && (\r\n {\r\n pickerStore.setTargetData(target);\r\n if(onChange) {\r\n if(target) {\r\n onChange({\r\n type: targetType,\r\n id: target.id,\r\n name: target.name\r\n }, target);\r\n } else {\r\n onChange({\r\n type: targetType,\r\n }, null);\r\n }\r\n }\r\n }} />\r\n ) }\r\n { targetType == 'Entity' && (\r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n));\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Icon } from \"office-ui-fabric-react/lib/Icon\";\r\nimport { Dropdown } from \"office-ui-fabric-react/lib/Dropdown\";\r\n\r\nimport { PortfolioPicker } from \"../../../portfolios/containers/pickers/PortfolioPicker\";\r\nimport { RichTextField } from \"../../../editors/components/RichTextField\";\r\nimport { BigTextField } from \"../../../base/components/BigTextField\";\r\nimport { ObservableSeparator } from \"../../../base/components/ObservableSeparator\";\r\nimport { PrincipalPicker } from \"../../../identity/containers/PrincipalPicker\";\r\nimport { SecurityTrimmed } from \"../../../identity/containers/utilities/SecurityTrimmed\";\r\nimport { RoleNames } from \"../../../identity/stores/PrincipalContextUtilities\";\r\n\r\nimport { RegistryPicker } from \"../../containers/pickers/RegistryPicker\";\r\nimport { RiskTargetPicker } from \"../../containers/pickers/RiskTargetPicker\";\r\n\r\nexport const RiskEditForm = observer(\r\n class RiskEditForm extends Component {\r\n render() {\r\n const { formData, formOptions } = this.props;\r\n\r\n return (\r\n Supplier is not yet supported
\r\n )} \r\n { targetType == 'Process' && (\r\n Process is not yet supported
\r\n )} \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\nimport { PrimaryButton, ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { ObservablePanel } from \"../../../base/components/ObservablePanel\";\r\nimport { ReviewEditForm } from \"../../components/reviews/ReviewEditForm\";\r\nimport { RiskEditForm } from \"../../components/core/RiskEditForm\";\r\n\r\nexport const RiskNewPanel = inject(\r\n \"riskStore\",\r\n \"routing\"\r\n)(\r\n withRouter(\r\n observer(\r\n class RiskEditPanel extends Component {\r\n render() {\r\n const { editStore } = this.props.riskStore;\r\n const { visible, formData, formOptions } = editStore;\r\n\r\n return (\r\n \r\n \r\n \r\n (formData.title = value)}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n Request Source \r\n \r\n \r\n \r\n \r\n (formData.trigger = op.key)}\r\n options={[\"Manual\", \"Assessment\", \"Event\"].map((p) => ({\r\n key: p,\r\n text: p,\r\n }))}\r\n />\r\n \r\n \r\n (formData.requestedBy = contact)}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n Key Information \r\n \r\n \r\n \r\n \r\n {\r\n formData.portfolio = portfolio;\r\n }}\r\n />\r\n \r\n \r\n {\r\n formData.registry = registry;\r\n }}\r\n />\r\n \r\n \r\n {\r\n formData.lifecycle.businessContact = contact;\r\n }}\r\n />\r\n \r\n \r\n {\r\n formData.lifecycle.technicalContact = contact;\r\n }}\r\n />\r\n \r\n \r\n
\r\n\r\n \r\n {\r\n formData.target = target;\r\n }}\r\n />\r\n
\r\n \r\n {\r\n formData.description = val;\r\n }}\r\n />\r\n
\r\n\r\n \r\n {\r\n formData.context = val;\r\n }}\r\n />\r\n
\r\n\r\n {!formOptions.disableAssessment && formData.assessment && (\r\n \r\n \r\n
\r\n )}\r\n\r\n {!formOptions.disableAssessment && formData.advisories && (\r\n \r\n
\r\n \r\n \r\n
\r\n )}\r\n - \r\n {formData.advisories.map((advisory) => (\r\n
- \r\n
\r\n {advisory.title}\r\n \r\n ))}\r\n
\r\n {section == \"Risk\" && (\r\n
\r\n );\r\n }\r\n\r\n _renderFooter() {\r\n const { editStore } = this.props.riskStore;\r\n const { formData, formOptions, isValid, isSectionValid, section } = editStore;\r\n\r\n if (!formData || !formOptions) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
\r\n )}\r\n {section == \"Review\" && (\r\n \r\n
\r\n )}\r\n \r\n {registryStore.registries.length !== 0 && (\r\n \r\n {Object.keys(risks).map((id) => {\r\n const tab = risks[id];\r\n return (\r\n \r\n \r\n );\r\n })}\r\n \r\n\r\n
\r\n \r\n );\r\n }\r\n\r\n _onNewRisk() {\r\n this.props.routing.push(\"/risks/new\");\r\n }\r\n }\r\n )\r\n);\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { FilterBar } from \"@modules/base/components/FilterBar\";\r\n\r\nexport const RiskFilterBar = observer(({ value, onChange, context, disabled }) => {\r\n const { riskStore } = useStores();\r\n const [subStatus, setSubStatus] = useState([]);\r\n\r\n useEffect(() => {\r\n riskStore.riskService.getSubStatuses(\"zerodai:risks:generic\").then((subStatus) => {\r\n setSubStatus(subStatus.filter((s) => s !== null));\r\n });\r\n }, []);\r\n\r\n const filters = [\r\n {\r\n name: \"keywords\",\r\n label: \"Keywords\",\r\n type: \"Search\",\r\n keywords: true,\r\n placeholder: \"Search by unique id or title\",\r\n },\r\n // {\r\n // name: \"registry\",\r\n // label: \"Registry\",\r\n // type: \"Registry\",\r\n // multiple: true,\r\n // allowClear: true,\r\n // query: {},\r\n // },\r\n {\r\n name: \"portfolio\",\r\n label: \"Portfolio\",\r\n type: \"Portfolio\",\r\n multiple: true,\r\n allowClear: true,\r\n query: {},\r\n },\r\n {\r\n name: \"subStatus\",\r\n label: \"Status\",\r\n type: \"Dropdown\",\r\n multiple: true,\r\n allowClear: true,\r\n options: subStatus.map((s) => ({ key: s, text: s })),\r\n },\r\n {\r\n name: \"assignedToUser\",\r\n label: \"Assigned To\",\r\n type: \"Principal\",\r\n multiple: true,\r\n allowClear: true,\r\n },\r\n {\r\n name: \"grossScore\",\r\n label: \"Gross Score\",\r\n type: \"Dropdown\",\r\n multiple: true,\r\n allowClear: true,\r\n options: [\r\n { key: \"None\", text: \"None\" },\r\n { key: \"Minor\", text: \"Minor\" },\r\n { key: \"Moderate\", text: \"Moderate\" },\r\n { key: \"Major\", text: \"Major\" },\r\n { key: \"Critical\", text: \"Critical\" },\r\n ],\r\n },\r\n {\r\n name: \"netScore\",\r\n label: \"Net Score\",\r\n type: \"Dropdown\",\r\n multiple: true,\r\n allowClear: true,\r\n options: [\r\n { key: \"None\", text: \"None\" },\r\n { key: \"Minor\", text: \"Minor\" },\r\n { key: \"Moderate\", text: \"Moderate\" },\r\n { key: \"Major\", text: \"Major\" },\r\n { key: \"Critical\", text: \"Critical\" },\r\n ],\r\n },\r\n ];\r\n return \r\n this._onNewRisk(options)}\r\n filterFields={this.filterFields}\r\n minibarFilters={[\"keywords\"]}\r\n calloutFilters={[\r\n \"registry\",\r\n \"portfolio\",\r\n \"subStatus\",\r\n \"assignedTo\",\r\n \"grossScore\",\r\n \"grossImpactLikelihood\",\r\n \"netScore\",\r\n \"netImpactLikelihood\",\r\n ]}\r\n onSearchChange={(filters) => {\r\n if (filters) {\r\n const keywordsFilter = filters.find((F) => F.fieldName === \"keywords\");\r\n const portfoliosFilter = filters.find((F) => F.fieldName === \"portfolio\");\r\n const subStatusFilter = filters.find((F) => F.fieldName === \"subStatus\");\r\n const assignedToFilter = filters.find((F) => F.fieldName === \"assignedTo\");\r\n const grossScoreToFilter = filters.find(\r\n (F) => F.fieldName === \"grossScore\"\r\n );\r\n const grossImpactToFilter = filters.find(\r\n (F) => F.fieldName === \"grossImpact\"\r\n );\r\n const grossLikelihoodToFilter = filters.find(\r\n (F) => F.fieldName === \"grossLikelihood\"\r\n );\r\n const netScoreToFilter = filters.find((F) => F.fieldName === \"netScore\");\r\n const netImpactToFilter = filters.find((F) => F.fieldName === \"netImpact\");\r\n const netLikelihoodToFilter = filters.find(\r\n (F) => F.fieldName === \"netLikelihood\"\r\n );\r\n const registryFilter = filters.find((F) => F.fieldName === \"registry\");\r\n\r\n const query = {\r\n keywords: keywordsFilter.getValues(keywordsFilter),\r\n portfolio: portfoliosFilter.getValues(portfoliosFilter.items),\r\n subStatus: subStatusFilter.getValues(subStatusFilter.items),\r\n assignedToUser: assignedToFilter.getValues(assignedToFilter.items),\r\n grossScore: grossScoreToFilter.getValues(grossScoreToFilter.items),\r\n netScore: netScoreToFilter.getValues(netScoreToFilter.items),\r\n grossImpact: grossImpactToFilter.getValues(grossImpactToFilter.items),\r\n grossLikelihood: grossLikelihoodToFilter.getValues(\r\n grossLikelihoodToFilter.items\r\n ),\r\n netImpact: netImpactToFilter.getValues(netImpactToFilter.items),\r\n netLikelihood: netLikelihoodToFilter.getValues(\r\n netLikelihoodToFilter.items\r\n ),\r\n registry: registryFilter.value ? [registryFilter.value] : null,\r\n };\r\n routing.push(`/risks/heatmap?query=${JsonQueryString.encode(query)}`);\r\n } else {\r\n routing.push(`/heatmap/browse`);\r\n }\r\n }}\r\n />\r\n
\r\n\r\n {children}
\r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport moment from \"moment\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\nimport { Toggle } from \"@ui/elements/Toggle\";\r\nimport { Text } from \"@ui/elements/Text\";\r\nimport { FontIcon } from \"@ui/elements/Icon\";\r\nimport { PersonaSize } from \"@ui/elements/Persona\";\r\nimport { IconButton } from \"@ui/elements/Button\";\r\n\r\nimport { RoutingLink } from \"@modules/base/components/RoutingLink\";\r\nimport { ListItemReveal } from \"@modules/base/components/ListItemReveal\";\r\nimport { UserHoverCard } from \"@modules/identity/containers/utilities/UserHoverCard\";\r\nimport { PhotoPersona } from \"@modules/identity/containers/utilities/PhotoPersona\";\r\n\r\nimport {\r\n getEventDisplayName,\r\n getEventIconName,\r\n getActivityDisplayName,\r\n getActivityIconName,\r\n getActivityScopeLabel,\r\n} from \"@modules/workflows/stores/WorkflowConstants\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-ActivityInstanceCardView-root\",\r\n css`\r\n background: var(--white);\r\n border-radius: var(--border-radius);\r\n box-shadow: var(--box-shadow);\r\n border: 1px solid var(--border-color);\r\n padding: var(--spacing-s);\r\n margin-bottom: var(--spacing-xs);\r\n min-height: 100px;\r\n `\r\n);\r\n\r\nexport const ActivityInstanceCardView = observer(({ className, instance, simple, canEdit, onEdit, onRemove }) => {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n {iconName &&
\r\n \r\n {description}\r\n
\r\n {children}\r\n \r\n {buttonLabel && onConfigure && (\r\n
\r\n \r\n {loading && [1, 2, 3, 4].map((i) => onCreate() : null}\r\n />\r\n )}\r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport Moment from \"react-moment\";\r\n\r\nimport { MessageBar } from \"@ui/elements/MessageBar\";\r\nimport { Text } from \"@ui/elements/Text\";\r\n\r\nimport { DetailsListLayoutMode, SelectionMode, ConstrainMode } from \"office-ui-fabric-react/lib/DetailsList\";\r\nimport { ShimmeredDetailsList } from \"office-ui-fabric-react/lib/ShimmeredDetailsList\";\r\n\r\nimport { BoxPanel } from \"@modules/base/components/BoxPanel\";\r\nimport { WrappedContent } from \"@modules/base/components/WrappedContent\";\r\n\r\nexport const WorkflowHistoryActivityGridView = observer((props) => {\r\n const { className, activities, loading, disableSelection } = props;\r\n\r\n const columns = [\r\n {\r\n key: \"action\",\r\n name: \"Action\",\r\n minWidth: 150,\r\n isRowHeader: true,\r\n isResizable: true,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return (\r\n {item.activity.name}
\r\n \r\n {item.message}\r\n
\r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Actions \r\n \r\n \r\n
\r\n );\r\n});\r\n","import React, { useCallback } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\n\r\nimport { ActionButton } from \"@ui/elements/Button\";\r\n\r\nimport { ActionPanel } from \"@modules/base/components/ActionPanel\";\r\nimport { ObservablePanel } from \"@modules/base/components/ObservablePanel\";\r\n\r\nimport { WorkflowHistoryViewer } from \"@modules/workflows/components/core/WorkflowHistoryViewer\";\r\n\r\nexport const WorkflowHistoryViewerPanel = observer(({ store }) => {\r\n const { history, activities } = store;\r\n\r\n const onDismiss = useCallback(() => {\r\n store.resolve(false);\r\n }, [store]);\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n {history.status}\r\n
\r\n \r\n \r\n \r\n {history.message}.\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {formData.name || \"Unnamed Automation\"}\r\n \r\n \r\n {getEventDisplayName(formData.trigger.event)}\r\n 🠖 \r\n {getActivityDisplayName(formData.definition)}\r\n \r\n \r\n \r\n (formData.active = val)} />\r\n \r\n {formData.active ? \"Enabled\" : \"Disabled\"}\r\n \r\n \r\n \r\n \r\n \r\n {\r\n formData.name = val;\r\n }}\r\n />\r\n \r\n \r\n {formData && registration && registration.editor && (\r\n \r\n \r\n\r\n \r\n \r\n Settings \r\n \r\n \r\n {\r\n formData.notes = val;\r\n }}\r\n />\r\n \r\n \r\n {\r\n const parsed = parseInt(val);\r\n if (!isNaN(parsed)) {\r\n formData.order = parsed;\r\n }\r\n }}\r\n />\r\n \r\n \r\n
\r\n );\r\n});\r\n","import React, { useCallback } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\n\r\nimport { ActionButton, SpinnerButton } from \"@ui/elements/Button\";\r\n\r\nimport { ObservablePanel } from \"@modules/base/components/ObservablePanel\";\r\nimport { ActionPanel } from \"@modules/base/components/ActionPanel\";\r\n\r\nimport { ActivityInstanceEditForm } from \"@modules/workflows/components/core/ActivityInstanceEditForm\";\r\n\r\nexport const ActivityInstanceNewPanel = observer(({ store }) => {\r\n const { visible, formData, formOptions, isValid, processing, registration } = store;\r\n\r\n const onSave = useCallback(() => {\r\n store.resolve(true);\r\n }, [store]);\r\n\r\n const onDismiss = useCallback(() => {\r\n store.resolve(false);\r\n }, [store]);\r\n\r\n return (\r\n \r\n \r\n {filteredAutomations.map((instance, i) => (\r\n \r\n \r\n ))}\r\n \r\n {!loading && !filteredAutomations.length && (\r\n (builderStore.query = {})}\r\n />\r\n )}\r\n
\r\n );\r\n});\r\n","import React, { useEffect, useCallback, useState } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { TooltipHost } from \"office-ui-fabric-react/lib/Tooltip\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { Pivot, PivotItem, PivotLinkFormat } from \"office-ui-fabric-react/lib/Pivot\";\r\n\r\nimport { GhostButton, DefaultButton, SpinnerButton, PrimaryButton } from \"@ui/elements/Button\";\r\n\r\nimport { BigModal } from \"@modules/base/components/BigModal\";\r\nimport { ObservablePagination } from \"@modules/base/components/ObservablePagination\";\r\n\r\nimport { WorkflowHistoryFilterBar } from \"@modules/workflows/components/core/WorkflowHistoryFilterBar\";\r\nimport { ActivityBuilderFilterBar } from \"@modules/workflows/components/core/ActivityBuilderFilterBar\";\r\nimport { WorkflowHistoryGridView } from \"@modules/workflows/components/core/WorkflowHistoryGridView\";\r\nimport { ActivityInstanceListView } from \"@modules/workflows/components/core/ActivityInstanceListView\";\r\n\r\nimport { WorkflowHistoryViewerPanel } from \"@modules/workflows/containers/panels/WorkflowHistoryViewerPanel\";\r\nimport { ActivityInstanceNewPanel } from \"@modules/workflows/containers/panels/ActivityInstanceNewPanel\";\r\nimport { ActivityInstanceEditPanel } from \"@modules/workflows/containers/panels/ActivityInstanceEditPanel\";\r\nimport { ActivityInstanceDeleteDialog } from \"@modules/workflows/containers/panels/ActivityInstanceDeleteDialog\";\r\n\r\nimport { ActivityInstanceBuilderTab } from \"@modules/workflows/containers/tabs/ActivityInstanceBuilderTab\";\r\n\r\nexport const AutomationContainerHost = observer(({ context, canManage }) => {\r\n const [selectedTab, setSelectedTab] = useState(\"automations\");\r\n const { workflowStore, routingManager } = useStores();\r\n const { historyBrowseStore, browseStore, lifecycleStore, builderStore, summaryStore } = workflowStore;\r\n const { filteredHistory, loading, options } = historyBrowseStore;\r\n\r\n const visible = routingManager.isAutomationsActive;\r\n\r\n const searchHistory = useCallback(\r\n (options) => {\r\n if (context) {\r\n historyBrowseStore.loadWorkflowHistory({\r\n ...options,\r\n id: context.id,\r\n });\r\n }\r\n },\r\n [context]\r\n );\r\n\r\n const searchInstances = useCallback(\r\n (options) => {\r\n if (context) {\r\n browseStore.loadActivityInstances({\r\n ...options,\r\n context,\r\n });\r\n }\r\n },\r\n [context]\r\n );\r\n\r\n useEffect(() => {\r\n if (visible && selectedTab === \"history\") {\r\n searchHistory({});\r\n }\r\n }, [context, visible, selectedTab]);\r\n\r\n useEffect(() => {\r\n if (visible && selectedTab === \"automations\") {\r\n searchInstances({});\r\n }\r\n }, [context, visible, selectedTab]);\r\n\r\n const onDismiss = useCallback(\r\n (options) => {\r\n routingManager.setAutomationActive(false);\r\n if (context) {\r\n summaryStore.loadEntitySummary({ id: context.id });\r\n }\r\n },\r\n [context]\r\n );\r\n\r\n return (\r\n \r\n {options.continuationToken && (\r\n searchHistory({ continuationToken: options.continuationToken })}\r\n >\r\n Load more\r\n \r\n )}\r\n
\r\n \r\n \r\n {onNavigateBack && (\r\n \r\n \r\n \r\n \r\n )}\r\n \r\n \r\n \r\n {risk.type.name} \r\n \r\n \r\n \r\n \r\n \r\n {risk.code} - {risk.title}\r\n \r\n
\r\n );\r\n }\r\n\r\n _getActionSetItems() {\r\n const { triggers, conditions, onTrigger, canUpload, onUpload } = this.props;\r\n\r\n const items = [];\r\n const overflowItems = [];\r\n\r\n triggers\r\n .filter((t) => t.location == \"Default\" || t.location == \"Quicklaunch\")\r\n .forEach((trigger) => {\r\n items.push({\r\n key: trigger.id,\r\n name: trigger.name,\r\n primary: trigger.variant == \"Primary\",\r\n iconOnly: trigger.iconProps && trigger.iconProps.iconOnly,\r\n iconProps: trigger.iconProps,\r\n confirmProps: trigger.confirmProps,\r\n disabled:\r\n trigger.command.condition &&\r\n (!conditions[trigger.command.condition] || !conditions[trigger.command.condition]()),\r\n onClick: (ev, comment) => {\r\n onTrigger(\r\n trigger,\r\n {\r\n args: trigger.command.args,\r\n comment: comment && comment.length ? { content: comment } : null,\r\n },\r\n ev\r\n );\r\n },\r\n });\r\n });\r\n\r\n triggers\r\n .filter((t) => t.location == \"Overflow\")\r\n .forEach((trigger) => {\r\n overflowItems.push({\r\n key: trigger.id,\r\n name: trigger.name,\r\n primary: trigger.variant == \"Primary\",\r\n iconProps: trigger.iconProps,\r\n confirmProps: trigger.confirmProps,\r\n disabled:\r\n trigger.command.condition &&\r\n (!conditions[trigger.command.condition] || !conditions[trigger.command.condition]()),\r\n onClick: (ev, comment) => {\r\n onTrigger(\r\n trigger,\r\n {\r\n args: trigger.command.args,\r\n comment: comment && comment.length ? { content: comment } : null,\r\n },\r\n ev\r\n );\r\n },\r\n });\r\n });\r\n\r\n items.push({\r\n key: \"upload\",\r\n name: \"Upload\",\r\n iconOnly: true,\r\n iconProps: { iconName: \"Upload\" },\r\n disabled: !canUpload || !canUpload(),\r\n ariaLabel: \"Upload\",\r\n onClick: () => onUpload({ internalOnly: false }),\r\n });\r\n\r\n return { items, overflowItems };\r\n }\r\n\r\n _isStatusOneOf(status) {\r\n const { lifecycle } = this.props;\r\n return status.indexOf(lifecycle.status) != -1;\r\n }\r\n }\r\n);\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { mergeStyleSets } from \"office-ui-fabric-react/lib/Styling\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\nimport { FontIcon } from \"@ui/elements/Icon\";\r\n\r\nimport RichTextViewer from \"@modules/editors/components/RichTextViewer\";\r\n\r\nconst classNames = mergeStyleSets({\r\n container: {\r\n padding: \"0.5rem\",\r\n boxShadow: \"var(--box-shadow)\",\r\n backgroundColor: \"var(--white)\",\r\n borderRadius: \"var(--border-radius)\",\r\n },\r\n icon: {\r\n fontSize: \"1.3rem\",\r\n padding: \"0.5rem\",\r\n },\r\n title: {\r\n textTransform: \"uppercase\",\r\n color: \"var(--text-color-lightest)\",\r\n letterSpacing: \"0.6px\",\r\n fontSize: \"0.7rem\",\r\n },\r\n state: {\r\n marginBottom: \"0.6px\",\r\n fontSize: \"1rem\",\r\n },\r\n});\r\n\r\nexport const StateFlowChangeCard = observer(({ attachment, title, icon }) => {\r\n const comment = attachment.payload.comment;\r\n return (\r\n {title || \"Current Status\"}
\r\n {attachment.payload.after.subState}
\r\n {/* (!attachment.payload.before ||\r\n attachment.payload.before.subStateId !== attachment.payload.after.subStateId) */}\r\n \r\n {comment.contentType === \"text/json+rich-text\" &&
\r\n )}\r\n \r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { Stack } from \"@ui/elements/Stack\";\r\nimport { FontIcon } from \"@ui/elements/Icon\";\r\nimport { Text } from \"@ui/elements/Text\";\r\n\r\nexport const ActivityStreamHeader = observer(({ context }) => {\r\n if (!context) {\r\n return null;\r\n }\r\n return (\r\n \r\n
\r\n )}\r\n \r\n {message.actor.name}\r\n \r\n {timestamp.format(\"DD/MM/YY HH:mm\")}\r\n \r\n
\r\n )}\r\n \r\n {message.contentType === \"text/json+rich-text\" &&
\r\n {message.attachments &&\r\n message.attachments.map((attachment, ai) => (\r\n {onRenderAttachment(attachment, ai, message)}
\r\n ))}\r\n - \r\n {messages.map((message, i) => {\r\n const timestamp = moment.utc(message.timestamp);\r\n const self = user && user.id === message.actor.id;\r\n const attached =\r\n i > 0 &&\r\n message.actor.id === messages[i - 1].actor.id &&\r\n timestamp.diff(moment.utc(messages[i - 1].timestamp), \"minute\", false) < 5;\r\n return (\r\n
- \r\n {tasks.map(({ self, attached, small }, i) => {\r\n return (\r\n
\r\n
\r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n if (contentType === \"text/plain\") {\r\n store.contentType = \"text/json+rich-text\";\r\n store.content = toJsonFromString(store.content);\r\n } else {\r\n store.contentType = \"text/plain\";\r\n store.content = toStringFromJson(store.content);\r\n }\r\n }}\r\n />\r\n
\r\n \r\n store.onSave()}\r\n />\r\n
\r\n \r\n )}\r\n \r\n
\r\n )}\r\n {loaded && messages.length === 0 && (\r\n \r\n
\r\n No messages yet!\r\n
\r\n )}\r\n {!loaded && (\r\n \r\n No messages yet!\r\n
\r\n {loading &&
\r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {risk.assessment && (\r\n \r\n \r\n )}\r\n \r\n
\r\n );\r\n});\r\n","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport moment from \"moment\";\r\n\r\nimport { Persona, PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\n\r\nimport { Label } from \"@ui/elements/Label\";\r\nimport { TooltipHost } from \"@ui/elements/Tooltip\";\r\n\r\nimport { AdaptiveField } from \"@modules/base/components/AdaptiveField\";\r\nimport { UserHoverCard } from \"@modules/identity/containers/utilities/UserHoverCard\";\r\nimport { PhotoPersona } from \"@modules/identity/containers/utilities/PhotoPersona\";\r\n\r\nexport const RiskWorkflowSection = observer(({ lifecycle }) => {\r\n return (\r\n \r\n \r\n {isNotNullOrEmpty(risk.description) ? (\r\n
\r\n \r\n \r\n {isNotNullOrEmpty(risk.context) ? (\r\n
\r\n \r\n \r\n \r\n {risk.portfolio && risk.portfolio.name}\r\n \r\n
\r\n \r\n \r\n {risk.target.name} \r\n
\r\n \r\n \r\n {risk.registry.name}\r\n
\r\n \r\n \r\n \r\n {risk.trigger || \"Not set\"}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {risk.assessment.code}\r\n \r\n
\r\n \r\n \r\n
\r\n {lifecycle.stage}
\r\n \r\n \r\n
\r\n \r\n \r\n {lifecycle.subStatus}\r\n \r\n
\r\n \r\n \r\n {lifecycle.assignedToGroup ? (\r\n
\r\n \r\n \r\n {lifecycle.assignedToUser ? (\r\n \r\n \r\n ) : (\r\n \"Not Set\"\r\n )}\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {/* className={css(\"margin-left: 22px\")} */}\r\n {contacts.map((contact, i) => (\r\n \r\n \r\n ))}\r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nexport const TreatmentEffectiveness = observer(\r\n class TreatmentEffectiveness extends Component {\r\n\r\n render () {\r\n return (\r\n {this._getLabel()}\r\n );\r\n }\r\n\r\n _getLabel() {\r\n const { effectiveness } = this.props;\r\n\r\n if(!effectiveness) {\r\n return 'Unknown';\r\n }\r\n \r\n switch(effectiveness) {\r\n case 'FullyEffective':\r\n return 'Fully Effective';\r\n case 'SubstantiallyEffective':\r\n return 'Substantially Effective';\r\n case 'PartiallyEffective':\r\n return 'Partially Effective';\r\n case 'LargelyIneffective':\r\n return 'Largely Ineffective';\r\n case 'TotallyIneffective':\r\n return 'Totally Ineffective';\r\n case 'Unknown':\r\n return 'Unknown';\r\n }\r\n\r\n return effectiveness;\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport Moment from \"react-moment\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\n\r\nimport RichTextViewer from \"../../../editors/components/RichTextViewer\";\r\nimport { isNotNullOrEmpty } from \"../../../editors/components/RichTextField\";\r\nimport { TreatmentEffectiveness } from \"../treatments/TreatmentEffectiveness\";\r\n\r\nimport { RiskScore } from \"./RiskScore\";\r\nimport { RiskScoreTooltip } from \"./RiskScoreTooltip\";\r\nimport { RiskHeatmap } from \"./RiskHeatmap\";\r\n\r\nexport const ReviewSummary = observer(\r\n class ReviewSummary extends Component {\r\n render() {\r\n const { risk } = this.props;\r\n\r\n if (!risk || !risk.review) {\r\n return \r\n \r\n {contact.contact ? (\r\n \r\n \r\n ) : (\r\n \"Not Set\"\r\n )}\r\n
\r\n No risk reviews found
;\r\n }\r\n\r\n const isExceptionTemplate = risk.type && risk.type.template === \"zerodai:risks:exception\";\r\n const isControlException = isExceptionTemplate && risk.type.name === \"Control Exception\";\r\n\r\n return (\r\n \r\n \r\n \r\n {isExceptionTemplate ? null : (\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { useEffect } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { BoxPanel } from \"@modules/base/components/BoxPanel\";\r\nimport { FieldSetView } from \"@modules/base/components/FieldSetView\";\r\n\r\nimport { RiskDetailsSection } from \"@modules/risks/components/core/RiskDetailsSection\";\r\nimport { RiskWorkflowSection } from \"@modules/risks/components/core/RiskWorkflowSection\";\r\nimport { RiskContactList } from \"@modules/risks/components/core/RiskContactList\";\r\nimport { ReviewSummary } from \"@modules/risks/components/reviews/ReviewSummary\";\r\n\r\nexport const RiskSummaryTab = observer(() => {\r\n const { riskStore } = useStores();\r\n const { risk, lifecycle } = riskStore.viewStore;\r\n\r\n useEffect(() => {\r\n riskStore.commentStore.loadComments();\r\n }, [risk ? risk.id : null]);\r\n\r\n return (\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n {risk.review && isNotNullOrEmpty(risk.review.grossScore.description) ? (\r\n \r\n \r\n
\r\n {isControlException && (\r\n <>\r\n \r\n
\r\n\r\n {risk.review && isNotNullOrEmpty(risk.review.netScore.description) ? (\r\n \r\n \r\n {!risk.review || !risk.review.category ? (\r\n No risk event type set\r\n ) : (\r\n {risk.review.category.name}\r\n )}\r\n
\r\n \r\n \r\n {!risk.review || !risk.review.controls || risk.review.controls.length == 0 ? (\r\n No related controls\r\n ) : (\r\n {risk.review.controls.map((c) => c.name).join(\", \")}\r\n )}\r\n
\r\n \r\n \r\n {!risk.review || !risk.review.policyDescription ? (\r\n No related policies / standards\r\n ) : (\r\n {risk.review.policyDescription}\r\n )}\r\n
\r\n \r\n \r\n {!risk.review || !risk.review.businessAppetite ? (\r\n No business risk appetite set\r\n ) : (\r\n {risk.review.businessAppetite}\r\n )}\r\n
\r\n \r\n )}\r\n \r\n \r\n {!risk.review || !risk.review.nextReviewDue ? (\r\n No expiry date set\r\n ) : (\r\n \r\n
\r\n {isExceptionTemplate ? null : (\r\n <>\r\n \r\n \r\n
\r\n {risk.review && (\r\n \r\n \r\n {risk.review.treatments.length == 0 &&
\r\n )}\r\n \r\n )}\r\n No treatments added
}\r\n \r\n {risk.review.treatments.map((treatment) => (\r\n
\r\n \r\n
\r\n ))}\r\n {treatment.type}
\r\n \r\n
\r\n );\r\n },\r\n isPadded: true,\r\n });\r\n }\r\n\r\n this._columns.push({\r\n key: \"netScore\",\r\n name: \"Net Risk\",\r\n fieldName: \"netScore\",\r\n minWidth: 420,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return (\r\n \r\n
\r\n {isNotNullOrEmpty(item.grossScore.description) ? (\r\n \r\n
\r\n );\r\n },\r\n isPadded: true,\r\n });\r\n\r\n if (props.isExceptionTemplate && props.isControlException) {\r\n this._columns.push({\r\n key: \"category\",\r\n name: \"Risk Event Type\",\r\n fieldName: \"category\",\r\n minWidth: 155,\r\n maxWidth: 190,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return item.category ? item.category.name : null;\r\n },\r\n isPadded: true,\r\n });\r\n\r\n this._columns.push({\r\n key: \"businessAppetite\",\r\n name: \"Business Appetite\",\r\n fieldName: \"businessAppetite\",\r\n minWidth: 125,\r\n maxWidth: 170,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return item.businessAppetite;\r\n },\r\n isPadded: true,\r\n });\r\n\r\n this._columns.push({\r\n key: \"nextReviewDue\",\r\n name: \"Expiry Date\",\r\n fieldName: \"nextReviewDue\",\r\n minWidth: 115,\r\n maxWidth: 150,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return \r\n
\r\n {isNotNullOrEmpty(item.netScore.description) ? (\r\n \r\n {item.treatmentsCount} \r\n {item.treatmentEffectiveness != \"Unknown\" && item.treatmentEffectiveness != 0 && (\r\n
\r\n );\r\n },\r\n isPadded: true,\r\n });\r\n }\r\n\r\n this._columns.push({\r\n key: \"controls\",\r\n name: \"Controls\",\r\n fieldName: \"controls\",\r\n minWidth: 45,\r\n maxWidth: 50,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return (\r\n \r\n {item.controlsCount} \r\n
\r\n );\r\n },\r\n isPadded: true,\r\n });\r\n }\r\n\r\n render() {\r\n const { reviews, loading, className, onRiskClick, disableSelection } = this.props;\r\n const { contextualMenuProps } = this.state;\r\n\r\n return (\r\n \r\n {\r\n ev.preventDefault();\r\n ev.stopPropagation();\r\n if (this.props.onTreatmentClick) {\r\n this.props.onTreatmentClick(item);\r\n }\r\n }}\r\n >\r\n {item.removedInReview ? \"Closed\" : moment(item.startDate).isAfter() ? \"Planned\" : \"Current\"}\r\n
\r\n Started
\r\n \r\n Started
\r\n {isNotNullOrEmpty(item.description) ? (\r\n
\r\n );\r\n },\r\n isPadded: true,\r\n },\r\n {\r\n key: \"reviewDate\",\r\n name: \"Review Date\",\r\n fieldName: \"reviewDate\",\r\n minWidth: 85,\r\n maxWidth: 100,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return {item.revieweDate &&
;\r\n },\r\n isPadded: true,\r\n },\r\n {\r\n key: \"assignedTo\",\r\n name: \"Assigned To\",\r\n fieldName: \"assignedTo\",\r\n minWidth: 130,\r\n maxWidth: 150,\r\n isResizable: false,\r\n onColumnClick: this._onColumnClick,\r\n data: \"string\",\r\n onRender: (item) => {\r\n return item.assigned ? (\r\n \r\n
\r\n ) : null;\r\n },\r\n isPadded: true,\r\n },\r\n ];\r\n }\r\n\r\n render() {\r\n const { treatments, loading, className, onRiskClick, disableSelection } = this.props;\r\n const { contextualMenuProps } = this.state;\r\n\r\n return (\r\n \r\n Assigned
\r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n _getTooltipText() {\r\n const { initialCompliance, finalCompliance } = this.props.advisory;\r\n const final = finalCompliance == null ? 'the analyst is yet to mark this advisory' : `the analyst has marked this as ${this._getComplianceLabel(finalCompliance)}`\r\n return `Initial answer from self assessment was ${this._getComplianceLabel(initialCompliance)}, ${final}.`\r\n }\r\n\r\n _getComplianceLabel(compliance) {\r\n if(compliance == null) {\r\n return null;\r\n }\r\n\r\n if(compliance == 'Compliant') {\r\n return 'compliant';\r\n }\r\n\r\n return 'non-compliant';\r\n }\r\n }\r\n);","import React, { Component, Fragment } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nexport const AdvisoryStatus = observer(\r\n class AdvisoryStatus extends Component {\r\n render () {\r\n const { advisory } = this.props;\r\n \r\n if(advisory.state == 'Open' || !advisory.finalCompliance ) {\r\n return \r\n
\r\n \r\n {advisory.state}
;\r\n }\r\n\r\n return { advisory.finalCompliance == 'NonCompliant' ? 'Non Compliant' : advisory.finalCompliance }
;\r\n }\r\n }\r\n);","import React, { Component } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { StatusBadge } from '@baseComponents/StatusBadge';\r\n\r\nexport const AdvisorySeverity = observer(\r\n class AdvisorySeverity extends Component {\r\n \r\n render () {\r\n const { advisory } = this.props;\r\n \r\n switch(advisory.level) {\r\n case 'Critical':\r\n return \r\n \r\n {riskMapping.risks.length} \r\n \r\n
\r\n )}\r\n {evidenceMapping && (\r\n \r\n \r\n {disableAdvisoriesClick ? (\r\n <>\r\n {evidenceMapping.count} \r\n \r\n ) : (\r\n <>\r\n {\r\n ev.preventDefault();\r\n ev.stopPropagation();\r\n this.props.onAdvisoryClick(item);\r\n }}\r\n >\r\n {evidenceMapping.count} \r\n \r\n \r\n )}\r\n \r\n
\r\n )}\r\n {disableAdvisoriesClick ? (\r\n {item.title}\r\n ) : (\r\n \r\n {item.references.find((r) => r.type == \"Measure\") && (\r\n
\r\n \r\n {risk.code}\r\n \r\n
\r\n {risk.title}\r\n
\r\n )}\r\n />\r\n );\r\n }\r\n\r\n _getKey(item, index) {\r\n return item ? item.id : index;\r\n }\r\n\r\n _getSelectionDetails() {\r\n const selectionCount = this._selection.getSelectedCount();\r\n\r\n switch (selectionCount) {\r\n case 0:\r\n return \"No items selected\";\r\n case 1:\r\n return \"1 item selected: \" + this._selection.getSelection()[0].name;\r\n default:\r\n return `${selectionCount} items selected`;\r\n }\r\n }\r\n\r\n _onColumnClick(ev, column) {}\r\n\r\n _onItemContextMenu(item, index, ev) {\r\n const contextualMenuProps = {\r\n target: ev.target,\r\n items: [\r\n {\r\n key: \"text\",\r\n name: `${this._selection.getSelectedCount()} selected`,\r\n },\r\n ],\r\n onDismiss: () => {\r\n this.setState({\r\n contextualMenuProps: undefined,\r\n });\r\n },\r\n };\r\n\r\n if (index > -1) {\r\n this.setState({\r\n contextualMenuProps: contextualMenuProps,\r\n });\r\n }\r\n\r\n return false;\r\n }\r\n }\r\n);\r\n","import React, { Component, Fragment } from 'react';\r\nimport { observer, inject } from 'mobx-react';\r\nimport { withRouter } from 'react-router';\r\n\r\nimport { Label } from 'office-ui-fabric-react/lib/Label';\r\nimport { BoxPanel } from '../../../base/components/BoxPanel';\r\n\r\nimport { AdvisoryGridView } from '../../../assessments/components/advisories/AdvisoryGridView';\r\nimport { RoutingLink } from '../../../base/components/RoutingLink';\r\n\r\nexport const RiskAssessmentTab = inject('riskStore')(withRouter(observer(\r\n class RiskAssessmentTab extends Component {\r\n\r\n componentWillMount() {\r\n const { riskStore, match } = this.props;\r\n const { assessmentStore } = riskStore;\r\n \r\n if(!assessmentStore.assessment || match.params.id != assessmentStore.assessment.riskId) {\r\n assessmentStore.loadAssessment(match.params.id).then((result) => {\r\n\r\n });\r\n }\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { riskStore, match } = nextProps;\r\n const { assessmentStore } = riskStore;\r\n\r\n if(!assessmentStore.assessment || match.params.id != assessmentStore.assessment.riskId) {\r\n assessmentStore.loadAssessment(match.params.id).then((result) => {\r\n\r\n });\r\n }\r\n }\r\n \r\n render () {\r\n const { riskStore, match } = this.props;\r\n const { loading, assessment, error } = riskStore.assessmentStore\r\n\r\n return (\r\n \r\n {risk.title}\r\n
\r\n \r\n { assessment && (\r\n \r\n\r\n
\r\n );\r\n }\r\n\r\n _onAdvisoryClick(advisory) {\r\n\r\n }\r\n }\r\n)));\r\n","import React, { Component, Fragment } from 'react';\r\nimport { observer } from 'mobx-react';\r\n\r\nimport { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';\r\nimport { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';\r\nimport { BoxPanel } from '../../../base/components/BoxPanel';\r\n\r\nexport const DocumentCommandBar = observer(\r\n class DocumentCommandBar extends Component {\r\n \r\n render () {\r\n const { risk, selectedDocuments, keywords, onSearchChange, view, onViewChanged, canUpload, onUploadInvoked, onDownloadInvoked } = this.props;\r\n\r\n const items = [\r\n {\r\n key: 'upload',\r\n text: 'Upload',\r\n iconProps: { iconName: 'Upload' },\r\n disabled: !canUpload || !canUpload(),\r\n ariaLabel: 'Upload',\r\n onClick: () => onUploadInvoked({ internalOnly: false }),\r\n subMenuProps: {\r\n items: [\r\n {\r\n key: 'uploadAsPublic',\r\n text: 'Upload as Public',\r\n onClick: () => onUploadInvoked({ internalOnly: false })\r\n },\r\n {\r\n key: 'uploadAsInternal',\r\n text: 'Upload as Internal',\r\n disabled: true,\r\n onClick: () => onUploadInvoked({ internalOnly: true })\r\n },\r\n ]\r\n }\r\n },\r\n {\r\n key: 'download',\r\n text: 'Download',\r\n iconProps: { iconName: 'Download' },\r\n ariaLabel: 'Download',\r\n disabled: !selectedDocuments || selectedDocuments.count != 1,\r\n onClick: () => onDownloadInvoked(selectedDocuments.selected[0]),\r\n },\r\n ];\r\n\r\n const farItems = [\r\n {\r\n key: 'showAll',\r\n text: this._getViewTitle('all'),\r\n checked: view == 'all',\r\n onClick: () => onViewChanged('all')\r\n },\r\n {\r\n key: 'internalOnly',\r\n text: this._getViewTitle('internalOnly'),\r\n checked: view == 'internalOnly',\r\n onClick: () => onViewChanged('internalOnly')\r\n }, \r\n {\r\n key: 'search',\r\n text: 'Search',\r\n onRender: () => {\r\n return (\r\n \r\n
\r\n ) }\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {assessment.assessment.patternVersion.name} (v{assessment.assessment.patternVersion.version})
\r\n\r\n \r\n
\r\n {assessment.assessment.state}
\r\n\r\n
\r\n \r\n \r\n this._onAdvisoryClick(advisory)} />\r\n
\r\n \r\n {item.notes &&
\r\n
\r\n );\r\n }\r\n\r\n _renderFooter() {\r\n const { formData, formOptions, isValid } = this.props.store;\r\n\r\n if (!formData || !formOptions) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n { loading && \r\n (except || []).indexOf(r.id) === -1).map(p => ({ key: p.id, text: p.name, data: p }))}\r\n onChange={(event, option, index, value) => {\r\n if(multiple) {\r\n if(option) {\r\n const newSelected = [...selectedGroupIds];\r\n const index = newSelected.indexOf(option.key);\r\n if(index == -1) {\r\n newSelected.push(option.key);\r\n } else {\r\n newSelected.splice(index, 1);\r\n }\r\n pickerStore.setSelectedWithIds(newSelected);\r\n\r\n if(onChange) {\r\n onChange(groups.filter(r => newSelected.indexOf(r.id) != -1));\r\n }\r\n }\r\n } else {\r\n pickerStore.setSelectedWithId(option ? option.key : null);\r\n if(onChange) {\r\n onChange(option ? option.data : null);\r\n }\r\n }\r\n }} />\r\n
\r\n );\r\n }\r\n }\r\n));\r\n","import { observable, flow } from \"mobx\";\r\n\r\nimport { IdentityService } from '../../../api/identity';\r\nimport { PrincipalStore } from './PrincipalStore';\r\n\r\nexport class UserPickerStore {\r\n\r\n private parentStore: PrincipalStore;\r\n private identityService: IdentityService;\r\n \r\n @observable public selectedUserIds: string[] = [];\r\n @observable public users: any[] = [];\r\n @observable public otherUsers: any[] = [];\r\n @observable public groupId: string;\r\n @observable public loading: boolean = false;\r\n\r\n constructor(parentStore: PrincipalStore) {\r\n this.parentStore = parentStore;\r\n this.identityService = parentStore.identityService;\r\n }\r\n\r\n public loadGroupUsers = flow(function*(query) {\r\n this.loading = true;\r\n var options = Object.assign({ page: 1, keywords: '', otherUsers: [] }, query);\r\n try {\r\n const result = yield this.identityService.searchPrincipalsByGroup({ \r\n pageSize: 250, \r\n startIndex: (options.page - 1) * 250,\r\n keywords: options.keywords,\r\n groupId: options.groupId\r\n }); \r\n this.users = result.items;\r\n this.groupId = options.groupId;\r\n return result;\r\n } catch (e) {\r\n console.error(e);\r\n } finally {\r\n this.loading = false;\r\n }\r\n });\r\n\r\n public setSelected = flow(function*(users) {\r\n this.selectedUserIds = users.map(i => i.id);\r\n\r\n if(this.selectedUserIds.length > 0) {\r\n this.otherUsers = yield this.identityService.getPrincipalsByIds(this.selectedUserIds); \r\n }\r\n });\r\n\r\n public setSelectedWithId = flow(function*(id: string | null) {\r\n if(!id) {\r\n this.selectedUserIds = [];\r\n } else {\r\n if(this.selectedUserIds.length == 1 && this.selectedUserIds[0] == id) {\r\n return;\r\n }\r\n this.selectedUserIds = [id];\r\n }\r\n\r\n if(this.selectedUserIds.length > 0) {\r\n this.otherUsers = yield this.identityService.getPrincipalsByIds(this.selectedUserIds); \r\n }\r\n });\r\n\r\n public setSelectedWithIds = flow(function*(ids: string[] | null) {\r\n if(ids == null || ids.length == 0) {\r\n this.selectedUserIds = [];\r\n } else {\r\n this.selectedUserIds = ids;\r\n }\r\n\r\n if(this.selectedUserIds.length > 0) {\r\n this.otherUsers = yield this.identityService.getPrincipalsByIds(this.selectedUserIds); \r\n }\r\n });\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { css } from \"emotion\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { ComboBox } from \"office-ui-fabric-react/lib/ComboBox\";\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Spinner, SpinnerSize } from \"office-ui-fabric-react/lib/Spinner\";\r\nimport { Persona, PersonaSize } from \"office-ui-fabric-react/lib/Persona\";\r\nimport { getId } from \"@uifabric/utilities/lib/getId\";\r\n\r\nimport { UserPickerStore } from \"../../stores/UserPickerStore\";\r\n\r\nconst personaClassName = css`\r\n padding: var(--spacing-xxxxs) var(--spacing-xxxxs);\r\n`;\r\n\r\nexport const UserDropDown = inject(\"principalStore\")(\r\n observer(\r\n class UserDropDown extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n pickerStore: new UserPickerStore(this.props.principalStore),\r\n };\r\n }\r\n\r\n componentWillMount() {\r\n const { pickerStore } = this.state;\r\n const { multiple, selected, selectedId, selectedIds, groupId } = this.props;\r\n\r\n if (\r\n !pickerStore.loading &&\r\n groupId &&\r\n (pickerStore.users.length == 0 || groupId !== pickerStore.groupId)\r\n ) {\r\n pickerStore.loadGroupUsers({ groupId });\r\n }\r\n\r\n if (typeof selected !== \"undefined\") {\r\n pickerStore.setSelected(multiple ? selected || [] : selected ? [selected] : []);\r\n } else if (!multiple) {\r\n pickerStore.setSelectedWithId(selectedId);\r\n } else {\r\n pickerStore.setSelectedWithIds(selectedIds);\r\n }\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { pickerStore } = this.state;\r\n const { multiple, selected, selectedId, selectedIds, groupId } = nextProps;\r\n\r\n if (\r\n !pickerStore.loading &&\r\n groupId &&\r\n (pickerStore.users.length == 0 || groupId !== pickerStore.groupId)\r\n ) {\r\n pickerStore.loadGroupUsers({ groupId });\r\n }\r\n\r\n if (typeof selected !== \"undefined\") {\r\n pickerStore.setSelected(multiple ? selected || [] : selected ? [selected] : []);\r\n } else if (!multiple) {\r\n pickerStore.setSelectedWithId(selectedId);\r\n } else {\r\n pickerStore.setSelectedWithIds(selectedIds);\r\n }\r\n }\r\n\r\n render() {\r\n const { pickerStore } = this.state;\r\n const { label, required, placeholder, multiple, disabled, className, onChange, except } = this.props;\r\n const { users, otherUsers, selectedUserIds, loading } = pickerStore;\r\n\r\n const selected = multiple ? selectedUserIds : selectedUserIds.length ? selectedUserIds[0] : null;\r\n\r\n const inGroup = users.filter((r) => (except || []).indexOf(r.id) === -1);\r\n const others = otherUsers.filter((u) => users.findIndex((x) => x.id == u.id) === -1);\r\n\r\n const options = [];\r\n if (inGroup.length > 0 && others.length > 0) {\r\n options.push({ key: \"in-group\", text: \"Users in group\", itemType: 2 });\r\n }\r\n inGroup.forEach((user) => {\r\n options.push({ key: user.id, text: user.name, data: user });\r\n });\r\n if (others.length > 0) {\r\n options.push({ key: \"not-in-group\", text: \"Users not in group\", itemType: 2 });\r\n }\r\n others.forEach((user) => {\r\n options.push({ key: user.id, text: user.name, data: user });\r\n });\r\n\r\n const pickerId = getId(\"userDropDown\");\r\n\r\n return (\r\n \r\n \r\n \r\n {loading && \r\n \r\n !option.data ? (\r\n option.text\r\n ) : (\r\n
\r\n );\r\n }\r\n }\r\n )\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { GroupDropDown } from \"../../../identity/containers/pickers/GroupDropDown\";\r\nimport { UserDropDown } from \"../../../identity/containers/pickers/UserDropDown\";\r\n\r\nexport const RiskAssignForm = observer(\r\n class RiskAssignForm extends Component {\r\n render() {\r\n const { formData, formOptions } = this.props;\r\n\r\n return (\r\n \r\n
\r\n )\r\n }\r\n onRenderTitle={(options) => {\r\n return options.map((option) => (\r\n \r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\nimport { PrimaryButton, ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { ObservablePanel } from \"../../../base/components/ObservablePanel\";\r\nimport { RiskAssignForm } from \"../../components/core/RiskAssignForm\";\r\n\r\nexport const RiskAssignPanel = inject(\"routing\")(\r\n withRouter(\r\n observer(\r\n class RiskAssignPanel extends Component {\r\n render() {\r\n const { visible, formData, formOptions, isValid } = this.props.store;\r\n\r\n return (\r\n \r\n \r\n \r\n {\r\n formData.assignedToGroup = group;\r\n //formData.assignedToUser = null;\r\n }}\r\n />\r\n \r\n \r\n {\r\n formData.assignedToUser = user;\r\n }}\r\n />\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {\r\n formData.lifecycle.businessContact = contact;\r\n }}\r\n />\r\n \r\n \r\n {\r\n formData.lifecycle.technicalContact = contact;\r\n }}\r\n />\r\n \r\n \r\n\r\n
\r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\nimport { PrimaryButton, ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { ObservablePanel } from \"../../../base/components/ObservablePanel\";\r\nimport { ReviewEditForm } from \"../../components/reviews/ReviewEditForm\";\r\nimport { RiskTransferForm } from \"../../components/core/RiskTransferForm\";\r\n\r\nexport const RiskTransferPanel = inject(\"routing\")(\r\n withRouter(\r\n observer(\r\n class RiskTransferPanel extends Component {\r\n render() {\r\n const { visible, formData, formOptions } = this.props.store;\r\n\r\n return (\r\n \r\n \r\n \r\n {\r\n formData.registry = registry;\r\n }}\r\n />\r\n \r\n \r\n
\r\n\r\n \r\n (formData.title = value)}\r\n />\r\n
\r\n\r\n \r\n {\r\n formData.description = val;\r\n }}\r\n />\r\n
\r\n\r\n \r\n {\r\n formData.context = val;\r\n }}\r\n />\r\n
\r\n \r\n {section == \"Risk\" && (\r\n
\r\n );\r\n }\r\n\r\n _renderFooter() {\r\n const { formData, formOptions, isValid, isSectionValid, section } =\r\n this.props.store;\r\n\r\n if (!formData || !formOptions) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n {formOptions.allowReview && (\r\n
\r\n )}\r\n {section == \"Review\" && (\r\n \r\n \r\n Step 1 of 2 - {formOptions.typeName} Details\r\n \r\n
\r\n )}\r\n \r\n {formOptions.allowReview && (\r\n
\r\n )}\r\n \r\n \r\n Step 2 of 2 - {formOptions.typeName} Review\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {\r\n ev.stopPropagation();\r\n routing.push(url);\r\n }}>\r\n {risk.code}\r\n \r\n \r\n \r\n \r\n \r\n {risk.portfolio.name} \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n );\r\n }\r\n }\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { cx, css } from \"emotion\";\r\n\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { Icon } from \"office-ui-fabric-react/lib/Icon\";\r\nimport { List } from \"office-ui-fabric-react/lib/List\";\r\nimport { FocusZone, FocusZoneDirection } from \"office-ui-fabric-react/lib/FocusZone\";\r\nimport { Shimmer } from \"office-ui-fabric-react/lib/Shimmer\";\r\nimport { Droppable, Draggable } from \"react-beautiful-dnd\";\r\n\r\nimport { ShimmerCard } from \"../../../base/components/ShimmerCard\";\r\n\r\nconst rootClassName = cx(\r\n \"cygraph-RiskBoardColumn-root\",\r\n css`\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: column;\r\n\r\n & .column-header {\r\n margin-bottom: var(--spacing-xs);\r\n padding: 0 0 var(--spacing-xxs) 0;\r\n border-bottom: 1px solid var(--border-color);\r\n display: flex;\r\n\r\n & > span {\r\n font-weight: 600;\r\n }\r\n\r\n & .title {\r\n flex-grow: 1;\r\n margin-bottom: 0;\r\n }\r\n\r\n & .destination {\r\n display: none;\r\n }\r\n\r\n & .source {\r\n display: none;\r\n }\r\n }\r\n\r\n & .droppable {\r\n flex-grow: 1;\r\n min-height: 200px;\r\n\r\n &.dragging-over .column-header .destination {\r\n color: var(--green-10);\r\n display: block;\r\n }\r\n\r\n &.dragging-from .column-header .source {\r\n color: var(--blue-10);\r\n display: block;\r\n }\r\n\r\n &.dragging-from .column-header .destination {\r\n display: none;\r\n }\r\n }\r\n `\r\n);\r\n\r\nexport const RiskBoardColumn = observer(\r\n class RiskBoardColumn extends Component {\r\n render() {\r\n const { id, title, items, loading, isDropDisabled, isDragDisabled, className, onRenderCard } = this.props;\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {(provided, snapshot) => (\r\n \r\n \r\n \r\n {provided.placeholder}\r\n
\r\n )}\r\n \r\n \r\n );\r\n }\r\n\r\n _getCustomElements = () => {\r\n const cards = parseInt(Math.random() * 3 + 2);\r\n return Array.from({ length: cards }, (v, i) => Math.random()).map((r, i) => {\r\n return \r\n \r\n {title}\r\n \r\n
\r\n \r\n \r\n {\r\n return (\r\n \r\n
\r\n \r\n \r\n {(provided, snapshot) => (\r\n \r\n
\r\n );\r\n }}\r\n />\r\n \r\n {onRenderCard(item, snapshot, this.props)}\r\n
\r\n )}\r\n \r\n \r\n \r\n { columns.map((id) => {\r\n const column = board[id];\r\n return (\r\n \r\n );\r\n }) }\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _isColumnDisabled = (column) => {\r\n return this.state.enabledColumns.indexOf(column) === -1;\r\n };\r\n\r\n _onDragStart = result => {\r\n const { board } = this.props;\r\n this.setState({\r\n enabledColumns: board[result.source.droppableId].allowedDrops || []\r\n }); \r\n };\r\n\r\n _onDragEnd = (result) => {\r\n const { onCardMoved } = this.props;\r\n\r\n if (!result.destination || result.reason != 'DROP' || result.source.droppableId == result.destination.droppableId) {\r\n return;\r\n }\r\n \r\n if(onCardMoved) {\r\n onCardMoved({ \r\n itemId: result.draggableId, \r\n fromId: result.source.droppableId, \r\n fromIndex: result.source.index,\r\n toId: result.destination.droppableId,\r\n toIndex: result.destination.index \r\n });\r\n }\r\n };\r\n }\r\n);","import React, { PureComponent } from 'react';\r\nimport { observer } from 'mobx-react';\r\nimport { cx, css } from 'emotion';\r\n\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\n\r\nimport { ObservableBadge } from '../../../base/components/ObservableBadge';\r\nimport { ActionSet } from '../../../base/components/ActionSet';\r\n\r\nconst rootClassName = cx(\r\n 'cygraph-RegistryHeader-root',\r\n css` \r\n margin: var(--spacing-s) 0;\r\n\r\n .title {\r\n margin: var(--spacing-xs) 0 0 0;\r\n }\r\n\r\n & .description {\r\n color: var(--text-color-light);\r\n font-size: var(--font-size-xs);\r\n }\r\n `\r\n);\r\n\r\nexport const RegistryHeader = observer(\r\n class RegistryHeader extends PureComponent {\r\n render () {\r\n const { registry } = this.props;\r\n const { items, overflowItems } = this._getActionSetItems();\r\n \r\n return (\r\n \r\n {/* \r\n Risk Regisrty \r\n */}\r\n {registry.name} \r\n
\r\n );\r\n }\r\n\r\n _getActionSetItems() {\r\n const { registry } = this.props;\r\n\r\n const items = [];\r\n const overflowItems = [];\r\n\r\n return { items, overflowItems };\r\n }\r\n }\r\n);","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\nimport Moment from \"react-moment\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\nimport { ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\n\r\nimport { ObservablePanel } from \"../../../base/components/ObservablePanel\";\r\nimport { isNotNullOrEmpty } from \"../../../editors/components/RichTextField\";\r\nimport RichTextViewer from \"../../../editors/components/RichTextViewer\";\r\n\r\nimport { RiskScore } from \"../../components/reviews/RiskScore\";\r\nimport { RiskHeatmap } from \"../../components/reviews/RiskHeatmap\";\r\nimport { TreatmentEffectiveness } from \"../../components/treatments/TreatmentEffectiveness\";\r\n\r\nexport const RiskSummaryPanel = inject(\r\n \"riskStore\",\r\n \"routing\"\r\n)(\r\n withRouter(\r\n observer(\r\n class RiskSummaryPanel extends Component {\r\n render() {\r\n const { summaryStore } = this.props.riskStore;\r\n const { visible, selectedRisk } = summaryStore;\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _renderFooter() {\r\n return (\r\n \r\n \r\n {selectedRisk.code} - {selectedRisk.title}\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n {selectedRisk.portfolio.name}
\r\n \r\n \r\n
\r\n {selectedRisk.registry.name}
\r\n \r\n \r\n {isNotNullOrEmpty(selectedRisk.description) ? (\r\n
\r\n\r\n \r\n \r\n {isNotNullOrEmpty(selectedRisk.context) ? (\r\n
\r\n\r\n \r\n \r\n
\r\n \r\n {selectedRisk.review ? (\r\n
\r\n \r\n \r\n
\r\n {selectedRisk.lifecycle.status}
\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n\r\n {selectedRisk.review &&\r\n isNotNullOrEmpty(\r\n selectedRisk.review.grossScore.description\r\n ) ? (\r\n \r\n \r\n
\r\n \r\n
\r\n\r\n {selectedRisk.review &&\r\n isNotNullOrEmpty(\r\n selectedRisk.review.netScore.description\r\n ) ? (\r\n \r\n \r\n
\r\n {selectedRisk.review && selectedRisk.review.treatments && (\r\n \r\n \r\n {selectedRisk.review.treatments.length == 0 && (\r\n
\r\n )}\r\n No treatments added
\r\n )}\r\n \r\n {selectedRisk.review.treatments.map((treatment) => (\r\n
\r\n \r\n
\r\n ))}\r\n {treatment.type}
\r\n \r\n {registry && this._onNewRisk(options)}\r\n onRefresh={() => this._onRefresh()}\r\n onSearchChange={(keywords) => {\r\n if (keywords) {\r\n routing.push(\r\n `/risks/boards/${\r\n match.params.id\r\n }?k=${encodeURIComponent(keywords)}`\r\n );\r\n } else {\r\n routing.push(`/risks/boards/${match.params.id}`);\r\n }\r\n }}\r\n />\r\n\r\n (\r\n this._onViewRisk(item)}\r\n selected={snapshot.isDragging}\r\n />\r\n )}\r\n onCardMoved={this._onCardMoved}\r\n onMonitor={(risk, move) => this._onReview(risk, true, move)}\r\n onClose={(risk, move) => this._onClose(risk, move)}\r\n onTransfer={(risk, move) => riskStore.transferRisk(risk)}\r\n onShare={(risk) => this._onShareRisk(risk.id)}\r\n onReview={(risk) => this._onReview(risk, false)}\r\n />\r\n\r\n {\r\n routing.push(\r\n `/risks/pending-review/${match.params.id}?p=${\r\n index + 1\r\n }${\r\n riskStore.keywords\r\n ? `&k=${encodeURIComponent(riskStore.keywords)}`\r\n : \"\"\r\n }`\r\n );\r\n }}\r\n />\r\n\r\n
\r\n \r\n );\r\n }\r\n\r\n _onCardMoved = (ev) => {\r\n const { reviewStore, transferStore, reviewBoardStore } = this.props.riskStore;\r\n\r\n const risk = reviewBoardStore.board[ev.fromId].items.find(\r\n (r) => r.id == ev.itemId\r\n );\r\n\r\n reviewBoardStore.move(ev);\r\n\r\n if (ev.toId === \"monitoring\") {\r\n reviewStore.show({\r\n review: risk.review,\r\n risk: risk,\r\n monitor: true,\r\n clearData: true,\r\n });\r\n } else if (ev.toId === \"closed\") {\r\n reviewBoardStore.dialog.show({\r\n title: \"Close Risk\",\r\n subText: `Are you sure you want to close risk ${risk.code}?`,\r\n isBlocking: true,\r\n context: risk,\r\n });\r\n } else if (ev.toId === \"transferred\") {\r\n transferStore.show({\r\n review: risk.review,\r\n risk: risk,\r\n allowReview: true,\r\n allowSubmit: true,\r\n clearData: true,\r\n });\r\n }\r\n };\r\n\r\n _onTransferCancelled = (formData) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n reviewBoardStore.reverse();\r\n };\r\n\r\n _onTransferSuccess = (lifecycle) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n\r\n reviewBoardStore.loadRisk(lifecycle.riskId).then((updated) => {\r\n reviewBoardStore.update(updated);\r\n });\r\n };\r\n\r\n _onCloseCancelled = (risk) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n reviewBoardStore.dialog.hide();\r\n reviewBoardStore.reverse();\r\n };\r\n\r\n _onCloseConfirmed = (risk) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n reviewBoardStore.dialog.hide();\r\n\r\n this.props.riskStore.closeRisk(risk.id).then((updated) => {\r\n reviewBoardStore.update(updated);\r\n });\r\n };\r\n\r\n _onClose = (risk) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n\r\n reviewBoardStore.dialog.show({\r\n title: \"Close Risk\",\r\n subText: `Are you sure you want to close risk ${risk.code}?`,\r\n isBlocking: true,\r\n context: risk,\r\n });\r\n };\r\n\r\n _onReviewCancelled = () => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n reviewBoardStore.reverse();\r\n };\r\n\r\n _onReview(risk) {\r\n const { reviewStore } = this.props.riskStore;\r\n\r\n reviewStore.show({\r\n review: risk.review,\r\n risk: risk,\r\n monitor: false,\r\n clearData: true,\r\n });\r\n }\r\n\r\n _onRiskCreated = (risk) => {\r\n const { reviewBoardStore } = this.props.riskStore;\r\n reviewBoardStore.insert(risk);\r\n };\r\n\r\n _onRefresh() {\r\n const { riskStore, routing, match } = this.props;\r\n const { reviewBoardStore } = riskStore;\r\n\r\n const params = getQueryStringParams(routing.location.search);\r\n reviewBoardStore.loadBoard({\r\n page: params[\"p\"] || 1,\r\n keywords: params[\"k\"],\r\n registryId: match.params.id,\r\n });\r\n }\r\n\r\n _onNewRisk(options) {\r\n const { editStore } = this.props.riskStore;\r\n\r\n const o = Object.assign(\r\n {\r\n allowReview: false,\r\n allowSubmit: false,\r\n disableTargetType: true,\r\n target: {\r\n type: \"Asset\",\r\n },\r\n },\r\n options\r\n );\r\n\r\n editStore.show(o);\r\n }\r\n\r\n _onViewRisk(risk) {\r\n const { summaryStore } = this.props.riskStore;\r\n summaryStore.show({\r\n id: risk.id,\r\n risk,\r\n });\r\n }\r\n }\r\n )\r\n )\r\n);\r\n","import React, { Component } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { AgeIndicator } from \"../../../base/components/AgeIndicator\";\r\n\r\nexport const RiskAgeIndicator = observer(\r\n class RiskAgeIndicator extends Component {\r\n render() {\r\n const { className, risk } = this.props;\r\n\r\n if (!risk || !risk.lifecycle) {\r\n return null;\r\n }\r\n return (\r\n \r\n {item.target.type && item.type.name && (\r\n
\r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { observer, inject } from \"mobx-react\";\r\n\r\nimport { Pivot, PivotItem, PivotLinkFormat } from \"office-ui-fabric-react/lib/Pivot\";\r\n\r\nimport { AppPage } from \"../../../layout/containers/AppPage\";\r\nimport { BigSearchBox } from \"../../../base/components/BigSearchBox\";\r\n\r\nimport { ExceptionGridView } from \"../../components/exceptions/ExceptionGridView\";\r\nimport { ExceptionSideNav } from \"../../components/exceptions/ExceptionSideNav\";\r\nimport { RiskNewPanel } from \"../panels/RiskNewPanel\";\r\n\r\nexport const ExceptionDashboardPage = inject(\r\n \"riskStore\",\r\n \"routing\"\r\n)(\r\n observer(\r\n class ExceptionDashboardPage extends Component {\r\n componentWillMount() {\r\n const { exceptionDashboardStore, typeStore } = this.props.riskStore;\r\n exceptionDashboardStore.loadDashboard({});\r\n typeStore.loadTypes({ cached: true });\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n const { exceptionDashboardStore, typeStore } = nextProps.riskStore;\r\n exceptionDashboardStore.loadDashboard({});\r\n typeStore.loadTypes({ cached: true });\r\n }\r\n\r\n render() {\r\n const { exceptionDashboardStore, typeStore } = this.props.riskStore;\r\n const { loading, breadcrumb, error, risks, tab, myTabs } = exceptionDashboardStore;\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n Exception\r\n
\r\n Management\r\n \r\n
\r\n\r\n \r\n Management\r\n
\r\n
\r\n\r\n {onNewRisk && (\r\n \r\n Exception Registries \r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n {types.map((type) => (\r\n \r\n \r\n ))}\r\n \r\n
\r\n );\r\n});\r\n","import React, { useEffect, useCallback } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\nimport { useStores } from \"@hooks/useStores\";\r\n\r\nimport { Text } from \"@ui/elements/Text\";\r\n\r\nimport { AppPage } from \"@modules/layout/containers/AppPage\";\r\n\r\nimport { ExceptionTypeListView } from \"@modules/risks/components/exceptions/ExceptionTypeListView\";\r\nimport { RiskNewPanel } from \"@modules/risks/containers/panels/RiskNewPanel\";\r\n\r\nexport const ExceptionCataloguePage = withRouter(\r\n observer(({ match }) => {\r\n const { riskStore, routing } = useStores();\r\n const { editStore, exceptionCatalogueStore } = riskStore;\r\n const { error, breadcrumb, loading, types } = exceptionCatalogueStore;\r\n\r\n useEffect(() => {\r\n exceptionCatalogueStore.loadTypes({});\r\n }, []);\r\n\r\n const onNewRisk = useCallback(\r\n (options) => {\r\n const o = Object.assign(\r\n {\r\n allowReview: false,\r\n allowSubmit: false,\r\n disableTargetType: true,\r\n target: {\r\n type: \"Asset\",\r\n },\r\n },\r\n options\r\n );\r\n\r\n editStore.show(o);\r\n },\r\n [editStore]\r\n );\r\n\r\n return (\r\n \r\n {exceptionType.name} \r\n
\r\n )}\r\n {formData && (\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {loading && \r\n {readOnly ? (\r\n selectedStateFlow ? (\r\n \r\n {selectedStateFlow ? selectedStateFlow.name : \"Not defined\"}\r\n \r\n ) : null\r\n ) : (\r\n (except || []).indexOf(r.id) === -1)\r\n .map((p) => ({ key: p.id, text: p.name, data: p }))}\r\n onChange={(event, option, index, value) => {\r\n if (multiple) {\r\n if (option) {\r\n const newSelected = [...selectedStateFlowIds];\r\n const index = newSelected.indexOf(option.key);\r\n if (index == -1) {\r\n newSelected.push(option.key);\r\n } else {\r\n newSelected.splice(index, 1);\r\n }\r\n pickerStore.setSelectedWithIds(newSelected);\r\n\r\n if (onChange) {\r\n onChange(stateflows.filter((r) => newSelected.indexOf(r.id) != -1));\r\n }\r\n }\r\n } else {\r\n pickerStore.setSelectedWithId(option ? option.key : null);\r\n if (onChange) {\r\n onChange(option ? option.data : null);\r\n }\r\n }\r\n }}\r\n />\r\n )}\r\n
\r\n );\r\n }\r\n }\r\n )\r\n);\r\n","import React from \"react\";\r\n\r\nimport MDEditor from \"@uiw/react-md-editor\";\r\n\r\nexport const MarkdownEditor = ({ value, onChange, mode, required, disabled, placeholder, dragBar, height }) => {\r\n return (\r\n \r\n
\r\n );\r\n};\r\n","import React from \"react\";\r\nimport { cx, css } from \"emotion\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\n\r\nimport { MarkdownEditor } from \"./MarkdownEditor\";\r\n\r\nexport const MarkdownField = observer(\r\n ({ value, onChange, label, placeholder, required, disabled, height, className, dataTest }) => {\r\n return (\r\n \r\n
\r\n \r\n );\r\n }\r\n);\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { observer } from \"mobx-react\";\r\n\r\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { Text } from \"office-ui-fabric-react/lib/Text\";\r\nimport { Toggle } from \"office-ui-fabric-react/lib/Toggle\";\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\nimport { Dropdown } from \"office-ui-fabric-react/lib/Dropdown\";\r\n\r\nimport { BigTextField } from \"../../../base/components/BigTextField\";\r\nimport { ObservableSeparator } from \"../../../base/components/ObservableSeparator\";\r\nimport { PrincipalPicker } from \"../../../identity/containers/PrincipalPicker\";\r\nimport { RichDropdown } from \"../../../base/richdropdown/RichDropdown\";\r\nimport { StateFlowPicker } from \"../../../stateflows/containers/pickers/StateFlowPicker\";\r\nimport { RichTextField } from \"../../../editors/components/RichTextField\";\r\nimport { RegistryPicker } from \"../../containers/pickers/RegistryPicker\";\r\nimport { GroupDropDown } from \"../../../identity/containers/pickers/GroupDropDown\";\r\nimport { MarkdownField } from \"@modules/editors/components/MarkdownField\";\r\n\r\nimport { AutoAssignmentModes, autoAssignmentModeOrDefault, templates } from \"../../stores/RiskContants\";\r\nimport { UserDropDown } from \"../../../identity/containers/pickers/UserDropDown\";\r\n\r\nfunction computeCodePreview(prefix, suffix, paddedZeros, numberIndex) {\r\n var pZeros = \"\";\r\n for (let i = 0; i < parseInt(paddedZeros) - numberIndex.length; i++) {\r\n pZeros += \"0\";\r\n }\r\n return prefix + pZeros + numberIndex + suffix;\r\n}\r\n\r\nfunction assembleCodePreview(prefix, suffix, paddedZeros) {\r\n if (parseInt(paddedZeros) > 0) {\r\n return `${prefix}{0:D${paddedZeros}}${suffix}`;\r\n } else {\r\n return prefix + \"{0}\" + suffix;\r\n }\r\n}\r\n\r\nexport const RiskTypeForm = observer((props) => {\r\n const { formData, isEdit } = props;\r\n const [prefix, setPrefix] = useState(\"\");\r\n const [suffix, setSuffix] = useState(\"\");\r\n const [paddedZeros, setPaddedZeros] = useState(\"0\");\r\n\r\n useEffect(() => {\r\n if (formData && formData.codeFormat) {\r\n setPrefix(formData.codeFormat.substr(0, formData.codeFormat.indexOf(\"{\")));\r\n setSuffix(formData.codeFormat.substr(formData.codeFormat.indexOf(\"}\") + 1, formData.codeFormat.length));\r\n let midSection = formData.codeFormat.substr(formData.codeFormat.indexOf(\"{\") + 1);\r\n midSection = midSection.substr(0, formData.codeFormat.indexOf(\"}\"));\r\n if (midSection.indexOf(\":D\") > 0) {\r\n let numberOfZeros = midSection.split(\":D\");\r\n numberOfZeros = numberOfZeros[1].split(\"}\");\r\n setPaddedZeros(numberOfZeros[0]);\r\n } else {\r\n setPaddedZeros(\"0\");\r\n }\r\n }\r\n }, [formData]);\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Risk Type \r\n \r\n \r\n \r\n {riskType && riskType.name} \r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n _getActionSetItems() {\r\n const { hideActions, canEdit, onEdit } = this.props;\r\n const items = [];\r\n const overflowItems = [];\r\n\r\n if(hideActions) {\r\n return { items, overflowItems };\r\n }\r\n\r\n if (canEdit) items.push({\r\n key: 'edit',\r\n name: 'Edit',\r\n iconProps: { iconName: 'Edit' },\r\n ariaLabel: 'Edit',\r\n onClick: onEdit,\r\n });\r\n\r\n return { items, overflowItems };\r\n }\r\n }\r\n);","import React from \"react\";\r\nimport { observer } from \"mobx-react\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nimport { Stack } from \"office-ui-fabric-react/lib/Stack\";\r\nimport { PrimaryButton, ActionButton } from \"office-ui-fabric-react/lib/Button\";\r\nimport { PanelType } from \"office-ui-fabric-react/lib/Panel\";\r\n\r\nimport { useStores } from \"../../../../hooks/useStores\";\r\n\r\nimport { ObservablePanel } from \"../../../base/components/ObservablePanel\";\r\nimport { RiskTypeForm } from \"../../components/core/RiskTypeForm\";\r\n\r\nexport const RiskTypeEditPanel = withRouter(\r\n observer((props) => {\r\n const { onClosePanel, onSaveRiskType } = props;\r\n const { riskStore, principalContext } = useStores();\r\n const { riskTypeEditFormStore, registryStore } = riskStore;\r\n const { riskRegistriesRoles } = registryStore;\r\n const { visible, formData, isValid, isSaving } = riskTypeEditFormStore;\r\n\r\n return (\r\n