diff --git a/src/activeLLM/suggestFix.js b/src/activeLLM/suggestFix.js index 039df69..b8219aa 100644 --- a/src/activeLLM/suggestFix.js +++ b/src/activeLLM/suggestFix.js @@ -21,21 +21,6 @@ export async function suggestFix( Ensure to include the fileName of where to insert the fix in the format Example.java. Strictly output in JSON format. The JSON should have the following format:{"code": "...", "explanation": "...", "fileName": "..."}`; - //the following prompt is an older version. It is commented out because the one used right now is more - //concise and produces better output - /*const prompt = `Here is a design rule and its description: ${rule} - Here is a code example that follows this design rule: ${example} - The example file path is ${exampleFilePath} - Now, here is a code snippet that violates this design rule. ${violation} - The violated code's file path is ${violationFilePath} - Suggest a fix to make this violation follow the given design rule? - Generate code with surrounding code included that follows the design rule. - Be sure to maintain proper whitespace with \\t and \\n. - Give a brief explanation of your fix as well. Strictly output in JSON format. - Ensure that you include the fileName where the fix should be inserted at. - This should just be in the format Example.java - The JSON should have the following format:{"code": "...", "explanation": "...", "fileName": "..."}`;*/ - let attempt = 1; let success = false; diff --git a/src/ui/rulePanel.js b/src/ui/rulePanel.js index d10a6d4..ca24854 100644 --- a/src/ui/rulePanel.js +++ b/src/ui/rulePanel.js @@ -2,26 +2,24 @@ * Created by saharmehrpour on 9/6/17. */ -import React, { Component, Fragment } from "react"; -import { connect } from "react-redux"; +import React, {Component, Fragment} from "react"; +import {connect} from "react-redux"; import "../index.css"; import "../App.css"; -import { - Tab, Tabs, Badge, FormGroup, ControlLabel, Label, Collapse -} from "react-bootstrap"; -import { FaCaretDown, FaCaretUp } from "react-icons/fa"; -import { MdEdit } from "react-icons/md"; +import {Badge, Collapse, ControlLabel, FormGroup, Label, Tab, Tabs} from "react-bootstrap"; +import {FaCaretDown, FaCaretUp} from "react-icons/fa"; +import {MdEdit} from "react-icons/md"; -import { changeEditMode, ignoreFileChange } from "../actions"; +import {changeEditMode, ignoreFileChange} from "../actions"; import Utilities from "../core/utilities"; import RulePad from "./RulePad/rulePad"; -import { reduxStoreMessages } from "../reduxStoreConstants"; -import { webSocketSendMessage } from "../core/coreConstants"; -import { relatives } from "../core/ruleExecutorConstants"; -import { hashConst, none_filePath } from "./uiConstants"; +import {reduxStoreMessages} from "../reduxStoreConstants"; +import {webSocketSendMessage} from "../core/coreConstants"; +import {relatives} from "../core/ruleExecutorConstants"; +import {hashConst, none_filePath} from "./uiConstants"; -import { suggestFix } from "../activeLLM/suggestFix"; +import {suggestFix} from "../activeLLM/suggestFix"; class RulePanel extends Component { @@ -86,13 +84,13 @@ class RulePanel extends Component { } this.caretClass = { - true: { cursor: "pointer", color: "black" }, - false: { cursor: "pointer", color: "darkgrey" } + true: {cursor: "pointer", color: "black"}, + false: {cursor: "pointer", color: "darkgrey"} }; this.editIconClass = { - true: { color: "#337ab7", cursor: "pointer" }, - false: { color: "black", cursor: "pointer" } + true: {color: "#337ab7", cursor: "pointer"}, + false: {color: "black", cursor: "pointer"} }; } @@ -101,43 +99,45 @@ class RulePanel extends Component { if (this.state.editMode) return ( this.changeEditMode()} />); + changeEditMode={() => this.changeEditMode()}/>); return (
-
- this.setState({ openPanel: false })} - style={this.caretClass[this.state.openPanel.toString()]} - className={"react-icons"} /> - this.setState({ openPanel: true })} - style={this.caretClass[(!this.state.openPanel).toString()]} - className={"react-icons"} /> +
+ this.setState({openPanel: false})} + style={this.caretClass[this.state.openPanel.toString()]} + className={"react-icons"}/> + this.setState({openPanel: true})} + style={this.caretClass[(!this.state.openPanel).toString()]} + className={"react-icons"}/> this.changeEditMode()} - className={"react-icons"} /> + onClick={() => this.changeEditMode()} + className={"react-icons"}/>
{this.state.title}

{this.state.description}

-
+
{this.renderTags()}
-
+
{ - if (this.state.activeTab === key) - this.setState({ activeTab: 0 }); - else - this.setState({ activeTab: key }); - }}> - { } - {this.renderListOfSnippets("satisfied")} - {this.renderListOfSnippets("violated")} + activeKey={this.state.activeTab} + onSelect={(key) => { + if (this.state.activeTab === key) + this.setState({activeTab: 0}); + else + this.setState({activeTab: key}); + }}> + {} + + {this.renderListOfSnippets("satisfied")} + + + {this.renderListOfSnippets("violated")} +
@@ -169,12 +169,11 @@ class RulePanel extends Component { if (nextProps.message === reduxStoreMessages.hash_msg) { let panelState = this.newUpdateStateUponCodeChange(nextProps.codeChanged, nextProps.filePath); - this.setState({ ...panelState, ...newState, filePath: nextProps.filePath }); + this.setState({...panelState, ...newState, filePath: nextProps.filePath}); + } + else if (nextProps.message === reduxStoreMessages.file_path_update_msg) { + this.setState({...newState, filePath: nextProps.filePath}); } - - else if (nextProps.message === reduxStoreMessages.file_path_update_msg) - this.setState({ ...newState, filePath: nextProps.filePath }); - else if (nextProps.message === reduxStoreMessages.change_edit_mode_msg) { let indices = nextProps.rules.map(d => d.index); let arrayIndex = indices.indexOf(this.ruleIndex); @@ -185,7 +184,7 @@ class RulePanel extends Component { else { this.ruleI = nextProps.rules[arrayIndex]; newState.editMode = this.ruleI.rulePanelState.editMode; - this.setState({ ...newState, filePath: nextProps.filePath }); + this.setState({...newState, filePath: nextProps.filePath}); } } } @@ -195,12 +194,10 @@ class RulePanel extends Component { if (arrayIndex !== -1) { if (this.ruleI.rulePanelState.editMode && !this.state.editMode) { newState.editMode = true; - this.setState({ ...newState, filePath: nextProps.filePath }); - } - - else { + this.setState({...newState, filePath: nextProps.filePath}); + } else { let panelState = this.newUpdateStateUponCodeChange(nextProps.codeChanged, nextProps.filePath); - this.setState({ ...newState, ...panelState, filePath: nextProps.filePath }); + this.setState({...newState, ...panelState, filePath: nextProps.filePath}); } } } @@ -240,13 +237,13 @@ class RulePanel extends Component { {this.state.filePath !== none_filePath ? ( {fileSatisfied + fileViolated} - out of + out of {totalSatisfied + totalViolated} ) : ( {totalSatisfied + totalViolated} )} - { } + {} ); case "satisfied": return ( @@ -254,13 +251,13 @@ class RulePanel extends Component { {this.state.filePath !== none_filePath ? ( {fileSatisfied} - out of + out of {totalSatisfied} ) : ( {totalSatisfied} )} - { } + {} ); case "violated": return ( @@ -268,13 +265,13 @@ class RulePanel extends Component { {this.state.filePath !== none_filePath ? ( {fileViolated} - out of + out of {totalViolated} ) : ( {totalViolated} )} - { } + {} ); default: break; @@ -441,21 +438,21 @@ class RulePanel extends Component { let ruleIFile = file.length !== 0 ? file[0].data : {}; if (ruleIFile.allChanged === relatives.greater && ruleIFile.satisfiedChanged === relatives.none && ruleIFile.violatedChanged === relatives.none) { - return { openPanel: true, className: "rulePanelDiv blue-bg" }; + return {openPanel: true, className: "rulePanelDiv blue-bg"}; } if (ruleIFile.satisfiedChanged === relatives.greater) - return { openPanel: true, className: "rulePanelDiv green-bg" }; + return {openPanel: true, className: "rulePanelDiv green-bg"}; if (ruleIFile.violatedChanged === relatives.greater) - return { openPanel: true, className: "rulePanelDiv red-bg" }; + return {openPanel: true, className: "rulePanelDiv red-bg"}; if (file.length > 0) - return { openPanel: true, className: "rulePanelDiv" }; + return {openPanel: true, className: "rulePanelDiv"}; if (ruleIFile.violated === 0) - return { openPanel: false, className: "rulePanelDiv" }; + return {openPanel: false, className: "rulePanelDiv"}; - return { openPanel: false, className: "rulePanelDiv" }; + return {openPanel: false, className: "rulePanelDiv"}; } /** @@ -526,7 +523,7 @@ class SnippetView extends Component { this.setState.bind(this), ); // notify the component that this snippet now has a suggested fix - this.setState({ suggestionCreated: true }); + this.setState({suggestionCreated: true}); } }; @@ -566,81 +563,50 @@ class SnippetView extends Component { return (
-
-
{ - this.props.onIgnoreFile(true); - Utilities.sendToServer( - this.props.ws, - webSocketSendMessage.snippet_xml_msg, - this.state.d.xml, - ); - }} - > - 
+                

+                    
 {
+                        this.props.onIgnoreFile(true);
+                        Utilities.sendToServer(this.props.ws, webSocketSendMessage.snippet_xml_msg,
+                            this.state.d.xml);
+                    }}>
+                        
 
                         
                             {/* render the following IF this is a violation of a rule and there is no fix yet */}
                             {this.state.snippetGroup === "violated" &&
-                                // Use the apiKey variable in the conditional rendering check
-                                apiKey !== null &&
-                                apiKey !== "" &&
-                                !this.state.suggestedSnippet && (
-                                    
-                                )}
+                            // Use the apiKey variable in the conditional rendering check
+                            apiKey !== null && apiKey !== "" && !this.state.suggestedSnippet && (
+                                
+                            )}
                         
                     

 
                     {this.state.suggestionCreated && !this.state.suggestedSnippet && (
-                        
Loading Fix...

+                        
{"Loading Fix..."}

                     )}
 
 
                     {/* render the following IF the component state has received snippet */}
                     {this.state.suggestedSnippet && (
                         

-                            
Suggested Fix:

-                            
-                            
Suggestion Location:

-                            

-                            
Explanation:

-                            

+                            
{"Suggested Fix:"}

+                            
+                            
{"Suggestion Location:"}

+                            

+                            
{"Explanation:"}

+                            

 
                             
                         

                     )}
@@ -663,6 +629,7 @@ class SnippetView extends Component {
); } + UNSAFE_componentWillReceiveProps(nextProps) { this.setState({ snippetGroup: nextProps.snippetGroup,