feast(backend): ux datamap doc

backend/src/build-system/context.ts

@@ -8,6 +8,11 @@ import {
 } from './types';
 import { Logger } from '@nestjs/common';
 
+export type GlobalDataKeys = 'projectName' | 'description' | 'platform';
+type ContextData = {
+  [key in GlobalDataKeys]: string;
+} & Record<string, any>;
+
 export class BuilderContext {
   private state: BuildExecutionState = {
     completed: new Set(),
@@ -80,11 +85,17 @@ export class BuilderContext {
     return { ...this.state };
   }
 
-  setData(key: string, value: any): void {
+  setData<Key extends keyof ContextData>(
+    key: Key,
+    value: ContextData[Key],
+  ): void {
     this.data[key] = value;
   }
 
-  getData(key: string): any {
+  getData<Key extends keyof ContextData>(key: Key): ContextData[Key] {
+    if (!(key in this.data)) {
+      throw new Error(`Data key "${key}" is not set or does not exist.`);
+    }
     return this.data[key];
   }
 

backend/src/build-system/node/ux-datamap/index.ts

@@ -0,0 +1,40 @@
+import { BuildHandler, BuildResult } from 'src/build-system/types';
+import { BuilderContext } from 'src/build-system/context';
+import { ModelProvider } from 'src/common/model-provider';
+import { prompts } from './prompt';
+
+export class UXDatamapHandler implements BuildHandler {
+  readonly id = 'op:UX_DATAMAP::STATE:GENERATE';
+
+  async run(context: BuilderContext, args: unknown): Promise<BuildResult> {
+    console.log('Generating UX Data Map Document...');
+
+    // extract relevant data from the context
+    const projectName =
+      context.getData('projectName') || 'Default Project Name';
+    const uxGoals = context.getData('uxGoals') || 'Default UX Goals';
+
+    // generate the UX Data Map prompt dynamically
+    const prompt = prompts.generateUXDataMapPrompt(
+      projectName,
+      args as string,
+      // TODO: change later
+      'web',
+    );
+
+    // Use ModelProsvider or another service to generate the document
+    const uxDatamapContent = await context.model.chatSync(
+      {
+        content: prompt,
+      },
+      'gpt-3.5-turbo',
+    );
+
+    // Store the generated document in the context
+    context.setData('uxDatamapDocument', uxDatamapContent);
+    return {
+      success: true,
+      data: uxDatamapContent,
+    };
+  }
+}

backend/src/build-system/node/ux-datamap/prompt.ts

@@ -0,0 +1,140 @@
+export const prompts = {
+  generateUXDataMapPrompt: (
+    projectName: string,
+    sitemapDoc: string,
+    platform: string,
+  ): string => {
+    return `You are an expert UX Designer. Your task is to analyze the provided sitemap documentation and identify all the data elements needed to support the user experience, based on the following inputs:
+
+       - Project name: ${projectName}
+       - Sitemap Documentation: ${sitemapDoc}
+       - Platform: ${platform}
+
+Follow these guidelines to analyze data requirements from a UX perspective:
+
+### Instructions and Rules:
+
+1. For each page/screen in the sitemap:
+   - What information does the user need to see?
+   - What data does the user need to input?
+   - What feedback or responses should the user receive?
+   - What dynamic content needs to be displayed?
+
+2. Consider:
+   - User goals on each page
+   - Required form fields and their purposes
+   - Content that needs to be displayed
+   - System feedback and status information
+   - Dynamic updates and real-time data
+   - Error states and messages
+
+### UX Data Requirements Document:
+
+---
+### Page-by-Page Data Analysis
+
+#### 1. Project Overview
+  - **Project Name**: 
+  - **Platform**: 
+  - **General Description**:
+
+#### 2. Global Data Elements
+Common data elements needed across multiple pages:
+  - User profile information
+  - Navigation states
+  - System status
+  - etc.
+
+#### 3. Page-Specific Data Requirements
+
+For each page in sitemap:
+
+##### [Page Name]
+**Purpose**: [Brief description of page purpose]
+
+**User Goals**:
+- Goal 1
+- Goal 2
+...
+
+**Required Data Elements**:
+
+*Input Data*:
+- Field 1: [Purpose and importance]
+  - Why it's needed
+  - User expectations
+  - Requirements (if any)
+- Field 2: ...
+
+*Display Data*:
+- Content 1: [Purpose and importance]
+  - Why users need this information
+  - Update frequency (if dynamic)
+  - Priority level
+- Content 2: ...
+
+*Feedback & States*:
+- Success states
+- Error states
+- Loading states
+- Empty states
+
+**User Interactions**:
+- How data changes based on user actions
+- What feedback is needed
+- When/how data updates
+
+Example for Login Page:
+
+##### Login Page
+**Purpose**: Allow users to authenticate and access their account
+
+**User Goals**:
+- Sign into their account
+- Recover forgotten password
+- Stay signed in for convenience
+
+**Required Data Elements**:
+
+*Input Data*:
+- Username/Email
+  - Purpose: Identify the user account
+  - User expectation: Email format or username rules
+  - Should be remembered if user chooses
+- Password
+  - Purpose: Authenticate the user
+  - Should be masked for security
+  - Should support paste functionality
+- "Remember Me" option
+  - Purpose: Convenience for returning users
+  - Optional selection
+
+*Display Data*:
+- Login form status
+- Authentication feedback
+- Password requirements (if needed)
+- Account recovery options
+
+*Feedback & States*:
+- Loading state during authentication
+- Success feedback and redirect
+- Error messages for invalid credentials
+- Password recovery confirmation
+
+**User Interactions**:
+- Form validation feedback
+- Login button state changes
+- Immediate feedback on input errors
+- Clear path to password recovery
+
+---
+
+Your reply must start with: "\`\`\`UXDataMap" and end with "\`\`\`". 
+
+Focus on describing the data requirements from a user experience perspective. For each page:
+1. What data needs to be collected and why
+2. What information needs to be displayed and why
+3. How the data supports user goals
+4. What feedback the user needs`;
+  },
+};