Merge 0eabeb5 into 512f890

.dev-lib

@@ -23,6 +23,12 @@ function run_tests {
 		npm run lint
 
 		echo ""
+	fi
+}
+
+function run_after_tests {
+	if [ "$TRAVIS" != true ]; then
+		echo ""
 		echo "## JavaScript tests"
 		npm run test:js
 

.env.dist

@@ -10,9 +10,9 @@ MYSQL_USER=wordpress
 MYSQL_PASSWORD=wordpress
 
 # WordPress
-WP_VERSION=5.3.2
+WP_VERSION=5.4.1
 WP_DB_USER=wordpress
 WP_DB_PASSWORD=wordpress
 
 # PHP
-PHP_VERSION=php7.4-apache
+PHP_VERSION=php7.4-apache

.eslintignore

@@ -4,6 +4,4 @@
 **/vendor/**
 **/assets/js/*.js
 build/*
-js/dist/*
 data/*
-built/*

.travis.yml

@@ -65,7 +65,7 @@ jobs:
       script:
         - source "$DEV_LIB_PATH/travis.script.sh"
         - npm run lint
-      
+
     - stage: unit-test
       name: PHP unit tests (7.4, WordPress latest, with code coverage)
       php: "7.4"
@@ -117,7 +117,7 @@ jobs:
       script:
         - npm run build:js
         - npm run test:js
-        -
+
     - stage: e2e-test
       name: E2E tests with Docker (7.4, WordPress latest)
       php: "7.4"

Gruntfile.js

@@ -33,12 +33,14 @@ module.exports = function( grunt ) {
 					'!package-lock.json',
 					'!phpcs.xml',
 					'!phpunit.xml',
+					'!postcss.config.js',
 					'!readme.md',
 					'!renovate.json',
 					'!scripts/**',
 					'!tests/**',
 					'!vendor/**',
 					'!webpack.config.js',
+					'!wp-assets/**',
 				],
 				dest: 'build',
 				expand: true,

assets/src/media-selector/collections/images_collection.js → assets/src/media-selector/collections/images-collection.js

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import ImagesQueryModel from '../models/images_query_model';
+import ImagesQueryModel from '../models/images-query-model';
 
 const ImagesCollection = wp.media.model.Attachments.extend( {
 	/**
@@ -18,6 +18,7 @@ const ImagesCollection = wp.media.model.Attachments.extend( {
 			this.mirror( ImagesQueryModel.get( props ) );
 		}
 	},
+
 	/**
 	 * Get value of respSuccess from mirrored object.
 	 *
@@ -26,6 +27,7 @@ const ImagesCollection = wp.media.model.Attachments.extend( {
 	respSuccess() {
 		return this.mirroring ? this.mirroring.respSuccess() : true;
 	},
+
 	/**
 	 * Get value of respErrorMessage from mirrored object.
 	 *

assets/src/media-selector/components/MediaUploadWithUnsplashState.js → assets/src/media-selector/components/unsplash-media-upload.js

@@ -6,7 +6,7 @@ import { MediaUpload } from '@wordpress/media-utils';
 /**
  * Internal dependencies
  */
-import UnsplashState from '../store/unsplash_state';
+import UnsplashState from '../store/unsplash-state';
 
 /**
  * Copied from Gutenberg and adapted to initialize the Unsplash state.
@@ -93,7 +93,7 @@ const getAttachmentsCollection = ids => {
 	} );
 };
 
-class MediaUploadWithUnsplashState extends MediaUpload {
+class UnsplashMediaUpload extends MediaUpload {
 	/**
 	 * Initializes the Media Library requirements for the featured image flow.
 	 *
@@ -116,4 +116,4 @@ class MediaUploadWithUnsplashState extends MediaUpload {
 	}
 }
 
-export default MediaUploadWithUnsplashState;
+export default UnsplashMediaUpload;

assets/src/media-selector/featured-image-selector.js

@@ -6,7 +6,7 @@ import { addFilter } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
-import MediaUploadWithUnsplashState from './components/MediaUploadWithUnsplashState.js';
+import UnsplashMediaUpload from './components/unsplash-media-upload.js';
 
 /**
  * We can't override the featured image media frame Gutenberg by extending Backbone views, meaning we can't initialize
@@ -16,5 +16,5 @@ import MediaUploadWithUnsplashState from './components/MediaUploadWithUnsplashSt
 addFilter(
 	'editor.MediaUpload',
 	'unsplash/extend-featured-image',
-	() => MediaUploadWithUnsplashState
+	() => UnsplashMediaUpload
 );

assets/src/media-selector/helpers/importImages.js → assets/src/media-selector/helpers/import-images.js

@@ -6,9 +6,9 @@ import { addQueryArgs } from '@wordpress/url';
 /**
  * Internal dependencies
  */
-import isUnsplashImage from './isUnsplashImage';
-import getConfig from './getConfig';
-import preloadImage from './preloadImage';
+import isUnsplashImage from './is-unsplash-image';
+import getConfig from './get-config';
+import preloadImage from './preload-image';
 
 /**
  * Import selected Unsplash images.

assets/src/media-selector/helpers/preloadImage.js → assets/src/media-selector/helpers/preload-image.js

@@ -4,7 +4,7 @@
  * @param {string} src Image source.
  * @return {Promise} Image object.
  */
-const preloadImage = src => {
+export default src => {
 	return new Promise( ( resolve, reject ) => {
 		const image = new window.Image();
 		image.onload = () => resolve( image );
@@ -13,5 +13,3 @@ const preloadImage = src => {
 		image.src = src;
 	} );
 };
-
-export default preloadImage;

assets/src/media-selector/helpers/unsetUnsplashLibrary.js → assets/src/media-selector/helpers/unset-unsplash-library.js

@@ -1,3 +1,9 @@
+/**
+ * Preload image using a promise.
+ *
+ * @param {wp.media.controller} Controller Image source.
+ * @return {Promise} Image object.
+ */
 export default Controller => {
 	return Controller.extend( {
 		saveContentMode() {
@@ -8,6 +14,7 @@ export default Controller => {
 			const mode = this.frame.content.mode(),
 				view = this.frame.router.get();
 
+			// @todo Why are we doing this, should we set Unsplash as the default if no mode is set?
 			// Prevent persisting Unsplash as the default media tab for the user.
 			if ( 'unsplash' !== mode && view && view.get( mode ) ) {
 				window.setUserSetting( 'libraryContent', mode );

assets/src/media-selector/helpers/withUnsplashTab.js → assets/src/media-selector/helpers/with-unsplash-tab.js

@@ -1,9 +1,12 @@
-import UnsplashState from '../store/unsplash_state';
-import ImagesBrowser from '../views/images_browser';
-import ImageView from '../views/image_view';
+/**
+ * Internal dependencies
+ */
+import UnsplashState from '../store/unsplash-state';
+import ImagesBrowser from '../views/images-browser';
+import ImageView from '../views/image-view';
 import Toolbar from '../views/toolbar';
-import ToolbarSelect from '../views/toolbar_select';
-import getConfig from './getConfig';
+import ToolbarSelect from '../views/toolbar-select';
+import getConfig from './get-config';
 
 export default View => {
 	return View.extend( {

assets/src/media-selector/index.js

@@ -2,9 +2,9 @@
  * Internal dependencies
  */
 import './style.css';
-import withUnsplashTab from './helpers/withUnsplashTab';
-import unsetUnsplashLibrary from './helpers/unsetUnsplashLibrary';
-import PostFrame from './views/post_frame';
+import withUnsplashTab from './helpers/with-unsplash-tab';
+import unsetUnsplashLibrary from './helpers/unset-unsplash-library';
+import PostFrame from './views/post-frame';
 
 // Override media frames in the respective editors to add the Unsplash tab.
 if ( wp.media && wp.media.view && wp.media.view.MediaFrame ) {

assets/src/media-selector/models/images_query_model.js → assets/src/media-selector/models/images-query-model.js

@@ -2,12 +2,13 @@
  * WordPress dependencies
  */
 import { addQueryArgs } from '@wordpress/url';
+
 /**
  * Internal dependencies
  */
-import ImagesCollection from '../collections/images_collection';
-import getConfig from '../helpers/getConfig';
-import preloadImage from '../helpers/preloadImage';
+import ImagesCollection from '../collections/images-collection';
+import getConfig from '../helpers/get-config';
+import preloadImage from '../helpers/preload-image';
 
 const ImagesQueryModel = wp.media.model.Query.extend(
 	{

assets/src/media-selector/store/unsplash_state.js → assets/src/media-selector/store/unsplash-state.js

@@ -1,8 +1,8 @@
 /**
  * Internal dependencies
  */
-import ImagesCollection from '../collections/images_collection';
-import getConfig from '../helpers/getConfig';
+import ImagesCollection from '../collections/images-collection';
+import getConfig from '../helpers/get-config';
 
 const State = wp.media.controller.State;
 

assets/src/media-selector/views/button.js

@@ -1,5 +1,8 @@
-import isUnsplashImage from '../helpers/isUnsplashImage';
-import importImages from '../helpers/importImages';
+/**
+ * Internal dependencies
+ */
+import isUnsplashImage from '../helpers/is-unsplash-image';
+import importImages from '../helpers/import-images';
 
 const Button = wp.media.view.Button.extend( {
 	/**

assets/src/media-selector/views/image_views.js → assets/src/media-selector/views/image-views.js

@@ -1,3 +1,6 @@
+/**
+ * External dependencies
+ */
 import Macy from 'macy';
 
 const ImageViews = wp.media.view.Attachments.extend( {

assets/src/media-selector/views/images_browser.js → assets/src/media-selector/views/images-browser.js

@@ -1,5 +1,8 @@
-import ImageViews from './image_views';
-import getConfig from '../helpers/getConfig';
+/**
+ * Internal dependencies
+ */
+import ImageViews from './image-views';
+import getConfig from '../helpers/get-config';
 
 const ImagesBrowser = wp.media.view.AttachmentsBrowser.extend( {
 	className: 'unsplash-browser attachments-browser',

assets/src/media-selector/views/toolbar_select.js → assets/src/media-selector/views/toolbar-select.js

@@ -1,3 +1,6 @@
+/**
+ * Internal dependencies
+ */
 import Toolbar from './toolbar';
 
 const ToolbarSelect = wp.media.view.Toolbar.Select.extend( {

contributing.md

@@ -20,7 +20,7 @@ Project maintainers are regularly monitoring issues and aim to fix open bugs qui
 
 ## Product and code contributions
 
-We'd love to have your help contributing code and features to the Unsplash Plugin! Head to the [Engineering guidelines](contributing/engineering.md) for details on the process you can use to contribute.
+We'd love to have your help contributing code and features to the Unsplash Plugin! Head to the [Project Management guidelines](contributing/project-management.md) as well as [Engineering guidelines](contributing/engineering.md) for details on the process you can use to contribute.
 
 ## Contributors list policy
 

contributing/engineering.md

@@ -107,19 +107,21 @@ Build of the JavaScript files:
 npm run build:js
 ```
 
-Lastly, to get the plugin running in your WordPress install, activate the plugin via the WordPress dashboard, or the following `wp-cli` command:
+Lastly, we need to setup WordPress and get the plugin running, you can follow the setup wizard and activate the plugin via the WordPress dashboard, or run the following command using the `wp-cli`:
 
 ```bash
+wp core install --title='Unsplash Demo' --admin_user=admin --admin_password=password --admin_email=admin@example.com --skip-email --url=http://localhost:8088
 wp plugin activate unsplash
 ```
 
 If running this from the included Docker environment:
 
 ```bash
+npm run wp -- wp core install --title='Unsplash Demo' --admin_user=admin --admin_password=password --admin_email=admin@example.com --skip-email --url=http://localhost:8088
 npm run wp -- wp plugin activate unsplash
 ```
 
-_This command assumes you went through the WordPress install process already_
+_These commands assume you have already successfully started the environment with `npm run env:start`_
 
 Visit [localhost:8025](http://localhost:8025) to check all emails sent by WordPress.