Skip to content

Commit

Permalink
Merge branch 'develop' into fix/only-register-store-if-not-already-pr…
Browse files Browse the repository at this point in the history
…esent
  • Loading branch information
fabiankaegy authored Aug 28, 2023
2 parents a3c7dbe + d3e0757 commit 2998b40
Show file tree
Hide file tree
Showing 42 changed files with 784 additions and 548 deletions.
53 changes: 53 additions & 0 deletions .github/workflows/release-npm-version.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
name: Publish new version to NPM
on:
workflow_dispatch:
inputs:
release_type:
description: 'Release Type'
required: true
default: 'patch'
type: choice
options:
- patch
- minor
- major
dry_run:
description: 'Dry Run'
required: true
default: 'false'
type: choice
options:
- true
- false
concurrency:
group: ${{ github.head_ref || github.run_id }}
cancel-in-progress: true
jobs:
build_and_release:
environment: production
if: github.ref == 'refs/heads/trunk'
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v3
with:
node-version-file: '.nvmrc'
registry-url: 'https://registry.npmjs.org'

- name: Configure git user name and email
run: |
git config user.name "10up Bot"
git config user.email "[email protected]"
- name: Install all npm packages
run: npm ci

- name: npm update version and release
run: |
npm version ${{ github.event.inputs.release_type }} --git-tag-version=${{ github.event.inputs.dry_run == 'false' }}
npm publish --dry-run=${{ github.event.inputs.dry_run }}
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

- name: push release commit to repo
run: git push
54 changes: 54 additions & 0 deletions .github/workflows/release-testing-npm-version.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
name: Publish new testing version to NPM
on: [pull_request]
concurrency:
group: ${{ github.head_ref || github.run_id }}
cancel-in-progress: true
jobs:
build_and_release:
environment: testing
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version-file: '.nvmrc'
registry-url: 'https://registry.npmjs.org'

- name: Cache node modules
id: cache-npm
uses: actions/cache@v3
env:
cache-name: cache-node-modules
with:
# npm cache files are stored in `~/.npm` on Linux/macOS
path: ~/.npm
key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
restore-keys: |
${{ runner.os }}-build-${{ env.cache-name }}-
${{ runner.os }}-build-
${{ runner.os }}-
- if: ${{ steps.cache-npm.outputs.cache-hit != 'true' }}
name: List the state of node modules
continue-on-error: true
run: npm list

- name: Configure git user name and email
run: |
git config user.name "10up Bot"
git config user.email "[email protected]"
- name: Install all npm packages
run: npm install

- name: npm update version and release
run: |
npm version prerelease --preid=testing-${{ github.event.number}}.${{ github.run_number}}
npm publish --tag testing-${{ github.event.number}}
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

- uses: mshick/add-pr-comment@v2
with:
message: |
:tada: A new testing version of this package has been published to NPM. You can install it with `npm install @10up/block-components@testing-${{ github.event.number}}`
35 changes: 34 additions & 1 deletion CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,15 +27,48 @@ For more on how 10up writes and manages code, check out our [10up Engineering Be
The `develop` branch is the development branch which means it contains the next version to be released. `stable` contains the current latest release and `trunk` contains the corresponding stable development version. Always work on the `develop` branch and open up PRs against `develop`.

## Local Environment

This repository contains a local environment setup using the `@wordpress/env` package. Before you can start that environment you will need to run `npm ci` in both the repository root and `example` directory. This will install the required dependencies.

Next, run `npm run build` in both the root and `example` directories to build and compile the needed assets or if you want to watch for changes instead, use `npm run start`.

Lastly, navigate your terminal to the `example` directory and run `npm run wp-env start` to start the local environment. The environment should be available at [http://localhost:8888](http://localhost:8888) and the credentials to login to the admin are: `admin` `password`.

## Working on a new or existing component

To work on a new or an existing component, after running your Local Environment, you can import the component you need from `@10up/block-components`. You can see how this is currently done in the [/example/src/index.js](https://github.com/10up/block-components/blob/trunk/example/src/index.js#L6) file. If you work on a new component inside the `/components/` folder, make sure to expose it's export in the [index.js](https://github.com/10up/block-components/blob/trunk/index.js) file.

The components in the repository do not store data using useAttributes. This is done in the Gutenberg blocks that include the Block Components of this repository. That isn't to say that the block components are not working with data. An example of that is the [ContentSearch](https://github.com/10up/block-components/blob/develop/components/ContentSearch/index.js) component. When you test out a component in the `example/index.js` file, you ideally want to also store the [block attributes](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-attributes/) there.

After you are ready with your changes, make sure to only commit and push the work from the **components folder**, not the example folder, unless, of course, the ticket is for the example folder.
After you are ready with your changes, make sure to only commit and push the work from the **components folder**, not the example folder, unless, of course, the ticket is for the example folder.

## Release instructions

Releases can get managed entirely via the UI in GitHub. There are various actions in place to make this as seamless as possible.

### Deploying a `@testing` version of a specific PR

Whenever a PR gets created / new changes are pushed to a PR, a GitHub Action runs that will try to deploy a prerelease version tagged with the pr number to NPM.

> **Note**
> This action only runs when it gets approved by a maintainer of the 10up Block Components repository.
### Deploying a `@next` version

Whenever a PR gets merged into the `develop` branch, a GitHub Action runs that will automatically release a new `@next` version of the package.

### Deploying `patch`, `minor`, or `major` versions

Whenever a new `patch`, `minor`, or `major` version of the package should get released, the code first needs to get merged into the `trunk` branch. Once the code is on the `trunk` brach you need to head to the `Actions` tab in the repository and select the [`Publish new version to NPM`](https://github.com/10up/block-components/actions/workflows/release-npm-version.yml) Action in the sidebar.

![GitHub Actions Window](./images/release-action-page.png)

This Action can be manually triggered and allows you to choose what type of release you want to start.

![Release Action Trigger](./images/release-action-trigger.png)

> **Warning**
> This action will only successfully run when `trunk` gets selected as the Branch. For any other branch it will skip all steps.
> **Note**
> This action only runs when it gets approved by a maintainer of the 10up Block Components repository.
4 changes: 2 additions & 2 deletions example/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"build": "wp-scripts build",
"start": "wp-scripts start",
"wp-env": "wp-env",
"start-env": "wp-env start",
"start-env": "wp-env start",
"import-media": "wp-env run tests-cli wp media import /var/www/html/wp-content/plugins/example/images/1920-1080.png"
},
"keywords": [],
Expand All @@ -16,7 +16,7 @@
"devDependencies": {
"@wordpress/env": "^5.8.0",
"@wordpress/eslint-plugin": "^13.7.0",
"@wordpress/scripts": "^25.0.0"
"@wordpress/scripts": "^25.5.1"
},
"dependencies": {
"@10up/block-components": "file:../dist/index.js",
Expand Down
150 changes: 78 additions & 72 deletions example/plugin.php
Original file line number Diff line number Diff line change
Expand Up @@ -14,66 +14,56 @@

namespace HelloWorld;

// Useful global constants.
define( 'EXAMPLE_PLUGIN_TEMPLATE_URL', plugin_dir_url( __FILE__ ) );
define( 'EXAMPLE_PLUGIN_PATH', plugin_dir_path( __FILE__ ) );
define( 'EXAMPLE_PLUGIN_DIST_PATH', EXAMPLE_PLUGIN_PATH . 'build/' );
define( 'EXAMPLE_PLUGIN_DIST_URL', EXAMPLE_PLUGIN_TEMPLATE_URL . '/build/' );
define( 'EXAMPLE_PLUGIN_INC', EXAMPLE_PLUGIN_PATH . 'includes/' );
define( 'EXAMPLE_PLUGIN_BLOCK_DIR', EXAMPLE_PLUGIN_INC . 'blocks/' );
define( 'EXAMPLE_PLUGIN_BLOCK_DIST_DIR', EXAMPLE_PLUGIN_PATH . 'build/blocks/' );

add_action( 'init', __NAMESPACE__ . '\register_block' );
/**
* Register the block
*/
function register_block() {

$dir = dirname( __FILE__ );
$script_asset_path = "$dir/build/index.asset.php";
$index_js = 'build/index.js';
$script_asset = require $script_asset_path;
wp_register_script(
'editor-script',
plugins_url( $index_js, __FILE__ ),
$script_asset['dependencies'],
$script_asset['version'],
false
);
if ( file_exists( EXAMPLE_PLUGIN_BLOCK_DIST_DIR ) ) {
$block_json_files = glob( EXAMPLE_PLUGIN_BLOCK_DIST_DIR . '*/block.json' );
foreach ( $block_json_files as $filename ) {
$block_folder = dirname( $filename );
register_block_type( $block_folder );
};
};
};

register_block_type(
'example/hello-world',
[
'editor_script' => 'editor-script',
]
);
add_action( 'enqueue_block_assets', __NAMESPACE__ . '\enqueue_block_editor_scripts' );

register_block_type(
__DIR__ . '/src/blocks/link-example',
[
'editor_script' => 'editor-script',
'render_callback' => function( $attributes, $content, $block ) {
$title = $attributes['title'];

$link_one_url = isset( $attributes['url'] ) ? $attributes['url'] : '';
$link_one_label = isset( $attributes['text'] ) ? $attributes['text'] : '';

$link_two_url = isset( $attributes['urlTwo'] ) ? $attributes['urlTwo'] : '';
$link_two_label = isset( $attributes['textTwo'] ) ? $attributes['textTwo'] : '';

$wrapper_attributes = get_block_wrapper_attributes();

ob_start();
?>
<div <?php echo wp_kses_post( $wrapper_attributes ); ?>>
<h2><?php echo wp_kses_post( $title ); ?></h2>
<a href="<?php echo esc_url( $link_one_url ); ?>"><?php echo wp_kses_post( $link_one_label ); ?></a>
<a href="<?php echo esc_url( $link_two_url ); ?>"><?php echo wp_kses_post( $link_two_label ); ?></a>
</div>
<?php
return ob_get_clean();
},
]
/**
* Enqueue Block Editor Scripts
*/
function enqueue_block_editor_scripts() {
$asset_file = include EXAMPLE_PLUGIN_DIST_PATH . 'index.asset.php';

wp_enqueue_script(
'example-block-editor-script',
EXAMPLE_PLUGIN_DIST_URL . 'index.js',
$asset_file['dependencies'],
$asset_file['version'],
true
);
};
}

/**
* Register Book Custom Post Type
*/
function register_book_custom_post_type() {
$labels = array(
'name' => __( 'Books', 'tenup' ),
'singular_name' => __( 'Book', 'tenup' ),
'menu_name' => __( 'Books', 'tenup' ),
'view_item' => __( 'View book', 'tenup' ),
'name' => __( 'Books', 'tenup' ),
'singular_name' => __( 'Book', 'tenup' ),
'menu_name' => __( 'Books', 'tenup' ),
'view_item' => __( 'View book', 'tenup' ),
);

$args = [
Expand All @@ -96,32 +86,48 @@ function register_book_custom_post_type() {
'capability_type' => 'post',
'show_in_rest' => true,
];

register_post_type( 'books', $args );

register_post_meta( 'books', 'author', [
'type' => 'string',
'single' => true,
'show_in_rest' => true,
] );

register_post_meta( 'books', 'isbn', [
'type' => 'string',
'single' => true,
'show_in_rest' => true,
] );

register_post_meta( 'books', 'price', [
'type' => 'number',
'single' => true,
'show_in_rest' => true,
] );

register_post_meta( 'books', 'is_featured', [
'type' => 'boolean',
'single' => true,
'show_in_rest' => true,
] );
register_post_meta(
'books',
'author',
[
'type' => 'string',
'single' => true,
'show_in_rest' => true,
]
);

register_post_meta(
'books',
'isbn',
[
'type' => 'string',
'single' => true,
'show_in_rest' => true,
]
);

register_post_meta(
'books',
'price',
[
'type' => 'number',
'single' => true,
'show_in_rest' => true,
]
);

register_post_meta(
'books',
'is_featured',
[
'type' => 'boolean',
'single' => true,
'show_in_rest' => true,
]
);
}

add_action( 'init', __NAMESPACE__ . '\register_book_custom_post_type' );
Expand Down
16 changes: 16 additions & 0 deletions example/src/blocks/content-item/block.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
{
"apiVersion": 2,
"name": "example/content-item",
"title": "Content Item",
"icon": "smiley",
"category": "common",
"example": {},
"supports": {
"html": false
},
"attributes": {},
"variations": [],
"usesContext": ["postId", "postType", "queryId"],
"ancestor": ["core/post-template"],
"editorScript": "file:./index.js"
}
Loading

0 comments on commit 2998b40

Please sign in to comment.