udp-react-enterprise-component-library 25.18.1-beta.3 → 25.18.1-beta.30

package/dist/VirtualBrowser-xUyUFhkU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualBrowser-xUyUFhkU.js","names":["value","PrimaryActionButton"],"sources":["../src/maintenanceEngine/virtualBrowser/VirtualTableColumnDefs.js","../src/maintenanceEngine/virtualBrowser/VirtualTableSidePanel.jsx","../src/maintenanceEngine/virtualBrowser/VirtualBrowser.jsx"],"sourcesContent":["import { toTitleCase } from '../../utilities/input/StringUtilities';\n\nconst defaultGridColumn = {\n  headerName: '',\n  field: '',\n  minWidth: 80,\n  autoHeight: false,\n  sortable: true\n};\n\nexport const VirtualTableColumnDefs = (\n  tableDescription,\n  actionList,\n  columnName = 'Actions',\n  crudTableActionRenderName = 'actionsRenderer',\n  panelDirection = 'right'\n) => {\n  let columnDefs =\n    tableDescription?.reduce((defs, element) => {\n      defs.push({\n        ...defaultGridColumn,\n        headerName: toTitleCase(element?.name || ''),\n        field: element?.name\n      });\n      return defs;\n    }, []) || [];\n\n  columnDefs.push({\n    headerName:\n      crudTableActionRenderName === 'actionsRenderer' ? 'Actions' : columnName,\n    filter: false,\n    pinned: panelDirection,\n    width: 150,\n    maxWidth: 180,\n    cellRenderer: crudTableActionRenderName,\n    cellRendererParams: {\n      actionList\n    },\n    valueGetter: (params) => params.data,\n    suppressMenu: true,\n    sortable: false,\n    cellStyle: { display: 'flex', alignItems: 'center' }\n  });\n\n  return columnDefs;\n};\n\nexport const defaultColActionsDef = {\n  resizable: true,\n  editable: false,\n  sortable: true,\n  filter: true,\n  floatingFilter: false,\n  enableRowGroup: true\n};\n","import { Divider, makeStyles } from '@material-ui/core';\nimport PropTypes from 'prop-types';\nimport React, { useMemo } from 'react';\nimport { useUser } from '../../utilities/auth/useUser';\nimport { DndProvider } from 'react-dnd';\nimport { HTML5Backend } from 'react-dnd-html5-backend';\nimport { PageContainer } from '../../page/PageContainer';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { Skeleton } from '@material-ui/lab';\nimport { LayoutUnit } from '../../layout/LayoutUnit';\nimport { VirtualForm } from '../../UI/forms/VirtualForm';\nimport { ConfigService } from '../../configService';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  divider: {\n    marginTop: theme.spacing(2)\n  }\n}));\n\nconst FIELD_NUMBER = 10;\n\nexport const VirtualTableSidePanel = (props) => {\n  const {\n    tableDescription,\n    value,\n    crudTableEditionData,\n    closeSideSheet,\n    onCreate,\n    onUpdate,\n    pageId,\n    setSideSheetWidth,\n    setSideSheetButtonLabel,\n    setSideSheetOnSubmit,\n    setSideSheetProps\n  } = props;\n  const user = useUser();\n  const classes = useStyles();\n\n  const [{ data: page, loading: loadingPage }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `page/${pageId}`,\n    {},\n    !!!pageId,\n    false\n  );\n\n  const skeleton = useMemo(() => {\n    const skeletonArr = [];\n    for (let i = 0; i < FIELD_NUMBER; i++) {\n      skeletonArr.push(\n        <>\n          <Skeleton key={i} variant='rect' className={classes.skeleton} />\n          <LayoutUnit unit='xxs' />\n        </>\n      );\n    }\n    return skeletonArr;\n  }, [classes]);\n\n  const sideSheetContent = useMemo(() => {\n    if (page) {\n      return (\n        <DndProvider backend={HTML5Backend}>\n          <PageContainer\n            user={user}\n            key={pageId}\n            pageData={page}\n            widgetParams={{\n              pageId: page?.pageId,\n              nodeObj: crudTableEditionData,\n              setSideSheetWidth: setSideSheetWidth,\n              setSideSheetButtonLabel: setSideSheetButtonLabel,\n              setSideSheetOnSubmit: setSideSheetOnSubmit,\n              closeSideSheet: closeSideSheet,\n              setSideSheetProps: setSideSheetProps,\n              onCreate: onCreate,\n              onUpdate: onUpdate\n            }}\n            disableMargins={true}\n          />\n        </DndProvider>\n      );\n    } else {\n      return (\n        <>\n          <VirtualForm\n            tableDescription={tableDescription}\n            rowValue={value}\n            closeSideSheet={closeSideSheet}\n            onCreate={onCreate}\n            onUpdate={onUpdate}\n          />\n          <div className={classes.divider}>\n            <Divider />\n          </div>\n        </>\n      );\n    }\n  }, [\n    page,\n    user,\n    pageId,\n    crudTableEditionData,\n    setSideSheetWidth,\n    setSideSheetButtonLabel,\n    setSideSheetOnSubmit,\n    setSideSheetProps,\n    closeSideSheet,\n    onCreate,\n    onUpdate,\n    classes,\n    tableDescription,\n    value\n  ]);\n\n  return (\n    <div>\n      {loadingPage ? (\n        <>\n          {skeleton.map((sk) => sk)}\n          <LayoutUnit unit='md' />\n          <Skeleton variant='rect' className={classes.skeletonButton} />\n        </>\n      ) : (\n        sideSheetContent\n      )}\n    </div>\n  );\n};\n\nVirtualTableSidePanel.propTypes = {\n  /**\n   * Description of the table\n   */\n  tableDescription: PropTypes.array,\n  /**\n   * Entity data\n   */\n  crudTableEditionData: PropTypes.array,\n  /**\n   * onClick event for closing sidesheet\n   */\n  closeSideSheet: PropTypes.func,\n  /**\n   * onClick event for creating\n   */\n  onCreate: PropTypes.func,\n  /**\n   * onClick event for updating\n   */\n  onUpdate: PropTypes.func\n};\n","import React, { useMemo, useState, useCallback, useEffect } from 'react';\nimport PrimaryActionButton from '../../UI/inputs/buttons/PrimaryActionButton';\nimport { AmbientGridTemplate } from '../../UI/templates/deprecated/AmbientGridTemplate/AmbientGridTemplate';\nimport { SideSheet } from '../../UI/surfaces/SideSheet';\nimport { ActionsRenderer } from '../../UI/templates/ui/renderers/ActionsRenderer';\nimport { VirtualTableColumnDefs } from './VirtualTableColumnDefs';\nimport { AddIcon, DeleteIcon, EditIcon } from '@fluentui/react-icons';\nimport { Typography } from '@material-ui/core';\nimport { format } from 'date-fns';\nimport { getPathObject } from '../../utilities/maintenanceEngine/CrudBrowserUtilities';\nimport { cloneDeep } from 'lodash';\nimport { useTranslation } from 'react-i18next';\nimport { executeQueryWithParameters } from '../../udp/utilities/methodUtils';\nimport { useHandleAxiosSnackbar } from '../../utilities/apiHelpers';\nimport { useAxiosMutate } from '../../utilities/useAxiosMutate';\nimport { useLocation } from 'react-router-dom';\nimport { useUser } from '../../utilities/auth/useUser';\nimport { useAxiosGet } from '../../utilities/useAxiosGet';\nimport { VirtualTableSidePanel } from './VirtualTableSidePanel';\nimport { UdpEnums } from '../../enums/unitySystemEnums';\nimport { useBuildEnvironment } from '../../shell/ui/useBuildEnvironment';\nimport { getSanitizedName } from '../../utilities/entities/entityUtilities';\nimport { useSetLocationState } from '../../hooks/useSetLocationState';\nimport { ConfigService } from '../../configService';\n\nconst useSearchParams = () => {\n  const { search } = useLocation();\n  return useMemo(() => new URLSearchParams(search), [search]);\n};\n\nexport const VirtualBrowser = (props) => {\n  const { ...other } = props;\n  const urlSearchParams = useSearchParams();\n  const location = useLocation();\n  const { value, promotedEntity } = location.state || {};\n  const parts = location?.pathname?.split('/');\n  const virtualId = value\n    ? value?.id\n    : '' || parts\n    ? parts[parts.length - 1]\n    : null;\n\n  const user = useUser();\n  const buildEnv = useBuildEnvironment();\n  const [isSheetOpen, setSheetOpen] = useState(false);\n  const [sideSheetWidth, setSideSheetWidth] = useState(600);\n  const [sideSheetButtonLabel, setSideSheetButtonLabel] = useState('');\n  const [otherSideSheetProps, setOtherSideSheetProps] = useState({});\n  const [sideSheetOnSubmit, setSideSheetOnSubmit] = useState(\n    () => () => console.warn('onSubmit not set')\n  );\n  const [selectedEntity, setSelectedEntity] = useState(promotedEntity);\n  const { t } = useTranslation();\n  const { handleErrorSnackbar, handleSuccessSnackbar } =\n    useHandleAxiosSnackbar();\n  const setLocationState = useSetLocationState();\n\n  const closeSheet = useCallback(() => {\n    setSheetOpen(false);\n  }, []);\n\n  const entityName = useMemo(() => {\n    if (selectedEntity) {\n      return selectedEntity.entityName || '';\n    } else {\n      return urlSearchParams.has('entityName') === true\n        ? urlSearchParams.get('entityName')\n        : '';\n    }\n  }, [selectedEntity, urlSearchParams]);\n\n  const createApiMethodPageId = useMemo(() => {\n    return selectedEntity?.unityBaseCreateMethod?.pageId;\n  }, [selectedEntity]);\n\n  const [{ data: tpacb, loading: loadingTpacb, error: tpacbError }] =\n    useAxiosGet(\n      ConfigService.integrationV1ApiUrl,\n      `tenantProductApiCatalogBase/tenant/${user?.currentTenantId}/product/${ConfigService.config.UNITY_PRODUCT_ID}`,\n      {},\n      !!!user || !!promotedEntity,\n      false\n    );\n\n  const [{ data: promotedMethodEntities }] = useAxiosGet(\n    ConfigService.integrationV1ApiUrl,\n    `apicatalog/${tpacb?.apiCatalogId}/promotedMethodEntities/${entityName}/product/${ConfigService.config.UNITY_PRODUCT_ID}`,\n    {},\n    !!!tpacb || !!!user || !!!entityName,\n    false\n  );\n\n  // Get all rows of an entity\n  const [{ data: entityData, loading: isLoading }, fetchEntityData] =\n    useAxiosMutate(\n      ConfigService.integrationV1ApiUrl,\n      `apimethod/executeQueryWithParameters/${selectedEntity?.unityBaseGetDataMethod?.apiMethodId}`,\n      {\n        method: 'post'\n      }\n    );\n\n  // Get all rows of an entity\n  const [\n    { data: tableDescription, loading: tableDescriptionLoading },\n    fetchTableDescription\n  ] = useAxiosMutate(\n    ConfigService.integrationV1ApiUrl,\n    `apimethod/executeQueryWithParameters/${selectedEntity?.unityBaseDescribeMethod?.apiMethodId}`,\n    {\n      method: 'post'\n    }\n  );\n\n  const constructVirtualValuesForRequest = useCallback(\n    (values) => {\n      if (!tableDescription) {\n        return [];\n      }\n      const bodyArr = [];\n      tableDescription.forEach((column) => {\n        const valueExist =\n          typeof values[column.name] == 'boolean' || values[column.name];\n        if (column.name || valueExist) {\n          switch (getSanitizedName(entityName?.toLowerCase())) {\n            case UdpEnums.Udp_Lookup.toLowerCase():\n              bodyArr.push({\n                lookupColumnId: column.id,\n                value: values[column.name]\n              });\n              break;\n            default:\n          }\n        }\n      });\n      return bodyArr;\n    },\n    [tableDescription, entityName]\n  );\n\n  const handleOnCreate = useCallback(\n    async (values) => {\n      if (selectedEntity?.unityBaseVirtualCreateMethod) {\n        const requestArr = constructVirtualValuesForRequest(values);\n        const data = { requestBody: requestArr, id: virtualId };\n        const response = await executeQueryWithParameters(\n          { data },\n          selectedEntity.unityBaseVirtualCreateMethod.apiMethodId\n        ).catch((res) => {\n          handleErrorSnackbar(res.message);\n        });\n\n        if (response?.status === 200) {\n          handleSuccessSnackbar(t(`Row has been created`));\n          const queryData = { id: virtualId };\n          fetchEntityData({ data: queryData });\n        }\n      }\n    },\n    [\n      selectedEntity,\n      t,\n      fetchEntityData,\n      handleErrorSnackbar,\n      handleSuccessSnackbar,\n      virtualId,\n      constructVirtualValuesForRequest\n    ]\n  );\n\n  const handleOnUpdate = useCallback(\n    async (values) => {\n      if (selectedEntity?.unityBaseVirtualUpdateMethod) {\n        // Get primary key value object using path parameters and merge with data\n        const primaryKeyValues = [virtualId, values.udpVirtualRowId];\n        const pathObject = getPathObject(\n          selectedEntity.unityBaseVirtualUpdateMethod.pathParameters,\n          primaryKeyValues\n        );\n        const requestArr = constructVirtualValuesForRequest(values);\n        let data = { requestBody: requestArr };\n        if (Array.isArray(pathObject)) {\n          pathObject.forEach((po) => {\n            data[Object.keys(po)[0]] = po[Object.keys(po)[0]];\n          });\n        } else {\n          data = { ...pathObject, requestBody: requestArr };\n        }\n\n        const response = await executeQueryWithParameters(\n          { data },\n          selectedEntity.unityBaseVirtualUpdateMethod.apiMethodId\n        ).catch((res) => {\n          handleErrorSnackbar(res.message);\n        });\n\n        if (response?.status === 200) {\n          handleSuccessSnackbar(t(`Row has been updated`));\n          const queryData = { id: virtualId };\n          fetchEntityData({ data: queryData });\n        }\n      }\n    },\n    [\n      selectedEntity,\n      t,\n      fetchEntityData,\n      handleErrorSnackbar,\n      handleSuccessSnackbar,\n      virtualId,\n      constructVirtualValuesForRequest\n    ]\n  );\n\n  const handleOnDelete = useCallback(\n    async (value) => {\n      if (selectedEntity?.unityBaseVirtualDeleteMethod) {\n        // Get primary key value object using path parameters and merge with data\n        const primaryKeyValues = [virtualId, value.udpVirtualRowId];\n        const pathObject = getPathObject(\n          selectedEntity?.unityBaseVirtualDeleteMethod.pathParameters,\n          primaryKeyValues\n        );\n        let data = {};\n        if (Array.isArray(pathObject)) {\n          pathObject.forEach((po) => {\n            data[Object.keys(po)[0]] = po[Object.keys(po)[0]];\n          });\n        } else {\n          data = { ...pathObject };\n        }\n\n        const response = await executeQueryWithParameters(\n          { data },\n          selectedEntity.unityBaseVirtualDeleteMethod.apiMethodId\n        ).catch((res) => {\n          handleErrorSnackbar(res.message);\n        });\n\n        if (response?.status === 200) {\n          handleSuccessSnackbar(t(`Row has been deleted`));\n          const queryData = { id: virtualId };\n          fetchEntityData({ data: queryData });\n        }\n      }\n    },\n    [\n      selectedEntity,\n      t,\n      fetchEntityData,\n      handleErrorSnackbar,\n      handleSuccessSnackbar,\n      virtualId\n    ]\n  );\n\n  const actionList = useMemo(() => {\n    if (!selectedEntity) {\n      return;\n    }\n\n    return [\n      {\n        id: 1, // Must be unique\n        title: selectedEntity?.unityBaseVirtualUpdateMethod\n          ? t('Edit')\n          : t('Edit Method Not Accessible'),\n        icon: EditIcon,\n        onClick: null,\n        opens: 'sideSheet',\n        view: {\n          component: VirtualTableSidePanel,\n          properties: {\n            tableDescription: tableDescription,\n            onUpdate: handleOnUpdate,\n            valuePropName: 'value',\n            closeSideSheet: null,\n            closeSideSheetPropName: 'closeSideSheet',\n            pageId: selectedEntity?.unityBaseVirtualUpdateMethod?.pageId,\n            isNewEntry: false\n          }\n        },\n        disabled: !!!selectedEntity?.unityBaseVirtualUpdateMethod\n      },\n      {\n        id: 2, // Must be unique\n        title: selectedEntity?.unityBaseVirtualDeleteMethod\n          ? t('Delete')\n          : t('Delete Method Not Accessible'),\n        icon: DeleteIcon,\n        onClick: null,\n        opens: 'dialog',\n        view: {\n          component: null,\n          properties: {\n            title: t('Delete'),\n            message: t('Are you sure you want to delete this row?'),\n            labelOne: t('Cancel'),\n            actionTwo: handleOnDelete,\n            labelTwo: t('Confirm')\n          }\n        },\n        disabled: !!!selectedEntity?.unityBaseVirtualDeleteMethod\n      }\n    ];\n  }, [selectedEntity, t, handleOnUpdate, handleOnDelete, tableDescription]);\n\n  const columnDefs = useMemo(() => {\n    if (tableDescription?.length) {\n      return VirtualTableColumnDefs(tableDescription, actionList);\n    }\n    return [];\n  }, [actionList, tableDescription]);\n\n  const groupData = useMemo(() => {\n    return columnDefs?.map((item) => {\n      return {\n        groupItem: item.field,\n        label: item.headerName,\n        value: item.field\n      };\n    });\n  }, [columnDefs]);\n\n  useEffect(() => {\n    if (promotedMethodEntities) {\n      setSelectedEntity(promotedMethodEntities);\n    }\n  }, [promotedMethodEntities]);\n\n  useEffect(() => {\n    if (virtualId) {\n      const queryData = { id: virtualId };\n      if (selectedEntity?.unityBaseGetDataMethod?.apiMethodId) {\n        fetchEntityData({ data: queryData });\n      }\n      if (selectedEntity?.unityBaseDescribeMethod?.apiMethodId) {\n        fetchTableDescription({ data: queryData });\n      }\n    }\n  }, [selectedEntity, fetchEntityData, virtualId, fetchTableDescription]);\n\n  // Setting location state label so that if this page was saved to favorites\n  // we can determine the bread crumb\n  useEffect(() => {\n    setLocationState({ label: t(value?.name) || t('Virtual Lookup') });\n  }, [setLocationState, t, value]);\n\n  const pab = (\n    <PrimaryActionButton onClick={() => setSheetOpen && setSheetOpen(true)}>\n      <Typography style={{ marginRight: 5 }}>Add</Typography>\n      <AddIcon />\n    </PrimaryActionButton>\n  );\n\n  const SideOptionList = useMemo(\n    () => (\n      <SideSheet\n        open={isSheetOpen}\n        onClose={closeSheet}\n        title={`Add new ${entityName}`}\n        width={sideSheetWidth}\n        buttonLabel={sideSheetButtonLabel}\n        onSubmit={sideSheetOnSubmit}\n        {...otherSideSheetProps}\n      >\n        <VirtualTableSidePanel\n          onCreate={handleOnCreate}\n          closeSideSheet={closeSheet}\n          pageId={createApiMethodPageId}\n          setSideSheetWidth={setSideSheetWidth}\n          setSideSheetButtonLabel={setSideSheetButtonLabel}\n          setSideSheetOnSubmit={setSideSheetOnSubmit}\n          setSideSheetProps={setOtherSideSheetProps}\n          tableDescription={tableDescription}\n        />\n      </SideSheet>\n    ),\n    [\n      isSheetOpen,\n      closeSheet,\n      entityName,\n      sideSheetWidth,\n      sideSheetButtonLabel,\n      sideSheetOnSubmit,\n      handleOnCreate,\n      createApiMethodPageId,\n      otherSideSheetProps,\n      tableDescription\n    ]\n  );\n\n  const formatData = useCallback(() => {\n    if (entityData?.data && tableDescription) {\n      let formattedEntityData = cloneDeep(entityData?.data);\n\n      //   get list of attributes that are datetime\n      const datetimeFields = tableDescription?.reduce((fields, element) => {\n        if (element?.type === 'datetime') {\n          fields.push(element?.name);\n        }\n        return fields;\n      }, []);\n\n      if (datetimeFields.length) {\n        formattedEntityData.forEach((e) => {\n          Object.keys(e).forEach((key) => {\n            // format all datetime fields\n            if (datetimeFields.find((field) => field === key)) {\n              // LAA UNT-2977: add null check to prevent default date from being added when null\n              if (e[key] === null) return;\n              e[key] = format(new Date(e[key]), 'yyyy/MM/dd kk:mm:ss');\n            }\n          });\n        });\n      }\n\n      return formattedEntityData;\n    }\n    return [];\n  }, [entityData, tableDescription]);\n\n  return (\n    <>\n      <AmbientGridTemplate\n        title={value?.name || entityData?.name}\n        data={entityData ? formatData(entityData?.data) : []}\n        columnDefs={columnDefs}\n        groupingData={groupData}\n        primaryActionButton={pab}\n        frameworkComponents={{ actionsRenderer: ActionsRenderer }}\n        height={`calc(100vh - ${buildEnv ? '139px' : '114px'})`}\n        disableRowSelection={true}\n        loading={isLoading}\n        {...other}\n      />\n      {SideOptionList}\n    </>\n  );\n};\n\n\nexport default VirtualBrowser;\n"],"mappings":"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"}

package/dist/VirtualForm-BQrYKgn3.js

@@ -0,0 +1,66 @@
+import { t as Form } from "./Form-DbOA5j38.js";
+import { n as SubmitButton, t as FormButtons } from "./FormButtons-BTCO-pzW.js";
+import { t as useVirtualActions } from "./virtualActions-BrXVKweh.js";
+import React, { useState } from "react";
+import { Typography, makeStyles } from "@material-ui/core";
+import PropTypes from "prop-types";
+
+//#region src/UI/forms/VirtualForm.jsx
+const useStyles = makeStyles((theme) => ({
+	actions: {
+		marginTop: theme.spacing(2),
+		marginBottom: theme.spacing(2),
+		display: "flex",
+		flexDirection: "row"
+	},
+	title: { flexGrow: 1 },
+	subject: {
+		marginLeft: theme.spacing(1),
+		display: "flex",
+		flexDirection: "row",
+		flexGrow: 1
+	},
+	switchRoot: { marginLeft: theme.spacing(1) },
+	input: {
+		height: 34,
+		padding: 0
+	},
+	formTextInput: { fontSize: 13 },
+	labelRoot: { fontSize: 13 }
+}));
+const VirtualForm = (props) => {
+	const { tableDescription, rowValue, closeSideSheet, onCreate, onUpdate } = props;
+	const { renderInputByFieldType } = useVirtualActions();
+	const [virtualTableFormData, setVirtualTableFormData] = useState(rowValue || {});
+	const classes = useStyles();
+	const handleSubmit = async (values) => {
+		let newTableData = {
+			...virtualTableFormData,
+			...values
+		};
+		if (!rowValue) onCreate && await onCreate(newTableData);
+		else onUpdate && await onUpdate(newTableData);
+		closeSideSheet && closeSideSheet();
+	};
+	return /* @__PURE__ */ React.createElement(Form, { onSubmit: handleSubmit }, /* @__PURE__ */ React.createElement("div", null, tableDescription?.map((formField, index) => {
+		return /* @__PURE__ */ React.createElement(React.Fragment, { key: `${formField.name}-${index}` }, /* @__PURE__ */ React.createElement(Typography, {
+			variant: "subtitle2",
+			style: { marginTop: 8 }
+		}, formField.friendlyName), renderInputByFieldType(formField, index, virtualTableFormData, classes));
+	})), /* @__PURE__ */ React.createElement(FormButtons, null, /* @__PURE__ */ React.createElement(SubmitButton, {
+		variant: "contained",
+		color: "secondary",
+		disablePristine: false,
+		disabled: false,
+		style: { marginTop: 15 }
+	}, "Save")));
+};
+VirtualForm.propTypes = {
+	closeSideSheet: PropTypes.func,
+	onCreate: PropTypes.func,
+	onUpdate: PropTypes.func
+};
+
+//#endregion
+export { VirtualForm as t };
+//# sourceMappingURL=VirtualForm-BQrYKgn3.js.map

package/dist/VirtualForm-BQrYKgn3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualForm-BQrYKgn3.js","names":[],"sources":["../src/UI/forms/VirtualForm.jsx"],"sourcesContent":["import { makeStyles, Typography } from '@material-ui/core';\nimport PropTypes from 'prop-types';\nimport React, { useState } from 'react';\nimport { Form, FormButtons, SubmitButton } from '../../utilities/form';\nimport { useVirtualActions } from '../../hooks/virtualActions';\n\nconst useStyles = makeStyles((theme) => ({\n  actions: {\n    marginTop: theme.spacing(2),\n    marginBottom: theme.spacing(2),\n    display: 'flex',\n    flexDirection: 'row'\n  },\n  title: {\n    flexGrow: 1\n  },\n  subject: {\n    marginLeft: theme.spacing(1),\n    display: 'flex',\n    flexDirection: 'row',\n    flexGrow: 1\n  },\n  switchRoot: {\n    marginLeft: theme.spacing(1)\n  },\n  input: {\n    height: 34,\n    padding: 0\n  },\n  formTextInput: {\n    fontSize: 13\n  },\n  labelRoot: {\n    fontSize: 13\n  }\n}));\n\nexport const VirtualForm = (props) => {\n  const { tableDescription, rowValue, closeSideSheet, onCreate, onUpdate } =\n    props;\n  const { renderInputByFieldType } = useVirtualActions();\n\n  const [virtualTableFormData, setVirtualTableFormData] = useState(\n    rowValue || {}\n  );\n  const classes = useStyles();\n\n  const handleSubmit = async (values) => {\n    let newTableData = {\n      ...virtualTableFormData,\n      ...values\n    };\n\n    const isNewRow = !rowValue;\n\n    if (isNewRow) {\n      onCreate && (await onCreate(newTableData));\n    } else {\n      onUpdate && (await onUpdate(newTableData));\n    }\n    closeSideSheet && closeSideSheet();\n  };\n\n  return (\n    <Form onSubmit={handleSubmit}>\n      <div>\n        {tableDescription?.map((formField, index) => {\n          return (\n            <React.Fragment key={`${formField.name}-${index}`}>\n              <Typography variant='subtitle2' style={{ marginTop: 8 }}>\n                {formField.friendlyName}\n              </Typography>\n              {renderInputByFieldType(\n                formField,\n                index,\n                virtualTableFormData,\n                classes\n              )}\n            </React.Fragment>\n          );\n        })}\n      </div>\n\n      <FormButtons>\n        <SubmitButton\n          variant='contained'\n          color='secondary'\n          disablePristine={false}\n          disabled={false}\n          style={{ marginTop: 15 }}\n        >\n          Save\n        </SubmitButton>\n      </FormButtons>\n    </Form>\n  );\n};\n\nVirtualForm.propTypes = {\n  /**\n   * onClick event for closing sidesheet\n   */\n  closeSideSheet: PropTypes.func,\n  /**\n   * onClick event for creating\n   */\n  onCreate: PropTypes.func,\n  /**\n   * onClick event for updating\n   */\n  onUpdate: PropTypes.func\n};\n"],"mappings":";;;;;;;;AAMA,MAAM,YAAY,YAAY,WAAW;CACvC,SAAS;EACP,WAAW,MAAM,QAAQ,EAAE;EAC3B,cAAc,MAAM,QAAQ,EAAE;EAC9B,SAAS;EACT,eAAe;EAChB;CACD,OAAO,EACL,UAAU,GACX;CACD,SAAS;EACP,YAAY,MAAM,QAAQ,EAAE;EAC5B,SAAS;EACT,eAAe;EACf,UAAU;EACX;CACD,YAAY,EACV,YAAY,MAAM,QAAQ,EAAE,EAC7B;CACD,OAAO;EACL,QAAQ;EACR,SAAS;EACV;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACF,EAAE;AAEH,MAAa,eAAe,UAAU;CACpC,MAAM,EAAE,kBAAkB,UAAU,gBAAgB,UAAU,aAC5D;CACF,MAAM,EAAE,2BAA2B,mBAAmB;CAEtD,MAAM,CAAC,sBAAsB,2BAA2B,SACtD,YAAY,EAAE,CACf;CACD,MAAM,UAAU,WAAW;CAE3B,MAAM,eAAe,OAAO,WAAW;EACrC,IAAI,eAAe;GACjB,GAAG;GACH,GAAG;GACJ;AAID,MAFiB,CAAC,SAGhB,aAAa,MAAM,SAAS,aAAa;MAEzC,aAAa,MAAM,SAAS,aAAa;AAE3C,oBAAkB,gBAAgB;;AAGpC,QACE,oCAAC,QAAK,UAAU,gBACd,oCAAC,aACE,kBAAkB,KAAK,WAAW,UAAU;AAC3C,SACE,oCAAC,MAAM,YAAS,KAAK,GAAG,UAAU,KAAK,GAAG,WACxC,oCAAC;GAAW,SAAQ;GAAY,OAAO,EAAE,WAAW,GAAG;KACpD,UAAU,aACA,EACZ,uBACC,WACA,OACA,sBACA,QACD,CACc;GAEnB,CACE,EAEN,oCAAC,mBACC,oCAAC;EACC,SAAQ;EACR,OAAM;EACN,iBAAiB;EACjB,UAAU;EACV,OAAO,EAAE,WAAW,IAAI;IACzB,OAEc,CACH,CACT;;AAIX,YAAY,YAAY;CAItB,gBAAgB,UAAU;CAI1B,UAAU,UAAU;CAIpB,UAAU,UAAU;CACrB"}

package/dist/WidgetCard-CDqYxK5O.js

@@ -0,0 +1,72 @@
+import { n as FUICardHeaderMenu, r as FUICard_default } from "./FUICard-DmszpY_T.js";
+import { t as FUIMenuItem_default } from "./FUIMenuItem-BZJKJa91.js";
+import React, { Fragment } from "react";
+import { CircularProgress, makeStyles } from "@material-ui/core";
+import clsx from "clsx";
+import { DeleteIcon } from "@fluentui/react-icons";
+
+//#region src/UI/widgets/WidgetCard.jsx
+/**
+* Core component for dashboard widget cards
+*/
+const WidgetCard = (props) => {
+	const { children, headerActions, className, widgetType, id, layout, params, setParam, onDelete, loading, errors, theme, ...other } = props;
+	const classes = makeStyles((theme$1) => ({
+		root: { "&.react-resizable-hide .react-resizable-handle": { display: "none" } },
+		darkRoot: {
+			"&.react-resizable-hide .react-resizable-handle": { display: "none" },
+			background: "#424242",
+			color: "white"
+		},
+		anyRoot: { "& .MuiCardContent-root": {
+			justifyContent: "space-between",
+			overflow: "auto",
+			padding: 0
+		} },
+		handle: {
+			cursor: "move",
+			"&:hover": { backgroundColor: theme$1.palette.action.hover }
+		},
+		loadingContent: {
+			flex: 1,
+			display: "flex",
+			flexDirection: "column",
+			alignItems: "center",
+			justifyContent: "center"
+		},
+		innerWidgetContentContainer: {
+			height: "100%",
+			minWidth: widgetType === "ProgressBarWidget" ? 0 : 270,
+			display: "flex",
+			flexDirection: "column",
+			justifyContent: "space-between",
+			padding: theme$1.spacing(2)
+		}
+	}))();
+	const raised = /(^|\s)react-draggable-dragging(\s|$)/.test(className ?? "");
+	let body = children;
+	if (loading) body = /* @__PURE__ */ React.createElement("div", { className: classes.loadingContent }, /* @__PURE__ */ React.createElement(CircularProgress, {
+		color: "secondary",
+		size: 64
+	}));
+	if (errors && !body) body = /* @__PURE__ */ React.createElement("div", null, "Unexpected error");
+	return /* @__PURE__ */ React.createElement(FUICard_default, {
+		...other,
+		className: clsx(className, theme === "dark" ? classes.darkRoot : classes.root, classes.anyRoot),
+		raised,
+		CardHeaderProps: {
+			className: classes.handle,
+			"data-handle": true
+		},
+		headerActions: /* @__PURE__ */ React.createElement(React.Fragment, null, headerActions, /* @__PURE__ */ React.createElement(FUICardHeaderMenu, null, /* @__PURE__ */ React.createElement(FUIMenuItem_default, {
+			onClick: onDelete,
+			fluentIcon: DeleteIcon,
+			primary: "Delete"
+		})))
+	}, /* @__PURE__ */ React.createElement("div", { className: classes.innerWidgetContentContainer }, body));
+};
+var WidgetCard_default = WidgetCard;
+
+//#endregion
+export { WidgetCard_default as t };
+//# sourceMappingURL=WidgetCard-CDqYxK5O.js.map

package/dist/WidgetCard-CDqYxK5O.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WidgetCard-CDqYxK5O.js","names":["theme","FUICard","FUIMenuItem"],"sources":["../src/UI/widgets/WidgetCard.jsx"],"sourcesContent":["import React, { Fragment } from 'react';\nimport { DeleteIcon } from '@fluentui/react-icons';\nimport { makeStyles, CircularProgress } from '@material-ui/core';\nimport clsx from 'clsx';\nimport FUICard, { FUICardHeaderMenu } from '../surfaces/cards/fluentCards/FUICard';\nimport FUIMenuItem from './FluentComponents/FUIMenuItem';\n\n/**\n * Core component for dashboard widget cards\n */\nconst WidgetCard = (props) => {\n  const {\n    children,\n    headerActions,\n    className,\n    widgetType,\n    id,\n    layout,\n    params,\n    setParam,\n    onDelete,\n    loading,\n    errors,\n    theme,\n    ...other\n  } = props;\n\n  const useStyles = makeStyles((theme) => ({\n    root: {\n      '&.react-resizable-hide .react-resizable-handle': {\n        display: 'none'\n      }\n    },\n    darkRoot: {\n      '&.react-resizable-hide .react-resizable-handle': {\n        display: 'none'\n      },\n      background: '#424242',\n      color: 'white'\n    },\n    anyRoot: {\n      '& .MuiCardContent-root': {\n        justifyContent: 'space-between',\n        overflow: 'auto',\n        padding: 0\n      }\n    },\n    handle: {\n      cursor: 'move',\n      '&:hover': {\n        backgroundColor: theme.palette.action.hover\n      }\n    },\n    loadingContent: {\n      flex: 1,\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      justifyContent: 'center'\n    },\n    innerWidgetContentContainer: {\n      height: '100%',\n      minWidth: widgetType === 'ProgressBarWidget' ? 0 : 270,\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      padding: theme.spacing(2)\n    }\n  }));\n  const classes = useStyles();\n\n  const raised = /(^|\\s)react-draggable-dragging(\\s|$)/.test(className ?? '');\n  let body = children;\n  if (loading) {\n    body = (\n      <div className={classes.loadingContent}>\n        <CircularProgress color='secondary' size={64} />\n      </div>\n    );\n  }\n  if (errors && !body) {\n    body = <div>Unexpected error</div>;\n  }\n  return (\n    <FUICard\n      {...other}\n      className={clsx(\n        className,\n        theme === 'dark' ? classes.darkRoot : classes.root,\n        classes.anyRoot\n      )}\n      raised={raised}\n      CardHeaderProps={{\n        className: classes.handle,\n        'data-handle': true\n      }}\n      headerActions={\n        <>\n          {headerActions}\n          <FUICardHeaderMenu>\n            <FUIMenuItem\n              onClick={onDelete}\n              fluentIcon={DeleteIcon}\n              primary='Delete'\n            />\n          </FUICardHeaderMenu>\n        </>\n      }\n    >\n      <div className={classes.innerWidgetContentContainer}>{body}</div>\n    </FUICard>\n  );\n};\n\nexport default WidgetCard;\n"],"mappings":";;;;;;;;;;;AAUA,MAAM,cAAc,UAAU;CAC5B,MAAM,EACJ,UACA,eACA,WACA,YACA,IACA,QACA,QACA,UACA,UACA,SACA,QACA,OACA,GAAG,UACD;CA4CJ,MAAM,UA1CY,YAAY,aAAW;EACvC,MAAM,EACJ,kDAAkD,EAChD,SAAS,QACV,EACF;EACD,UAAU;GACR,kDAAkD,EAChD,SAAS,QACV;GACD,YAAY;GACZ,OAAO;GACR;EACD,SAAS,EACP,0BAA0B;GACxB,gBAAgB;GAChB,UAAU;GACV,SAAS;GACV,EACF;EACD,QAAQ;GACN,QAAQ;GACR,WAAW,EACT,iBAAiBA,QAAM,QAAQ,OAAO,OACvC;GACF;EACD,gBAAgB;GACd,MAAM;GACN,SAAS;GACT,eAAe;GACf,YAAY;GACZ,gBAAgB;GACjB;EACD,6BAA6B;GAC3B,QAAQ;GACR,UAAU,eAAe,sBAAsB,IAAI;GACnD,SAAS;GACT,eAAe;GACf,gBAAgB;GAChB,SAASA,QAAM,QAAQ,EAAE;GAC1B;EACF,EAAE,EACwB;CAE3B,MAAM,SAAS,uCAAuC,KAAK,aAAa,GAAG;CAC3E,IAAI,OAAO;AACX,KAAI,QACF,QACE,oCAAC,SAAI,WAAW,QAAQ,kBACtB,oCAAC;EAAiB,OAAM;EAAY,MAAM;GAAM,CAC5C;AAGV,KAAI,UAAU,CAAC,KACb,QAAO,oCAAC,aAAI,mBAAsB;AAEpC,QACE,oCAACC;EACC,GAAI;EACJ,WAAW,KACT,WACA,UAAU,SAAS,QAAQ,WAAW,QAAQ,MAC9C,QAAQ,QACT;EACO;EACR,iBAAiB;GACf,WAAW,QAAQ;GACnB,eAAe;GAChB;EACD,eACE,0DACG,eACD,oCAAC,yBACC,oCAACC;GACC,SAAS;GACT,YAAY;GACZ,SAAQ;IACR,CACgB,CACnB;IAGL,oCAAC,SAAI,WAAW,QAAQ,+BAA8B,KAAW,CACzD;;AAId,yBAAe"}

package/dist/WorkOrderCard-SG7aBovD.js

@@ -0,0 +1,55 @@
+import { t as FluentIconButton } from "./FluentIconButton-Dc95mE3v.js";
+import { t as LayoutUnit } from "./LayoutUnit-D4jJvonh.js";
+import { t as AmbientCard } from "./AmbientCard-DK9abODq.js";
+import React, { useState } from "react";
+import { Collapse, Divider, Typography, makeStyles } from "@material-ui/core";
+import { ChevronDownIcon, ChevronUpIcon } from "@fluentui/react-icons";
+
+//#region src/UI/surfaces/cards/workOrderCard/WorkOrderHeader.jsx
+const useStyles$1 = makeStyles((theme) => ({
+	root: {},
+	wrapper: {
+		display: "flex",
+		justifyContent: "space-between",
+		width: "75%"
+	}
+}));
+const WorkOrderHeader = ({ cost, hours }) => {
+	const classes = useStyles$1();
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classes.wrapper }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, { variant: "h3" }, " $", cost, " "), /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, " Total Cost ")), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Divider, { variant: "vertical" })), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, { variant: "h3" }, " ", hours, " "), /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, " Total Hours "))));
+};
+
+//#endregion
+//#region src/UI/surfaces/cards/workOrderCard/WorkOrderCard.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {},
+	moreButton: { display: "flex" }
+}));
+const WorkOrderCard = ({ title, onClick, status, label, cost, hours, service, list, extendedList, launch }) => {
+	const classes = useStyles();
+	const [expanded, setExpanded] = useState(false);
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(AmbientCard, {
+		title,
+		onClick,
+		ariaLabel: "launch",
+		fullWidth: true,
+		status,
+		label,
+		launch,
+		extendedContent: expanded
+	}, cost && /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(WorkOrderHeader, {
+		cost,
+		hours
+	})), /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "sm" }), service, /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "sm" })), !cost && /* @__PURE__ */ React.createElement("div", null, " ", service), /* @__PURE__ */ React.createElement("div", null, list, /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" }), extendedList && /* @__PURE__ */ React.createElement("div", { className: classes.moreButton }, /* @__PURE__ */ React.createElement(FluentIconButton, {
+		onClick: () => setExpanded(!expanded),
+		icon: expanded ? ChevronUpIcon : ChevronDownIcon,
+		className: classes.icon
+	})), /* @__PURE__ */ React.createElement(Collapse, {
+		in: expanded,
+		timeout: "auto"
+	}, /* @__PURE__ */ React.createElement("div", null, extendedList)))));
+};
+
+//#endregion
+export { WorkOrderHeader as n, WorkOrderCard as t };
+//# sourceMappingURL=WorkOrderCard-SG7aBovD.js.map

package/dist/WorkOrderCard-SG7aBovD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkOrderCard-SG7aBovD.js","names":["useStyles"],"sources":["../src/UI/surfaces/cards/workOrderCard/WorkOrderHeader.jsx","../src/UI/surfaces/cards/workOrderCard/WorkOrderCard.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography, Divider } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  wrapper: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    width: '75%'\n  }\n}))\n\nexport const WorkOrderHeader = ({ cost, hours }) => {\n  const classes = useStyles()\n\n  return (\n    <div className={classes.root}>\n      <div className={classes.wrapper}>\n        <div>\n          <Typography variant='h3'> ${cost} </Typography>\n          <Typography variant='caption'> Total Cost </Typography>\n        </div>\n        <div>\n          <Divider variant='vertical' />\n        </div>\n        <div>\n          <Typography variant='h3'> {hours} </Typography>\n          <Typography variant='caption'> Total Hours </Typography>\n        </div>\n      </div>\n    </div>\n  )\n}\n","import React, { useState } from 'react'\nimport { makeStyles, Collapse } from '@material-ui/core'\nimport { AmbientCard } from '../AmbientCard'\nimport { FluentIconButton } from '../../../inputs/buttons/FluentIconButton'\nimport { LayoutUnit } from '../../../../layout/LayoutUnit'\nimport { ChevronDownIcon, ChevronUpIcon } from '@fluentui/react-icons'\nimport { WorkOrderHeader } from './WorkOrderHeader'\n\nconst useStyles = makeStyles(theme => ({\n  root: {},\n  moreButton: {\n    display: 'flex',\n    // justifyContent: 'flex-end',\n  },\n}));\n\nexport const WorkOrderCard = ({\n  title,\n  onClick,\n  status,\n  label,\n  cost,\n  hours,\n  service,\n  list,\n  extendedList,\n  launch,\n}) => {\n  const classes = useStyles();\n  const [expanded, setExpanded] = useState(false);\n\n  return (\n    <div className={classes.root}>\n      <AmbientCard\n        title={title}\n        onClick={onClick}\n        ariaLabel=\"launch\"\n        fullWidth\n        status={status}\n        label={label}\n        launch={launch}\n        extendedContent={expanded}\n      >\n        {cost && (\n          <div>\n            <div>\n              <WorkOrderHeader cost={cost} hours={hours} />\n            </div>\n            <LayoutUnit unit=\"sm\" />\n            {service}\n            <LayoutUnit unit=\"sm\" />\n          </div>\n        )}\n        {!cost && <div> {service}</div>}\n\n        <div>\n          {list}\n          <LayoutUnit unit=\"xxs\" />\n          {extendedList && (\n            <div className={classes.moreButton}>\n              <FluentIconButton\n                onClick={() => setExpanded(!expanded)}\n                icon={expanded ? ChevronUpIcon : ChevronDownIcon}\n                className={classes.icon}\n              />\n            </div>\n          )}\n          <Collapse in={expanded} timeout=\"auto\">\n            <div>{extendedList}</div>\n          </Collapse>\n        </div>\n      </AmbientCard>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAGA,MAAMA,cAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,SAAS;EACP,SAAS;EACT,gBAAgB;EAChB,OAAO;EACR;CACF,EAAE;AAEH,MAAa,mBAAmB,EAAE,MAAM,YAAY;CAClD,MAAM,UAAUA,aAAW;AAE3B,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC,SAAI,WAAW,QAAQ,WACtB,oCAAC,aACC,oCAAC,cAAW,SAAQ,QAAK,MAAG,MAAK,IAAc,EAC/C,oCAAC,cAAW,SAAQ,aAAU,eAAyB,CACnD,EACN,oCAAC,aACC,oCAAC,WAAQ,SAAQ,aAAa,CAC1B,EACN,oCAAC,aACC,oCAAC,cAAW,SAAQ,QAAK,KAAE,OAAM,IAAc,EAC/C,oCAAC,cAAW,SAAQ,aAAU,gBAA0B,CACpD,CACF,CACF;;;;;ACtBV,MAAM,YAAY,YAAW,WAAU;CACrC,MAAM,EAAE;CACR,YAAY,EACV,SAAS,QAEV;CACF,EAAE;AAEH,MAAa,iBAAiB,EAC5B,OACA,SACA,QACA,OACA,MACA,OACA,SACA,MACA,cACA,aACI;CACJ,MAAM,UAAU,WAAW;CAC3B,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;AAE/C,QACE,oCAAC,SAAI,WAAW,QAAQ,QACtB,oCAAC;EACQ;EACE;EACT,WAAU;EACV;EACQ;EACD;EACC;EACR,iBAAiB;IAEhB,QACC,oCAAC,aACC,oCAAC,aACC,oCAAC;EAAsB;EAAa;GAAS,CACzC,EACN,oCAAC,cAAW,MAAK,OAAO,EACvB,SACD,oCAAC,cAAW,MAAK,OAAO,CACpB,EAEP,CAAC,QAAQ,oCAAC,aAAI,KAAE,QAAc,EAE/B,oCAAC,aACE,MACD,oCAAC,cAAW,MAAK,QAAQ,EACxB,gBACC,oCAAC,SAAI,WAAW,QAAQ,cACtB,oCAAC;EACC,eAAe,YAAY,CAAC,SAAS;EACrC,MAAM,WAAW,gBAAgB;EACjC,WAAW,QAAQ;GACnB,CACE,EAER,oCAAC;EAAS,IAAI;EAAU,SAAQ;IAC9B,oCAAC,aAAK,aAAmB,CAChB,CACP,CACM,CACV"}

package/dist/WorkflowContainer-DFidyJU3.js

@@ -0,0 +1,187 @@
+import { t as ConfigService } from "./configService-C4uoG3wj.js";
+import { t as useUser } from "./useUser-wpHGo6jU.js";
+import { P as TreeViewModeEnums } from "./unitySystemEnums-DtVX3A-I.js";
+import { n as useShellStore } from "./shellStore-C8zfPsZ-.js";
+import { t as useAxiosGet } from "./useAxiosGet-vvPjwB4W.js";
+import { t as useSetLocationState } from "./useSetLocationState-Kvcc9BTb.js";
+import { n as useBuildEnvironment, t as APP_RIBBON_SPACE } from "./useBuildEnvironment-2gdqpmBX.js";
+import { t as NodeLoader } from "./NodeLoader-BtOQQiwA.js";
+import { t as UtilitySideBar } from "./UtilitySideBar-CkymNmr-.js";
+import { t as WorkflowTreeMenu } from "./WorkflowTreeMenu-CLMTRLUg.js";
+import { i as transformWorkflowPlayTree } from "./workflowUtilities-Y2J2_Bcx.js";
+import { t as WorkflowContent } from "./WorkflowContent-B4W3IhqH.js";
+import { t as useUpdateSearchParams } from "./useUpdateSearchParams-sZqx_zVu.js";
+import React, { useCallback, useEffect, useState } from "react";
+import { makeStyles } from "@material-ui/core";
+import { useLocation } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import { DndProvider } from "react-dnd";
+import { HTML5Backend } from "react-dnd-html5-backend";
+
+//#region src/workflow/WorkflowContainer.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {
+		flex: 1,
+		minHeight: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,
+		display: "grid",
+		gridTemplateAreas: ["sidebar content"].map((line) => `"${line}"`).join(" "),
+		gridTemplateColumns: "auto 1fr",
+		gridTemplateRows: "auto 1fr"
+	},
+	sidebar: {
+		gridArea: "sidebar",
+		marginRight: theme.spacing(1)
+	},
+	content: {
+		gridArea: "content",
+		display: "flex",
+		flexDirection: "column",
+		position: "relative",
+		zIndex: 1,
+		height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,
+		overflowY: "auto"
+	},
+	menuContent: {
+		marginTop: theme.spacing(1),
+		height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 116}px)`,
+		overflowX: "hidden"
+	},
+	loader: {
+		marginRight: theme.spacing(1),
+		marginLeft: theme.spacing(1)
+	},
+	loadingContent: {
+		flex: 1,
+		display: "flex",
+		flexDirection: "column",
+		alignItems: "center",
+		justifyContent: "center"
+	}
+}));
+const WorkflowContainer = (props) => {
+	const { playId, taskId, autoCollapseNav = true } = props;
+	const buildEnv = useBuildEnvironment();
+	const classes = useStyles({
+		...props,
+		appRibbonSpace: buildEnv ? APP_RIBBON_SPACE : 0
+	});
+	const location = useLocation();
+	const updateSearchParams = useUpdateSearchParams();
+	const user = useUser();
+	const setLocationState = useSetLocationState();
+	const { t } = useTranslation();
+	const [menuItemsList, setMenuItemsList] = useState([]);
+	const [selectedNode, setSelectedNode] = useState(null);
+	const [sidebarExpanded, setSidebarExpanded] = useState(true);
+	const [reloadFromPage, setReloadFromPage] = useState(false);
+	const [workflow, setWorkflow] = useState(false);
+	const state = location.state;
+	let searchParamStr = location.search;
+	let searchParams = new URLSearchParams(searchParamStr);
+	const urlPlayId = location.pathname.replace("/workflowtask/", "");
+	const udpPlayId = playId || urlPlayId || (state ? state.playId : searchParams.has("playId") === true ? searchParams.get("playId") : "");
+	const udpTaskId = taskId || (state ? state.taskId : searchParams.has("taskId") === true ? searchParams.get("taskId") : "");
+	const [{ data: workflowPlay, loading: workflowPlayLoading }, reloadWorkflow] = useAxiosGet(ConfigService.builderV1ApiUrl, `workflow/play/${udpPlayId}`, {}, !!!udpPlayId, false);
+	const [{ data: users }] = useAxiosGet(ConfigService.securityV1ApiUrl, `users?tenantId=${user?.currentTenantId || ""}`, {}, !!!user?.currentTenantId);
+	const [{ data: groups }] = useAxiosGet(ConfigService.tenantV1ApiUrl, `groups?tenantId=${user?.currentTenantId || ""}&productId=${ConfigService.config.UNITY_PRODUCT_ID}`, {}, !!!user?.currentTenantId);
+	const { setSubHeaderActionHasChildren, setNavigationExpanded } = useShellStore();
+	const handleReloadWorkflow = useCallback(async () => {
+		setReloadFromPage(true);
+		await reloadWorkflow();
+		setReloadFromPage(false);
+	}, [reloadWorkflow]);
+	const handleSelectedNode = useCallback(async (node, menuIndex) => {
+		if (node.isSelectable) {
+			setSelectedNode(node);
+			await handleReloadWorkflow();
+			if (node?.properties?.playSceneId) updateSearchParams({ taskId: node.properties.playSceneId });
+		}
+	}, [updateSearchParams, handleReloadWorkflow]);
+	const handleDropNode = useCallback((sourceNode, targetNode, sourceNodeMenuIndex, targetNodeMenuIndex) => {}, []);
+	const handleSidebarExpandClick = useCallback(() => {
+		setSidebarExpanded((expanded) => !expanded);
+	}, []);
+	useEffect(() => {
+		if (workflowPlay) setWorkflow(workflowPlay);
+	}, [workflowPlay]);
+	useEffect(() => {
+		setLocationState({ label: t("Workflow") });
+	}, [setLocationState, t]);
+	useEffect(() => {
+		if (workflow) setSelectedNode((prevNode) => {
+			if (!!prevNode) {
+				const foundNode = workflow.workflowPlayNode?.children?.find((child) => child.id === prevNode.id);
+				if (!!foundNode) {
+					const updatedNode = { ...prevNode };
+					updatedNode.properties.state = foundNode.state;
+					return updatedNode;
+				} else return prevNode;
+			}
+		});
+	}, [workflow]);
+	useEffect(() => {
+		if (workflow) {
+			const list = [];
+			const updatedMenu = transformWorkflowPlayTree(workflow.workflowPlayNode);
+			if (updatedMenu) list.push(updatedMenu);
+			setMenuItemsList(list);
+		}
+	}, [workflow]);
+	useEffect(() => {
+		if (!selectedNode) {
+			const menu = menuItemsList[0];
+			if (menu) {
+				if (!!udpTaskId) setSelectedNode(menu.children.find((child) => child?.properties?.playSceneId === udpTaskId) || menu.children[0] || null);
+				else {
+					const firstSelectableMenuItem = menu?.children?.find((item) => item.isSelectable);
+					setSelectedNode(firstSelectableMenuItem || null);
+				}
+				if (autoCollapseNav) setNavigationExpanded(false);
+			}
+		}
+	}, [
+		udpTaskId,
+		menuItemsList,
+		selectedNode,
+		setNavigationExpanded,
+		autoCollapseNav
+	]);
+	useEffect(() => {
+		setSubHeaderActionHasChildren(false);
+	}, [setSubHeaderActionHasChildren]);
+	return /* @__PURE__ */ React.createElement(DndProvider, { backend: HTML5Backend }, /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classes.sidebar }, /* @__PURE__ */ React.createElement(UtilitySideBar, {
+		title: "Workflow",
+		isUsingChildren: true,
+		resizable: true,
+		removePadding: true,
+		removeTopLayoutUnit: true,
+		onUtilitySidebarToggleExpandClick: handleSidebarExpandClick,
+		collapsedWidth: 64
+	}, /* @__PURE__ */ React.createElement("div", {
+		className: classes.menuContent,
+		key: playId
+	}, menuItemsList?.length > 0 && (!workflowPlayLoading || reloadFromPage) && menuItemsList.map((menuItems, index) => /* @__PURE__ */ React.createElement("div", {
+		key: menuItems.id,
+		className: classes.nodeContainer
+	}, /* @__PURE__ */ React.createElement(WorkflowTreeMenu, {
+		menuItems,
+		onSelectNode: handleSelectedNode,
+		onDropNode: handleDropNode,
+		menuIndex: index,
+		selectedNodeId: selectedNode?.id,
+		selectedNodeParentId: selectedNode?.parentId,
+		sidebarExpanded,
+		treeViewMode: TreeViewModeEnums.Classic
+	}))), workflowPlayLoading && !reloadFromPage && /* @__PURE__ */ React.createElement("div", { className: classes.loader }, /* @__PURE__ */ React.createElement(NodeLoader, { loading: workflowPlayLoading }))))), /* @__PURE__ */ React.createElement("div", { className: classes.content }, /* @__PURE__ */ React.createElement(WorkflowContent, {
+		selectedNode,
+		workflow,
+		reloadWorkflow: handleReloadWorkflow,
+		users,
+		groups
+	}))));
+};
+var WorkflowContainer_default = WorkflowContainer;
+
+//#endregion
+export { WorkflowContainer_default as n, WorkflowContainer as t };
+//# sourceMappingURL=WorkflowContainer-DFidyJU3.js.map

package/dist/WorkflowContainer-DFidyJU3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkflowContainer-DFidyJU3.js","names":[],"sources":["../src/workflow/WorkflowContainer.jsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport { useAxiosGet } from '../utilities/useAxiosGet';\nimport { UtilitySideBar } from '../UI/utilityDisplay/UtilitySideBar';\nimport { makeStyles } from '@material-ui/core';\nimport { WorkflowTreeMenu } from './menus/WorkflowTreeMenu';\nimport { TreeViewModeEnums } from '../enums/unitySystemEnums';\nimport { DndProvider } from 'react-dnd';\nimport { HTML5Backend } from 'react-dnd-html5-backend';\nimport { useShellStore } from '../stores/shellStore';\nimport { NodeLoader } from '../UI/feedback/NodeLoader';\nimport {\n  APP_RIBBON_SPACE,\n  useBuildEnvironment\n} from '../shell/ui/useBuildEnvironment';\nimport { WorkflowContent } from './WorkflowContent';\nimport {\n  transformWorkflowPlayTree,\n  updateWorkflowPlayNodeState\n} from '../utilities/workflow/workflowUtilities';\nimport { useUpdateSearchParams } from '../hooks/useUpdateSearchParams';\nimport { useUser } from '../utilities/auth/useUser';\nimport { apiMutate } from '../utilities/useAxiosMutate';\nimport { useSetLocationState } from '../hooks/useSetLocationState';\nimport { useTranslation } from 'react-i18next';\nimport { ConfigService } from '../configService';\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    flex: 1,\n    minHeight: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    display: 'grid',\n    gridTemplateAreas: ['sidebar content'].map((line) => `\"${line}\"`).join(' '),\n    gridTemplateColumns: 'auto 1fr',\n    gridTemplateRows: 'auto 1fr'\n  },\n  sidebar: {\n    gridArea: 'sidebar',\n    marginRight: theme.spacing(1)\n  },\n  content: {\n    gridArea: 'content',\n    display: 'flex',\n    flexDirection: 'column',\n    position: 'relative',\n    zIndex: 1,\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,\n    overflowY: 'auto'\n  },\n  menuContent: {\n    marginTop: theme.spacing(1),\n    height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 116}px)`,\n    overflowX: 'hidden'\n  },\n  loader: {\n    marginRight: theme.spacing(1),\n    marginLeft: theme.spacing(1)\n  },\n  loadingContent: {\n    flex: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center'\n  }\n}));\n\nexport const WorkflowContainer = (props) => {\n  const { playId, taskId, autoCollapseNav = true } = props;\n  const buildEnv = useBuildEnvironment();\n  const classes = useStyles({\n    ...props,\n    appRibbonSpace: buildEnv ? APP_RIBBON_SPACE : 0\n  });\n  const location = useLocation();\n  const updateSearchParams = useUpdateSearchParams();\n  const user = useUser();\n  const setLocationState = useSetLocationState();\n  const { t } = useTranslation();\n\n  const [menuItemsList, setMenuItemsList] = useState([]); // holds a list of trees\n  const [selectedNode, setSelectedNode] = useState(null);\n  const [sidebarExpanded, setSidebarExpanded] = useState(true);\n  const [reloadFromPage, setReloadFromPage] = useState(false);\n  const [workflow, setWorkflow] = useState(false);\n\n  const state = location.state;\n  let searchParamStr = location.search;\n  let searchParams = new URLSearchParams(searchParamStr);\n  const urlPlayId = location.pathname.replace('/workflowtask/', '');\n  const udpPlayId =\n    playId ||\n    urlPlayId ||\n    (state\n      ? state.playId\n      : searchParams.has('playId') === true\n      ? searchParams.get('playId')\n      : '');\n\n  const udpTaskId =\n    taskId ||\n    (state\n      ? state.taskId\n      : searchParams.has('taskId') === true\n      ? searchParams.get('taskId')\n      : '');\n\n  const [{ data: workflowPlay, loading: workflowPlayLoading }, reloadWorkflow] =\n    useAxiosGet(\n      ConfigService.builderV1ApiUrl,\n      `workflow/play/${udpPlayId}`,\n      {},\n      !!!udpPlayId,\n      false\n    );\n\n  const [{ data: users }] = useAxiosGet(\n    ConfigService.securityV1ApiUrl,\n    `users?tenantId=${user?.currentTenantId || ''}`,\n    {},\n    !!!user?.currentTenantId\n  );\n\n  const [{ data: groups }] = useAxiosGet(\n    ConfigService.tenantV1ApiUrl,\n    `groups?tenantId=${user?.currentTenantId || ''}&productId=${\n      ConfigService.config.UNITY_PRODUCT_ID\n    }`,\n    {},\n    !!!user?.currentTenantId\n  );\n\n  // const getNodeState = useCallback(\n  //   async (nodeId) =>\n  //     apiMutate(\n  //       ConfigService.builderV1ApiUrl,\n  //       `workflow/play/${udpPlayId}/node/${nodeId}/state`,\n  //       {\n  //         method: 'get'\n  //       }\n  //     ),\n  //   [udpPlayId]\n  // );\n\n  const { setSubHeaderActionHasChildren, setNavigationExpanded } =\n    useShellStore();\n\n  const handleReloadWorkflow = useCallback(async () => {\n    setReloadFromPage(true);\n    await reloadWorkflow();\n    setReloadFromPage(false);\n  }, [reloadWorkflow]);\n\n  const handleSelectedNode = useCallback(\n    async (node, menuIndex) => {\n      if (node.isSelectable) {\n        setSelectedNode(node);\n        await handleReloadWorkflow();\n        if (node?.properties?.playSceneId) {\n          updateSearchParams({ taskId: node.properties.playSceneId });\n        }\n      }\n    },\n    [updateSearchParams, handleReloadWorkflow]\n  );\n\n  const handleDropNode = useCallback(\n    (sourceNode, targetNode, sourceNodeMenuIndex, targetNodeMenuIndex) => {\n      // TODO: Implement if we need to for next Phase\n    },\n    []\n  );\n\n  const handleSidebarExpandClick = useCallback(() => {\n    setSidebarExpanded((expanded) => !expanded);\n  }, []);\n\n  useEffect(() => {\n    if (workflowPlay) {\n      setWorkflow(workflowPlay);\n    }\n  }, [workflowPlay]);\n\n  // Setting location state label so that if this page was saved to favorites\n  // we can determine the bread crumb\n  useEffect(() => {\n    setLocationState({ label: t('Workflow') });\n  }, [setLocationState, t]);\n\n  // this is used for updating the state node for page use\n  useEffect(() => {\n    if (workflow) {\n      setSelectedNode((prevNode) => {\n        if (!!prevNode) {\n          const foundNode = workflow.workflowPlayNode?.children?.find(\n            (child) => child.id === prevNode.id\n          );\n          if (!!foundNode) {\n            const updatedNode = { ...prevNode };\n            // TODO: using this to update state for now but may need to update\n            // other properties of the selected node when we pull workflow tree\n            updatedNode.properties.state = foundNode.state;\n            return updatedNode;\n          } else {\n            return prevNode;\n          }\n        }\n      });\n    }\n  }, [workflow]);\n\n  useEffect(() => {\n    if (workflow) {\n      const list = [];\n      const updatedMenu = transformWorkflowPlayTree(workflow.workflowPlayNode);\n      if (updatedMenu) {\n        list.push(updatedMenu);\n      }\n      setMenuItemsList(list);\n    }\n  }, [workflow]);\n\n  useEffect(() => {\n    if (!selectedNode) {\n      const menu = menuItemsList[0];\n      // Use Task Id to find the first matching node in tree\n      if (menu) {\n        if (!!udpTaskId) {\n          const matchingTaskNode = menu.children.find(\n            (child) => child?.properties?.playSceneId === udpTaskId\n          );\n          setSelectedNode(matchingTaskNode || menu.children[0] || null);\n        } else {\n          const firstSelectableMenuItem = menu?.children?.find(\n            (item) => item.isSelectable\n          );\n          setSelectedNode(firstSelectableMenuItem || null);\n        }\n        if (autoCollapseNav) {\n          setNavigationExpanded(false);\n        }\n      }\n    }\n  }, [\n    udpTaskId,\n    menuItemsList,\n    selectedNode,\n    setNavigationExpanded,\n    autoCollapseNav\n  ]);\n\n  useEffect(() => {\n    setSubHeaderActionHasChildren(false);\n  }, [setSubHeaderActionHasChildren]);\n\n  // useEffect(() => {\n  //   if (selectedNode) {\n  //     const getState = async () => {\n  //       const response = await getNodeState(selectedNode.id);\n  //       if (response.status === 200) {\n  //         setMenuItemsList((prevMenuList) => {\n  //           let updatedList = [];\n  //           prevMenuList.forEach((menu) => {\n  //             const updatedMenu = updateWorkflowPlayNodeState(\n  //               menu,\n  //               selectedNode.id,\n  //               response.data\n  //             );\n  //             updatedList.push(updatedMenu);\n  //           });\n  //           return updatedList;\n  //         });\n  //       }\n  //     };\n  //     getState();\n  //   }\n  // }, [selectedNode, getNodeState]);\n\n  return (\n    <DndProvider backend={HTML5Backend}>\n      <div className={classes.root}>\n        <div className={classes.sidebar}>\n          <UtilitySideBar\n            title={'Workflow'}\n            isUsingChildren={true}\n            resizable={true}\n            removePadding={true}\n            removeTopLayoutUnit={true}\n            onUtilitySidebarToggleExpandClick={handleSidebarExpandClick}\n            collapsedWidth={64}\n          >\n            <div className={classes.menuContent} key={playId}>\n              {menuItemsList?.length > 0 &&\n                (!workflowPlayLoading || reloadFromPage) &&\n                menuItemsList.map((menuItems, index) => (\n                  <div key={menuItems.id} className={classes.nodeContainer}>\n                    <WorkflowTreeMenu\n                      menuItems={menuItems}\n                      onSelectNode={handleSelectedNode}\n                      onDropNode={handleDropNode}\n                      menuIndex={index}\n                      selectedNodeId={selectedNode?.id}\n                      selectedNodeParentId={selectedNode?.parentId}\n                      sidebarExpanded={sidebarExpanded}\n                      treeViewMode={TreeViewModeEnums.Classic}\n                    />\n                  </div>\n                ))}\n              {workflowPlayLoading && !reloadFromPage && (\n                <div className={classes.loader}>\n                  <NodeLoader loading={workflowPlayLoading} />\n                </div>\n              )}\n            </div>\n          </UtilitySideBar>\n        </div>\n        <div className={classes.content}>\n          <WorkflowContent\n            selectedNode={selectedNode}\n            workflow={workflow}\n            reloadWorkflow={handleReloadWorkflow}\n            users={users}\n            groups={groups}\n          />\n        </div>\n      </div>\n    </DndProvider>\n  );\n};\n\nexport default WorkflowContainer;\n"],"mappings":"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"}

package/dist/WorkflowContainer-DTfH1Jm2.js

@@ -0,0 +1,3 @@
+import { n as WorkflowContainer_default, t as WorkflowContainer } from "./WorkflowContainer-DFidyJU3.js";
+
+export { WorkflowContainer, WorkflowContainer_default as default };