Compare commits

...

3 Commits

Author SHA1 Message Date
Abhimanyu Yadav
88e92a36a6 Revert "fix(frontend): improve history tracking and error handling in flow ed…"
This reverts commit 11d5ef2f43.
2026-01-16 18:50:00 +05:30
Abhimanyu Yadav
11d5ef2f43 fix(frontend): improve history tracking and error handling in flow editor (#11784)
### Changes 🏗️

- Improved error handling in `useRunInputDialog.ts` to properly handle
cases where node errors are empty or undefined
- Fixed node collision resolution in Flow component by using the current
state from the store instead of stale props
- Enhanced edge management to track history when edges are removed
- Fixed potential null reference in NodeHeader when accessing
hardcodedValues
- Improved history management in edgeStore by saving state before
modifications
- Significantly enhanced historyStore with better undo/redo
functionality:
  - Added checks to prevent redundant state changes
  - Fixed comparison of current vs. previous states
  - Improved tracking of drag operations
- Fixed nodeStore to properly track node position changes and maintain
history
- Removed console.log statement from FormRenderer

### Checklist 📋

#### For code changes:
- [x] I have clearly listed my changes in the PR description
- [x] I have made a test plan
- [x] I have tested my changes according to the test plan:
- [x] Verified undo/redo functionality works correctly after
adding/removing nodes
  - [x] Confirmed error handling works when validation fails
  - [x] Tested node dragging and collision resolution
  - [x] Verified edge creation and deletion properly updates history
2026-01-16 18:43:19 +05:30
abhi1992002
0116e0686e feat(frontend): enhance Google Drive Picker integration and improve UI components
- Added a new utility function to identify Google Drive file objects for better schema handling.
- Updated the GoogleDrivePickerField component to conditionally render based on the UI type.
- Refactored the matcher for Google Drive Picker schema to utilize the new utility function.
- Enhanced the ArrayFieldTemplate component by adding a gap between items for improved layout.
- Introduced a console log for debugging preprocessed schema in FormRenderer for development purposes.
2026-01-16 18:15:52 +05:30
5 changed files with 55 additions and 9 deletions

View File

@@ -30,6 +30,8 @@ export const FormRenderer = ({
return generateUiSchemaForCustomFields(preprocessedSchema, uiSchema);
}, [preprocessedSchema, uiSchema]);
console.log("preprocessedSchema", preprocessedSchema);
return (
<div className={"mb-6 mt-4"} data-tutorial-id="input-handles">
<Form

View File

@@ -63,7 +63,7 @@ export default function ArrayFieldTemplate(props: ArrayFieldTemplateProps) {
<div className="m-0 flex p-0">
<div className="m-0 w-full space-y-4 p-0">
{!fromAnyOf && (
<div className="flex items-center">
<div className="flex items-center gap-2">
<ArrayFieldTitleTemplate
fieldPathId={fieldPathId}
title={uiOptions.title || title}

View File

@@ -1,12 +1,23 @@
import { BlockUIType } from "@/app/(platform)/build/components/types";
import { GoogleDrivePickerInput } from "@/components/contextual/GoogleDrivePicker/GoogleDrivePickerInput";
import { GoogleDrivePickerConfig } from "@/lib/autogpt-server-api";
import { FieldProps, getUiOptions } from "@rjsf/utils";
export const GoogleDrivePickerField = (props: FieldProps) => {
const { schema, uiSchema, onChange, fieldPathId, formData } = props;
const { schema, uiSchema, onChange, fieldPathId, formData, registry } = props;
const uiOptions = getUiOptions(uiSchema);
const config: GoogleDrivePickerConfig = schema.google_drive_picker_config;
const uiType = registry.formContext?.uiType;
if (uiType === BlockUIType.INPUT) {
return (
<div className="rounded-3xl border border-gray-200 p-2 pl-4 text-xs text-gray-500 hover:cursor-not-allowed">
Select files when you run the graph
</div>
);
}
return (
<div>
<GoogleDrivePickerInput

View File

@@ -3,7 +3,10 @@ import { CredentialsField } from "./CredentialField/CredentialField";
import { GoogleDrivePickerField } from "./GoogleDrivePickerField/GoogleDrivePickerField";
import { JsonTextField } from "./JsonTextField/JsonTextField";
import { MultiSelectField } from "./MultiSelectField/MultiSelectField";
import { isMultiSelectSchema } from "../utils/schema-utils";
import {
isGoogleDrivePickerSchema,
isMultiSelectSchema,
} from "../utils/schema-utils";
import { TableField } from "./TableField/TableField";
export interface CustomFieldDefinition {
@@ -29,12 +32,7 @@ export const CUSTOM_FIELDS: CustomFieldDefinition[] = [
},
{
id: "custom/google_drive_picker_field",
matcher: (schema: any) => {
return (
"google_drive_picker_config" in schema ||
("format" in schema && schema.format === "google-drive-picker")
);
},
matcher: isGoogleDrivePickerSchema,
component: GoogleDrivePickerField,
},
{

View File

@@ -55,3 +55,38 @@ export function isMultiSelectSchema(schema: RJSFSchema | undefined): boolean {
)
);
}
const isGoogleDriveFileObject = (obj: RJSFSchema): boolean => {
if (obj.type !== "object" || !obj.properties) {
return false;
}
const props = obj.properties;
const hasId = "id" in props;
const hasMimeType = "mimeType" in props || "mime_type" in props;
const hasIconUrl = "iconUrl" in props || "icon_url" in props;
const hasIsFolder = "isFolder" in props || "is_folder" in props;
return hasId && hasMimeType && (hasIconUrl || hasIsFolder);
};
export const isGoogleDrivePickerSchema = (
schema: RJSFSchema | undefined,
): boolean => {
if (!schema) {
return false;
}
// highest priority
if (
"google_drive_picker_config" in schema ||
("format" in schema && schema.format === "google-drive-picker")
) {
return true;
}
// In the Input type block, we do not add the format for the GoogleFile field, so we need to include this extra check.
if (isGoogleDriveFileObject(schema)) {
return true;
}
return false;
};