feat: added correct showing of goals with the description and can_fail

ref: N25B-434

src/pages/VisProgPage/visualProgrammingUI/components/Plan.tsx

@@ -67,10 +67,36 @@ function StepReduce(planElement: PlanElement, _nodes: Node[]) : Record<string, u
  * @param plan: the plan to check
  * @returns: a boolean 
  */
-export function DoesPlanIterate(plan?: Plan) : boolean {
+export function DoesPlanIterate( _nodes: Node[], plan?: Plan,) : boolean {
     // TODO: should recursively check plans that have goals (and thus more plans) in them.
     if (!plan) return false
-    return plan.steps.filter((step) => step.type == "llm").length > 0;
+    return plan.steps.filter((step) => step.type == "llm").length > 0 || 
+     (
+        // Find the goal node of this step
+        plan.steps.filter((step) => step.type == "goal").map((goalStep) => {
+        const goalId = goalStep.id;
+        const goalNode = _nodes.find((x) => x.id === goalId);
+        // In case we don't find any valid plan, this node doesn't iterate
+        if (!goalNode || !goalNode.data.plan) return false;
+        // Otherwise, check if this node can fail - if so, we should have the option to iterate
+        return (goalNode && goalNode.data.plan && goalNode.data.can_fail)
+        })
+    ).includes(true);
+}
+
+/**
+ * Checks if any of the plan's goal steps has its can_fail value set to true.
+ * @param plan: plan to check
+ * @param _nodes: nodes in flow store.
+ */
+export function HasCheckingSubGoal(plan: Plan, _nodes: Node[]) {
+    const goalSteps = plan.steps.filter((x) => x.type == "goal");
+    return goalSteps.map((goalStep) => {
+        // Find the goal node and check its can_fail data boolean.
+        const goalId = goalStep.id;
+        const goalNode = _nodes.find((x) => x.id === goalId);
+        return (goalNode && goalNode.data.can_fail)
+    }).includes(true);
 }
 
 /**

src/pages/VisProgPage/visualProgrammingUI/components/PlanEditor.tsx

@@ -23,6 +23,7 @@ export default function PlanEditorDialog({
   const [newActionType, setNewActionType] = useState<ActionTypes>("speech");
   const [newActionGestureType, setNewActionGestureType] = useState<boolean>(true);
   const [newActionValue, setNewActionValue] = useState("");
+  const [hasInteractedWithPlan, setHasInteractedWithPlan] = useState<boolean>(false)
   const { setScrollable } = useFlowStore();
   const nodes = useFlowStore().nodes;
 
@@ -56,6 +57,7 @@ export default function PlanEditorDialog({
 
   const buildAction = (): Action => {
     const id = crypto.randomUUID();
+    setHasInteractedWithPlan(true)
     switch (newActionType) {
     case "speech":
      return { id, text: newActionValue, type: "speech" };
@@ -103,7 +105,7 @@ export default function PlanEditorDialog({
               <div className={styles.planEditorLeft}>
               {/* Left Side (Action Adder) */}
                   <h4>Add Action</h4>
-                  {(!plan && description && draftPlan.steps.length === 0) && (<div className={styles.stepSuggestion}>
+                  {(!plan && description && draftPlan.steps.length === 0 && !hasInteractedWithPlan) && (<div className={styles.stepSuggestion}>
                       <label> Filled in as a suggestion! </label>
                       <label> Feel free to change! </label>
                   </div>)}