Difference between revisions of "Editing Admin Pages"

From SocialStack
(Created page with "The administration panel in SocialStack is just a set of pages as well meaning they are editable in the same way as your frontend. These pages are automatica...")
 
Line 1: Line 1:
The administration panel in SocialStack is just a set of pages as well meaning they are editable in [[Editing pages|the same way as your frontend]]. These pages are automatically generated by the modules in your project through the InstallAdminPages call which is provided by default and commented out in the *Service.cs file by the [[Generate|generate command]]. However, there are occasionally times when you're creating a reusable module where you would like your module to manipulate the administration panel page automatically, such as extend it or entirely replace it with something custom. There are a few ways you can do this.
The administration panel in SocialStack is just a set of pages as well meaning they are editable in [[Editing pages|the same way as your frontend]]. These pages are automatically generated by the modules in your project through the InstallAdminPages call which is provided by default and commented out in the *Service.cs file by the [[Generate|generate command]]. However, there are occasionally times when you're creating a reusable module where you would like your module to manipulate the administration panel page automatically, such as extend it or entirely replace it with something custom. There are a few ways you can do this.


# Installing some other page
= Installing some other page =


You can leave the default InstallAdminPages commented out and instead create pages directly. This is done via calling Install on the PageService, typically in the Events.Service.AfterStart event handler. For the page to be treated as part of the admin panel, all it needs is a URL that starts with /en-admin/ - aside from that its content is whatever you need it to be.
You can leave the default InstallAdminPages commented out and instead create pages directly. This is done via calling Install on the PageService, typically in the Events.Service.AfterStart event handler. For the page to be treated as part of the admin panel, all it needs is a URL that starts with /en-admin/ - aside from that its content is whatever you need it to be.


# Injecting JSON into the default page
= Injecting JSON into the default page =


Alternatively you can manipulate the JSON of the default admin panel pages. This is how, for example, the password reset module injects a "generate link" tile onto the user edit page. In order to allow multiple extensions to manipulate the same page (and again the user edit page is likely to be popular for this kind of extension), the API represents the about-to-be-created page with an in memory structure of the JSON which you can manipulate as needed. That manipulation is done by the Events.Page.BeforeAdminPageInstall event.
Alternatively you can manipulate the JSON of the default admin panel pages. This is how, for example, the password reset module injects a "generate link" tile onto the user edit page. In order to allow multiple extensions to manipulate the same page (and again the user edit page is likely to be popular for this kind of extension), the API represents the about-to-be-created page with an in memory structure of the JSON which you can manipulate as needed. That manipulation is done by the Events.Page.BeforeAdminPageInstall event.

Revision as of 00:26, 11 August 2022

The administration panel in SocialStack is just a set of pages as well meaning they are editable in the same way as your frontend. These pages are automatically generated by the modules in your project through the InstallAdminPages call which is provided by default and commented out in the *Service.cs file by the generate command. However, there are occasionally times when you're creating a reusable module where you would like your module to manipulate the administration panel page automatically, such as extend it or entirely replace it with something custom. There are a few ways you can do this.

Installing some other page

You can leave the default InstallAdminPages commented out and instead create pages directly. This is done via calling Install on the PageService, typically in the Events.Service.AfterStart event handler. For the page to be treated as part of the admin panel, all it needs is a URL that starts with /en-admin/ - aside from that its content is whatever you need it to be.

Injecting JSON into the default page

Alternatively you can manipulate the JSON of the default admin panel pages. This is how, for example, the password reset module injects a "generate link" tile onto the user edit page. In order to allow multiple extensions to manipulate the same page (and again the user edit page is likely to be popular for this kind of extension), the API represents the about-to-be-created page with an in memory structure of the JSON which you can manipulate as needed. That manipulation is done by the Events.Page.BeforeAdminPageInstall event.

Events.Page.BeforeAdminPageInstall.AddEventListener((Context context, Pages.Page page, CanvasRenderer.CanvasNode canvas, Type contentType, AdminPageType pageType) =>
{
		if (contentType == typeof(User) && pageType == AdminPageType.Single)
		{
			// Installing user admin page for a particular user.
			// Add the reset box into the user admin page (as a child of the autoform):
			var tile = new CanvasNode("Admin/Tile");
			tile.AppendChild(new CanvasNode("Admin/PasswordResetButton").With("userId", new {
					name = "user.id",
					type = "urlToken"
			}));
					
			canvas.AppendChild(
				tile
			);
		}

		return new ValueTask<Pages.Page>(page);
});

You could of course just straight swap the whole JSON with something else but doing so would be unfriendly towards other extensions so do try to keep others in mind by generally keeping a consistent structure.