UNPKG

@orchestrator-ui/orchestrator-ui-components

Version:

Library of UI Components used to display the workflow orchestrator frontend

1,689 lines (1,644 loc) 825 kB
// src/components/WfoBadges/WfoBadge/WfoBadge.tsx import { EuiBadge, EuiText } from "@elastic/eui"; import { jsx } from "@emotion/react/jsx-runtime"; var WfoBadge = ({ textColor, children, size, ...restProps }) => /* @__PURE__ */ jsx(EuiBadge, { title: "", ...restProps, children: /* @__PURE__ */ jsx(EuiText, { color: textColor, size: size ?? "xs", children: /* @__PURE__ */ jsx("b", { children }) }) }); // src/hooks/useCheckEngineStatus.ts import { useTranslations as useTranslations2 } from "next-intl"; // src/configuration/constants.ts var MAXIMUM_ITEMS_FOR_BULK_FETCHING = 1e3; var NUMBER_OF_ITEMS_REPRESENTING_ALL_ITEMS = 1e6; var PROCESSES_ENDPOINT = "processes"; var PROCESS_STATUS_COUNTS_ENDPOINT = `${PROCESSES_ENDPOINT}/status-counts`; var PROCESSES_RESUME_ALL_ENDPOINT = `resume-all`; var PROCESS_RESUME_ENDPOINT = `resume`; var PROCESS_ABORT_ENDPOINT = `abort`; var SETTINGS_ENDPOINT = "/settings"; var SETTINGS_ENGINE_STATUS_ENDPOINT = `${SETTINGS_ENDPOINT}/status`; var SETTINGS_WORKER_STATUS_ENDPOINT = `${SETTINGS_ENDPOINT}/worker-status`; var SETTINGS_CACHE_NAMES_ENDPOINT = `${SETTINGS_ENDPOINT}/cache-names`; var SETTINGS_CACHE_ENDPOINT = `${SETTINGS_ENDPOINT}/cache`; var SETTINGS_SEARCH_INDEX_RESET_ENDPOINT = `${SETTINGS_ENDPOINT}/search-index/reset`; var SETTINGS_OVERVIEW = `${SETTINGS_ENDPOINT}/overview`; var IPAM_ENDPOINT = "surf/ipam"; var IPAM_PREFIX_FILTERS_ENDPOINT = `${IPAM_ENDPOINT}/prefix_filters`; var IPAM_IP_BLOCKS_ENDPOINT = `${IPAM_ENDPOINT}/ip_blocks`; var IPAM_FREE_SUBNETS_ENDPOINT = `${IPAM_ENDPOINT}/free_subnets`; var SUBSCRIPTION_ACTIONS_ENDPOINT = "subscriptions/workflows"; var SUBSCRIPTION_DROPDOWN_OPTIONS_ENDPOINT = "surf/subscriptions/dropdown-options"; var CUSTOMER_DESCRIPTION_ENDPOINT = "/subscription_customer_descriptions"; var METADATA_PRODUCT_ENDPOINT = "products"; var METADATA_PRODUCT_BLOCK_ENDPOINT = "product_blocks"; var METADATA_RESOURCE_TYPE_ENDPOINT = "resource_types"; var METADATA_WORKFLOWS_ENDPOINT = "workflows"; // src/configuration/policy-resources.ts var PolicyResource = /* @__PURE__ */ ((PolicyResource2) => { PolicyResource2["NAVIGATION_METADATA"] = "/orchestrator/metadata/"; PolicyResource2["NAVIGATION_SETTINGS"] = "/orchestrator/settings/"; PolicyResource2["NAVIGATION_SUBSCRIPTIONS"] = "/orchestrator/subscriptions/"; PolicyResource2["NAVIGATION_TASKS"] = "/orchestrator/tasks/"; PolicyResource2["NAVIGATION_WORKFLOWS"] = "/orchestrator/processes/"; PolicyResource2["PROCESS_ABORT"] = "/orchestrator/processes/abort/"; PolicyResource2["PROCESS_DELETE"] = "/orchestrator/processes/delete/"; PolicyResource2["PROCESS_DETAILS"] = "/orchestrator/processes/details/"; PolicyResource2["PROCESS_RELATED_SUBSCRIPTIONS"] = "/orchestrator/subscriptions/view/from-process"; PolicyResource2["PROCESS_RETRY"] = "/orchestrator/processes/retry/"; PolicyResource2["PROCESS_USER_INPUT"] = "/orchestrator/processes/user-input/"; PolicyResource2["SUBSCRIPTION_CREATE"] = "/orchestrator/processes/create/process/menu"; PolicyResource2["SUBSCRIPTION_MODIFY"] = "/orchestrator/subscriptions/modify/"; PolicyResource2["SUBSCRIPTION_TERMINATE"] = "/orchestrator/subscriptions/terminate/"; PolicyResource2["SUBSCRIPTION_RECONCILE"] = "/orchestrator/subscriptions/reconcile/"; PolicyResource2["SUBSCRIPTION_VALIDATE"] = "/orchestrator/subscriptions/validate/"; PolicyResource2["TASKS_CREATE"] = "/orchestrator/processes/create/task"; PolicyResource2["TASKS_RETRY_ALL"] = "/orchestrator/processes/all-tasks/retry"; PolicyResource2["SETTINGS_FLUSH_CACHE"] = "/orchestrator/settings/flush-cache"; PolicyResource2["SETTINGS_START_STOP_ENGINE"] = "/orchestrator/settings/start-stop-engine"; PolicyResource2["SET_IN_SYNC"] = "/orchestrator/subscriptions/set-in-sync"; return PolicyResource2; })(PolicyResource || {}); // src/configuration/version.ts var ORCHESTRATOR_UI_LIBRARY_VERSION = "7.0.0"; // src/types/types.ts var EngineStatus = /* @__PURE__ */ ((EngineStatus2) => { EngineStatus2["RUNNING"] = "RUNNING"; EngineStatus2["PAUSING"] = "PAUSING"; EngineStatus2["PAUSED"] = "PAUSED"; EngineStatus2["UNKNOWN"] = "UNKNOWN"; return EngineStatus2; })(EngineStatus || {}); var WorkerTypes = /* @__PURE__ */ ((WorkerTypes3) => { WorkerTypes3["CELERY"] = "CELERY"; WorkerTypes3["THREAD"] = "THREAD"; return WorkerTypes3; })(WorkerTypes || {}); var ProductLifecycleStatus = /* @__PURE__ */ ((ProductLifecycleStatus2) => { ProductLifecycleStatus2["ACTIVE"] = "active"; ProductLifecycleStatus2["PRE_PRODUCTION"] = "pre production"; ProductLifecycleStatus2["PHASE_OUT"] = "phase out"; ProductLifecycleStatus2["END_OF_LIFE"] = "end of life"; return ProductLifecycleStatus2; })(ProductLifecycleStatus || {}); var BadgeType = /* @__PURE__ */ ((BadgeType2) => { BadgeType2["WORKFLOW"] = "workflow"; BadgeType2["FIXED_INPUT"] = "fixed_input"; BadgeType2["RESOURCE_TYPE"] = "resource_type"; BadgeType2["PRODUCT_BLOCK"] = "product_block"; BadgeType2["PRODUCT_BLOCK_TAG"] = "product_block_tag"; BadgeType2["PRODUCT_TAG"] = "product_tag"; BadgeType2["PRODUCT"] = "product"; BadgeType2["TASK"] = "task"; return BadgeType2; })(BadgeType || {}); var WorkflowTarget = /* @__PURE__ */ ((WorkflowTarget2) => { WorkflowTarget2["CREATE"] = "create"; WorkflowTarget2["MODIFY"] = "modify"; WorkflowTarget2["TERMINATE"] = "terminate"; WorkflowTarget2["SYSTEM"] = "system"; WorkflowTarget2["VALIDATE"] = "validate"; WorkflowTarget2["RECONCILE"] = "reconcile"; return WorkflowTarget2; })(WorkflowTarget || {}); var StepStatus = /* @__PURE__ */ ((StepStatus2) => { StepStatus2["FORM"] = "form"; StepStatus2["SUCCESS"] = "success"; StepStatus2["FAILED"] = "failed"; StepStatus2["PENDING"] = "pending"; StepStatus2["RUNNING"] = "running"; StepStatus2["SKIPPED"] = "skipped"; StepStatus2["SUSPEND"] = "suspend"; StepStatus2["WAITING"] = "waiting"; StepStatus2["AWAITING_CALLBACK"] = "awaiting_callback"; StepStatus2["ABORT"] = "abort"; StepStatus2["COMPLETE"] = "complete"; return StepStatus2; })(StepStatus || {}); var ProcessStatus = /* @__PURE__ */ ((ProcessStatus3) => { ProcessStatus3["CREATE"] = "create"; ProcessStatus3["CREATED"] = "created"; ProcessStatus3["RUNNING"] = "running"; ProcessStatus3["SUSPENDED"] = "suspended"; ProcessStatus3["WAITING"] = "waiting"; ProcessStatus3["AWAITING_CALLBACK"] = "awaiting_callback"; ProcessStatus3["ABORTED"] = "aborted"; ProcessStatus3["FAILED"] = "failed"; ProcessStatus3["RESUMED"] = "resumed"; ProcessStatus3["API_UNAVAILABLE"] = "api_unavailable"; ProcessStatus3["INCONSISTENT_DATA"] = "inconsistent_data"; ProcessStatus3["COMPLETED"] = "completed"; return ProcessStatus3; })(ProcessStatus || {}); var ProcessDoneStatuses = [ "completed" /* COMPLETED */, "aborted" /* ABORTED */ ]; var SortOrder = /* @__PURE__ */ ((SortOrder2) => { SortOrder2["ASC"] = "ASC"; SortOrder2["DESC"] = "DESC"; return SortOrder2; })(SortOrder || {}); var Locale = /* @__PURE__ */ ((Locale3) => { Locale3["enGB"] = "en-GB"; Locale3["nlNL"] = "nl-NL"; return Locale3; })(Locale || {}); var SubscriptionStatus = /* @__PURE__ */ ((SubscriptionStatus2) => { SubscriptionStatus2["INITIAL"] = "initial"; SubscriptionStatus2["ACTIVE"] = "active"; SubscriptionStatus2["MIGRATING"] = "migrating"; SubscriptionStatus2["DISABLED"] = "disabled"; SubscriptionStatus2["TERMINATED"] = "terminated"; SubscriptionStatus2["PROVISIONING"] = "provisioning"; return SubscriptionStatus2; })(SubscriptionStatus || {}); var ToastTypes = /* @__PURE__ */ ((ToastTypes2) => { ToastTypes2["ERROR"] = "ERROR"; ToastTypes2["SUCCESS"] = "SUCCESS"; return ToastTypes2; })(ToastTypes || {}); var Environment = /* @__PURE__ */ ((Environment2) => { Environment2["DEVELOPMENT"] = "Development"; Environment2["PRODUCTION"] = "Production"; return Environment2; })(Environment || {}); var ColorModes = /* @__PURE__ */ ((ColorModes2) => { ColorModes2["LIGHT"] = "LIGHT"; ColorModes2["DARK"] = "DARK"; return ColorModes2; })(ColorModes || {}); var CacheTagType = /* @__PURE__ */ ((CacheTagType2) => { CacheTagType2["workerStatus"] = "workerStatus"; CacheTagType2["engineStatus"] = "engineStatus"; CacheTagType2["processes"] = "processes"; CacheTagType2["processStatusCounts"] = "processStatusCounts"; CacheTagType2["subscriptions"] = "subscriptions"; return CacheTagType2; })(CacheTagType || {}); var CACHETAG_TYPE_LIST = "LIST"; // src/types/search.ts var VisualizationType = /* @__PURE__ */ ((VisualizationType2) => { VisualizationType2["PIE"] = "pie"; VisualizationType2["LINE"] = "line"; VisualizationType2["TABLE"] = "table"; return VisualizationType2; })(VisualizationType || {}); // src/rtk/api.ts import { getSession as getSession2, signOut as signOut2 } from "next-auth/react"; import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react"; // src/rtk/wfoGraphqlRequestBaseQuery.ts import { ClientError, GraphQLClient } from "graphql-request"; import { signOut } from "next-auth/react"; // src/rtk/utils.ts import { isPlainObject } from "lodash"; import { getSession } from "next-auth/react"; function stripUndefined(obj) { if (!isPlainObject(obj)) { return obj; } const copy = { ...obj }; for (const [k, v] of Object.entries(copy)) { if (v === void 0) { delete copy[k]; } } return copy; } function isSerializedError(error) { if (error) { return error && typeof error === "object" && ("name" in error || "message" in error || "stack" in error || "code" in error); } return false; } var UNKNOWN_ERROR_MESSAGE = "Unknown error"; var getSerializedErrorMessage = (error) => { if (error.message) { return error.message; } else if (error.name) { return error.name; } else if (error.code) { return error.code; } else if (error.stack) { return error.stack; } return UNKNOWN_ERROR_MESSAGE; }; var mapRtkErrorToWfoError = (error) => { if (Array.isArray(error)) { return error.map((err) => { return { extensions: err.extensions, message: err.message }; }); } else if (error && "status" in error && error.status !== void 0) { return [ { extensions: {}, message: String(error.status) } ]; } else if (isSerializedError(error)) { return [ { extensions: {}, message: getSerializedErrorMessage(error) } ]; } return error; }; var isRecord = (value) => { return typeof value === "object" && value !== null && !Array.isArray(value); }; var isFetchBaseQueryError = (error) => { if (typeof error === "object" && error !== null && "status" in error) { const status = error.status; return typeof status === "number" || status === "FETCH_ERROR" || status === "PARSING_ERROR" || status === "TIMEOUT_ERROR" || status === "CUSTOM_ERROR"; } return false; }; var getWebSocket = async (url) => { const session = await getSession(); if (session?.accessToken) { return new WebSocket(url, [ "base64.bearer.token", session?.accessToken ]); } else { return new WebSocket(url); } }; // src/rtk/wfoGraphqlRequestBaseQuery.ts var wfoGraphqlRequestBaseQuery = (options, authActive) => { const client = "client" in options ? options.client : new GraphQLClient(options.url, { errorPolicy: "all" }); const requestHeaders = options.requestHeaders ?? {}; return async ({ document: document2, variables }, { getState, endpoint, forced, type, extra }) => { try { const prepareHeaders2 = options.prepareHeaders ?? ((x) => x); const strippedHeaders = stripUndefined(requestHeaders); const headers = new Headers(strippedHeaders); const preparedHeaders = await prepareHeaders2(headers, { getState, endpoint, forced, type, extra }); const { data, errors } = await client.rawRequest( document2, variables, preparedHeaders ); return { data, meta: { errors } }; } catch (error) { if (error instanceof ClientError) { const { request, response } = error; const errors = response.errors; if (authActive && errors?.some( (error2) => error2.extensions?.error_type === "not_authenticated" )) { signOut(); } const customErrors = options.customErrors ?? ((error2) => error2.response.errors); const customizedErrors = customErrors(error); return { error: customizedErrors, meta: { request, response } }; } throw error; } }; }; // src/rtk/api.ts var BaseQueryTypes = /* @__PURE__ */ ((BaseQueryTypes2) => { BaseQueryTypes2["fetch"] = "fetch"; BaseQueryTypes2["graphql"] = "graphql"; BaseQueryTypes2["custom"] = "custom"; return BaseQueryTypes2; })(BaseQueryTypes || {}); var HttpStatus = /* @__PURE__ */ ((HttpStatus2) => { HttpStatus2[HttpStatus2["FormNotComplete"] = 510] = "FormNotComplete"; HttpStatus2[HttpStatus2["BadGateway"] = 502] = "BadGateway"; HttpStatus2[HttpStatus2["BadRequest"] = 400] = "BadRequest"; HttpStatus2[HttpStatus2["ServiceUnavailable"] = 503] = "ServiceUnavailable"; HttpStatus2[HttpStatus2["Unauthorized"] = 401] = "Unauthorized"; HttpStatus2[HttpStatus2["Forbidden"] = 403] = "Forbidden"; HttpStatus2[HttpStatus2["Ok"] = 200] = "Ok"; HttpStatus2[HttpStatus2["Created"] = 201] = "Created"; HttpStatus2[HttpStatus2["NoContent"] = 204] = "NoContent"; HttpStatus2[HttpStatus2["MultipleChoices"] = 300] = "MultipleChoices"; return HttpStatus2; })(HttpStatus || {}); var prepareHeaders = async (headers) => { const session = await getSession2(); if (session?.accessToken) { headers.set("Authorization", `Bearer ${session.accessToken}`); } return headers; }; var handlePromiseErrorWithCallback = (promise, status, callbackAction) => { return promise.catch((err) => { if (err.data && err.status === status) { callbackAction(err.data); } else { throw err; } }); }; var handleGraphqlMetaErrors = (meta, responseHasInvalidData) => { if (responseHasInvalidData && meta.errors && meta.errors.length > 0) { throw meta.errors[0]; } }; var isUnauthorized = (status) => status === 401 /* Unauthorized */ || status === 403 /* Forbidden */; var isNotSuccessful = (status) => status < 200 /* Ok */ || status >= 300 /* MultipleChoices */; var catchErrorResponse = async (response, authActive) => { const status = response.status; if (isNotSuccessful(status)) { console.error(status, response.body); } if (isUnauthorized(status) && authActive) { signOut2(); } else if (status === 204 /* NoContent */) { return {}; } else { return response.json(); } }; var orchestratorApi = createApi({ reducerPath: "orchestratorApi", baseQuery: (args, api, extraOptions) => { const { baseQueryType, apiName, paramsSerializer } = extraOptions || {}; const state = api.getState(); const { orchestratorApiBaseUrl, graphqlEndpointCore, authActive } = state.orchestratorConfig; const customApi = state.customApis?.find( (query) => query.apiName === apiName ); switch (baseQueryType) { case "fetch" /* fetch */: { const baseUrl = customApi ? customApi.apiBaseUrl : orchestratorApiBaseUrl; const fetchFn = fetchBaseQuery({ baseUrl, prepareHeaders, paramsSerializer, responseHandler: (response) => catchErrorResponse(response, authActive) }); return fetchFn(args, api, {}); } default: { const graphqlFn = wfoGraphqlRequestBaseQuery( { url: customApi ? customApi.apiBaseUrl : graphqlEndpointCore, prepareHeaders, customErrors: (args2) => { return args2.response?.errors; } }, authActive ); return graphqlFn(args, api, {}); } } }, endpoints: () => ({}), tagTypes: [ "engineStatus" /* engineStatus */, "workerStatus" /* workerStatus */, "processes" /* processes */, "processStatusCounts" /* processStatusCounts */, "subscriptions" /* subscriptions */ ], keepUnusedDataFor: process.env.NEXT_PUBLIC_DISABLE_CACHE === "true" ? 0 : 60 * 60 * 1e3 }); // src/rtk/endpoints/customers.ts var customersQuery = `query Customers { customers(first: 1000000, after: 0) { page { fullname customerId shortcode } } }`; var customersWithSubscriptionCountQuery = `query Customers { customers(first: ${NUMBER_OF_ITEMS_REPRESENTING_ALL_ITEMS}, after: 0) { page { customerId fullname shortcode subscriptions(filterBy: {field: "status", value: "${"active" /* ACTIVE */}"}) { pageInfo { totalItems } } } } }`; var customerQuery = `query Customer( $customerId: String! $first: Int! ) { customers( first: $first filterBy: [{field: "customerId", value: $customerId}] ) { page { customerId fullname shortcode } } }`; var customersApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ getCustomersWithSubscriptionCount: build.query({ query: () => ({ document: customersWithSubscriptionCountQuery }), transformResponse: (response) => response.customers.page.filter( (customer) => customer.subscriptions.pageInfo.totalItems > 0 ) }), getCustomers: build.query({ query: () => ({ document: customersQuery }), transformResponse: (response) => response?.customers?.page || [] }), getCustomer: build.query({ query: ({ customerIds }) => ({ document: customerQuery, variables: { customerId: customerIds.join("|"), first: customerIds.length } }), transformResponse: (response) => response?.customers?.page || [] }) }) }); var { useGetCustomersQuery, useGetCustomerQuery, useGetCustomersWithSubscriptionCountQuery } = customersApi; // src/rtk/endpoints/inSync.ts var inSyncApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ setSubscriptionInSync: build.mutation({ query: (subscriptionId) => ({ url: `subscriptions/${subscriptionId}/set_in_sync`, method: "PUT" }), extraOptions: { baseQueryType: "fetch" /* fetch */ }, invalidatesTags: (_result, _error, subscriptionId) => [ { type: "subscriptions" /* subscriptions */, id: subscriptionId } ] }) }) }); var { useSetSubscriptionInSyncMutation } = inSyncApi; // src/rtk/store.ts import { configureStore } from "@reduxjs/toolkit"; // src/rtk/slices/customApis.ts import { createSlice } from "@reduxjs/toolkit"; var getCustomApiSlice = (customApis) => { return createSlice({ name: "customApis", initialState: customApis, reducers: {} }); }; // src/rtk/slices/orchestratorComponentOverride.ts import { createSlice as createSlice2 } from "@reduxjs/toolkit"; var getOrchestratorComponentOverrideSlice = (config) => createSlice2({ name: "orchestratorComponentOverride", initialState: config, reducers: {} }); // src/rtk/slices/toastMessages.ts import { createSlice as createSlice3 } from "@reduxjs/toolkit"; var initialState = { messages: [] }; var toastMessagesSlice = createSlice3({ name: "toastMessages", initialState, reducers: { addToastMessage: (state, action) => { return { ...state, messages: [...state.messages, action.payload] }; }, removeToastMessage: (state, action) => { return { ...state, messages: state.messages.filter( (message) => message.id !== action.payload ) }; } } }); var { addToastMessage, removeToastMessage } = toastMessagesSlice.actions; var toastMessagesReducer = toastMessagesSlice.reducer; // src/rtk/slices/orchestratorConfig.ts import { createSlice as createSlice4 } from "@reduxjs/toolkit"; var getOrchestratorConfigSlice = (config) => { return createSlice4({ name: "orchestrator", initialState: config, reducers: {} }); }; var selectOrchestratorConfig = (state) => state.orchestratorConfig; // src/rtk/slices/pydanticForm.ts import { createSlice as createSlice5 } from "@reduxjs/toolkit"; var getPydanticFormSlice = (pydanticForm) => createSlice5({ name: "pydanticForm", initialState: pydanticForm, reducers: {} }); // src/rtk/store.ts var getOrchestratorStore = ({ orchestratorConfig, orchestratorComponentOverride = {}, pydanticForm = {}, customApis }) => { const configSlice = getOrchestratorConfigSlice(orchestratorConfig); const orchestratorComponentOverrideSlice = getOrchestratorComponentOverrideSlice(orchestratorComponentOverride); const customApisSlice = getCustomApiSlice(customApis); const componentMatcherSlice = getPydanticFormSlice(pydanticForm); const orchestratorStore = configureStore({ reducer: { [orchestratorApi.reducerPath]: orchestratorApi.reducer, toastMessages: toastMessagesReducer, orchestratorConfig: configSlice.reducer, orchestratorComponentOverride: orchestratorComponentOverrideSlice.reducer, customApis: customApisSlice?.reducer, pydanticForm: componentMatcherSlice?.reducer }, middleware: (getDefaultMiddleware) => getDefaultMiddleware({ serializableCheck: false }).concat(orchestratorApi.middleware) }); return orchestratorStore; }; // src/rtk/storeProvider.tsx import { useState as useState3 } from "react"; import { Provider } from "react-redux"; // src/contexts/ConfirmationDialogProvider.tsx import { createContext, useState } from "react"; // src/components/confirmationDialog/WfoConfirmationDialog.tsx import { useTranslations } from "next-intl"; import { EuiButton, EuiModal, EuiModalBody, EuiModalFooter, EuiModalHeader, EuiModalHeaderTitle, EuiOverlayMask } from "@elastic/eui"; // src/components/confirmationDialog/ConfirmationDialogStyling.ts import { css } from "@emotion/react"; var confirmationDialogStyling = css` .dialog-content { h2 { margin: 10px 0; line-height: 22px; font-size: 16px; font-weight: normal; } } `; // src/components/confirmationDialog/WfoConfirmationDialog.tsx import { jsx as jsx2, jsxs } from "@emotion/react/jsx-runtime"; function WfoConfirmationDialog({ isOpen = false, onCancel, onConfirm, question = "", subQuestion = "", cancelButtonText = "", confirmButtonText = "", isError = false }) { const t = useTranslations("confirmationDialog"); return /* @__PURE__ */ jsx2("div", { className: "confirmation-dialog-overlay", children: isOpen && /* @__PURE__ */ jsx2(EuiOverlayMask, { children: /* @__PURE__ */ jsxs( EuiModal, { css: confirmationDialogStyling, className: "confirm-modal", onClose: onCancel, initialFocus: "[name=popfirst]", children: [ /* @__PURE__ */ jsx2(EuiModalHeader, { children: /* @__PURE__ */ jsx2(EuiModalHeaderTitle, { children: t("title") }) }), /* @__PURE__ */ jsx2(EuiModalBody, { children: /* @__PURE__ */ jsx2("div", { children: /* @__PURE__ */ jsxs( "section", { className: `dialog-content ${isError ? " error" : ""}`, children: [ /* @__PURE__ */ jsx2("h2", { children: question }), subQuestion && /* @__PURE__ */ jsx2("p", { children: subQuestion }) ] } ) }) }), /* @__PURE__ */ jsxs(EuiModalFooter, { children: [ /* @__PURE__ */ jsx2( EuiButton, { onClick: onCancel, id: "dialog-cancel", fill: false, children: cancelButtonText || t("cancel") } ), /* @__PURE__ */ jsx2( EuiButton, { onClick: onConfirm, fill: true, id: "dialog-confirm", children: confirmButtonText || t("confirm") } ) ] }) ] } ) }) }); } // src/contexts/ConfirmationDialogProvider.tsx import { jsx as jsx3, jsxs as jsxs2 } from "@emotion/react/jsx-runtime"; var ConfirmationDialogContext = createContext({ showConfirmDialog: () => { }, closeConfirmDialog: () => { } }); var ConfirmationDialogProvider = ConfirmationDialogContext.Provider; function ConfirmationDialogContextWrapper({ children }) { const [confirmationDialogOpen, setConfirmationDialogOpen] = useState(false); const [ { onConfirm, question, isError, subQuestion, cancelButtonText, confirmButtonText }, setState ] = useState({ onConfirm: () => { }, question: "" }); const closeConfirmDialog = () => setConfirmationDialogOpen(false); const showConfirmDialog = ({ onConfirm: onConfirm2, question: question2, isError: isError2 = false, subQuestion: subQuestion2 = "", cancelButtonText: cancelButtonText2 = "", confirmButtonText: confirmButtonText2 = "" }) => { setConfirmationDialogOpen(true); setState({ onConfirm: onConfirm2, question: question2, isError: isError2, subQuestion: subQuestion2, cancelButtonText: cancelButtonText2, confirmButtonText: confirmButtonText2 }); }; return /* @__PURE__ */ jsxs2( ConfirmationDialogProvider, { value: { showConfirmDialog, closeConfirmDialog }, children: [ /* @__PURE__ */ jsx3( WfoConfirmationDialog, { isOpen: confirmationDialogOpen, onCancel: () => setConfirmationDialogOpen(false), onConfirm: (e) => { onConfirm(e); setConfirmationDialogOpen(false); }, question, isError, subQuestion, cancelButtonText, confirmButtonText } ), children ] } ); } // src/contexts/OrchestratorConfigContext.tsx import { createContext as createContext2 } from "react"; // src/hooks/useOrchestratorConfig.ts var useOrchestratorConfig = (initialOrchestratorConfig) => { return { orchestratorConfig: initialOrchestratorConfig }; }; // src/contexts/OrchestratorConfigContext.tsx import { jsx as jsx4 } from "@emotion/react/jsx-runtime"; var emptyOrchestratorConfig = { environmentName: "", graphqlEndpointCore: "", orchestratorApiBaseUrl: "", orchestratorWebsocketUrl: "", authActive: true, useWebSockets: false, useThemeToggle: false, showWorkflowInformationLink: false, workflowInformationLinkUrl: "", enableSupportMenuItem: false, supportMenuItemUrl: "", enableAoStackStatus: false, aoStackStatusUrl: "" }; var OrchestratorConfigContext = createContext2( emptyOrchestratorConfig ); var OrchestratorConfigProvider = ({ initialOrchestratorConfig, children }) => { const { orchestratorConfig } = useOrchestratorConfig( initialOrchestratorConfig ?? emptyOrchestratorConfig ); return /* @__PURE__ */ jsx4(OrchestratorConfigContext.Provider, { value: orchestratorConfig, children }); }; // src/contexts/PolicyContext.tsx import { createContext as createContext3 } from "react"; import { jsx as jsx5 } from "@emotion/react/jsx-runtime"; var PolicyContext = createContext3({ isAllowedHandler: () => true }); var PolicyContextProvider = ({ isAllowedHandler, children }) => /* @__PURE__ */ jsx5(PolicyContext.Provider, { value: { isAllowedHandler }, children }); // src/contexts/TreeContext.tsx import * as React2 from "react"; import { jsx as jsx6 } from "@emotion/react/jsx-runtime"; var TreeContext = React2.createContext(null); var TreeProvider = ({ children }) => { const [depths, setDepths] = React2.useState([]); const [selectedIds, setSelectedIds] = React2.useState([0]); const [expandedIds, setExpandedIds] = React2.useState([0]); const toggleSelectedId = (id) => { if (selectedIds.includes(id)) { setSelectedIds( (prevSelectedIds) => prevSelectedIds.filter((selectedId) => selectedId !== id) ); } else { setSelectedIds((prevSelectedIds) => [...prevSelectedIds, id]); } }; const selectAll = () => { setSelectedIds(Array.from(Array(depths.length).keys())); }; const selectIds = (ids) => { setSelectedIds( (prevSelectedIds) => Array.from(/* @__PURE__ */ new Set([...prevSelectedIds, ...ids])) ); }; const deselectIds = (ids) => { setSelectedIds( (prevSelectedIds) => prevSelectedIds.filter((id) => !ids.includes(id)) ); }; const expandAll = () => { setExpandedIds(Array.from(Array(depths.length).keys())); }; const collapseAll = () => { setExpandedIds([0]); }; const expandNode = (itemIndex) => { const initialDepth = depths[itemIndex]; const expandedNodeIds = depths.map((depth, i) => { if (i === itemIndex || i > itemIndex && depth > initialDepth) { return i; } return -1; }).filter((nodeId) => nodeId !== -1); setExpandedIds((prevExpandedIds) => [ ...prevExpandedIds, ...expandedNodeIds ]); }; const collapseNode = (itemIndex) => { const initialDepth = depths[itemIndex]; const collapsedNodeIds = []; for (let i = itemIndex; i < depths.length; i++) { if (i === itemIndex) collapsedNodeIds.push(i); else if (depths[i] > initialDepth) collapsedNodeIds.push(i); else if (depths[i] <= initialDepth) break; } setExpandedIds( (prevExpandedIds) => prevExpandedIds.filter((id) => !collapsedNodeIds.includes(id)) ); }; const resetSelection = () => { setSelectedIds([]); }; return /* @__PURE__ */ jsx6( TreeContext.Provider, { value: { setDepths, selectedIds, expandedIds, toggleSelectedId, expandNode, collapseNode, expandAll, collapseAll, resetSelection, selectAll, selectIds, deselectIds }, children } ); }; // src/contexts/WfoErrorMonitoringProvider.tsx import { createContext as createContext5 } from "react"; import { jsx as jsx7 } from "@emotion/react/jsx-runtime"; var emptyWfoErrorMonitoring = { reportError: () => { }, reportMessage: () => { } }; var WfoErrorMonitoringContext = createContext5( emptyWfoErrorMonitoring ); var WfoErrorMonitoringProvider = ({ errorMonitoringHandler, children }) => { return /* @__PURE__ */ jsx7( WfoErrorMonitoringContext.Provider, { value: errorMonitoringHandler ?? emptyWfoErrorMonitoring, children } ); }; // src/rtk/storeProvider.tsx import { jsx as jsx8 } from "@emotion/react/jsx-runtime"; var StoreProvider = ({ initialOrchestratorConfig, orchestratorComponentOverride, componentMatcherExtender, customApis = [], children }) => { const store = getOrchestratorStore({ orchestratorConfig: initialOrchestratorConfig ?? emptyOrchestratorConfig, orchestratorComponentOverride, pydanticForm: { componentMatcherExtender: componentMatcherExtender || void 0 }, customApis }); const [orchestratorStore] = useState3(store); return /* @__PURE__ */ jsx8(Provider, { store: orchestratorStore, children }); }; // src/rtk/endpoints/metadata/productBlocks.ts var productBlocksQuery = ` query MetadataProductBlocks( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $query: String ) { productBlocks( first: $first after: $after sortBy: $sortBy query: $query ) { page { productBlockId name tag description status createdAt endDate resourceTypes { description resourceType resourceTypeId } dependsOn { productBlockId name tag description status createdAt endDate } } pageInfo { endCursor hasNextPage hasPreviousPage startCursor totalItems sortFields filterFields } } } `; var productBlocksApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getProductBlocks: builder.query({ query: (variables) => ({ document: productBlocksQuery, variables }), transformResponse: (response) => { const productBlocks = response.productBlocks.page || []; const pageInfo = response.productBlocks.pageInfo || {}; return { productBlocks, pageInfo }; } }) }) }); var { useGetProductBlocksQuery, useLazyGetProductBlocksQuery } = productBlocksApi; var productBlocksRestApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ updateProductBlock: build.mutation({ query: (productBlock) => ({ url: `${METADATA_PRODUCT_BLOCK_ENDPOINT}/${productBlock.id}`, method: "PATCH", headers: { "Content-Type": "application/json" }, body: { description: productBlock.description } }), extraOptions: { baseQueryType: "fetch" /* fetch */ } }) }) }); var { useUpdateProductBlockMutation } = productBlocksRestApi; // src/rtk/endpoints/metadata/resourceTypes.ts var resourceTypesQuery = ` query MetadataResourceTypes( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $query: String ) { resourceTypes( first: $first after: $after sortBy: $sortBy query: $query ) { page { resourceTypeId resourceType description productBlocks { description name productBlockId status createdAt endDate } } pageInfo { endCursor hasNextPage hasPreviousPage startCursor totalItems sortFields filterFields } } } `; var resourceTypesApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getResourceTypes: builder.query({ query: (variables) => ({ document: resourceTypesQuery, variables }), transformResponse: (response) => { const resourceTypes = response.resourceTypes.page || []; const pageInfo = response.resourceTypes.pageInfo || {}; return { resourceTypes, pageInfo }; } }) }) }); var { useGetResourceTypesQuery, useLazyGetResourceTypesQuery } = resourceTypesApi; var resourceTypesRestApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ updateResourceType: build.mutation({ query: (resourceType) => ({ url: `${METADATA_RESOURCE_TYPE_ENDPOINT}/${resourceType.id}`, method: "PATCH", headers: { "Content-Type": "application/json" }, body: { description: resourceType.description } }), extraOptions: { baseQueryType: "fetch" /* fetch */ } }) }) }); var { useUpdateResourceTypeMutation } = resourceTypesRestApi; // src/rtk/endpoints/metadata/workflows.ts var workflowsDescription = ` query MetadataWorkflowsDescription( $workflowName: String! ) { workflows( filterBy: [{ field: "name", value: $workflowName }] ) { page { name description } } } `; var workflowsQuery = ` query MetadataWorkflows( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $query: String ) { workflows( first: $first after: $after sortBy: $sortBy query: $query filterBy: { field: "target", value: "CREATE|MODIFY|TERMINATE|RECONCILE" } ) { page { workflowId name description target isTask products { tag } createdAt } pageInfo { endCursor hasNextPage hasPreviousPage startCursor totalItems sortFields filterFields } } } `; var workflowsApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getWorkflows: builder.query({ query: (variables) => ({ document: workflowsQuery, variables }), transformResponse: (response) => { if (!response) { return void 0; } const workflows = response?.workflows.page || []; const pageInfo = response?.workflows.pageInfo || {}; return { workflows, pageInfo }; } }), getDescriptionForWorkflowName: builder.query({ query: (variables) => ({ document: workflowsDescription, variables }), transformResponse: (response, _4, variables) => { const workflows = response.workflows.page || []; const workflow = workflows.find( ({ name: name2 }) => name2 === variables.workflowName ); if (!workflow) { throw new Error( `No workflow found with name ${variables.workflowName}` ); } const { name, description } = workflow; return { name, description }; } }) }) }); var { useGetWorkflowsQuery, useLazyGetWorkflowsQuery, useGetDescriptionForWorkflowNameQuery } = workflowsApi; var workflowsRestApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ updateWorkflow: build.mutation({ query: (workflow) => ({ url: `${METADATA_WORKFLOWS_ENDPOINT}/${workflow.id}`, method: "PATCH", headers: { "Content-Type": "application/json" }, body: { description: workflow.description } }), extraOptions: { baseQueryType: "fetch" /* fetch */ } }) }) }); var { useUpdateWorkflowMutation } = workflowsRestApi; // src/rtk/endpoints/metadata/tasks.ts var tasksQuery = ` query MetadataWorkflows( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $query: String ) { workflows( first: $first after: $after sortBy: $sortBy query: $query filterBy: { field: "isTask", value: "true" } ) { page { workflowId name description target isTask products { tag } createdAt } pageInfo { endCursor hasNextPage hasPreviousPage startCursor totalItems sortFields filterFields } } } `; var tasksApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getTasks: builder.query({ query: (variables) => ({ document: tasksQuery, variables }), transformResponse: (response) => { if (!response) { return void 0; } const tasks = response.workflows.page || []; const pageInfo = response.workflows.pageInfo || {}; return { tasks, pageInfo }; } }) }) }); var { useGetTasksQuery, useLazyGetTasksQuery } = tasksApi; // src/utils/cacheTag.ts var getCacheTag = (type, id) => { const cacheTag = { type }; if (id) { cacheTag.id = id; } return [cacheTag]; }; // src/rtk/endpoints/processDetail.ts var processDetailQuery = `query ProcessDetail($processId: String!) { processes(filterBy: { value: $processId, field: "processId" }) { page { processId lastStatus createdBy startedAt lastModifiedAt lastStep workflowName isTask form traceback userPermissions { retryAllowed resumeAllowed } steps { name status stepId stateDelta started completed } customer { fullname } subscriptions { page { product { name } description subscriptionId } } } } }`; var processDetailApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getProcessDetail: builder.query({ query: (variables) => ({ document: processDetailQuery, variables }), transformResponse: (response) => { const processes = response.processes.page || []; return { processes }; }, providesTags: (result, error, queryArguments) => { if (!error && result) { return getCacheTag( "processes" /* processes */, queryArguments.processId ); } return []; } }), getRawProcessDetail: builder.query({ query: ({ processId }) => ({ url: `${PROCESSES_ENDPOINT}/${processId}`, method: "GET", headers: { "Content-Type": "application/json" } }), extraOptions: { baseQueryType: "fetch" /* fetch */ } }), retryAllProcesses: builder.mutation({ query: () => ({ url: `${PROCESSES_ENDPOINT}/${PROCESSES_RESUME_ALL_ENDPOINT}`, method: "PUT" }), extraOptions: { baseQueryType: "fetch" /* fetch */ }, invalidatesTags: getCacheTag("processes" /* processes */) }), retryProcess: builder.mutation({ query: ({ processId }) => ({ url: `${PROCESSES_ENDPOINT}/${processId}/${PROCESS_RESUME_ENDPOINT}`, method: "PUT", headers: { "Content-Type": "application/json" }, body: "{}" }), extraOptions: { baseQueryType: "fetch" /* fetch */ }, invalidatesTags: getCacheTag("processes" /* processes */) }), deleteProcess: builder.mutation({ query: ({ processId }) => ({ url: `${PROCESSES_ENDPOINT}/${processId}`, method: "DELETE" }), extraOptions: { baseQueryType: "fetch" /* fetch */ }, invalidatesTags: getCacheTag("processes" /* processes */) }), abortProcess: builder.mutation({ query: ({ processId }) => ({ url: `${PROCESSES_ENDPOINT}/${processId}/${PROCESS_ABORT_ENDPOINT}`, method: "PUT" }), extraOptions: { baseQueryType: "fetch" /* fetch */ }, invalidatesTags: getCacheTag("processes" /* processes */) }) }) }); var { useGetProcessDetailQuery, useGetRawProcessDetailQuery, useRetryAllProcessesMutation, useRetryProcessMutation, useDeleteProcessMutation, useAbortProcessMutation } = processDetailApi; // src/rtk/endpoints/processList.ts var processListQuery = ` query ProcessList( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $filterBy: [GraphqlFilter!] $query: String ) { processes( first: $first after: $after sortBy: $sortBy filterBy: $filterBy query: $query ) { page { workflowName lastStep lastStatus workflowTarget product { name tag } customer { fullname shortcode } createdBy assignee processId startedAt lastModifiedAt isTask subscriptions { page { subscriptionId description } } } pageInfo { hasNextPage hasPreviousPage startCursor totalItems endCursor sortFields filterFields } } } `; var processApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ getProcessList: build.query({ query: (variables) => ({ document: processListQuery, variables }), transformResponse: (response) => { const processes = response.processes.page || []; return { processes, pageInfo: response.processes?.pageInfo || {} }; }, providesTags: getCacheTag( "processes" /* processes */, CACHETAG_TYPE_LIST ) }) }) }); var { useGetProcessListQuery, useLazyGetProcessListQuery } = processApi; // src/rtk/endpoints/processListSummary.ts var processListSummaryQuery = ` query ProcessListSummary( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $filterBy: [GraphqlFilter!] $query: String ) { processes( first: $first after: $after sortBy: $sortBy filterBy: $filterBy query: $query ) { page { processId workflowName startedAt } pageInfo { totalItems startCursor endCursor } } } `; var processApi2 = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ getProcessListSummary: build.query({ query: (variables) => ({ document: processListSummaryQuery, variables }), transformResponse: (response) => { const processes = response.processes.page || []; return { processes, pageInfo: response.processes?.pageInfo || {} }; }, providesTags: getCacheTag( "processes" /* processes */, CACHETAG_TYPE_LIST ) }) }) }); var { useGetProcessListSummaryQuery } = processApi2; // src/rtk/endpoints/processSteps.ts var processStepsQuery = ` query ProcessSteps($processName: String!) { workflows(filterBy: { field: "name", value: $processName }) { page { steps { name assignee } } } } `; var processStepApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ getTimeLineItems: build.query({ query: (processName) => ({ document: processStepsQuery, variables: { processName } }), transformResponse: (response) => { const timeLineItems = response.workflows.page[0].steps.map( ({ name }) => { return { processStepStatus: "pending" /* PENDING */, stepDetail: name }; } ); return timeLineItems; } }) }) }); var { useGetTimeLineItemsQuery } = processStepApi; // src/rtk/endpoints/metadata/products.ts var products = ` query MetadataProducts( $first: Int! $after: Int! $sortBy: [GraphqlSort!] $query: String ) { products(first: $first, after: $after, sortBy: $sortBy, query: $query) { page { productId name description tag createdAt productType status productBlocks { name } fixedInputs { name value } endDate } pageInfo { endCursor hasNextPage hasPreviousPage startCursor totalItems sortFields filterFields } } } `; var productsApi = orchestratorApi.injectEndpoints({ endpoints: (builder) => ({ getProducts: builder.query({ query: (variables) => ({ document: products, variables }), transformResponse: (response) => { const products2 = response.products.page || []; const pageInfo = response.products.pageInfo || {}; return { products: products2, pageInfo }; } }) }) }); var { useGetProductsQuery, useLazyGetProductsQuery } = productsApi; var productRestApi = orchestratorApi.injectEndpoints({ endpoints: (build) => ({ updateProduct: build.mutation({ query: (product) => ({ url: `${METADATA_PRODUCT_ENDPOINT}/${product.id}`, method: "PATCH", headers: { "Content-Type": "application/json" }, body: { description: product.description } }), extraOptions: { baseQueryType: "fetch" /* fetch */ } }) }) }); var { useUpdateProductMutation } = productRestApi; // src/rtk/endpoints/productsSummary.ts var productsSummary = ` query MetadataProducts( $first: Int!