sections: plugin_hooks:plugin-actions
This data as json
| id | page | ref | title | content | breadcrumbs | references |
|---|---|---|---|---|---|---|
| plugin_hooks:plugin-actions | plugin_hooks | plugin-actions | Action hooks | Action hooks can be used to add items to the action menus that appear at the top of different pages within Datasette. Unlike menu_links() , actions which are displayed on every page, actions should only be relevant to the page the user is currently viewing. Each of these hooks should return a list of menu items, with optional "description": "..." keys describing each action in more detail. The most common action item is a link to another page: { "href": datasette.urls.path("/-/custom-action"), "label": "Custom action", "description": "Run this action on a separate page.", } Plugins can also return button actions for JavaScript-backed interactions: { "type": "button", "label": "Open custom dialog", "description": "Show a dialog without leaving this page.", "attrs": { "aria-label": "Open custom dialog", "data-plugin-action": "open-custom-dialog", }, } These are rendered as <button type="button" class="button-as-link action-menu-button" role="menuitem" tabindex="-1"> . The optional attrs dictionary is added to the button, and is useful for data-* attributes that your plugin's JavaScript can use to attach event handlers. Here is a minimal plugin example that adds a button to a table page and loads JavaScript to handle clicks on that button: from datasette import hookimpl @hookimpl def table_actions(datasette, database, table): return [ { "type": "button", "label": "Show table name", "description": "Open a JavaScript-powered plugin action.", "attrs": { "aria-label": "Show table name", "data-plugin-action": "show-table-name", "data-database": database, "data-table": table, }, } ] @hookimpl def extra_js_urls(datasette): return [ datasette.static( "show-table.js", plugin="datasette_show_table" ) ] The static/show-table.js file in that plugin could look like this: document.addEventListener("click", (event) => { const button = event.target.closest( "button[data-plugin-action='show-table-name']" ); if (!button) { return; } alert(`${button.dataset.database}.${button.dataset.table}`); }); They can alternatively return an async def awaitable function which, when called, returns a list of those menu items. | ["Plugin hooks"] | [] |