feat: Add drag & drop reordering for event types

[Manas-Kenge]

What does this PR do?

• Fixes [CAL-3514] Drag & drop for re-ordering event types #14701
• Fixes CAL-3514

Visual Demo

• Before

Screencast.from.2026-01-03.12-47-01.mp4

• After

The lag seen here is due to my laptop, should not affect prod

Screencast.from.2026-01-03.12-48-28.mp4

Mandatory Tasks (DO NOT REMOVE)

• I have self-reviewed the code (A decent size PR without self-review might be rejected).
• I have updated the developer docs in /docs if this PR makes changes that would require a documentation change.
• I confirm automated tests are in place that prove my fix is effective or that my feature works.

---

Summary by cubic

Adds drag & drop reordering to the Event Types list so users can quickly arrange items. Implements the CAL-3514 requirement and replaces the old up/down controls.

• New Features

  • Drag handle on desktop using framer-motion Reorder; arrows removed.
  • Order is saved via eventTypeOrder with optimistic updates and a 500ms debounce.
  • List is flattened for drag, then re-chunked to keep pagination.

• Dependencies

  • Bump framer-motion to 12.23.26.

^{Written for commit 56de4d6. Summary will update on new commits.}

[vercel]

@Manas-Kenge is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

Hey there and thank you for opening this pull request! 👋🏼

We require pull request titles to follow the Conventional Commits specification and it looks like your proposed title needs to be adjusted.

Details:

No release type found in pull request title "feat:Add drag & drop reordering for event types". Add a prefix to indicate what kind of release this pull request corresponds to. For reference, see https://www.conventionalcommits.org/

Available types:
 - feat: A new feature
 - fix: A bug fix
 - docs: Documentation only changes
 - style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
 - refactor: A code change that neither fixes a bug nor adds a feature
 - perf: A code change that improves performance
 - test: Adding missing tests or correcting existing tests
 - build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
 - ci: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
 - chore: Other changes that don't modify src or test files
 - revert: Reverts a previous commit

[cubic-dev-ai]

2 issues found across 3 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="apps/web/modules/event-types/views/event-types-listing-view.tsx">

<violation number="1" location="apps/web/modules/event-types/views/event-types-listing-view.tsx:417">
P2: The `handleReorder` callback calls `mutation.mutate` on every order change during drag, which could result in multiple API calls. Consider debouncing the mutation call to only persist the final order after drag ends or after a short delay.</violation>
</file>

<file name="packages/features/package.json">

<violation number="1" location="packages/features/package.json:28">
P2: Consider using a pinned version (`12.23.26`) instead of caret notation (`^12.23.26`) for consistency with other direct dependencies in this file. Caret ranges can lead to different versions being installed across environments/time, making bugs harder to reproduce.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

[dhairyashiil]

Please address both comments from Cubic, especially the one about package.json
Also, test this behavior on tablet and mobile screens and attach videos showing the results.

[Manas-Kenge]

Please address both comments from Cubic, especially the one about package.json Also, test this behavior on tablet and mobile screens and attach videos showing the results.

There is no reordering of event types with arrows for mobile right now, so I haven't added it for drag & drop either. Should I add it? It works on tablet

[cubic-dev-ai]

1 issue found across 3 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="apps/web/modules/event-types/views/event-types-listing-view.tsx">

<violation number="1" location="apps/web/modules/event-types/views/event-types-listing-view.tsx:1022">
P2: Use `htmlFor` instead of `for` in JSX. The `for` keyword is reserved in JavaScript, and React requires `htmlFor` for the HTML `for` attribute. This regression breaks the label-input association and hurts accessibility.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

[dhairyashiil]

could you please resolve merge conflicts?

[cubic-dev-ai]

1 issue found across 3 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="apps/web/modules/event-types/views/event-types-listing-view.tsx">

<violation number="1" location="apps/web/modules/event-types/views/event-types-listing-view.tsx:352">
P2: The `useEffect` that syncs `pages` to `flattenedEventTypes` will overwrite local drag state if the server refetches mid-drag (e.g., on window focus). Consider guarding the sync to skip when there&#39;s a pending order:

```javascript
useEffect(() =&gt; {
  if (!pendingOrderRef.current) {
    setFlattenedEventTypes(pages?.flatMap((page) =&gt; page.eventTypes) ?? []);
  }
}, [pages]);
```</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}

[Manas-Kenge]

@dhairyashiil can you review this?

[Manas-Kenge]

@anikdhabal can you review this pls?