Skip to content

feat: add ability to duplicate a segment with user-defined name (#5259)#5488

Closed
sbhrwlr wants to merge 3 commits intoFlagsmith:mainfrom
sbhrwlr:feat/issue-5259-duplicatable-segment
Closed

feat: add ability to duplicate a segment with user-defined name (#5259)#5488
sbhrwlr wants to merge 3 commits intoFlagsmith:mainfrom
sbhrwlr:feat/issue-5259-duplicatable-segment

Conversation

@sbhrwlr
Copy link
Copy Markdown

@sbhrwlr sbhrwlr commented May 25, 2025

Thanks for submitting a PR! Please check the boxes below:

  • I have added information to docs/ if required so people know about the feature!
  • I have filled in the "Changes" section below?
  • I have filled in the "How did you test this code" section below?
  • I have used a Conventional Commit title for this Pull Request

Changes

Added a new modal component CreateDuplicateSegmentModal.tsx to create duplicates of segments by copying their data without IDs.

Integrated this modal into SegmentsPage.tsx with a new duplicateSegment function that opens the modal and calls a callback on submission.

Added a "duplicate" button for each segment that triggers duplication using the modal and creates the new segment via API, showing success/error toasts.

Adjusted UI states to disable buttons during creation/removal to handle loading properly.

How did you test this code?

Step 1: Navigate to the Segments page in the application.
Step 2: Find an existing segment from the list.
Step 3: Click the "duplicate" (copy) button next to the chosen segment.
Step 4: In the modal, enter a name for the new segment.
Step 5: Submit the form to create the duplicate segment.
Step 6: Verify the modal closes, the new segment appears in the list, and a success toast shows with the original segment’s name.
Step 7: Try submitting with an empty name to confirm the submit button is disabled, and test canceling the modal closes it without changes.
Step 8: Simulate an API failure (if possible) and verify the error toast appears.
Step 9: Confirm the duplicate and remove buttons are disabled during creation/removal loading states.

Note: Tested for feature specific segments as well.

Added below recording:
fix-demo

@sbhrwlr sbhrwlr requested a review from a team as a code owner May 25, 2025 13:17
@sbhrwlr sbhrwlr requested review from Zaimwa9 and removed request for a team May 25, 2025 13:17
@vercel
Copy link
Copy Markdown

vercel Bot commented May 25, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
docs ⬜️ Ignored (Inspect) Visit Preview May 25, 2025 1:20pm

@vercel
Copy link
Copy Markdown

vercel Bot commented May 25, 2025

@sbhrwlr is attempting to deploy a commit to the Flagsmith Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions Bot added the front-end Issue related to the React Front End Dashboard label May 25, 2025
@matthewelwell
Copy link
Copy Markdown
Contributor

Hi @sbhrwlr, thanks very much for the contribution, however this work is already in progress by the Flagsmith team - see PRs #5393 and #5394.

Please make sure that you reach out to the Flagsmith team before starting any work in the future so we can avoid duplication of effort like this. We'd love to receive PRs on other open issues whenever you have the time.

I'm going to go ahead and close this PR based on this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants