twenty

Files

T

Thomas Trompette 15fd236ad0 fix(workflow): add tooltip explaining why the variable picker is disabled (#21862 )

## Context

Closes #21773
<img width="448" height="301" alt="Capture d’écran 2026-06-19 à 16 33
56"
src="https://github.com/user-attachments/assets/4efc637e-3361-4108-86b6-92ffc2e84252"
/>


When a workflow's variable picker (the `+` button next to a field) is
disabled — e.g. on a step whose only trigger is a global manual trigger
that produces no record variables — the button just shows a
`not-allowed` cursor with no explanation of *why*.

## Change

Add an `AppTooltip` to the disabled state of `WorkflowVariablesDropdown`
explaining the reason:

> No variables are available yet. Variables come from the workflow
trigger and previous steps.

The disabled state is reached via `disabled === true ||
noAvailableVariables`. In practice the callers hide the picker entirely
in read-only mode (it's rendered only when `!disabled`/`!readonly`), so
the meaningful trigger is **no available variables** — hence a single
message rather than separate copy per reason.

The tooltip is anchored with a `data-*` attribute selector instead of an
`#id`, because the picker's `instanceId` comes from React's `useId()`
(values like `:r1:`) which are invalid in a CSS `#id` selector that
`AppTooltip` runs through `querySelectorAll`.

## Testing

- `nx lint:diff-with-main twenty-front` — passes (lint + format).
- Verified the component resolves/renders on a local instance running
this branch.

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/21862?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->

2026-06-19 16:37:07 +02:00