diff --git a/app/page.tsx b/app/page.tsx index 00a7ed6..ccf60a4 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -96,10 +96,14 @@ export default function Home() { const [stackInput, setStackInput] = useState(""); const [features, setFeatures] = useState<Feature[]>([]); + const [tasks, setTasks] = useState<Task[]>([]); const { setValue } = form; async function onSubmit(values: z.infer<typeof formSchema>) { + setFeatures([]); + setTasks([]); + try { const feature_gen_prompt = `You are an AI software project manager. You use agile methodology and the best software project management techniques to plan software projects for indie developers. @@ -190,13 +194,15 @@ Instructions: For each feature, we need to figure out what other features need t dependencies: z .array( z.object({ - uid: z.enum(featureUids), + uid: z.enum(featureUids).describe("The UID of this feature"), dependencies: z .array( z.object({ uid: z .enum(featureUids) - .describe("The UID of the feature"), + .describe( + "The UID of the feature this feature depends on" + ), }) ) .describe("The UID of the dependencies of the feature"), @@ -259,7 +265,7 @@ Instructions: For each feature, we need to figure out what other features need t .filter((dep) => dep.uid === feature.uid) .map((dep) => _features.find((f) => f.uid === dep.depUid)); - generateTask( + return generateTask( p_name, p_desc, p_stack, @@ -268,9 +274,8 @@ Instructions: For each feature, we need to figure out what other features need t feature ); }); - - const tasks = await Promise.all(featurePromises); - console.log("all tasks", tasks); + const tasks: Task[][] = await Promise.all(featurePromises); + setTasks(tasks.flat()); } async function generateTask( @@ -413,6 +418,8 @@ Dependency-Based Order (numeric) </FormControl> <FormDescription> This is your project tech stack. + </FormDescription> + <div> {form.getValues("stack").map((stack) => ( <Badge key={stack} @@ -432,12 +439,15 @@ Dependency-Based Order (numeric) /> </Badge> ))} - </FormDescription> + </div> <FormMessage /> </FormItem> )} /> <Button type="submit">Submit</Button> + <Button type="button" onClick={() => setDogs(form)}> + Prefill Uber Dogs + </Button> </form> </Form> <h1></h1> @@ -459,7 +469,7 @@ Dependency-Based Order (numeric) <TableBody> {features!.map((feature) => { return ( - <TableRow key={feature.name}> + <TableRow key={feature.uid}> <TableCell className="max-w-xs whitespace-nowrap" style={{ @@ -478,7 +488,23 @@ Dependency-Based Order (numeric) </TableBody> </Table> </TabsContent> - <TabsContent value="tasks">{}</TabsContent> + <TabsContent value="tasks"> + {features.map((_feature) => { + return ( + <> + <div key={_feature.uid}> + <TaskTable + feature={_feature} + tasks={tasks.filter( + (task) => task.feature === _feature.uid + )} + /> + <hr className="my-10" /> + </div> + </> + ); + })} + </TabsContent> </Tabs> </div> ); @@ -523,6 +549,15 @@ const TaskTable = (props: any) => { ); }; +const setDogs = (form: any) => { + form.setValue("name", "Uber Dogs"); + form.setValue( + "description", + "Uber Dogs is a mobile app that allows users to order dogs on demand." + ); + form.setValue("stack", ["Django", "google-maps-api", "GraphQL"]); +}; + /* Electronic Medical Record System