diff --git a/docs/en/images/abp-studio-ai-agent.png b/docs/en/images/abp-studio-ai-agent.png new file mode 100644 index 0000000000..d74add4b2d Binary files /dev/null and b/docs/en/images/abp-studio-ai-agent.png differ diff --git a/docs/en/images/react-ui-and-admin-console.png b/docs/en/images/react-ui-and-admin-console.png new file mode 100644 index 0000000000..8b2dbea60b Binary files /dev/null and b/docs/en/images/react-ui-and-admin-console.png differ diff --git a/docs/en/others/free-licenses-vs-pro-licenses.md b/docs/en/others/free-licenses-vs-pro-licenses.md index 96f06eecb1..c6383a6d20 100644 --- a/docs/en/others/free-licenses-vs-pro-licenses.md +++ b/docs/en/others/free-licenses-vs-pro-licenses.md @@ -29,6 +29,8 @@ The following table explains the major differences between the open-source ABP a | [PRO application modules](https://abp.io/modules) | | | | [PRO UI themes](https://abp.io/themes) | | | | [ABP Suite](https://abp.io/tools/suite) | | | +| [React UI](../framework/ui/react/index.md) | | | +| [ABP Studio AI Agent](https://abp.io/studio/ai-agent) | | | | [Premium support](https://abp.io/support) | | | | | [Download](https://abp.io/get-started) | [Pricing](https://abp.io/pricing) | @@ -62,21 +64,22 @@ ABP has many **additional modules** compared to the open-source ABP project. Als | Account | [Basic](https://docs.abp.io/en/abp/latest/Modules/Account) | [PRO](https://abp.io/modules/Volo.Account.Pro) | | Multi-Tenancy | [Basic](https://docs.abp.io/en/abp/latest/Modules/Tenant-Management) *(only tenant management)* | [PRO](https://abp.io/modules/Volo.Saas) (SaaS) | | CMS Kit | [Basic](https://docs.abp.io/en/abp/latest/Modules/Cms-Kit) | [PRO](https://abp.io/modules/Volo.CmsKit.Pro) | -| [Blogging](https://docs.abp.io/en/abp/latest/Modules/Blogging) | | | -| [Docs](https://docs.abp.io/en/abp/latest/Modules/Docs) | | | -| [Identity Server Integration](https://docs.abp.io/en/abp/latest/Modules/IdentityServer) | | | +| [Blogging](https://abp.io/modules/blogging) | | | +| [Docs](../modules/docs.md) | | | +| [Identity Server Integration](../modules/identity-server.md) | | | | [Identity Server Management UI](https://abp.io/modules/Volo.Identityserver.Ui) | | | -| [OpenIddict Integration](https://docs.abp.io/en/abp/latest/Modules/OpenIddict) | | | +| [OpenIddict Integration](../modules/openiddict.md) | | | | [OpenIddictManagement UI](https://abp.io/modules/Volo.OpenIddict.Pro) | | | -| [Audit Log Reporting UI](https://abp.io/modules/Volo.AuditLogging.Ui) | | | -| [Dynamic Language Management](https://abp.io/modules/Volo.LanguageManagement) | | | -| [Payment](https://abp.io/modules/Volo.Payment) | | | -| [Text Template Management](https://abp.io/modules/Volo.TextTemplateManagement) | | | -| [Chat](https://abp.io/modules/Volo.Chat) | | | -| [File Management](https://abp.io/modules/Volo.FileManagement) | | | -| [Forms](https://abp.io/modules/Volo.Forms) | | | -| [Twilio SMS](https://abp.io/modules/Volo.Abp.Sms.Twilio) | | | -| [GDPR](https://docs.abp.io/en/commercial/latest/modules/gdpr) | | | +| [Audit Log Reporting UI](../modules/audit-logging-pro.md) | | | +| [Dynamic Language Management](../modules/language-management.md) | | | +| [Payment](../modules/payment.md) | | | +| [Text Template Management](../modules/text-template-management.md) | | | +| [Chat](../modules/chat.md) | | | +| [File Management](../modules/file-management.md) | | | +| [Forms](../modules/forms.md) | | | +| [Twilio SMS](../modules/twilio-sms.md) | | | +| [GDPR](../modules/gdpr.md) | | | +| [AI Management](../modules/ai-management/index.md) | | | Some modules have "Basic" (open-source) and "PRO" (commercial) versions. The next sections show the differences between the basic and the PRO versions. @@ -153,6 +156,23 @@ A screenshot from the CRUD Page Generator: ABP Suite is a part of the ABP Platform that generates full source code from the backend to the client. ABP Suite is not a free tool for everyone. It is free for only the active ABP license holders. +## React UI and ABP Studio AI Agent + +ABP 10.4 introduces two important license-holder capabilities that are designed for modern, AI-assisted application development: + +| Feature | Open Source ABP Project | ABP | +| ------- | ----------------------- | --- | +| [React UI](../framework/ui/react/index.md) | | | +| [ABP Studio AI Agent](https://abp.io/studio/ai-agent) | | | + +- **[React UI](https://abp.io/community/announcements/react-ui-for-abp-framework-is-finally-here-7rfmgb2v) is available with the modern template system for ABP license holders. You can create a React-based solution with ABP Studio's Modern Wizard or with `abp new --modern --ui-framework react`. A modern React solution contains your own React application under `react/` or `apps/react/`, while ABP's standard administration pages are provided by the [ABP Admin Console](../framework/ui/react/admin-console.md). The Admin Console is delivered by the `Volo.Abp.AdminConsole` NuGet package in layered and single-layer templates, and as a separate `apps/react-admin-console/` application in microservice templates.** + +![React UI & Admin Console](../images/react-ui-and-admin-console.png) + +- **[ABP Studio AI Agent](https://abp.io/community/announcements/introducing-abp-studio-ai-agent-o1ni0toc) is also available for ABP license holders. It works inside ABP Studio to understand ABP solution structure, plan changes, edit code, build projects, run migrations, diagnose runtime errors and keep changes Git-safe. AI Agent usage is based on AI credits: existing customers have predefined AI credits, while new customers receive new AI credits according to the current commercial offering. See the [ABP Studio AI Agent](https://abp.io/studio/ai-agent) page for the latest feature and credit details** + +![ABP Studio AI Agent](../images/abp-studio-ai-agent.png) + ## LeptonX Lite (Basic Theme) vs LeptonX (PRO Theme) ABP provides a theming system that has the following goals: diff --git a/docs/en/suite/create-solution.md b/docs/en/suite/create-solution.md index 39d3fb925e..1ec5a799cd 100644 --- a/docs/en/suite/create-solution.md +++ b/docs/en/suite/create-solution.md @@ -25,4 +25,6 @@ From ABP Suite v8.3, **create a new solution** option has been removed. Instead, it's suggessted to use [ABP Studio](../studio/index.md) or [ABP CLI](../cli/index.md) to create a new solution. After, creating an ABP Solution, then you can generate CRUD pages via ABP Suite as always. +> **Note:** ABP Suite does not generate React UI pages. If you create a modern React solution, use Suite where applicable for backend and application-layer generation, and develop the React UI in the source-owned [React UI](../framework/ui/react/index.md) application. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages more easily. + > ABP Studio has a shortcut for running [ABP Suite](./index.md) to allow using it without starting it externally and using it on a browser, which means you can create, manage, deploy your applications in a single desktop application and also generate CRUD pages via Suite as a pre-integrated application to ABP Studio. \ No newline at end of file diff --git a/docs/en/suite/creating-many-to-many-relationship.md b/docs/en/suite/creating-many-to-many-relationship.md index f711c2a891..005cab9896 100644 --- a/docs/en/suite/creating-many-to-many-relationship.md +++ b/docs/en/suite/creating-many-to-many-relationship.md @@ -75,4 +75,6 @@ Click the **Navigations** tab. Then click the **Add navigation collection** butt The below image is the final page created by ABP Suite. The **new book** dialog has a **Categories** tab which lists all categories of the book and allows add/remove categories. +> **Note:** ABP Suite does not generate React UI for this page. The generated UI applies to Suite-supported UI stacks such as MVC, Blazor and Angular. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages more easily. + ![navigation-collection-books-page](../images/navigation-collection-books-page.8.1.png) diff --git a/docs/en/suite/creating-master-detail-relationship.md b/docs/en/suite/creating-master-detail-relationship.md index b1d8874d5b..94bda1b7fa 100644 --- a/docs/en/suite/creating-master-detail-relationship.md +++ b/docs/en/suite/creating-master-detail-relationship.md @@ -39,6 +39,8 @@ You need to specify the **Entity type** as _Master_ (default). Then, provide the Create a child entity, specify the **Entity type** as _Child_, and associate it with a master entity. In the figure above, you can see an example of, a child entity **OrderLine** with the associated master entity **Order**. When you specify the **Entity type** as _Child_, then the UI and tests will not be generated for the child entity and instead, all of the orchestration of the entity will be delegated to its master entity. +> **Note:** ABP Suite does not generate React UI for master-detail pages. The generated UI applies to Suite-supported UI stacks such as MVC, Blazor and Angular. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages more easily. + Application services will be generated for the child entity, so it's possible for you to consume its endpoints and create-update-list or delete the child entity specifically. Suite also respects your multi-tenancy selection and sets the child entity as a multi-tenant entity, if the master entity has multi-tenancy enabled. > **Note**: Child entities are not a good candidate to establish a many-to-many relationship and therefore that's disabled in the Suite UI. So, you can't create a many-to-many relationship for child entities, but you can create a one-to-many relationship. diff --git a/docs/en/suite/customizing-the-generated-code.md b/docs/en/suite/customizing-the-generated-code.md index e5061ca700..350405ddb0 100644 --- a/docs/en/suite/customizing-the-generated-code.md +++ b/docs/en/suite/customizing-the-generated-code.md @@ -58,6 +58,8 @@ You can see the example below, which demonstrates defining a new method in the ` For the UI side, ABP Suite provides convenient comment placeholders within pages for MVC, Blazor, and Angular UIs. These comment sections serve as hook points where you can add your custom code. By placing your custom logic with these hook points, you can enhance the UI to your needs without the fear of losing your changes during the next CRUD page generation. +> **Note:** ABP Suite does not generate React UI pages or React customization hook points. React UI is part of ABP's modern template system and is customized directly in the source-owned [React UI](../framework/ui/react/index.md) application. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages and customize them more easily. + ### Customizations on MVC UI If you have created your application with MVC UI, you can see the extended classes for _the code-behind classes of your pages_, under the `Pages` folder: diff --git a/docs/en/suite/editing-templates.md b/docs/en/suite/editing-templates.md index 354adc8ead..dd91fee86c 100644 --- a/docs/en/suite/editing-templates.md +++ b/docs/en/suite/editing-templates.md @@ -16,6 +16,8 @@ The are 2 template filters: 1. **UI**: You can switch between `Angular`, `MVC` and `Blazor` templates. 2. **Database provider:** You can switch between `EF Core` and `MongoDb` templates. +> **Note:** ABP Suite does not include React UI templates or generate React client-side code. React UI belongs to the modern template system and should be developed in the source-owned [React UI](../framework/ui/react/index.md) application. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages more easily. + These filters are automatically selected based on your ABP solution. The selected solution is shown on the top right of the page. In the current screenshot it is "Acme.BookStore". ABP Suite templates are embedded resources which are stored in the `Volo.Abp.Commercial.SuiteTemplates` package. When you update your project, Suite templates are also being updated. To be able to generate the correct code for your project, the version of `Volo.Abp.Commercial.SuiteTemplates` must be the same as your Suite version. diff --git a/docs/en/suite/generating-crud-page.md b/docs/en/suite/generating-crud-page.md index 8c605418e8..3325e8c03c 100644 --- a/docs/en/suite/generating-crud-page.md +++ b/docs/en/suite/generating-crud-page.md @@ -108,7 +108,9 @@ To create a new entity, make sure the *-New entity-* is selected in the **Entity * **Update database:** When you add a new migration, ABP Suite can automatically execute update-database command so that the changes are being applied to the database. -* **Create user interface:** Creates pages, modals, components, `JavaScript`, `CSS ` files and adds the new page to the main menu. If you don't have a requirement to manage the entity via user interface, you can uncheck this option. +* **Create user interface:** Creates pages, modals, components, `JavaScript`, `CSS` files and adds the new page to the main menu. If you don't have a requirement to manage the entity via user interface, you can uncheck this option. + + > **Note:** This option does not generate React UI pages. ABP Suite's UI generation targets Suite-supported UI stacks such as MVC, Blazor and Angular. For React-based solutions, build the UI in the source-owned [React UI](../framework/ui/react/index.md) application. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages more easily. * **Excel export**: Creates a button that exports a list of all the data that were added to the entity to an Excel file. diff --git a/docs/en/suite/index.md b/docs/en/suite/index.md index b1c8d43fa7..d24b36af5a 100644 --- a/docs/en/suite/index.md +++ b/docs/en/suite/index.md @@ -21,6 +21,8 @@ ABP Suite is a complementary tool to the ABP Platform. ABP Suite allows you to build web pages in a matter of minutes. +> **Important:** ABP Suite does not generate React UI pages or client-side React code. Its CRUD UI generation is designed for the established Suite-supported UI stacks, such as MVC, Blazor and Angular. The new [React UI](../framework/ui/react/index.md) belongs to ABP's modern template system and is designed for an AI-first, AI-oriented development flow with a modern frontend stack such as React, TypeScript, Vite, TanStack Router, TanStack Query, shadcn/ui, Zod and React Hook Form. In React UI solutions, ABP Suite can still be useful for the backend and application layers where applicable, but the React UI side is expected to be developed in the source-owned React application. ABP license holders can use [ABP Studio AI Agent](https://abp.io/studio/ai-agent) with predefined AI credits to generate React pages and evolve the UI more easily. + It's a .NET Core Global tool that can be installed from the command line. If you are using [ABP Studio](../studio/index.md), you don't even need to install it because it should already be installed, when you first installed the [ABP Studio](../studio/index.md). By using the ABP Suite, you can generate CRUD pages from the database to the front-end and directly get a kickstart for your application. ABP Suite is actively developed and new features are being added version by version according to the roadmap and your feedback.