Improve bit Boilerplate system prompts page (#11316)

[ysmoradi]

closes #11316

Summary by CodeRabbit

• New Features

  • Manage multiple system prompts in a tabbed interface.
  • Edit and preview each prompt individually, with a dedicated Save button per prompt.

• Refactor

  • Backend now delivers a collection of prompts with query support to match the multi-prompt UI.
  • Updated serialization to handle prompt lists for smoother data exchange.

[coderabbitai]

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Important

Review skipped

Auto incremental reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Walkthrough

Refactors single-prompt workflow to a multi-prompt model across client, server, and shared layers: UI now iterates and edits multiple prompts via a pivot; server endpoint exposes a queryable collection; shared interface and JSON context updated to use lists. Save now targets a specific prompt instance.

Changes

Cohort / File(s)	Summary
Client UI: Multi-prompt pivot and per-item save src/.../Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor, src/.../Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor.cs	Replace single editor with BitPivot rendering multiple prompts. Save handler changed to SaveChanges(systemPrompt). Data loading now fetches a list (GetSystemPrompts) and binds per-item editor/viewer.
Server API: Collection endpoint src/.../Server/Boilerplate.Server.Api/Controllers/Chatbot/ChatbotController.cs	Replace GetSystemPrompt(kind) with queryable GetSystemPrompts(). Route changed from HttpGet("{kind}") to HttpGet with [EnableQuery]. Returns IQueryable<SystemPromptDto>.
Shared contract: Interface signature src/.../Shared/Controllers/Chatbot/IChatbotController.cs	Replace single-item GetSystemPrompt(PromptKind, ...) with GetSystemPrompts(CancellationToken) : Task<List<SystemPromptDto>>. Note: route attribute remains [HttpGet("{kind}")] with no parameter in signature.
Serialization context: List support src/.../Shared/Dtos/AppJsonContext.cs	Json source generation updated from SystemPromptDto to List<SystemPromptDto> within the SignalR block.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  actor User
  participant Page as SystemPromptsPage (Client)
  participant ICtrl as IChatbotController (Shared)
  participant API as ChatbotController (Server)
  participant DB as DbContext

  User->>Page: Navigate to System Prompts
  Page->>ICtrl: GetSystemPrompts(cancellationToken)
  ICtrl->>API: HTTP GET /chatbot/systemprompts
  API->>DB: Query SystemPrompts (Project, IQueryable)
  DB-->>API: IQueryable<SystemPromptDto>
  API-->>ICtrl: 200 OK (List/Queryable)
  ICtrl-->>Page: List<SystemPromptDto>
  Page->>Page: Render BitPivot with items

  rect rgb(232,246,255)
  note right of User: Per-item save
  User->>Page: Click Save (prompt X)
  Page->>ICtrl: UpdateSystemPrompt(prompt X)
  ICtrl->>API: HTTP PATCH /chatbot/systemprompts/{id}
  API->>DB: Update prompt X
  DB-->>API: Saved
  API-->>ICtrl: 204/200
  ICtrl-->>Page: Complete
  end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Assessment against linked issues

Objective	Addressed	Explanation
Improve system prompts page (#11316)	❓	Issue lacks explicit acceptance criteria; multiple-prompt UI implemented but specific requirements are not stated.

Poem

I hopped through tabs of prompts today,
A pivot dance in tidy array.
Each save a nibble, crisp and neat—
Queries line up, a carrot treat.
From one to many, swift and bright,
My whiskers twitch: “Ship it tonight!” 🥕

✨ Finishing Touches

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbitai help to get the list of available commands.

Other keywords and placeholders

• Add @coderabbitai ignore or @coderabbit ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

• Visit our Status Page to check the current availability of CodeRabbit.
• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[Copilot]

Pull Request Overview

This PR improves the system prompts page by changing it from displaying a single system prompt to displaying multiple system prompts in a tabbed interface. The changes enable users to view and manage different types of system prompts (like Support, Sales, etc.) within a single page using pivot tabs.

Key changes:

• Modified API to return all system prompts instead of a single prompt by kind
• Updated the UI to display multiple prompts in a BitPivot component with tabs
• Changed the save functionality to work with individual prompts

Reviewed Changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
AppJsonContext.cs	Updated JSON serialization to handle List instead of single SystemPromptDto
IChatbotController.cs	Changed interface method to return all system prompts instead of filtering by kind
ChatbotController.cs	Modified endpoint to return IQueryable for OData support and removed kind filtering
SystemPromptsPage.razor.cs	Updated component logic to handle multiple prompts and modified save method signature
SystemPromptsPage.razor	Added BitPivot UI with tabs for each prompt type and updated save button logic

[coderabbitai]

Actionable comments posted: 5

🧹 Nitpick comments (2)

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor.cs (1)

30-35: Remove null-forgiving and guard Patch against null result.

Minor readability and NRE-safety improvement.

-    private async Task SaveChanges(SystemPromptDto systemPrompt)
+    private async Task SaveChanges(SystemPromptDto systemPrompt)
     {
         if (await AuthManager.TryEnterElevatedAccessMode(CurrentCancellationToken))
         {
-            (await chatbotController.UpdateSystemPrompt(systemPrompt!, CurrentCancellationToken)).Patch(systemPrompt);
+            var updated = await chatbotController.UpdateSystemPrompt(systemPrompt, CurrentCancellationToken);
+            updated?.Patch(systemPrompt);
         }
     }

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor (1)

14-37: Handle empty-state and harden Markdown nullability.

Avoid rendering an empty pivot and coalesce Markdown for the viewer.

-    else if (systemPrompts is not null)
+    else if (systemPrompts is { Count: > 0 })
     {
         <BitPivot>
@@
-                        <BitMarkdownViewer Markdown="@systemPrompt.Markdown" Class="md-viewer" />
+                        <BitMarkdownViewer Markdown="@(systemPrompt.Markdown ?? string.Empty)" Class="md-viewer" />
                     </BitStack>
                 </BitPivotItem>
             }
 
         </BitPivot>
+    }
+    else
+    {
+        <BitMessageBar MessageBarType="BitMessageBarType.Info">
+            @Localizer[nameof(AppStrings.NoSystemPromptsFound)]
+        </BitMessageBar>
     }

Optional: localize Pivot headers instead of PromptKind.ToString() if user-facing.

I can add the AppStrings key and header localization mapping if you want.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Knowledge Base: Disabled due to Reviews > Disable Knowledge Base setting

📥 Commits

Reviewing files that changed from the base of the PR and between b7c7f9b and 489683f.

📒 Files selected for processing (5)

• src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor (1 hunks)
• src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor.cs (3 hunks)
• src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Controllers/Chatbot/ChatbotController.cs (1 hunks)
• src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Controllers/Chatbot/IChatbotController.cs (1 hunks)
• src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Dtos/AppJsonContext.cs (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: build and test

🔇 Additional comments (2)

src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor.cs (2)

11-11: Good shift to a collection-backed state.

---

21-21: Client fetch aligns with new API; looks good.