Add design when edge focused (#13687)

Fix focused design for edges, edge buttons and handle

## Before
<img width="3014" height="1026" alt="image"
src="https://github.com/user-attachments/assets/8ef6647b-1ba6-4c71-9ffd-f6f5fe15e891"
/>


https://github.com/user-attachments/assets/9d702a24-70c4-4f2b-9655-5fec0f83e9d8


## After

<img width="1509" height="595" alt="Capture d’écran 2025-08-06 à 14 58
54"
src="https://github.com/user-attachments/assets/7c81b504-69a3-4d62-b455-738764b21d45"
/>



https://github.com/user-attachments/assets/7d859d12-c2e1-43d5-a611-d906aa9bc0d1
This commit is contained in:
martmull
2025-08-06 17:47:35 +02:00
committed by GitHub
parent b71e6b0609
commit 787f8b75ab
23 changed files with 292 additions and 106 deletions
@@ -3,6 +3,7 @@ import { WorkflowWithCurrentVersion } from '@/workflow/types/Workflow';
import { useCreateWorkflowVersionEdge } from '@/workflow/workflow-steps/hooks/useCreateWorkflowVersionEdge';
import { useState } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { WorkflowDiagramEdge } from '@/workflow/workflow-diagram/types/WorkflowDiagramEdge';
export const useCreateEdge = ({
workflow,
@@ -15,14 +16,8 @@ export const useCreateEdge = ({
const { getUpdatableWorkflowVersion } = useGetUpdatableWorkflowVersion();
const createEdge = async ({
source,
target,
}: {
source: string;
target: string;
}) => {
if (isLoading === true) {
const createEdge = async ({ source, target }: WorkflowDiagramEdge) => {
if (isLoading) {
return;
}
@@ -3,6 +3,7 @@ import { WorkflowWithCurrentVersion } from '@/workflow/types/Workflow';
import { useDeleteWorkflowVersionEdge } from '@/workflow/workflow-steps/hooks/useDeleteWorkflowVersionEdge';
import { useState } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { WorkflowDiagramEdge } from '@/workflow/workflow-diagram/types/WorkflowDiagramEdge';
export const useDeleteEdge = ({
workflow,
@@ -15,14 +16,8 @@ export const useDeleteEdge = ({
const { getUpdatableWorkflowVersion } = useGetUpdatableWorkflowVersion();
const deleteEdge = async ({
source,
target,
}: {
source: string;
target: string;
}) => {
if (isLoading === true) {
const deleteEdge = async ({ source, target }: WorkflowDiagramEdge) => {
if (isLoading) {
return;
}