Class ExtensionPage<Attrs>

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.

Returns

the jQuery object for the DOM node

Final

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.

Example

{
   *    setting: 'acme.checkbox',
   *    label: app.translator.trans('acme.admin.setting_label'),
   *    type: 'bool',
   *    help: app.translator.trans('acme.admin.setting_help'),
   *    className: 'Setting-item'
   * }

Example

{
   *    setting: 'acme.select',
   *    label: app.translator.trans('acme.admin.setting_label'),
   *    type: 'select',
   *    options: {
   *      'option1': 'Option 1 label',
   *      'option2': 'Option 2 label',
   *    },
   *    default: 'option1',
   * }

Example

() => {
  return <p>My cool component</p>;
}

A list of extension-defined custom setting components to be available through AdminPage.buildSettingComponent.

The ItemList key represents the value for type to be provided when calling AdminPage.buildSettingComponent. Other attributes passed are provided as arguments to the function added to the ItemList.

ItemList priority has no effect here.

Example

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 class="helpText">{attrs.help}</p>}

        My setting component!
      </div>
    );
  })
})

Returns a map of settings keys to values which includes only those which have been modified but not yet saved.

Returns the options passed to the AdminHeader component.

Returns the number of settings that have been modified.

Inherit Doc

Inherit Doc

Inherit Doc

Inherit Doc

Called when saveSettings completes successfully.

Inherit Doc

Saves the modified settings to the database.

Returns a function that fetches the setting from the app global.

Returns the submit button for this AdminPage.

Calls this.saveSettings when the button is clicked.

Convenience method to attach a component without JSX. Has the same effect as calling m(THIS_CLASS, attrs, children).

See

https://mithril.js.org/hyperscript.html#mselector,-attributes,-children

Initialize the component's attrs.

This can be used to assign default values for missing, optional attrs.