ui_layers_panels_reports.mjs

/**
## /ui/layers/panels/reports
Exports a function for creating a drawer or just a panel which contains links to custom views.

```JSON
    {
      "report_1":{
        "template": "report_template"
      }
    }
```

Supplying `layer.reports.drawer: false` will return the links a plain dev instead of a drawer

@module /ui/layers/panels/reports
*/

/**
@function reports

@description
Creates a list of `a` elements containing links to custom views.

Specifying `layer.reports.drawer: false` will prevent a drawer from being made for the reports panel.

@param {layer} layer

@property {array} layer.reports The configuration of the reports
@property {boolean} [reports.popout] Whether the drawer can be popped out into a dialog.
@property {string} [reports.classList] The string will be appended to the drawer element classlist.

@returns {HTMLElement} The report element for the panel.
*/
export default function reports(layer) {
  // Create chkbox controls for each dataview entry.
  const reports = [];
  for (const [key, entry] of Object.entries(layer.reports)) {
    if (typeof entry === 'boolean') continue;

    entry.key = key;

    entry.label ??= key;

    entry.layer = layer;

    if (entry.template) {
      entry.report = {
        template: entry.template,
      };
    }

    const el = mapp.ui.elements.reportLink(entry);

    reports.push(el);
  }

  if (layer.reports.dialog) {
    layer.reports.dialog = {
      btn_label: 'Reports',
      title: 'Reports',
      icon: 'summarize',
      ...layer.reports.dialog,
    };
  }

  // Create a drawer with the dataview chkbox controls.
  const drawer = mapp.ui.elements.drawer({
    drawer: layer.reports.drawer,
    class: layer.reports.classList || '',
    data_id: `reports-drawer`,
    header: mapp.utils.html`
      <h3>Reports</h3>`,
    content: mapp.utils.html`${reports}`,
    popout: layer.reports.popout,
    dialog: layer.reports.dialog,
    layer,
  });

  return drawer;
}