Add Refactor Project docs and Toolbar enhancements

Author: pinkeshmars

docs/intro/ff-ui/toolbar.md

@@ -265,6 +265,10 @@ _Connect GitHub Repo_, _Download Code_, and _Download APK_ features requires a [
 
 6. **Open in VSCode**: This option lets you open your entire FlutterFlow project in a VS Code environment, offering a richer development experience. You’ll have real-time autocomplete and error detection, easier access to existing Flutter & Dart tooling, and the ability to leverage the AI ecosystem.
 
+7. **Refactor Project**: This option opens your FlutterFlow project in a YAML-based file editor, allowing you to perform bulk edits more efficiently. You can search, edit, and replace values across multiple files—useful for renaming keys, updating data types, or migrating resources to a Library. Check out the [**Refactor Project**](../../resources/projects/refactor-project.md) documentation for more details.
+
+
+
 ## Share project
 
 You can make a project public so that others can view and clone your project. Before you share your project, make sure to remove any sensitive information.

docs/resources/projects/refactor-project.md

@@ -0,0 +1,58 @@
+---
+slug: refactor-project
+title: Refactor Project
+tags: [Refactor]
+keywords: [FlutterFlow, Refactor Project, developer tools, large-scale edits, rename , key reference search, developer menu]
+description: Learn how to refactor your project in FlutterFlow.
+sidebar_position: 7
+---
+
+# Refactor Project
+
+**Refactor Project** is a developer‑focused mode that opens your FlutterFlow project as a set of YAML files so you can perform large-scale edits, such as renaming data types, pages, enums, or components, in a single, consistent operation.
+
+For example, if you want to use a custom data type from a Library and update all references, you don’t have to manually edit each page or component. With Refactor Project, you can update all references in one go using a single refactor pass.
+
+It makes managing large projects easier and more reliable. You can make changes across hundreds of references in just seconds, which saves time and effort compared to manually editing. It also lets you preview changes and dismiss anything you don't want to update.
+
+:::info
+
+You can refactor the project only if you're on a [**paid plan**](https://www.flutterflow.io/pricing).
+
+:::
+
+To refactor a project, go to **Toolbar > Developer Menu > Refactor Project**. You’ll need to commit any unsaved changes before entering the refactor view. This opens your project in a YAML-based editor, where you can search, edit, and replace values across multiple files.
+
+You can also use **key reference** search by toggling the **key** icon—currently supported for data types, enums, pages, and components. Changes are color-coded: added lines appear green, and removed lines appear red. As you make changes, FlutterFlow provides inline YAML validation to help you catch and fix any issues in real time.
+
+When you're done, click **Commit** to save the changes. After that, test your app to make sure all widgets, actions, and bindings still work as expected.
+
+:::tip
+You can exclude any item from the replacement by right-clicking on it and selecting **Dismiss**.
+:::
+
+<div style={{
+    position: 'relative',
+    paddingBottom: 'calc(56.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
+    height: 0,
+    width: '100%'}}>
+    <iframe 
+        src="https://demo.arcade.software/Uy4bDoJSGEIJtm4an8G6?embed&show_copy_link=true"
+        title=""
+        style={{
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            width: '100%',
+            height: '100%',
+            colorScheme: 'light'
+        }}
+        frameborder="0"
+        loading="lazy"
+        webkitAllowFullScreen
+        mozAllowFullScreen
+        allowFullScreen
+        allow="clipboard-write">
+    </iframe>
+</div>
+<p></p>