Add EXAMPLES_MOCK constant to constants.ts

src/frontend/src/constants/constants.ts

@@ -1,6 +1,7 @@
 // src/constants/constants.ts
 
 import { languageMap } from "../types/components";
+import { FlowType } from "../types/flow";
 
 /**
  * invalid characters for flow name
@@ -739,4 +740,75 @@ export const PRIORITY_SIDEBAR_ORDER = [
   "helpers",
   "experimental",
 ];
+/*
+Data ingestion
+Basic Prompting
+Chat com memória
+Working with data (file/website)
+API requests
+Vector Store
+Assistant
+*/
 
+export const EXAMPLES_MOCK:FlowType[] = [
+  {
+    name: "Working with data",
+    id: "Working with data Description",
+    data: {
+      nodes: [],
+      edges: [],
+      viewport: { zoom: 1, x: 1, y: 1 }
+    },
+    description: "This flow represents the first process in our application.",
+    folder: STARTER_FOLDER_NAME,
+    user_id: undefined,
+  },
+  {
+    name: "Basic Prompting",
+    id: "Basic Prompting Description",
+    data: {
+      nodes: [],
+      edges: [],
+      viewport: { zoom: 1, x: 1, y: 1 }
+    },
+    description: "This flow represents the first process in our application.",
+    folder: STARTER_FOLDER_NAME,
+    user_id: undefined,
+  },
+  {
+    name: "Chat with memory",
+    id: "Chat with memory Description",
+    data: {
+      nodes: [],
+      edges: [],
+      viewport: { zoom: 1, x: 1, y: 1 }
+    },
+    description: "This flow represents the first process in our application.",
+    folder: STARTER_FOLDER_NAME,
+    user_id: undefined,
+  },
+  {
+    name: "API requests",
+    id: "API requests Description",
+    data: {
+      nodes: [],
+      edges: [],
+      viewport: { zoom: 1, x: 1, y: 1 }
+    },
+    description: "This flow represents the first process in our application.",
+    folder: STARTER_FOLDER_NAME,
+    user_id: undefined,
+  },
+  {
+    name: "Assistant",
+    id: "Assistant Description",
+    data: {
+      nodes: [],
+      edges: [],
+      viewport: { zoom: 1, x: 1, y: 1 }
+    },
+    description: "This flow represents the first process in our application.",
+    folder: STARTER_FOLDER_NAME,
+    user_id: undefined,
+  },
+];

src/frontend/src/pages/MainPage/index.tsx

@@ -10,6 +10,7 @@ import SidebarNav from "../../components/sidebarComponent";
 import { Button } from "../../components/ui/button";
 import { CONSOLE_ERROR_MSG } from "../../constants/alerts_constants";
 import {
+  EXAMPLES_MOCK,
   MY_COLLECTION_DESC,
   USER_PROJECTS_HEADER,
 } from "../../constants/constants";
@@ -133,7 +134,7 @@ export default function HomePage(): JSX.Element {
         </BaseModal.Header>
         <BaseModal.Content>
           <div className="flex h-full w-full flex-wrap gap-3 overflow-auto p-4 custom-scroll">
-            {examples.map((example, idx) => {
+            {EXAMPLES_MOCK.map((example, idx) => {
               return <UndrawCardComponent key={idx} flow={example} />;
             })}
             <NewFlowCardComponent />