diff --git a/apps/dashboard/package.json b/apps/dashboard/package.json index 1b302ece074..34539df719a 100644 --- a/apps/dashboard/package.json +++ b/apps/dashboard/package.json @@ -24,6 +24,7 @@ "@codemirror/lang-liquid": "^6.2.1", "@hookform/resolvers": "^3.9.0", "@lezer/highlight": "^1.2.1", + "@novu/framework": "workspace:*", "@novu/react": "workspace:*", "@novu/shared": "workspace:*", "@radix-ui/react-accordion": "^1.2.1", diff --git a/apps/dashboard/src/api/bridge.ts b/apps/dashboard/src/api/bridge.ts index 08da81f4b99..36d89371b73 100644 --- a/apps/dashboard/src/api/bridge.ts +++ b/apps/dashboard/src/api/bridge.ts @@ -1,8 +1,7 @@ -import { BridgeStatus } from '@/utils/types'; +import type { HealthCheck } from '@novu/framework/internal'; import { get, post } from './api.client'; - export const getBridgeHealthCheck = async () => { - const { data } = await get<{ data: BridgeStatus }>('/bridge/status'); + const { data } = await get<{ data: HealthCheck }>('/bridge/status'); return data; }; diff --git a/apps/dashboard/src/hooks/use-bridge-health-check.ts b/apps/dashboard/src/hooks/use-bridge-health-check.ts index 1b10d81ab66..bc169f3344d 100644 --- a/apps/dashboard/src/hooks/use-bridge-health-check.ts +++ b/apps/dashboard/src/hooks/use-bridge-health-check.ts @@ -1,9 +1,10 @@ import { useQuery } from '@tanstack/react-query'; import { getBridgeHealthCheck } from '@/api/bridge'; -import { BridgeStatus, ConnectionStatus } from '@/utils/types'; +import { ConnectionStatus } from '@/utils/types'; import { QueryKeys } from '@/utils/query-keys'; import { useMemo } from 'react'; import { useEnvironment } from '@/context/environment/hooks'; +import type { HealthCheck } from '@novu/framework/internal'; const BRIDGE_STATUS_REFRESH_INTERVAL_IN_MS = 10 * 1000; @@ -11,7 +12,7 @@ export const useBridgeHealthCheck = () => { const { currentEnvironment } = useEnvironment(); const bridgeURL = currentEnvironment?.bridge?.url || ''; - const { data, isLoading, error } = useQuery({ + const { data, isLoading, error } = useQuery({ queryKey: [QueryKeys.bridgeHealthCheck, currentEnvironment?._id, bridgeURL], queryFn: getBridgeHealthCheck, enabled: !!bridgeURL, diff --git a/apps/dashboard/src/utils/types.ts b/apps/dashboard/src/utils/types.ts index 8f2e8149c32..b00cd7b777f 100644 --- a/apps/dashboard/src/utils/types.ts +++ b/apps/dashboard/src/utils/types.ts @@ -1,13 +1,5 @@ import type { StepResponseDto } from '@novu/shared'; -export type BridgeStatus = { - status: 'ok'; - bridgeUrl?: string; - discovered: { - workflows: number; - }; -}; - export enum ConnectionStatus { CONNECTED = 'connected', DISCONNECTED = 'disconnected', diff --git a/apps/web/src/bridgeApi/bridgeApi.client.ts b/apps/web/src/bridgeApi/bridgeApi.client.ts index 02ecb7aecb4..3ed2969f861 100644 --- a/apps/web/src/bridgeApi/bridgeApi.client.ts +++ b/apps/web/src/bridgeApi/bridgeApi.client.ts @@ -1,13 +1,6 @@ import axios from 'axios'; -import type { DiscoverWorkflowOutput } from '@novu/framework/internal'; - -export type StepPreviewParams = { - workflowId: string; - stepId: string; - payload: Record; - controls: Record; -}; +import type { DiscoverWorkflowOutput, Event, ExecuteOutput, HealthCheck } from '@novu/framework/internal'; export type TriggerParams = { workflowId: string; @@ -19,14 +12,6 @@ export type TriggerParams = { }; }; -export type BridgeStatus = { - status: 'ok'; - bridgeUrl?: string; - discovered: { - workflows: number; - }; -}; - export function buildBridgeHTTPClient(baseURL: string) { const httpClient = axios.create({ baseURL, @@ -69,7 +54,7 @@ export function buildBridgeHTTPClient(baseURL: string) { }); }, - async healthCheck(): Promise { + async healthCheck(): Promise { return get('', { action: 'health-check', }); @@ -78,7 +63,7 @@ export function buildBridgeHTTPClient(baseURL: string) { /** * TODO: Use framework shared types */ - async getWorkflow(workflowId: string): Promise { + async getWorkflow(workflowId: string): Promise { const { workflows } = await this.discover(); return workflows.find((workflow) => workflow.workflowId === workflowId); @@ -87,10 +72,19 @@ export function buildBridgeHTTPClient(baseURL: string) { /** * TODO: Use framework shared types */ - async getStepPreview({ workflowId, stepId, controls, payload }: StepPreviewParams): Promise { + async getStepPreview({ + workflowId, + stepId, + controls, + payload, + state, + subscriber, + }: Omit): Promise { return post(`${baseURL}?action=preview&workflowId=${workflowId}&stepId=${stepId}`, { controls: controls || {}, payload: payload || {}, + state: state || [], + subscriber: subscriber || {}, }); }, diff --git a/apps/web/src/components/layout/components/BridgeStatus.tsx b/apps/web/src/components/layout/components/BridgeStatus.tsx index dcfb85b2346..1023e1468a3 100644 --- a/apps/web/src/components/layout/components/BridgeStatus.tsx +++ b/apps/web/src/components/layout/components/BridgeStatus.tsx @@ -2,6 +2,7 @@ import { Badge, Text } from '@mantine/core'; import { useQuery } from '@tanstack/react-query'; import { Popover } from '@novu/design-system'; import { useDisclosure } from '@mantine/hooks'; +import type { HealthCheck } from '@novu/framework/internal'; import { api } from '../../../api/api.client'; import { useEnvironment } from '../../../hooks'; import { IS_SELF_HOSTED } from '../../../config'; @@ -11,11 +12,7 @@ export function BridgeStatus() { const { environment } = useEnvironment(); const isBridgeEnabled = !!environment?.echo?.url && !IS_SELF_HOSTED; - const { data, error, isInitialLoading } = useQuery<{ - status: 'ok' | 'down'; - version: string; - discovered: { workflows: number }; - }>( + const { data, error, isInitialLoading } = useQuery( ['/v1/bridge/status'], () => { return api.get('/v1/bridge/status'); diff --git a/apps/web/src/pages/studio-onboarding/components/SetupTimeline.tsx b/apps/web/src/pages/studio-onboarding/components/SetupTimeline.tsx index 9105883ac82..82fd5f3b479 100644 --- a/apps/web/src/pages/studio-onboarding/components/SetupTimeline.tsx +++ b/apps/web/src/pages/studio-onboarding/components/SetupTimeline.tsx @@ -4,7 +4,7 @@ import { IconCheck } from '@novu/novui/icons'; import { Text } from '@novu/novui'; import { css } from '@novu/novui/css'; import { useColorScheme } from '@novu/design-system'; -import { BridgeStatus } from '../../../bridgeApi/bridgeApi.client'; +import type { HealthCheck } from '@novu/framework/internal'; import { CodeSnippet } from '../../get-started/legacy-onboarding/components/CodeSnippet'; import { useStudioState } from '../../../studio/StudioStateProvider'; import { timelineRecipe } from './SetupTimeline.recipe'; @@ -20,7 +20,7 @@ const Icon = () => ( /> ); -export const SetupTimeline = ({ testResponse }: { testResponse: { isLoading: boolean; data: BridgeStatus } }) => { +export const SetupTimeline = ({ testResponse }: { testResponse: { isLoading: boolean; data: HealthCheck } }) => { const { devSecretKey } = useStudioState(); const [active, setActive] = useState(0); const { colorScheme } = useColorScheme(); diff --git a/apps/web/src/pages/studio-onboarding/index.tsx b/apps/web/src/pages/studio-onboarding/index.tsx index 829e3b15d80..89b3f9b3285 100644 --- a/apps/web/src/pages/studio-onboarding/index.tsx +++ b/apps/web/src/pages/studio-onboarding/index.tsx @@ -3,13 +3,13 @@ import { useEffect } from 'react'; import { Title, Text } from '@novu/novui'; import { VStack } from '@novu/novui/jsx'; import { useNavigate } from 'react-router-dom'; +import { HealthCheck } from '@novu/framework/internal'; import { Footer } from './components/Footer'; import { Header } from './components/Header'; import { SetupTimeline } from './components/SetupTimeline'; import { Wrapper } from './components/Wrapper'; import { ROUTES } from '../../constants/routes'; import { useHealthCheck } from '../../studio/hooks/useBridgeAPI'; -import { BridgeStatus } from '../../bridgeApi/bridgeApi.client'; import { useStudioState } from '../../studio/StudioStateProvider'; import { capitalizeFirstLetter } from '../../utils/string'; import { setNovuOnboardingStepCookie } from '../../utils'; @@ -62,7 +62,7 @@ export const StudioOnboarding = () => { Send your first email notification, by connecting to your Novu Bridge Endpoint. This setup will create a sample Next.js project with a pre-configured @novu/framework. - +