Skip to content

Show 'Add New'/'Duplicate' form in a persistent side panel#783

Open
sven-n wants to merge 3 commits into
masterfrom
admin-panel-improvements
Open

Show 'Add New'/'Duplicate' form in a persistent side panel#783
sven-n wants to merge 3 commits into
masterfrom
admin-panel-improvements

Conversation

@sven-n
Copy link
Copy Markdown
Member

@sven-n sven-n commented May 25, 2026

Summary

  • Replaces the modal dialog used to create ("Add New") or duplicate configuration objects with a collapsible panel docked on the right side of the page. Because the panel lives in MainLayout, it survives page navigation — so a user can look up related data (on other pages) while filling in a new entry, then save. The panel can be collapsed/expanded with arrow buttons.
  • Only one creation can be open at a time; starting another while one is in progress asks to discard the current one.

How it works

  • New circuit-scoped CreationPanelService holds a single active CreationSession (item, type, context, save/cancel delegates) and raises StateChanged/ItemCreated events. CreationPanel.razor (in MainLayout) renders the form for the active session.
  • The form body was extracted from ModalCreateNew into a reusable ItemCreationForm. ModalCreateNew now hosts it, so the remaining modal flows (account/user creation, plugin config) are unchanged.
  • EditConfigGrid create/duplicate transfer their persistence context to the panel (the panel owns and disposes it) and reload the grid via the ItemCreated event.
  • ItemTable's nested "Create" uses the same panel, but page-bound: it reuses the edit page's context and is cancelled when navigating away from that page (its context can't outlive the page).

Notes

  • App.razor now also links the AdminPanel scoped-CSS bundle (_content/MUnique.OpenMU.Web.AdminPanel/...styles.css). The host (Startup.styles.css) only imports the library bundles, not AdminPanel's own scoped CSS, so the panel's styles weren't being delivered without this.
  • Fixed the MonsterDefinition singular type caption from "Monsters" to "Monster" (also improves the edit-page heading).

Test plan

  • Open a config grid (e.g. Monsters), click Add New → form appears in the right panel.
  • Navigate to another page while the form is open → panel and entered data persist.
  • Collapse/expand the panel with the arrow button.
  • Submit → object is saved and the grid refreshes; Cancel discards it.
  • Start a second create while one is open → prompted to discard the first.
  • Duplicate an entry → panel pre-filled from the clone, saves correctly.
  • Nested Create inside an edit form (e.g. a skill on a character) opens in the panel; navigating away cancels it.
  • Existing modal flows (create account/user, plugin config) still work.

🤖 Generated with Claude Code

Replaces the modal dialog shown when creating ("Add New") or duplicating
configuration objects with a collapsible panel docked on the right of the
page. The panel keeps its state across page navigation, so the user can
look up related data while filling in a new entry, and can collapse/expand
it with arrow buttons.

- Add circuit-scoped CreationPanelService holding one active CreationSession
  (asks to discard when another creation is started while one is open).
- Extract the creation form into a reusable ItemCreationForm component;
  ModalCreateNew now hosts it, so account/user/plugin creation stay modal.
- EditConfigGrid create/duplicate hand their context to the panel and reload
  the grid via the ItemCreated event.
- ItemTable nested "Create" uses the same panel (page-bound: cancelled when
  navigating away from the edit page, since it reuses the page's context).
- Link the AdminPanel scoped CSS bundle in App.razor so the panel styles are
  actually delivered to the browser.
- Fix the MonsterDefinition singular caption ("Monsters" -> "Monster").

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@gemini-code-assist
Copy link
Copy Markdown

Summary of Changes

Hello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request improves the user experience for creating and duplicating configuration objects by moving these workflows from transient modal dialogs to a persistent side panel. This change allows users to navigate the application while keeping their input data intact, significantly improving multitasking capabilities. The implementation introduces a centralized service to manage creation sessions and refactors existing form components to support this new UI pattern.

Highlights

  • Persistent Creation Panel: Replaced modal dialogs for 'Add New' and 'Duplicate' actions with a persistent, collapsible side panel in the MainLayout, allowing users to navigate between pages while maintaining their creation progress.
  • CreationPanelService: Introduced a new circuit-scoped service to manage the active creation session, handling state, persistence context, and lifecycle events across the application.
  • Component Refactoring: Extracted the creation form logic into a reusable 'ItemCreationForm' component, simplifying the implementation for both the new side panel and existing modal flows.
  • Bug Fixes: Corrected the 'MonsterDefinition' singular type caption and fixed a CSS delivery issue for the AdminPanel by explicitly linking the scoped stylesheet in App.razor.
New Features

🧠 You can now enable Memory (public preview) to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize the Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counterproductive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Copy Markdown

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a persistent side panel for creating and duplicating items, replacing the previous modal-based workflow. Key changes include the addition of a circuit-scoped CreationPanelService to manage creation sessions across page navigations, a new CreationPanel UI component, and the refactoring of creation logic into a reusable ItemCreationForm. Feedback focuses on ensuring that EditForm validation is properly enforced by using the OnValidSubmit event, improving resource management by wrapping context creation in try-catch blocks for reliable disposal, and correctly awaiting all subscribers of asynchronous events within the service.

Comment thread src/Web/Shared/Components/Form/ItemCreationForm.razor Outdated
Comment thread src/Web/AdminPanel/Pages/EditConfigGrid.razor.cs
Comment thread src/Web/Shared/Services/CreationPanelService.cs
- ItemCreationForm: use EditForm.OnValidSubmit so DataAnnotations validation
  is enforced before submit instead of bypassing it via the button onclick.
- EditConfigGrid.OnCreateButtonClickAsync: wrap context creation in try/catch
  so the context is disposed if an exception occurs before the session starts
  (consistent with OnDuplicateButtonClickAsync).
- CreationPanelService: await every ItemCreated subscriber via the invocation
  list rather than only the last one.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@sven-n
Copy link
Copy Markdown
Member Author

sven-n commented May 25, 2026

/gemini review

Copy link
Copy Markdown

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a persistent side panel for object creation and duplication, replacing the previous modal-based workflow. Key additions include the CreationPanel component, a CreationPanelService for managing creation sessions across page navigations, and the ItemCreationForm for unified form handling. Feedback highlights an opportunity to optimize asynchronous calls in EditConfigGrid by removing unnecessary Task.Run usage. Additionally, several comments point out hardcoded strings in UI components and services that should be moved to resource files to support localization.

Comment thread src/Web/AdminPanel/Pages/EditConfigGrid.razor.cs
Comment thread src/Web/Shared/Services/CreationPanelService.cs Outdated
Comment thread src/Web/Shared/Components/Form/ItemCreationForm.razor Outdated
Comment thread src/Web/Shared/Components/Form/ItemTable.razor.cs Outdated
Comment thread src/Web/AdminPanel/Components/Layout/CreationPanel.razor Outdated
Comment thread src/Web/AdminPanel/Pages/EditConfigGrid.razor.cs Outdated
Addresses the second round of review feedback:
- Move user-facing strings to resource files: the Submit/Cancel buttons and
  the discard-confirmation dialog (Web.Shared), and the creation success
  toast and panel collapse tooltips (AdminPanel).
- ItemTable creation title now uses the localized type caption
  (GetTypeCaption) instead of the raw CLR type name.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant