fix: Prompt generate

[shaohuzhang1]

fix: Prompt generate --bug=1061828 --user=张展玮 【提示词生成】- AI对话节点中，生成的提示词点击替换不管用 https://www.tapd.cn/62980211/s/1773916

[f2c-ci-robot]

Adding the "do-not-merge/release-note-label-needed" label because no release-note block was detected, please follow our release note process to remove it.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

[f2c-ci-robot]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[shaohuzhang1]

The provided code looks generally correct but lacks some critical optimizations and security considerations. Here are my observations:

1. Security Concerns:

   • The MsgConfirm function call uses a translation method ($t) which suggests that translations are missing or incorrectly formatted in your Vue.js project. Ensure all necessary translations are correctly set up and loaded.

2. Component Unmounting Issue:

   • The cleanup of the streamTimer inside the onUnmounted hook is good practice to prevent memory leaks during component unmounting. However, it’s worth noting that the timer might be stopped multiple times due to early exits before receiving complete responses.

3. Stream Handling Issues:

   • The flow when streaming data can lead to edge cases where partial messages might still be cached or processed. Consider adding checks within the if (!split[index].replace('data:', '')) {} block to ensure only valid chunks are handled.

4. Loading State Management:

   • Currently, loading state management isn't fully clear since there aren’t direct updates or reset operations after handling API requests. This might cause inconsistencies especially when generating long answers slowly.

Suggested Improvements

1. Error Logging & Cleanup:

   • Add logging for errors occurring during message processing to help debug any issues with incomplete responses.

   const handleWrite = ({ done, value }: { done: boolean; value: any }) => {
     try {
       if (done) {
         loading.value = false;
         console.info('Flow successfully completed');
       } else {
         await processMessage(value);
       }
     } catch (error) {
       loading.value = false;
       isApiComplete.value = true;
       console.error('Processing failed', error);
   
       MsgErr(t('common.flowFailed'));
       stopStreaming();
     }
   
     return reader.read().then(handleWrite);
   };

2. Optimization for Streaming Start:

   • Instead of starting the streaming immediately upon receiving each chunk, consider checking whether the entire response has been received based on specific indicators like "EOS" markers. Delay starting the interval until such an indicator is encountered.

startStreamingOutput() {
  if(isPaused.value || streamTimer) {
    return;
  }
  isStreaming.value = true;

  streamTimer = setInterval(async () => {
    if(!isPaused.value && currentDisplayIndex.value < fullContent.value.length){
      const step = Math.min(3, fullContent.value.length - currentDisplayIndex.value);
      currentDisplayIndex.value += step;

      // Update displayed content
      const currentAnswer = chatMessages.value[chatMessages.value.length - 1];
      if(currentAnswer && currentAnswer.role === 'ai'){
        currentAnswer.content = fullContent.value.substring(0, currentDisplayIndex.value);
      }

      // Check if we have reached the end gracefully
      const lastChunk = fullContentvalue.split('\n').pop();      
      if(lastChunk && /END_OF_STREAM/.test(lastChunk)){
        clearInterval(this.streamTimer);
        this.streamTimer = null;
        this.isStreaming = false;
        this.loading = false;  // Optional depending on how you want to finalize the dialog UI        
      }
    }
    }, 50); // Adjust polling interval as needed            
}

This ensures smoother transitions between short chunks and completes the display when appropriate, avoiding abrupt stops in large outputs.

By implementing these suggested improvements, your component should become more robust and easier to maintain.

Feel free to further clarify any concerns or adjust solutions as per your app's specific requirements!

[shaohuzhang1]

The provided code appears to be part of a configuration object used for localization in a web application or similar project. The export statement exports an object with various keys, each containing human-readable strings that will be displayed to users.

Here's a brief summary of the corrections needed:

1. Typo: There might be a typo in the key 'remake'. It should likely be 'regenerate'.

2. Consistency: Ensure consistency throughout the translation entries. For example, both 'generatePrompt' should use consistent terminology and formatting (e.g., 'prompt', no extra spaces after it).

Here’s the corrected version of the block:

@@ -135,6 +135,9 @@ export default {
     label: 'Generate',
     generatePrompt: 'Generate Prompt',
     placeholder: 'Please enter the prompt topic',
+    title: 'The prompt is displayed here',
+    regenerate: 'Regenerate',
+    stopGenerating: 'Stop Generating',
     continueGenerating: 'Continue Generating',
     replaceContent: 'Replace Content',
     exitConfirmation: 'Are you sure you want to exit and discard the AI-generated content?',
   },

In this revised version:

• 'replace' has been replaced with 'replaceContent' which seems more natural if the intention is to change the generated text.
• A new key 'exitConfirmation' has been added to confirm whether the user wants to cancel their action while still having access to the AI-generated content. This improves clarity as it provides options on how to handle changes versus abandoning them entirely.

[shaohuzhang1]

Your code looks mostly correct, but there are a few improvements that could be made:

1. Consistent String Formatting: Consider using string interpolation (template literals) to make the string formatting more consistent across different parts of the object.

2. Error Handling for placeholder:

   • Add a check to ensure that placeholder is not empty or null before setting it.
   • Provide default values if necessary.

3. Optimization Suggestions:

   • Ensure that all strings are unique to avoid namespace conflicts within different contexts.

Here's an example of how you can improve the readability and robustness of the strings.js file while maintaining the existing functionality:

export default {
  common: {
    cancel: '取消',
    confirm: '确认',
  },
  
  settings: {
    saveButtonLabel: {
      type: 'save_settings_dialog_save_button_label'
    }
  // other settings...
}

// Example of adding error handling for placeholder
const placeholder = '请输入提示词主题';
if (!placeholder || typeof placeholder !== 'string') {
  throw new Error('Placeholder must be a non-empty string');
}

This way, when someone tries to set an invalid value for placeholder, TypeScript will catch it during compilation, providing better debugging experience. Remember to replace placeholders like {type: "save_settings_dialog_save_button_label"} with actual labels or keys from your application's localization setup.