[WEB-3712] improvement: create draft work item logic#6847
[WEB-3712] improvement: create draft work item logic#6847sriramveeraghanta merged 1 commit intopreviewfrom
Conversation
WalkthroughThis pull request introduces new customizable properties in dropdown and modal components. The Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant IssueFormRoot
participant DraftIssueLayout
User->>IssueFormRoot: Triggers modal close
IssueFormRoot->>DraftIssueLayout: Calls handleClose
DraftIssueLayout->>DraftIssueLayout: Calls sanitizeChanges to filter changes
alt If valid changes exist
DraftIssueLayout->>DraftIssueLayout: Calls handleDraftAndClose to draft issue and close modal
else No valid changes
DraftIssueLayout->>User: Closes modal without drafting
end
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
Pull Request Linked with Plane Work Items
Comment Automatically Generated by Plane |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
web/core/components/issues/issue-modal/draft-issue-layout.tsx (1)
41-58: Good implementation of centralizing sanitization logic.The new
sanitizeChangesfunction effectively centralizes the logic for determining what constitutes a meaningful change, which improves code maintainability and consistency.Consider addressing the static analysis warnings about the
deleteoperator by using an alternative approach that may be more performant:- if (value === null || value === undefined || value === "") delete sanitizedChanges[issueKey]; + if (value === null || value === undefined || value === "") sanitizedChanges[issueKey] = undefined; - if (typeof value === "object" && isEmpty(value)) delete sanitizedChanges[issueKey]; + if (typeof value === "object" && isEmpty(value)) sanitizedChanges[issueKey] = undefined; - if (Array.isArray(value) && value.length === 0) delete sanitizedChanges[issueKey]; + if (Array.isArray(value) && value.length === 0) sanitizedChanges[issueKey] = undefined; - if (issueKey === "project_id") delete sanitizedChanges.project_id; + if (issueKey === "project_id") sanitizedChanges.project_id = undefined; - if (issueKey === "priority" && value && value === "none") delete sanitizedChanges.priority; + if (issueKey === "priority" && value && value === "none") sanitizedChanges.priority = undefined; - delete sanitizedChanges.description_html; + sanitizedChanges.description_html = undefined;🧰 Tools
🪛 Biome (1.9.4)
[error] 48-48: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
[error] 49-49: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
[error] 55-55: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
packages/ui/src/dropdowns/custom-search-select.tsx(3 hunks)packages/ui/src/dropdowns/helper.tsx(1 hunks)web/ce/components/issues/issue-modal/template-select.tsx(1 hunks)web/core/components/issues/issue-modal/draft-issue-layout.tsx(3 hunks)web/core/components/issues/issue-modal/form.tsx(4 hunks)
🧰 Additional context used
🧬 Code Definitions (2)
web/core/components/issues/issue-modal/form.tsx (1)
packages/constants/src/issue/modal.ts (1)
DEFAULT_WORK_ITEM_FORM_VALUES(4-19)
web/core/components/issues/issue-modal/draft-issue-layout.tsx (1)
web/core/components/issues/issue-modal/form.tsx (1)
IssueFormRoot(69-590)
🪛 Biome (1.9.4)
web/core/components/issues/issue-modal/draft-issue-layout.tsx
[error] 48-48: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
[error] 49-49: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
[error] 55-55: Avoid the delete operator which can impact performance.
Unsafe fix: Use an undefined assignment instead.
(lint/performance/noDelete)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: Analyze (javascript)
- GitHub Check: Analyze (python)
🔇 Additional comments (10)
packages/ui/src/dropdowns/helper.tsx (1)
46-46: Good addition of customizable messaging.Adding the optional
noResultsMessageproperty to theCustomSearchSelectPropsinterface enables greater flexibility for users of this component, allowing them to customize the message shown when no search results are found.packages/ui/src/dropdowns/custom-search-select.tsx (2)
36-36: Good implementation with backward compatibility.Adding the
noResultsMessageprop with a default value ensures backward compatibility while allowing for customization. This is a clean implementation of the interface change.
202-202: Proper implementation of the customizable message.The implementation correctly uses the
noResultsMessageprop to display a custom message when no results are found, replacing the hardcoded text with the configurable property.web/core/components/issues/issue-modal/form.tsx (4)
64-64: Well-defined optional property for draft handling.Adding the optional
handleDraftAndClosemethod to theIssueFormPropsinterface is a good approach for extending functionality without breaking existing code. This aligns with the PR objective of improving draft work item handling.
90-90: Properly destructured from props.The
handleDraftAndCloseproperty is correctly destructured from the props, maintaining the pattern used for other properties in this component.
240-255: Improved form reset logic with template handling.The enhanced reset logic that conditionally applies templates is a good improvement. When creating multiple items with a template, this ensures the template is consistently applied between submissions.
402-408: Good implementation of the modal close handler.The conditional logic for handling modal closure is well-implemented. It appropriately delegates to either the draft-specific handler or the standard close handler based on availability.
web/core/components/issues/issue-modal/draft-issue-layout.tsx (3)
66-68: Good use of the sanitizeChanges function.Using the newly created
sanitizeChangesfunction here ensures consistent handling of the changes object and improves readability by abstracting the sanitization logic.
129-135: Well-implemented draft and close functionality.The new
handleDraftAndClosefunction provides a streamlined way to create a draft issue and close the modal in one step, enhancing the user experience.
149-149: Correctly integrates the new functionality with the form component.Now that the
handleDraftAndClosefunction is passed to theIssueFormRootcomponent, it can be used by child components to offer a "draft and close" workflow.
| placeholder?: string; | ||
| renderChevron?: boolean; | ||
| dropDownContainerClassName?: string; | ||
| handleModalClose: () => void; |
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Consider making this property optional to maintain backward compatibility.
Adding a required property handleModalClose to an existing type could break existing implementations. If this component is already used elsewhere in the codebase, consider making this property optional with a default behavior.
🏁 Script executed:
#!/bin/bash
# Check for existing usages of the WorkItemTemplateSelect component
echo "Searching for usages of WorkItemTemplateSelect component..."
rg "WorkItemTemplateSelect" --type tsx --type jsxLength of output: 206
Action Required: Verify the Optionality of the handleModalClose Property
- The addition of the required
handleModalCloseproperty inweb/ce/components/issues/issue-modal/template-select.tsxmay break components that rely on a default behavior. - Our initial search encountered file type issues, so we recommend re-running the search (as done in the updated script above) to check if there are any usages of the WorkItemTemplateSelect component.
- If further verification confirms that the component is used without explicitly providing a
handleModalCloseprop, adjust the interface to make this property optional and implement a suitable default behavior.
🏁 Script executed:
#!/bin/bash
# Updated search for usages of WorkItemTemplateSelect component using explicit file globs for tsx and jsx files
echo "Searching for usages of WorkItemTemplateSelect in .tsx and .jsx files..."
rg "WorkItemTemplateSelect" -g "*.tsx" -g "*.jsx"Length of output: 605
Action Required: Make handleModalClose Optional to Maintain Backward Compatibility
- Our updated search confirms that the
WorkItemTemplateSelectcomponent is used inweb/core/components/issues/issue-modal/form.tsxwithout an explicithandleModalCloseprop. - Keeping
handleModalCloseas a required property risks breaking existing implementations. - Please update the type in
web/ce/components/issues/issue-modal/template-select.tsxby markinghandleModalCloseas optional (for example, change it fromtohandleModalClose: () => void;
) and implement a default behavior if none is provided.handleModalClose?: () => void;
3 participants
Description
Type of Change
Summary by CodeRabbit