dreamsicle-io / wp-backstage Goto Github PK

Add support for the ability to set a term from a dropdown.

When set on post types, there should be an argument to actually attach the taxonomy, and retrieve the terms for that post when populating the value.

When setting on other terms, ensure that the filtering and sorting logic does not affect them. Something to look out for is whether the query comes before the actual get_terms call for the page. WP Backstage adds actions to the first get terms and get terms (count) queries to be able to target the list table calls, without affecting the others. If the filters are called first, this will mess things up, so make sure to check that this isn't the case.

Make a composer script to lint php and get the code inline with wp coding standards.

https://github.com/squizlabs/PHP_CodeSniffer
https://github.com/WordPress/WordPress-Coding-Standards
https://github.com/PHPCSStandards/composer-installer

Get some automatic formatting on save working with vscode and phpcbf

The API documentation generated by PHPDoc does not help new users get started. To support this, user facing documentation needs to be written showing how to manage the plugin's settings.

• Remove classic editor plugin dependency.
• Move post type edit nonce to "edit_form_after_title" because it fires on the block editor.
• refresh fields on block editor load event in post type script.
• add classes for Gutenbergish styling.

Right now, we init on after_setup_theme at priority 0.

Do something like:

function register_init_hook() {
	do_action( 'wp_backstage_init' );
}

add_action( 'after_setup_theme', 'register_init_hook', 0 );

Right now, the fields are filtered right before they are output in the forms, this means they also need to be filtered when saved, when columns are created, when sanitized, etc. A better way to do this so developers can alter field configs outside of the config methods reliably is to filter them when the fields are retrieved, because fields are always retrieved using the get_fields() methods.

• Register fields and schemas with the API.
• Add "show_in_rest" arg to field.
• Add "_links" and "_embed" support to fields.
• Add "rest_description" arg to fields.

Fields with label focus issues:

• media
• editor

Current Behavior

WP Backstage adds a thumbnail column to custom post type columns. This should be removed if the supports key does not include the thumbnail value.

Expected Behavior

WP Backstage should not add a thumbnail column to custom post type columns if the supports key does not include the thumbnail value.

WP_Backstage.php

• 364: uplaoder
• 467: Inlines the editor field style.
• 1027: Inline Datepicker Script

WP_Backstage_Component.php

• 839: Conditionally enqueue required scripts and styles...

WP_Backstage_Widget.php

• doc all methods.

All

• doc all filters

Add BEM style class names to all elements and move all default styles to inline injected CSS (similar to approach for JavaScript).

Note: Currently WP Backstage adds no network requests, don't change that.

When a select value isn't found while formatting column value for select field, WP Debug shows warning. This can happen when the select field is being populated by a get_posts() call, but the saved value references a deleted post, for example.

Relevant stack trace entries to look at:

Notice: Undefined offset: {number} in ...\wp-content\plugins\wp-backstage\includes\class-wp-backstage-component.php on line 1345

WP_Backstage_Post_Type->format_field_value( ) | ...\class-wp-backstage-post-type.php:800

These are using sprintf templates but dont need to be.

Fix "strint" typos

1. WP_Backstage_Component::get_media_uploader_label()
2. WP_Backsage_Post_Type::get_label()
3. WP_Backstage_Taxonomy::get_label()

WP_Backstage.php

• 364: uplaoder
• 467: Inlines the editor field style.
• 1027: Inline Datepicker Script

WP_Backstage_Component.php

• 839: Conditionally enqueue required scripts and styles...

WP_Backstage_Widget.php

• doc all methods.

All

• doc all filters

In the current implementation of the WordPress post updated messages, the post type labels are not used and must be filtered seperately.

Many of the strings, however, are implemetednin the post type labels, use them where appropriate to avoid unnecessary bloat in the translation file.

• ensure translator comments are on all sprintf templates.

• ensure escaping is done properly.

The wiki is currently missing documentation for the plural name arg.

To be able to debug REST API better, add a section on the help tab that shows rest api response.

On single post pages show the post being fetched.

On collection pages show a collection.

Etc.

Maybe worth adding some controls to be able to interact with the API to test various scenarios, search, filtering, etc.

Right now the hooks for fields are dynamic, but they only take into account the components slug, not the type. If there is a post type called "example" and a taxonomy called "example, these filters will apply to both currently.

All attachment fields now use arrays, make sure handle_attachments method is functioning properly even if singular.

The sorting hook needs to come after the filter hook, as this is the one that takes into account whether there is a meta query set or not.

API changes

Code Field

• arg for mime type is now "language" and accepts php, html, css, javascript, and json.

Date field

• arg for format removed, to ensure sort/filter behavior, this should always be ISO formatted.

Options component

• show_in_rest arg is removed and is now set per field.

Field Args

• show_label arg is removed.
• disabled arg is removed.

Tests

• tests are now included via a filter, not theme support.

The color field display is having "display:block" stripped from <i> elements in the inline CSS on admin columns since WP 6.0

Fix "agyer" typo to "after".

Add a composer task to extract translations and build *.pot file with WP CLI's i18n tools.

composer.json

This configures composer to require wp-cli/i18n-command dependency, and adds tasks to the composer scripts. Note that these scripts should be added to what already exists in the plugin's composer scripts.

"require-dev": {
	"wp-cli/i18n-command": "2.3.0"
},
"scripts": {
	"post-install-cmd": "composer run update-hooks",
	"post-update-cmd": "composer run update-hooks",
	"build": "composer run build-pot",
	"build-pot": "wp i18n make-pot . languages/wp-backstage.pot",
	"update-hooks": ["composer run remove-hooks", "composer run add-hooks"],
	"add-hooks": "cp -v -f pre-commit .git/hooks/pre-commit",
	"remove-hooks": "find .git/hooks/* ! -name *.sample -delete -print"
}

Note: This assumes a pre-commit file is in the root of the project.

pre-commit

This file will be copied to the .git/hooks directory on composer's post-install and post-update lifecycles, or when manually running composer run update-hooks. This file will hook into the git's pre-commit lifecycle, and will build and add the file to the commit automatically.

#!/bin/sh

composer run build
git add languages/wp-backstage.pot

Currently the media uploader does not show video previews, audio previews, etc.

Installation

This plugin is not hosted on the WordPress plugin directory, so it will have to be installed as a zip file through the WordPress admin dashboard under the plugins tab.

Get the latest version of the zip file

1. Visit the plugin's GitHub repository.
2. Find the latest release.
3. Download the artifact labeled wp-backstage.zip.

Install through the WordPress admin dashboard

1. From the sidebar navigation, Visit Plugins → Add New.
2. Click the Upload Plugin button to expose the file uploader.
3. Click Choose File to open the operating system's file browser.
4. Find and select the wp-backstage.zip file that was downloaded earlier.
5. Click Install now
6. The resulting page will behave differently depending on whether the plugin is being updated, or installed for the first time.
   • Install: Upon successful upload, click Activate Plugin to activate the plugin.
   • Update: Upon successful upload, click Replace current with updated. Then, upon successful update, click Activate Plugin if the plugin is not already active.

Serialized fields:

• checkbox_group

Boolean fields:

• checkbox

Date/Time fields?

• Similar to post date filters, ie: August 2022, September 2022, October 2022, etc. If this route is taken, the filter should be populated by only those dates that apply to the current set of posts.

When saving nav menu items OR Widgets in the customizer, the wp editor is either not saving or not populating its value correctly.

Change not triggering.

Move setup code from global jquery event to the actual tinymce.setup config key so that it fires on every init. This is both more reliable and cleaner.

The selects and colon seps should all be inline. Currently in some scenarios the colons are dropping underneath the selects.

Issue appears on Add User form.

Notice: Trying to get property 'ID' of non-object in ...\wp-backstage\includes\class-wp-backstage-user.php on line 305

Add an argument for select fields that will allow for setting a string for the "none" option. Also add a default arg for this.

There is a caveat when working with WP Backstage Nav Menu Items in the WordPress Customizer. Since WordPress doesn't publish newly added menu items added in the Customizer until the changes are published, previewing of custom meta fields that may or may not be used in the actual output of the menu item will not be previewable. The Customizer assigns a negative post ID (placeholder), and does not save the menu item as a post in the DB until the customizer changes are published, meaning there is no way to get the post meta for this non-existing post. We will continue to investigate ways to get around this, but at this time there simply is none. In the mean time, previewing works great for custom meta on menu items that do already exist in the DB.

This ticket will be used to track findings on this issue.

Inorder to inadvertently cause side effects (which I don't believe there would be anyway, this really would be best practice), only apply this on pages rendered by WP Backtage.

CSS that fixes the issue:

.form-table {
    table-layout: fixed;
    max-width: 100%;
}

Drag drop should be disabled on mobile and not respond to touch in general. Arrows should be added for accessible moving of media elements. When drag drop is disabled.

Another side effect of this is that the remove button is not tapable currently.

Labels to add:

The following labels are not currently rendered by WP Backstage.

'item_published' => string '{SINGULAR} published.'
'item_published_privately' => string '{SINGULAR} published privately.'
'item_reverted_to_draft' => string '{SINGULAR} reverted to draft.'
'item_scheduled' => string '{SINGULAR} scheduled.'
'item_updated' => string '{SINGULAR} updated.'
'item_link' => string '{SINGULAR} Link'
'item_link_description' => string 'A link to a {SINGULAR}.'

Labels to fix:

The following labels must be fixed.

'not_found_in_trash' => string 'Not {PLURAL} found in Trash'

This should have all of the methods needed to construct a new field in a more normalized way, and will allow us to get methods out of WP_Backstage and WP_Backstage_Component classes into a more appropriate place. This will also pave the way for extensions and extra fields to be added in a normalized way.

See: https://github.com/dreamsicle-io/wp-backstage/wiki/Development#developing-fields

The interface should have a signature similar to this:

class WP_Backstage_field {

    public $type = 'text';
    public $default_args = array();
    public $is_non_regular_text = false;
    public $is_remove_label_for = false;
    public $is_textarea_control = false;

    public function __construct() {}

    public function init() {}

    public function render() {}

    public function sanitize() {}

    public function format_value() {}

    public function format_column_value() {}

    public function inline_style() {}

    public function inline_script() {}

}

Currently if the value is an array it plucks only the first item, it also has strange behavior intermittently, and needs to be hooked much later.

Add a component for adding custom dashboard widgets with controls using WP Backstage's fields.

nav-menus.php?action=locations:2089 Uncaught TypeError: Cannot read properties of null (reading 'querySelectorAll')

The issue lies here:

function getInitialItems() {
	const itemList = document.getElementById('menu-to-edit');
	const items = itemList.querySelectorAll('.menu-item'); // Item list does not exist on the "Manage Locations" section!
	return Array.from(items);
}

May not be a WP Backstage issue, but documenting here anyway. Hard to pinpoint the issue as it doesn't happen with much consistency, further investigation needed.

Issue may happen when:

• The widget is the first of a widget area.
• The widget area is not displayed when the customizer is loaded.

See: https://developer.wordpress.org/block-editor/how-to-guides/widgets/legacy-widget-block/

Clicking the format select does nothing.

The issue stems from phpcs WordPress.WP.CapitalPDangit.Misspelled sniff doing things it shouldn't. TinyMCE has a plugin called "wordpress" that this sniff with phpcbf is converting to WordPress and causing issues.

Just remove that sniff entirely it is ridiculous.

Currently wordpress outputs no help tabs on custom post types and taxonomies.

Normalize help tabs accross custom post types and taxonomies by creating autogenerating "duplicates" of existing tabs.

• Add a method to be able to get a parsed field value, by wrapping get_{component}_meta().
• Add a method to be able to get a field's configuration from outside of the class.
• This will require either setting the component instances as global, OR setting just the component instance fields as global when they are initialized.

Explorations:

get_field( $component_type, $component_slug, $field_name );

get_field_value( $component_type, $component_slug, $field_name, $object_id );

get_fields( $component_type, $component_slug );

Widget icons in the customizer are purely CSS based. They provide the unicode character for dashicons on .widget-title::before. Add a config key that will allow for adding an inline style to set this on the customizer panel.

Below is the CSS that is used to set the widget icon in the available-widgets section of the customizer:

#available-widgets [class*=text] .widget-title:before {
    content: "\f478";
}

Currently WP Backstage renders field labels and descriptions inside the field HTML. This means that they cannot be rendered differently on different screens. Instead, labels and fields should be output above and below the field render methods instead, to be able to have different markup/classes per screen, and better conform to varying styles accross WP admin screens.

#: includes/class-wp-backstage-component.php:1627msgid "All Users"msgstr ""

#: includes/class-wp-backstage-component.php:1643
msgid "All options"
msgstr ""

#. translators: 1:required arg key.
#: includes/class-wp-backstage-nav-menu-item.php:103
msgctxt "nav menu item - required arg error"
msgid "[nav_menu_item] The %1$s key is required."
msgstr ""

#. translators: 1: post type slug.
#: includes/class-wp-backstage-options.php:164
msgctxt "options - required slug error"
msgid "[options: %1$s] A slug is required when adding a new options page."
msgstr ""

#. translators: 1: post type singular nam.
#: includes/class-wp-backstage-post-type.php:452
msgctxt "post bulk updated message - untrashed singular"
msgid "1 %1$s restored from the Trash."
msgstr ""

#. translators: 1: taxonomy singular name.
#. translators: 1: taxonomy plural name.
#: includes/class-wp-backstage-taxonomy.php:347
#: includes/class-wp-backstage-taxonomy.php:367
msgctxt "term updated messages - deleted"
msgid "%1$s deleted."
msgstr ""

Since the form for adding terms submits via JS the HTML validation is not preventing submission on the form.

Investigation findings:

• The form has a "validate" class on it, investigate what this is triggering and how it works.
• The form submits via JS, then returns an admin error notice when the name is left blank for example.