feat: add reusable tag selector for Add/Edit Task dialogs by Hell1213 · Pull Request #390 · CCExtractor/ccsync

Hell1213 · 2026-01-10T13:57:44Z

Replaced manual tag input with a dropdown selector to fix typos and inconsistent tagging.

Changes:
Added new TagMultiSelect component with dropdown for tag selection
Replaced manual tag input in Add Task dialog with TagMultiSelect
Replaced manual tag input in Edit Task dialog with TagMultiSelect
Save/cancel buttons now appear inline with selected tags

Fixes: #210

Checklist

Ran npx prettier --write . (for formatting)
Ran gofmt -w . (for Go backend) - Not applicable, frontend only
Ran npm test (for JS/TS testing)
Added unit tests, if applicable
Verified all tests pass (581/581 passing)
Updated documentation, if needed - Not needed

Additional Notes
The new component makes tag management easier:

Click dropdown to see all existing tags
Search or create new tags by typing
Press Enter or create tag to add a tag
Click X on tag badges to remove them
Save/cancel buttons show up next to the tags

Demo

Screencast.from.2026-01-15.11-28-26.mp4

github-actions · 2026-01-10T13:57:52Z

Thank you for opening this PR!

Before a maintainer takes a look, it would be really helpful if you could walk through your changes using GitHub's review tools.

Please take a moment to:

Check the "Files changed" tab
Leave comments on any lines for functions, comments, etc. that are important, non-obvious, or may need attention
Clarify decisions you made or areas you might be unsure about and/or any future updates being considered.
Finally, submit all the comments!

More information on how to conduct a self review:
https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/reviewing-changes-in-pull-requests/reviewing-proposed-changes-in-a-pull-request

This helps make the review process smoother and gives us a clearer understanding of your thought process.

Once you've added your self-review, we'll continue from our side. Thank you!

Hell1213

Done with self review , PR adds a reusable tag component that makes tag management easier for users. Instead of typing tags manually , users can now select from existing tags or create new ones through a dropdown. The component is used in both Add Task and Edit Task dialogs, removing code duplication.

its-me-abhishek

Overall looks good, do checkout the suggestions

its-me-abhishek · 2026-01-12T14:34:51Z

@@ -200,7 +196,7 @@ export const Tasks = (
  }, [props.email]);
  useEffect(() => {


this useEffect could be removed, completely

its-me-abhishek · 2026-01-12T14:36:21Z

+          handleNewTagCreate();
+        }
+      }
+      // Do nothing if search is empty


do remove the comment

its-me-abhishek · 2026-01-12T14:37:41Z


-      expect(screen.queryByText('tag2')).not.toBeInTheDocument();
+      await waitFor(() => {
+        // Check that tag1 is not in the selected tags badges area


kindly remove the comment

and other such comments

its-me-abhishek · 2026-01-12T14:38:43Z

@@ -0,0 +1,556 @@
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';


tests would need to be updated, upon changing the file name

Hell1213 · 2026-01-12T17:26:20Z

sure @its-me-abhishek , i have implemented all changes as requested will push soon .

its-me-abhishek · 2026-01-14T16:43:33Z

@Hell1213 , after 0:48, the tags did not get removed, though, seems to be a bug

Hell1213 · 2026-01-14T17:50:19Z

@Hell1213 , after 0:48, the tags did not get removed, though, seems to be a bug

thanks for pointing out , I'm looking into it and will push soon when it get fixed .

Hell1213 · 2026-01-15T06:00:13Z

hey @its-me-abhishek pls take a look I have ,updated that demo video and done with changes in code as needed .

its-me-abhishek

Kindly provide some context, or revert these changes, probably the issue was just frontend related

its-me-abhishek · 2026-01-15T18:25:06Z


 	// Handle tags
+
+	output, err := utils.ExecCommandForOutputInDir(tempDir, "task", taskID, "export")


i think the old logic was fine, probably some frontend bug would have caused that issue, considering a UI revamp would not break any backend func, unless already broken

Hell1213 · 2026-01-16T06:19:24Z

Kindly provide some context, or revert these changes, probably the issue was just frontend related

thanks , I'll be in scope and would not touch backend and revert edit task file,
and I will check that bug which causing removed tags still appeared in task

Hell1213 · 2026-01-17T15:25:26Z

hey @its-me-abhishek ,please take a look ,
reverted the backend edit_task changes - turned out it was just a frontend issue in handleSaveTags not recalculating uniqueTags properly. Fixed it and everything's working now!

its-me-abhishek · 2026-01-17T16:50:36Z

cool, LGTM, merging this! Thanks for the PR!

Hell1213 commented Jan 10, 2026

View reviewed changes

Hell1213 changed the title ~~feat: add reusable TagMultiSelect component for task tag management~~ feat: add reusable tag selector for Add/Edit Task dialogs Jan 10, 2026

its-me-abhishek requested changes Jan 12, 2026

View reviewed changes

ShivaGupta-14 mentioned this pull request Jan 12, 2026

feat(tags): implement tags dropdown in Add/Edit Task dialogs #351

Closed

6 tasks

Hell1213 force-pushed the fix/issue-210-reusable-tags branch from cd58387 to 4937543 Compare January 12, 2026 17:50

Hell1213 force-pushed the fix/issue-210-reusable-tags branch from 4937543 to 3affb2a Compare January 14, 2026 18:44

its-me-abhishek requested changes Jan 15, 2026

View reviewed changes

Hell1213 force-pushed the fix/issue-210-reusable-tags branch from 3affb2a to 3392553 Compare January 17, 2026 13:55

Hell1213 added 3 commits January 17, 2026 19:38

feat: create TagMultiSelect component for reusable tag selection

9a6e0b7

feat: integrate TagMultiSelect with AddTaskDialog

f6c346c

feat: integrate TagMultiSelect with TaskDialog for editing

e35f306

Hell1213 force-pushed the fix/issue-210-reusable-tags branch 2 times, most recently from 4219262 to 1e78c56 Compare January 17, 2026 15:15

test: add comprehensive tests for TagMultiSelect component

854cab3

Hell1213 force-pushed the fix/issue-210-reusable-tags branch from 1e78c56 to 854cab3 Compare January 17, 2026 15:22

its-me-abhishek approved these changes Jan 17, 2026

View reviewed changes

its-me-abhishek merged commit 0f6b972 into CCExtractor:main Jan 17, 2026
5 checks passed

		@@ -200,7 +196,7 @@ export const Tasks = (
		}, [props.email]);
		useEffect(() => {

		@@ -0,0 +1,556 @@
		import { render, screen, fireEvent, waitFor } from '@testing-library/react';


		// Handle tags

		output, err := utils.ExecCommandForOutputInDir(tempDir, "task", taskID, "export")

Conversation

Hell1213 commented Jan 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jan 10, 2026

Uh oh!

Hell1213 left a comment

Choose a reason for hiding this comment

Uh oh!

its-me-abhishek left a comment

Choose a reason for hiding this comment

Uh oh!

its-me-abhishek Jan 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

its-me-abhishek Jan 12, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

its-me-abhishek Jan 12, 2026

Choose a reason for hiding this comment

Uh oh!

its-me-abhishek Jan 12, 2026

Choose a reason for hiding this comment

Uh oh!

its-me-abhishek Jan 12, 2026

Choose a reason for hiding this comment

Uh oh!

Hell1213 commented Jan 12, 2026

Uh oh!

its-me-abhishek commented Jan 14, 2026

Uh oh!

Hell1213 commented Jan 14, 2026

Uh oh!

Hell1213 commented Jan 15, 2026

Uh oh!

its-me-abhishek left a comment

Choose a reason for hiding this comment

Uh oh!

its-me-abhishek Jan 15, 2026

Choose a reason for hiding this comment

Uh oh!

Hell1213 commented Jan 16, 2026

Uh oh!

Hell1213 commented Jan 17, 2026

Uh oh!

its-me-abhishek commented Jan 17, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Hell1213 commented Jan 10, 2026 •

edited

Loading

its-me-abhishek Jan 12, 2026 •

edited

Loading