Skip to content

Commit 64ce9bf

Browse files
ctatectate
committed
auto-select
1 parent 03e2350 commit 64ce9bf

File tree

2 files changed

+116
-124
lines changed

2 files changed

+116
-124
lines changed

‎components/ui/integration-selector.tsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,13 @@ export function IntegrationSelector({
7979
return unsubscribe;
8080
}, []);
8181

82+
// Auto-select single integration from cached data
83+
useEffect(() => {
84+
if (integrations.length === 1 && !value && !disabled) {
85+
onChange(integrations[0].id);
86+
}
87+
}, [integrations, value, disabled, onChange]);
88+
8289
const handleNewIntegrationCreated = async (integrationId: string) => {
8390
await loadIntegrations(true);
8491
onChange(integrationId);
@@ -151,12 +158,6 @@ export function IntegrationSelector({
151158
if (integrations.length === 1) {
152159
const integration = integrations[0];
153160
const displayName = integration.name || `${integrationLabel} API Key`;
154-
const isSelected = value === integration.id;
155-
156-
// Auto-select if not already selected
157-
if (!isSelected && !disabled) {
158-
onChange(integration.id);
159-
}
160161

161162
return (
162163
<>

‎components/workflow/workflow-toolbar.tsx‎

Lines changed: 109 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1573,10 +1573,20 @@ function WorkflowIssuesDialog({
15731573
const { brokenReferences, missingRequiredFields, missingIntegrations } =
15741574
actions.workflowIssues;
15751575

1576-
const handleGoToStep = (nodeId: string) => {
1576+
const handleGoToStep = (nodeId: string, fieldKey?: string) => {
15771577
actions.setShowWorkflowIssuesDialog(false);
15781578
state.setSelectedNodeId(nodeId);
15791579
state.setActiveTab("properties");
1580+
// Focus on the specific field after a short delay to allow the panel to render
1581+
if (fieldKey) {
1582+
setTimeout(() => {
1583+
const element = document.getElementById(fieldKey);
1584+
if (element) {
1585+
element.focus();
1586+
element.scrollIntoView({ behavior: "smooth", block: "center" });
1587+
}
1588+
}, 100);
1589+
}
15801590
};
15811591

15821592
const handleAddIntegration = (integrationType: IntegrationType) => {
@@ -1608,138 +1618,119 @@ function WorkflowIssuesDialog({
16081618
</AlertDialogDescription>
16091619
</AlertDialogHeader>
16101620

1611-
<div className="flex-1 space-y-4 overflow-y-auto py-2">
1612-
{/* Broken References Section */}
1613-
{brokenReferences.length > 0 && (
1614-
<div className="space-y-2">
1615-
<h4 className="flex items-center gap-1.5 font-medium text-red-600 text-sm dark:text-red-400">
1616-
<AlertTriangle className="size-4" />
1617-
Broken References ({brokenReferences.length})
1621+
<div className="flex-1 space-y-3 overflow-y-auto py-2">
1622+
{/* Missing Connections Section */}
1623+
{missingIntegrations.length > 0 && (
1624+
<div className="space-y-1">
1625+
<h4 className="font-medium text-muted-foreground text-xs uppercase tracking-wide">
1626+
Missing Connections
16181627
</h4>
1619-
<div className="space-y-2">
1620-
{brokenReferences.map((broken) => (
1621-
<div
1622-
className="flex items-center gap-3 rounded-lg border border-red-500/20 bg-red-500/5 p-3"
1623-
key={broken.nodeId}
1628+
{missingIntegrations.map((missing) => (
1629+
<div
1630+
className="flex items-center gap-3 py-1"
1631+
key={missing.integrationType}
1632+
>
1633+
<IntegrationIcon
1634+
className="size-4 shrink-0"
1635+
integration={missing.integrationType}
1636+
/>
1637+
<p className="min-w-0 flex-1 text-sm">
1638+
<span className="font-medium">
1639+
{missing.integrationLabel}
1640+
</span>
1641+
<span className="text-muted-foreground">
1642+
{" — "}
1643+
{missing.nodeNames.length > 3
1644+
? `${missing.nodeNames.slice(0, 3).join(", ")} +${missing.nodeNames.length - 3} more`
1645+
: missing.nodeNames.join(", ")}
1646+
</span>
1647+
</p>
1648+
<Button
1649+
className="shrink-0"
1650+
onClick={() =>
1651+
handleAddIntegration(missing.integrationType)
1652+
}
1653+
size="sm"
1654+
variant="outline"
16241655
>
1625-
<div className="min-w-0 flex-1">
1626-
<p className="font-medium text-foreground text-sm">
1627-
{broken.nodeLabel}
1628-
</p>
1629-
<div className="mt-1 space-y-1">
1630-
{broken.brokenReferences.map((ref, idx) => (
1631-
<p
1632-
className="text-muted-foreground text-xs"
1633-
key={`${ref.fieldKey}-${idx}`}
1634-
>
1635-
<span className="font-mono text-red-600 dark:text-red-400">
1636-
{ref.displayText}
1637-
</span>{" "}
1638-
in {ref.fieldLabel}
1639-
</p>
1640-
))}
1641-
</div>
1642-
</div>
1643-
<Button
1644-
className="shrink-0"
1645-
onClick={() => handleGoToStep(broken.nodeId)}
1646-
size="sm"
1647-
variant="outline"
1648-
>
1649-
Fix
1650-
</Button>
1651-
</div>
1652-
))}
1653-
</div>
1656+
Add
1657+
</Button>
1658+
</div>
1659+
))}
16541660
</div>
16551661
)}
16561662

1657-
{/* Missing Required Fields Section */}
1658-
{missingRequiredFields.length > 0 && (
1663+
{/* Broken References Section */}
1664+
{brokenReferences.length > 0 && (
16591665
<div className="space-y-2">
1660-
<h4 className="flex items-center gap-1.5 font-medium text-orange-600 text-sm dark:text-orange-400">
1661-
<AlertTriangle className="size-4" />
1662-
Missing Required Fields ({missingRequiredFields.length})
1666+
<h4 className="font-medium text-muted-foreground text-xs uppercase tracking-wide">
1667+
Broken References
16631668
</h4>
1664-
<div className="space-y-2">
1665-
{missingRequiredFields.map((node) => (
1666-
<div
1667-
className="flex items-center gap-3 rounded-lg border border-orange-500/20 bg-orange-500/5 p-3"
1668-
key={node.nodeId}
1669-
>
1670-
<div className="min-w-0 flex-1">
1671-
<p className="font-medium text-foreground text-sm">
1672-
{node.nodeLabel}
1673-
</p>
1674-
<div className="mt-1 space-y-1">
1675-
{node.missingFields.map((field) => (
1676-
<p
1677-
className="text-muted-foreground text-xs"
1678-
key={field.fieldKey}
1679-
>
1680-
Missing:{" "}
1681-
<span className="font-medium text-orange-600 dark:text-orange-400">
1682-
{field.fieldLabel}
1683-
</span>
1684-
</p>
1685-
))}
1669+
{brokenReferences.map((broken) => (
1670+
<div key={broken.nodeId}>
1671+
<p className="font-medium text-sm">{broken.nodeLabel}</p>
1672+
<div className="mt-1 space-y-0.5">
1673+
{broken.brokenReferences.map((ref, idx) => (
1674+
<div
1675+
className="flex items-center gap-3 py-0.5 pl-3"
1676+
key={`${broken.nodeId}-${ref.fieldKey}-${idx}`}
1677+
>
1678+
<p className="min-w-0 flex-1 text-muted-foreground text-sm">
1679+
<span className="font-mono">{ref.displayText}</span>
1680+
{" in "}
1681+
{ref.fieldLabel}
1682+
</p>
1683+
<Button
1684+
className="shrink-0"
1685+
onClick={() =>
1686+
handleGoToStep(broken.nodeId, ref.fieldKey)
1687+
}
1688+
size="sm"
1689+
variant="outline"
1690+
>
1691+
Fix
1692+
</Button>
16861693
</div>
1687-
</div>
1688-
<Button
1689-
className="shrink-0"
1690-
onClick={() => handleGoToStep(node.nodeId)}
1691-
size="sm"
1692-
variant="outline"
1693-
>
1694-
Fix
1695-
</Button>
1694+
))}
16961695
</div>
1697-
))}
1698-
</div>
1696+
</div>
1697+
))}
16991698
</div>
17001699
)}
17011700

1702-
{/* Missing Connections Section */}
1703-
{missingIntegrations.length > 0 && (
1701+
{/* Missing Required Fields Section */}
1702+
{missingRequiredFields.length > 0 && (
17041703
<div className="space-y-2">
1705-
<h4 className="flex items-center gap-1.5 font-medium text-orange-600 text-sm dark:text-orange-400">
1706-
<AlertTriangle className="size-4" />
1707-
Missing Connections ({missingIntegrations.length})
1704+
<h4 className="font-medium text-muted-foreground text-xs uppercase tracking-wide">
1705+
Missing Required Fields
17081706
</h4>
1709-
<div className="space-y-2">
1710-
{missingIntegrations.map((missing) => (
1711-
<div
1712-
className="flex items-center gap-3 rounded-lg border border-orange-500/20 bg-orange-500/5 p-3"
1713-
key={missing.integrationType}
1714-
>
1715-
<IntegrationIcon
1716-
className="size-5 shrink-0"
1717-
integration={missing.integrationType}
1718-
/>
1719-
<div className="min-w-0 flex-1">
1720-
<p className="font-medium text-foreground text-sm">
1721-
{missing.integrationLabel}
1722-
</p>
1723-
<p className="text-muted-foreground text-xs">
1724-
Used by:{" "}
1725-
{missing.nodeNames.length > 3
1726-
? `${missing.nodeNames.slice(0, 3).join(", ")} and ${missing.nodeNames.length - 3} more`
1727-
: missing.nodeNames.join(", ")}
1728-
</p>
1729-
</div>
1730-
<Button
1731-
className="shrink-0"
1732-
onClick={() =>
1733-
handleAddIntegration(missing.integrationType)
1734-
}
1735-
size="sm"
1736-
variant="outline"
1737-
>
1738-
Add
1739-
</Button>
1707+
{missingRequiredFields.map((node) => (
1708+
<div key={node.nodeId}>
1709+
<p className="font-medium text-sm">{node.nodeLabel}</p>
1710+
<div className="mt-1 space-y-0.5">
1711+
{node.missingFields.map((field) => (
1712+
<div
1713+
className="flex items-center gap-3 py-0.5 pl-3"
1714+
key={`${node.nodeId}-${field.fieldKey}`}
1715+
>
1716+
<p className="min-w-0 flex-1 text-muted-foreground text-sm">
1717+
{field.fieldLabel}
1718+
</p>
1719+
<Button
1720+
className="shrink-0"
1721+
onClick={() =>
1722+
handleGoToStep(node.nodeId, field.fieldKey)
1723+
}
1724+
size="sm"
1725+
variant="outline"
1726+
>
1727+
Fix
1728+
</Button>
1729+
</div>
1730+
))}
17401731
</div>
1741-
))}
1742-
</div>
1732+
</div>
1733+
))}
17431734
</div>
17441735
)}
17451736
</div>

0 commit comments

Comments
 (0)