Raphaël Bosi b70119dbe6 Fix modal click outside (#12120)
Fixes https://github.com/twentyhq/twenty/issues/12111

The bug occurred because in
https://github.com/twentyhq/twenty/pull/12062, I changed the click
outside mode of the modal from compare pixels to compare html ref. This
happens because the modal is in a portal, so the `compareHTMLRef`
doesn't work.

A bug already existed before but since the mode was compare pixel, it
only happened when a dropdown was overflowing from the modal:


https://github.com/user-attachments/assets/e34bfaca-dd21-46e5-a532-a66ba494889d

I commented the tests `CancelButtonClick`, and `ConfirmButtonClick`
because they don't work with compare pixel mode (the `userEvent.click()`
creates a `MouseEvent` with `clientX`=0 and `clientY`=0 so it triggers
the click outside listener even when the story tiggers a click on an
element inside a modal)

We should find a way to make the ClickOutsideMode `compareHTMLRef` work
with portals. I believe the `comparePixels` mode was used as a hacky way
to get around this problem (hacky because of the existing bug above).
2025-05-19 15:04:04 +02:00
2025-05-14 16:35:51 +05:30
2024-11-06 14:24:07 +01:00
2025-05-19 15:04:04 +02:00
2025-04-09 17:35:25 +02:00
2025-04-03 14:26:19 +02:00
2025-03-05 14:27:17 +01:00
2024-01-10 17:05:23 +01:00
2025-03-07 18:19:42 +01:00
2025-04-16 11:46:37 +02:00


Twenty logo

The #1 Open-Source CRM

🌐 Website · 📚 Documentation · Roadmap · Discord · Figma


Companies view


Installation

See:
🚀 Self-hosting
🖥️ Local Setup

Does the world need another CRM?

We built Twenty for three reasons:

CRMs are too expensive, and users are trapped. Companies use locked-in customer data to hike prices. It shouldn't be that way.

A fresh start is required to build a better experience. We can learn from past mistakes and craft a cohesive experience inspired by new UX patterns from tools like Notion, Airtable or Linear.

We believe in Open-source and community. Hundreds of developers are already building Twenty together. Once we have plugin capabilities, a whole ecosystem will grow around it.


What You Can Do With Twenty

We're currently developing Twenty's beta version.

Please feel free to flag any specific needs you have by creating an issue.

Below are a few features we have implemented to date:

Add, filter, sort, edit, and track customers:

Companies view

Create one or several opportunities for each company:

Opportunities view

Track deals effortlessly with the email integration:

Emails

Tailor your data model to meet business needs:

Data model

See rich notes displayed in a timeline:

Rich notes

Create tasks on records

Tasks

Keyboard shortcuts

Connect your CRM to all your tools through our APIs and Webhooks.

API


Stack

Thanks

Chromatic Greptile Sentry Crowdin

Thanks to these amazing services that we use and recommend for UI testing (Chromatic), code review (Greptile), catching bugs (Sentry) and translating (Crowdin).

Join the Community

Description
No description provided
Readme AGPL-3.0 324 MiB
Languages
TypeScript 98.7%
MDX 1%