Conversation
…ed on dummy options
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 2 Ignored Deployments
|
|
Thank you for following the naming conventions for pull request titles! 🙏 |
apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/QuestionFormInput.tsxWhile the implementation of the MentionsInput component is a great addition, the hardcoded data array for the mentions could be improved. If the data for the mentions is static and won't change, it's fine to leave it as is. However, if the data is dynamic and could change, it would be better to fetch this data from a source (like an API or a state management store) and update it accordingly. // If the data is dynamic, fetch it from the appropriate source
const data = fetchDataFromSource();The new code introduces inline styles for the MentionsInput component. While this works, it can lead to performance issues in React as the object will be recreated on every render. It's recommended to use CSS classes or styled-components for better performance. // Use CSS classes or styled-components for better performance
const StyledMentionsInput = styled(MentionsInput)`
width: 100%;
border: 1px rgb(203 213 225) solid;
border-radius: 4px;
textArea: {
border: none;
marginBottom: 1rem;
};
suggestions: {
list: {
backgroundColor: white;
fontSize: 14;
};
item: {
padding: 5px 15px;
"&focused": {
backgroundColor: #cee4e5;
};
};
};
`; |
![review-agent-prime[bot]](https://avatars.githubusercontent.com/in/404610?s=60&v=4){kind=small}
| const data = [ | ||
| { id: "question 1", display: "question 1" }, | ||
| { id: "question 2", display: "question 2" }, | ||
| { id: "question 3", display: "question 3" }, | ||
| { id: "question 4", display: "question 4" }, | ||
| { id: "question 5", display: "question 5" }, | ||
| ]; |
There was a problem hiding this comment.
The hardcoded data array for the mentions is replaced with a function call to fetch data from a source. This is beneficial if the data is dynamic and could change over time.
| const data = [ | |
| { id: "question 1", display: "question 1" }, | |
| { id: "question 2", display: "question 2" }, | |
| { id: "question 3", display: "question 3" }, | |
| { id: "question 4", display: "question 4" }, | |
| { id: "question 5", display: "question 5" }, | |
| ]; | |
| const data = fetchDataFromSource(); |
2 participants
…ed on dummy options
What does this PR do?
Fixes # (issue)
Type of change
How should this be tested?
Checklist
Required
pnpm buildconsole.logsgit pull origin mainAppreciated