Merge branch 'main' into feat-backend-requirement-doc

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

@@ -12,7 +12,6 @@ export class UXDatamapHandler implements BuildHandler {
     // extract relevant data from the context
     const projectName =
       context.getData('projectName') || 'Default Project Name';
-    const uxGoals = context.getData('uxGoals') || 'Default UX Goals';
 
     const prompt = prompts.generateUXDataMapPrompt(
       projectName,
@@ -27,7 +26,6 @@ export class UXDatamapHandler implements BuildHandler {
       },
       'gpt-4o-mini',
     );
-
     return {
       success: true,
       data: uxDatamapContent,

backend/src/build-system/node/ux_sitemap_document/prompt/prompt.ts

@@ -0,0 +1,44 @@
+// Define and export the system prompts object
+export const prompts = {
+  generateUxsmdrompt: (
+    projectName: string,
+    prdDocument: string,
+    platform: string,
+  ): string => {
+    return `You are an expert frontend develper and ux designer. Your job is to analyze and expand upon the details provided, generating a Full UX Sitemap Document based on the following inputs:  
+       - Project name: ${projectName}
+       - product requirements document: ${prdDocument}
+       - Platform: ${platform}
+
+    Follow these rules as a guide to ensure clarity and completeness in your UX Sitemap Document.
+    1, Write you result in markdown
+    2, Your reply should start with : "\`\`\`UXSitemap" and end with "\`\`\`", Use proper markdown syntax for headings, subheadings, and hierarchical lists.
+    3. **Comprehensive Analysis**: Thoroughly parse the PRD to identify all core features, functionalities, and user stories.
+    - Focus on creating a hierarchical sitemap that covers each major section, with relevant sub-sections, pages, and key interactions.
+    - Ensure all primary and secondary user journeys identified in the PRD are clearly reflected.
+
+    4. **Page and Navigation Structure**: Break down the sitemap into main sections, secondary sections, and individual screens.
+    - **Main Sections**: Identify primary sections (e.g., Home, User Account, Product Catalog) based on project requirements.
+    - **Secondary Sections**: Include sub-sections under each main section (e.g., "Profile" and "Order History" under "User Account").
+    - **Screens and Interactions**: List specific screens and interactions that users encounter within each flow.
+
+    5. **Detailed User Journeys**:
+    - For every user story described in the PRD, map out the step-by-step navigation path.
+    - Highlight sequences (e.g., 1. Home > 1.1. Explore > 1.1.1. Product Details).
+
+    6. **Thorough Coverage**:
+    - Ensure the sitemap is fully comprehensive. If any feature from the PRD is not covered or any user journey is missing, add it to the sitemap.
+    - Consider the target audience and validate that all expected navigation flows and screens meet user needs.
+
+7. Ask Your self:
+    - Am I cover all the product requirement document?
+    - Am I Cover all the gloabal UI?
+    - Am I Cover all unique UI?
+    - Am I cover all the view that expect by user?
+    - what is all the details about UI?
+    - Am I cover all the cases? Is the final result 100% complete?
+ 
+Remeber your result will be directly be use in the deveolpment. Make sure is 100% complete.
+    `;
+  },
+};

backend/src/build-system/node/ux_sitemap_document/uxsmd.ts

@@ -0,0 +1,53 @@
+import { BuildHandler, BuildResult } from 'src/build-system/types';
+import { BuilderContext } from 'src/build-system/context';
+import { prompts } from './prompt/prompt';
+import { ModelProvider } from 'src/common/model-provider';
+import { Logger } from '@nestjs/common';
+
+export class UXSMDHandler implements BuildHandler {
+  readonly id = 'op:UXSMD::STATE:GENERATE';
+  readonly logger: Logger = new Logger('UXSMDHandler');
+
+  async run(context: BuilderContext, args: unknown): Promise<BuildResult> {
+    this.logger.log('Generating UXSMD...');
+
+    // Extract project data from the context
+    const projectName =
+      context.getData('projectName') || 'Default Project Name';
+    const platform = context.getData('platform') || 'Default Platform';
+
+    // Generate the prompt dynamically
+    const prompt = prompts.generateUxsmdrompt(
+      projectName,
+      args as string,
+      platform,
+    );
+
+    // Send the prompt to the LLM server and process the response
+    const uxsmdContent = await this.generateUXSMDFromLLM(prompt);
+
+    // Store the generated document in the context
+    context.setData('uxsmdDocument', uxsmdContent);
+
+    return {
+      success: true,
+      data: uxsmdContent,
+    };
+  }
+
+  private async generateUXSMDFromLLM(prompt: string): Promise<string> {
+    const modelProvider = ModelProvider.getInstance();
+
+    const model = 'gpt-3.5-turbo';
+
+    const prdContent = modelProvider.chatSync(
+      {
+        content: prompt,
+      },
+      model,
+    );
+
+    this.logger.log('Received full UXSMD content from LLM server.');
+    return prdContent;
+  }
+}