The attributes passed into the component.
Protected bodyA class name to apply to the body while the route is active.
The root DOM element for the component.
Private isPrivate loadingPage number being loaded. Zero-indexed.
Private moreAre there more users available?
Private numNumber of users to load per page.
Private pageThis page's array of users.
undefined when page loads as no data has been fetched.
Private pageCurrent page number. Zero-indexed.
Private queryProtected scrollWhether we should scroll to the top of the page when its rendered.
Class component state that is persisted between redraws.
Updating this will not automatically trigger a redraw, unlike other frameworks.
This is different to Vnode state, which is always an instance of your class component.
This is undefined by default.
Private throttledProtected useWhether the browser should restore scroll state on refreshes.
Readonly userTotal number of forum users.
Fetched from the active AdminApplication (app), with
data provided by AdminPayload.php, or flarum/statistics
if installed.
Returns a jQuery object for this component's element. If you pass in a selector string, this method will return a jQuery object, using the current element as its buffer.
For example, calling component.$('li') will return a jQuery object
containing all of the li elements inside the DOM element of this
component.
Optional selector: stringa jQuery-compatible selector string
the jQuery object for the DOM node
buildSettingComponent takes a settings object and turns it into a component.
Depending on the type of input, you can set the type to 'bool', 'select', or
any standard type. Any values inside the 'extra' object will be added
to the component as an attribute.
Alternatively, you can pass a callback that will be executed in ExtensionPage's context to include custom JSX elements.
{
* setting: 'acme.checkbox',
* label: app.translator.trans('acme.admin.setting_label'),
* type: 'bool',
* help: app.translator.trans('acme.admin.setting_help'),
* className: 'Setting-item'
* }
{
* setting: 'acme.select',
* label: app.translator.trans('acme.admin.setting_label'),
* type: 'select',
* options: {
* 'option1': 'Option 1 label',
* 'option2': 'Option 2 label',
* },
* default: 'option1',
* }
() => {
return <p>My cool component</p>;
}
Build an item list of columns to show for each user.
Each column in the list should be an object with keys name and content.
name is a string that will be used as the column name.
content is a function with the User model passed as the first and only argument.
See UserListPage.tsx for examples.
A list of extension-defined custom setting components to be available through buildSettingComponent.
The ItemList key represents the value for type to be provided when calling
buildSettingComponent. Other attributes passed are provided
as arguments to the function added to the ItemList.
ItemList priority has no effect here.
extend(AdminPage.prototype, 'customSettingComponents', function (items) {
// You can access the AdminPage instance with `this` to access its `settings` property.
// Prefixing the key with your extension ID is recommended to avoid collisions.
items.add('my-ext.setting-component', (attrs) => {
return (
<div className={attrs.className}>
<label>{attrs.label}</label>
{attrs.help && <p className="helpText">{attrs.help}</p>}
My setting component!
</div>
);
})
})
Private getReturns the Header component for this AdminPage.
Returns the options passed to the AdminHeader component.
Asynchronously fetch the next set of users to be rendered.
Returns an array of Users, plus the raw API payload.
Uses the this.numPerPage as the response limit, and automatically calculates the offset required from pageNumber.
The zero-based page number to load and display
Private setStatic componentConvenience method to attach a component without JSX.
Has the same effect as calling m(THIS_CLASS, attrs, children).
Static initGenerated using TypeDoc v0.24.8
Admin page which displays a paginated list of all users on the forum.