feat: add full path label tooltip for workflow filter field (#16580)
# Closes Issue: Can't distinguish between fields with identical names (#16285) There was a UX bug in the workflow filter interface where **two variables coming from different steps but sharing the same field name** were displayed identically. This made it difficult for users to tell them apart when used in a filter group, leading to confusion when building workflows. --- # Fix: Add Full Path Label Tooltip for Workflow Filter Field - Adds a **tooltip/label showing the complete path** so users can distinguish fields from different workflow steps even if they share the same name. ## UX Improvements <img width="495" height="288" alt="image" src="https://github.com/user-attachments/assets/fa26f381-835b-4d14-bf73-f04b59c8d0b5" />
This commit is contained in:
+2
@@ -57,6 +57,8 @@ export const useStepsOutputSchema = () => {
|
||||
type: step.type,
|
||||
icon: getActionIcon(step.type),
|
||||
outputSchema: (outputSchema ?? {}) as OutputSchemaV2,
|
||||
objectName: (step.settings?.input as { objectName?: string })
|
||||
?.objectName,
|
||||
};
|
||||
|
||||
set(stepsOutputSchemaFamilyState(stepKey), stepOutputSchema);
|
||||
|
||||
+1
@@ -25,4 +25,5 @@ export type StepOutputSchemaV2 = {
|
||||
type: WorkflowTriggerType | WorkflowActionType;
|
||||
icon?: string;
|
||||
outputSchema: OutputSchemaV2;
|
||||
objectName?: string;
|
||||
};
|
||||
|
||||
+16
-4
@@ -45,11 +45,13 @@ export const searchVariableThroughFindRecordsOutputSchema = ({
|
||||
searchRecordOutputSchema,
|
||||
rawVariableName,
|
||||
isFullRecord = false,
|
||||
stepNameLabel,
|
||||
}: {
|
||||
stepName: string;
|
||||
searchRecordOutputSchema: FindRecordsOutputSchema;
|
||||
rawVariableName: string;
|
||||
isFullRecord?: boolean;
|
||||
stepNameLabel?: string;
|
||||
}): VariableSearchResult => {
|
||||
if (!isDefined(searchRecordOutputSchema)) {
|
||||
return {
|
||||
@@ -84,23 +86,33 @@ export const searchVariableThroughFindRecordsOutputSchema = ({
|
||||
selectedField: fieldName,
|
||||
path: pathSegments,
|
||||
isFullRecord,
|
||||
stepNameLabel,
|
||||
});
|
||||
}
|
||||
|
||||
if (searchResultKey === 'totalCount') {
|
||||
const label =
|
||||
searchRecordOutputSchema[searchResultKey]?.label ?? 'Total Count';
|
||||
const basePath = `${stepName} > ${label}`;
|
||||
return {
|
||||
variableLabel:
|
||||
searchRecordOutputSchema[searchResultKey]?.label ?? 'Total Count',
|
||||
variablePathLabel: `${stepName} > ${searchRecordOutputSchema[searchResultKey]?.label ?? 'Total Count'}`,
|
||||
variableLabel: label,
|
||||
variablePathLabel: stepNameLabel
|
||||
? `${basePath} (${stepNameLabel})`
|
||||
: basePath,
|
||||
variableType: FieldMetadataType.NUMBER,
|
||||
};
|
||||
}
|
||||
|
||||
if (searchResultKey === 'all') {
|
||||
const label =
|
||||
searchRecordOutputSchema[searchResultKey]?.label ?? 'All Records';
|
||||
const basePath = `${stepName} > ${label}`;
|
||||
return {
|
||||
variableLabel:
|
||||
searchRecordOutputSchema[searchResultKey]?.label ?? 'All Records',
|
||||
variablePathLabel: `${stepName} > ${searchRecordOutputSchema[searchResultKey]?.label ?? 'All Records'}`,
|
||||
variablePathLabel: stepNameLabel
|
||||
? `${basePath} (${stepNameLabel})`
|
||||
: basePath,
|
||||
variableType: FieldMetadataType.ARRAY,
|
||||
};
|
||||
}
|
||||
|
||||
+1
@@ -66,6 +66,7 @@ export const searchVariableThroughOutputSchemaV2 = ({
|
||||
searchRecordOutputSchema: stepOutputSchema.outputSchema,
|
||||
rawVariableName,
|
||||
isFullRecord,
|
||||
stepNameLabel: stepOutputSchema.objectName,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
+8
-1
@@ -77,6 +77,7 @@ const buildVariableResult = (
|
||||
targetSchema: RecordFieldNodeValue,
|
||||
targetFieldName: string,
|
||||
isFullRecord: boolean,
|
||||
stepNameLabel?: string,
|
||||
): VariableSearchResult => {
|
||||
const targetField = getFieldFromSchema(targetFieldName, targetSchema);
|
||||
// Determine the variable label based on whether we want the full record or a specific field
|
||||
@@ -97,7 +98,10 @@ const buildVariableResult = (
|
||||
|
||||
// Build the full path: stepName > field1 > field2 > targetField
|
||||
const fullPathSegments = [stepName, ...pathLabels, variableLabel];
|
||||
const variablePathLabel = fullPathSegments.join(' > ');
|
||||
const basePath = fullPathSegments.join(' > ');
|
||||
const variablePathLabel = stepNameLabel
|
||||
? `${basePath} (${stepNameLabel})`
|
||||
: basePath;
|
||||
|
||||
return {
|
||||
variableLabel,
|
||||
@@ -117,12 +121,14 @@ export const searchRecordOutputSchema = ({
|
||||
path,
|
||||
selectedField,
|
||||
isFullRecord,
|
||||
stepNameLabel,
|
||||
}: {
|
||||
stepName: string;
|
||||
recordOutputSchema: RecordOutputSchemaV2;
|
||||
path: string[];
|
||||
selectedField: string;
|
||||
isFullRecord: boolean;
|
||||
stepNameLabel?: string;
|
||||
}): VariableSearchResult => {
|
||||
const navigationResult = navigateToTargetField(recordOutputSchema, path);
|
||||
|
||||
@@ -140,6 +146,7 @@ export const searchRecordOutputSchema = ({
|
||||
navigationResult.schema,
|
||||
selectedField,
|
||||
isFullRecord,
|
||||
stepNameLabel,
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user