diff --git a/apps/dashboard/src/components/workflow-editor/nodes.tsx b/apps/dashboard/src/components/workflow-editor/nodes.tsx index c24a4e7e7f7..9738a29f98b 100644 --- a/apps/dashboard/src/components/workflow-editor/nodes.tsx +++ b/apps/dashboard/src/components/workflow-editor/nodes.tsx @@ -12,7 +12,7 @@ import { STEP_TYPE_TO_COLOR } from '@/utils/color'; import { useWorkflow } from '@/components/workflow-editor/workflow-provider'; import { WorkflowOriginEnum } from '@novu/shared'; import { createStep } from '@/components/workflow-editor/steps/step-provider'; -import { getEncodedId, STEP_DIVIDER } from '@/utils/step'; +import { getWorkflowIdFromSlug, STEP_DIVIDER } from '@/utils/step'; export type NodeData = { name?: string; @@ -54,8 +54,8 @@ const StepNode = (props: StepNodeProps) => { }>(); const isSelected = - getEncodedId({ slug: stepSlug ?? '', divider: STEP_DIVIDER }) === - getEncodedId({ slug: data.stepSlug ?? '', divider: STEP_DIVIDER }); + getWorkflowIdFromSlug({ slug: stepSlug ?? '', divider: STEP_DIVIDER }) === + getWorkflowIdFromSlug({ slug: data.stepSlug ?? '', divider: STEP_DIVIDER }); return ; }; diff --git a/apps/dashboard/src/components/workflow-editor/steps/step-provider.tsx b/apps/dashboard/src/components/workflow-editor/steps/step-provider.tsx index 3f77bbf5560..b7d917ce3bc 100644 --- a/apps/dashboard/src/components/workflow-editor/steps/step-provider.tsx +++ b/apps/dashboard/src/components/workflow-editor/steps/step-provider.tsx @@ -6,7 +6,7 @@ import { StepDataDto, StepIssuesDto, StepTypeEnum } from '@novu/shared'; import { createContextHook } from '@/utils/context'; import { Step } from '@/utils/types'; import { STEP_DIVIDER } from '@/utils/step'; -import { getEncodedId } from '@/utils/step'; +import { getWorkflowIdFromSlug } from '@/utils/step'; import { useWorkflow } from '@/components/workflow-editor/workflow-provider'; export type StepEditorContextType = { @@ -40,8 +40,8 @@ export const StepProvider = ({ children }: { children: ReactNode }) => { const issues = useMemo(() => { const newIssues = workflow?.steps.find( (s) => - getEncodedId({ slug: s.slug, divider: STEP_DIVIDER }) === - getEncodedId({ slug: stepSlug, divider: STEP_DIVIDER }) + getWorkflowIdFromSlug({ slug: s.slug, divider: STEP_DIVIDER }) === + getWorkflowIdFromSlug({ slug: stepSlug, divider: STEP_DIVIDER }) )?.issues; return { ...newIssues }; diff --git a/apps/dashboard/src/components/workflow-editor/test-workflow/test-workflow-tabs.tsx b/apps/dashboard/src/components/workflow-editor/test-workflow/test-workflow-tabs.tsx index 2ededb1b148..5afa269efcd 100644 --- a/apps/dashboard/src/components/workflow-editor/test-workflow/test-workflow-tabs.tsx +++ b/apps/dashboard/src/components/workflow-editor/test-workflow/test-workflow-tabs.tsx @@ -1,25 +1,26 @@ import { useMemo } from 'react'; -import { Link, useParams } from 'react-router-dom'; -import { RiPlayCircleLine } from 'react-icons/ri'; import { useForm } from 'react-hook-form'; +import { RiPlayCircleLine } from 'react-icons/ri'; +import { Link, useParams } from 'react-router-dom'; // eslint-disable-next-line // @ts-ignore +import { ToastClose, ToastIcon } from '@/components/primitives/sonner'; +import { useFetchWorkflow } from '@/hooks/use-fetch-workflow'; +import { useTriggerWorkflow } from '@/hooks/use-trigger-workflow'; +import { buildRoute, LEGACY_ROUTES, ROUTES } from '@/utils/routes'; import { zodResolver } from '@hookform/resolvers/zod'; import type { WorkflowTestDataResponseDto } from '@novu/shared'; -import { Tabs, TabsContent, TabsList, TabsTrigger } from '../../primitives/tabs'; -import { buildRoute, LEGACY_ROUTES, ROUTES } from '@/utils/routes'; -import { useFetchWorkflow } from '@/hooks/use-fetch-workflow'; -import { Form } from '../../primitives/form/form'; +import { toast } from 'sonner'; import { Button } from '../../primitives/button'; -import { useTriggerWorkflow } from '@/hooks/use-trigger-workflow'; +import { Form } from '../../primitives/form/form'; import { showToast } from '../../primitives/sonner-helpers'; +import { Tabs, TabsContent, TabsList, TabsTrigger } from '../../primitives/tabs'; import { buildDynamicFormSchema, makeObjectFromSchema, TestWorkflowFormType } from '../schema'; import { TestWorkflowForm } from './test-workflow-form'; -import { toast } from 'sonner'; -import { ToastClose, ToastIcon } from '@/components/primitives/sonner'; export const TestWorkflowTabs = ({ testData }: { testData: WorkflowTestDataResponseDto }) => { const { environmentSlug = '', workflowSlug = '' } = useParams<{ environmentSlug: string; workflowSlug: string }>(); + const { workflow } = useFetchWorkflow({ workflowSlug, }); @@ -37,8 +38,9 @@ export const TestWorkflowTabs = ({ testData }: { testData: WorkflowTestDataRespo const form = useForm({ mode: 'onSubmit', resolver: zodResolver(buildDynamicFormSchema({ to: testData?.to ?? {} })), - defaultValues: { to, payload: JSON.stringify(payload, null, 2) }, + values: { to, payload: JSON.stringify(payload, null, 2) }, }); + const { handleSubmit } = form; const { triggerWorkflow, isPending } = useTriggerWorkflow(); @@ -105,7 +107,7 @@ export const TestWorkflowTabs = ({ testData }: { testData: WorkflowTestDataRespo
- + { const client = useQueryClient(); @@ -14,8 +14,8 @@ export const useFetchStep = ({ workflowSlug, stepSlug }: { workflowSlug: string; () => [ QueryKeys.fetchWorkflow, currentEnvironment?._id, - getEncodedId({ slug: workflowSlug, divider: WORKFLOW_DIVIDER }), - getEncodedId({ slug: stepSlug, divider: STEP_DIVIDER }), + getWorkflowIdFromSlug({ slug: workflowSlug, divider: WORKFLOW_DIVIDER }), + getWorkflowIdFromSlug({ slug: stepSlug, divider: STEP_DIVIDER }), ], [currentEnvironment?._id, workflowSlug, stepSlug] ); diff --git a/apps/dashboard/src/hooks/use-fetch-workflow-test-data.ts b/apps/dashboard/src/hooks/use-fetch-workflow-test-data.ts index 0bbb0c5461a..07fabbcece6 100644 --- a/apps/dashboard/src/hooks/use-fetch-workflow-test-data.ts +++ b/apps/dashboard/src/hooks/use-fetch-workflow-test-data.ts @@ -3,15 +3,23 @@ import type { WorkflowTestDataResponseDto } from '@novu/shared'; import { QueryKeys } from '@/utils/query-keys'; import { getWorkflowTestData } from '@/api/workflows'; import { useEnvironment } from '@/context/environment/hooks'; +import { getWorkflowIdFromSlug, WORKFLOW_DIVIDER } from '@/utils/step'; -export const useFetchWorkflowTestData = ({ workflowSlug }: { workflowSlug?: string }) => { +export const useFetchWorkflowTestData = ({ workflowSlug }: { workflowSlug: string }) => { const { currentEnvironment } = useEnvironment(); const { data, isPending, error } = useQuery({ - queryKey: [QueryKeys.fetchWorkflowTestData, currentEnvironment?._id, workflowSlug], + queryKey: [ + QueryKeys.fetchWorkflowTestData, + currentEnvironment?._id, + getWorkflowIdFromSlug({ slug: workflowSlug, divider: WORKFLOW_DIVIDER }), + ], queryFn: () => getWorkflowTestData({ environment: currentEnvironment!, workflowSlug }), enabled: !!currentEnvironment?._id && !!workflowSlug, + gcTime: 0, }); + console.log(data); + return { testData: data, isPending, diff --git a/apps/dashboard/src/hooks/use-fetch-workflow.ts b/apps/dashboard/src/hooks/use-fetch-workflow.ts index 44423f9beca..4a0292644ca 100644 --- a/apps/dashboard/src/hooks/use-fetch-workflow.ts +++ b/apps/dashboard/src/hooks/use-fetch-workflow.ts @@ -4,12 +4,12 @@ import type { WorkflowResponseDto } from '@novu/shared'; import { QueryKeys } from '@/utils/query-keys'; import { getWorkflow } from '@/api/workflows'; import { useEnvironment } from '@/context/environment/hooks'; -import { getEncodedId, WORKFLOW_DIVIDER } from '@/utils/step'; +import { getWorkflowIdFromSlug, WORKFLOW_DIVIDER } from '@/utils/step'; export const useFetchWorkflow = ({ workflowSlug }: { workflowSlug?: string }) => { const { currentEnvironment } = useEnvironment(); const workflowId = useMemo( - () => getEncodedId({ slug: workflowSlug ?? '', divider: WORKFLOW_DIVIDER }), + () => getWorkflowIdFromSlug({ slug: workflowSlug ?? '', divider: WORKFLOW_DIVIDER }), [workflowSlug] ); diff --git a/apps/dashboard/src/hooks/use-update-workflow.ts b/apps/dashboard/src/hooks/use-update-workflow.ts index c4c0da1f4a8..31db1bfdaaf 100644 --- a/apps/dashboard/src/hooks/use-update-workflow.ts +++ b/apps/dashboard/src/hooks/use-update-workflow.ts @@ -1,4 +1,4 @@ -import { getEncodedId, WORKFLOW_DIVIDER } from '@/utils/step'; +import { getWorkflowIdFromSlug, WORKFLOW_DIVIDER } from '@/utils/step'; import { OmitEnvironmentFromParameters } from '@/utils/types'; import { QueryKeys } from '@/utils/query-keys'; import { updateWorkflow } from '@/api/workflows'; @@ -18,14 +18,11 @@ export const useUpdateWorkflow = ( mutationFn: (args: UpdateWorkflowParameters) => updateWorkflow({ environment: currentEnvironment!, ...args }), ...options, onSuccess: async (data, variables, context) => { - await queryClient.setQueryData( - [ - QueryKeys.fetchWorkflow, - currentEnvironment?._id, - getEncodedId({ slug: data.slug, divider: WORKFLOW_DIVIDER }), - ], - data - ); + const workflowId = getWorkflowIdFromSlug({ slug: data.slug, divider: WORKFLOW_DIVIDER }); + await queryClient.setQueryData([QueryKeys.fetchWorkflow, currentEnvironment?._id, workflowId], data); + await queryClient.invalidateQueries({ + queryKey: [QueryKeys.fetchWorkflowTestData, currentEnvironment?._id, workflowId], + }); options?.onSuccess?.(data, variables, context); }, }); diff --git a/apps/dashboard/src/utils/step.ts b/apps/dashboard/src/utils/step.ts index c54634e140a..f3f1f4552ba 100644 --- a/apps/dashboard/src/utils/step.ts +++ b/apps/dashboard/src/utils/step.ts @@ -3,7 +3,7 @@ import { ShortIsPrefixEnum } from '@novu/shared'; export const WORKFLOW_DIVIDER = `_${ShortIsPrefixEnum.WORKFLOW}`; export const STEP_DIVIDER = `_${ShortIsPrefixEnum.STEP}`; -export const getEncodedId = ({ slug, divider }: { slug: string; divider: string }) => { +export const getWorkflowIdFromSlug = ({ slug, divider }: { slug: string; divider: string }) => { const parts = slug.split(divider); return parts[parts.length - 1]; };