Skip to content

Commit a0bb9aa

Browse files
kevinkim-ogpkevinkim-ogp
committed
refactor: organise files, get allApps from context
1 parent 99beb24 commit a0bb9aa

File tree

8 files changed

+55
-59
lines changed

8 files changed

+55
-59
lines changed

packages/frontend/src/pages/AiBuilder/components/AiBuilderContext.tsx renamed to packages/frontend/src/pages/AiBuilder/AiBuilderContext.tsx

File renamed without changes.

packages/frontend/src/pages/AiBuilder/components/BranchStep.tsx renamed to packages/frontend/src/pages/AiBuilder/components/StepsPreview/BranchStep.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { IApp, IStep } from '@plumber/types'
1+
import { IStep } from '@plumber/types'
22

33
import { Box, Flex, Text } from '@chakra-ui/react'
44

@@ -7,13 +7,12 @@ import { branchStyles } from '@/components/FlowStepGroup/Content/IfThen/styles'
77
import Step from './Step'
88

99
interface BranchStepProps {
10-
allApps: IApp[]
1110
branchSteps: IStep[]
1211
isMobile: boolean
1312
}
1413

1514
export default function BranchStep(props: BranchStepProps) {
16-
const { allApps, branchSteps } = props
15+
const { branchSteps } = props
1716

1817
const branchName = branchSteps[0].parameters?.branchName as string
1918

@@ -28,7 +27,6 @@ export default function BranchStep(props: BranchStepProps) {
2827
{branchSteps.map((step, index) => (
2928
<Step
3029
key={String(step.position)}
31-
allApps={allApps}
3230
step={step}
3331
isNested={true}
3432
isLastStep={index === branchSteps.length - 1}

packages/frontend/src/pages/AiBuilder/components/GroupedStepContainer.tsx renamed to packages/frontend/src/pages/AiBuilder/components/StepsPreview/GroupedStepContainer.tsx

File renamed without changes.

packages/frontend/src/pages/AiBuilder/components/GroupedStepHeader.tsx renamed to packages/frontend/src/pages/AiBuilder/components/StepsPreview/GroupedStepHeader.tsx

File renamed without changes.

‎packages/frontend/src/pages/AiBuilder/components/StepsPreview/ModifyPromptModal.tsx‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { Modal, ModalContent, ModalOverlay } from '@chakra-ui/react'
2+
3+
import { AiFormData } from '../../schema'
4+
import { AIFormModalContent } from '../AIFormModalContent'
5+
6+
const ModifyPromptModal = ({
7+
isOpen,
8+
formInput,
9+
onClose,
10+
onUpdatePrompt,
11+
}: {
12+
isOpen: boolean
13+
formInput: {
14+
trigger: string
15+
actions: string
16+
}
17+
onClose: () => void
18+
onUpdatePrompt: (formData: AiFormData) => Promise<void>
19+
}) => {
20+
return (
21+
<Modal
22+
isOpen={isOpen}
23+
onClose={onClose}
24+
motionPreset="none"
25+
closeOnEsc={false}
26+
isCentered
27+
>
28+
<ModalOverlay bg="base.canvas.overlay" />
29+
30+
<ModalContent>
31+
<AIFormModalContent
32+
trigger={formInput?.trigger || ''}
33+
actions={formInput?.actions || ''}
34+
type="update"
35+
onBack={onClose}
36+
onSubmit={onUpdatePrompt}
37+
/>
38+
</ModalContent>
39+
</Modal>
40+
)
41+
}
42+
43+
export default ModifyPromptModal

packages/frontend/src/pages/AiBuilder/components/Step.tsx renamed to packages/frontend/src/pages/AiBuilder/components/StepsPreview/Step.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,20 +8,21 @@ import StepCaptionAndDemo from '@/components/FlowStep/components/StepCaptionAndD
88
import { flowStepStyles } from '@/components/FlowStep/styles'
99
import { SUPPORT_FORM_LINK } from '@/config/urls'
1010
import getStepName from '@/helpers/getStepName'
11+
import { useAiBuilderContext } from '@/pages/AiBuilder/AiBuilderContext'
1112

1213
interface AiStep extends IStep {
1314
description?: string
1415
}
1516

1617
interface StepProps {
17-
allApps: IApp[]
1818
step?: AiStep | null
1919
isNested?: boolean
2020
isLastStep?: boolean
2121
}
2222

2323
export default function Step(props: StepProps) {
24-
const { allApps, step, isNested, isLastStep } = props
24+
const { step, isNested, isLastStep } = props
25+
const { allApps } = useAiBuilderContext()
2526

2627
const app = allApps?.find(
2728
(currentApp: IApp) => currentApp.key === step?.appKey,

packages/frontend/src/pages/AiBuilder/components/StepsPreview.tsx renamed to packages/frontend/src/pages/AiBuilder/components/StepsPreview/index.tsx

Lines changed: 5 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,6 @@ import {
66
Center,
77
Flex,
88
HStack,
9-
Modal,
10-
ModalContent,
11-
ModalOverlay,
129
Text,
1310
useDisclosure,
1411
VStack,
@@ -20,14 +17,13 @@ import { MultiStepLoader } from '@/components/MultiStepLoader'
2017
import PrimarySpinner from '@/components/PrimarySpinner'
2118
import { GENERATE_AI_STEPS } from '@/graphql/mutations/generate-ai-steps'
2219
import { TOOLBOX_ACTIONS } from '@/helpers/toolbox'
23-
import { AIFormModalContent } from '@/pages/AiBuilder/components/AIFormModalContent'
20+
import { useAiBuilderContext } from '@/pages/AiBuilder/AiBuilderContext'
21+
import { getPromptFromFormInput } from '@/pages/AiBuilder/helpers'
22+
import { AiFormData } from '@/pages/AiBuilder/schema'
2423

25-
import { getPromptFromFormInput } from '../helpers'
26-
import { AiFormData } from '../schema'
27-
28-
import { useAiBuilderContext } from './AiBuilderContext'
2924
import BranchStep from './BranchStep'
3025
import GroupedStepContainer from './GroupedStepContainer'
26+
import ModifyPromptModal from './ModifyPromptModal'
3127
import Step from './Step'
3228

3329
const LOADING_STATES = [
@@ -37,47 +33,9 @@ const LOADING_STATES = [
3733
{ text: 'Putting it all together...' },
3834
]
3935

40-
const ModifyPromptModal = ({
41-
isOpen,
42-
formInput,
43-
onClose,
44-
onUpdatePrompt,
45-
}: {
46-
isOpen: boolean
47-
formInput: {
48-
trigger: string
49-
actions: string
50-
}
51-
onClose: () => void
52-
onUpdatePrompt: (formData: AiFormData) => Promise<void>
53-
}) => {
54-
return (
55-
<Modal
56-
isOpen={isOpen}
57-
onClose={onClose}
58-
motionPreset="none"
59-
closeOnEsc={false}
60-
isCentered
61-
>
62-
<ModalOverlay bg="base.canvas.overlay" />
63-
64-
<ModalContent>
65-
<AIFormModalContent
66-
trigger={formInput?.trigger || ''}
67-
actions={formInput?.actions || ''}
68-
type="update"
69-
onBack={onClose}
70-
onSubmit={onUpdatePrompt}
71-
/>
72-
</ModalContent>
73-
</Modal>
74-
)
75-
}
76-
7736
export default function StepsPreview() {
7837
const location = useLocation()
7938
const {
80-
allApps,
8139
formInput,
8240
output,
8341
triggerStep,
@@ -181,12 +139,11 @@ export default function StepsPreview() {
181139
return (
182140
<>
183141
<Box pos="relative" w="100%">
184-
<Step allApps={allApps} step={triggerStep} />
142+
<Step step={triggerStep} />
185143
{stepsBeforeGroup.map((action) => (
186144
<Fragment key={`${action.position}-${action.appKey}`}>
187145
<Step
188146
key={`${action.position}-${action.appKey}`}
189-
allApps={allApps}
190147
step={action}
191148
isLastStep={action.position === actionSteps.length + 1}
192149
/>
@@ -203,7 +160,6 @@ export default function StepsPreview() {
203160
{groupedSteps.map((branchSteps) => (
204161
<BranchStep
205162
key={String(branchSteps[0].position)}
206-
allApps={allApps}
207163
branchSteps={branchSteps}
208164
isMobile={isMobile}
209165
/>
@@ -215,7 +171,6 @@ export default function StepsPreview() {
215171
{forEachSteps.map((step, index) => (
216172
<Step
217173
key={String(step.position)}
218-
allApps={allApps}
219174
step={step}
220175
isNested={true}
221176
isLastStep={
@@ -234,7 +189,6 @@ export default function StepsPreview() {
234189
{ifThenSteps.map((branchSteps) => (
235190
<BranchStep
236191
key={String(branchSteps[0].position)}
237-
allApps={allApps}
238192
branchSteps={branchSteps}
239193
isMobile={isMobile}
240194
/>

‎packages/frontend/src/pages/AiBuilder/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ import { EDITOR_MARGIN_TOP } from '@/components/Editor/constants'
88
import * as URLS from '@/config/urls'
99
import InvalidEditorPage from '@/pages/Editor/components/InvalidEditorPage'
1010

11+
import StepsPreview from './components/StepsPreview'
1112
import {
1213
AiBuilderContextProvider,
1314
useAiBuilderContext,
14-
} from './components/AiBuilderContext'
15-
import StepsPreview from './components/StepsPreview'
15+
} from './AiBuilderContext'
1616

1717
function AiBuilderContent() {
1818
const { flowName, isSteps } = useAiBuilderContext()

0 commit comments

Comments
 (0)