[RNMobile] Move MediaUploadPorgress to its own component folder

packages/block-editor/src/components/index.native.js

@@ -18,6 +18,7 @@ export {
 } from './rich-text';
 export { default as MediaPlaceholder } from './media-placeholder';
 export { default as MediaUpload, MEDIA_TYPE_IMAGE, MEDIA_TYPE_VIDEO } from './media-upload';
+export { default as MediaUploadProgress } from './media-upload-progress';
 export { default as URLInput } from './url-input';
 export { default as BlockInvalidWarning } from './block-list/block-invalid-warning';
 export { default as Caption } from './caption';

packages/block-library/src/image/image-size.native.js → packages/block-editor/src/components/media-upload-progress/image-size.native.js

@@ -11,7 +11,15 @@ import { View, Image } from 'react-native';
 /**
  * Internal dependencies
  */
-import { calculatePreferedImageSize } from './utils';
+
+function calculatePreferedImageSize( image, container ) {
+	const maxWidth = container.clientWidth;
+	const exceedMaxWidth = image.width > maxWidth;
+	const ratio = image.height / image.width;
+	const width = exceedMaxWidth ? maxWidth : image.width;
+	const height = exceedMaxWidth ? maxWidth * ratio : image.height;
+	return { width, height };
+}
 
 class ImageSize extends Component {
 	constructor() {

packages/block-editor/src/components/media-upload-progress/styles.native.scss

@@ -0,0 +1,4 @@
+.mediaUploadProgress {
+	flex: 1;
+	background-color: $gray-lighten-30;
+}

packages/block-library/src/image/test/media-upload-progress.native.js → packages/block-editor/src/components/media-upload-progress/test/index.native.js

@@ -15,7 +15,7 @@ import {
 	MEDIA_UPLOAD_STATE_SUCCEEDED,
 	MEDIA_UPLOAD_STATE_FAILED,
 	MEDIA_UPLOAD_STATE_RESET,
-} from '../media-upload-progress';
+} from '../index';
 
 jest.mock( 'react-native-gutenberg-bridge', () => {
 	const callUploadCallback = ( payload ) => {

packages/block-library/src/image/edit.native.js

@@ -26,6 +26,7 @@ import {
 	Caption,
 	MediaPlaceholder,
 	MediaUpload,
+	MediaUploadProgress,
 	MEDIA_TYPE_IMAGE,
 	BlockControls,
 	InspectorControls,
@@ -38,7 +39,6 @@ import { doAction, hasAction } from '@wordpress/hooks';
  * Internal dependencies
  */
 import styles from './styles.scss';
-import MediaUploadProgress from './media-upload-progress';
 import SvgIcon from './icon';
 import SvgIconRetry from './icon-retry';
 

packages/block-library/src/image/styles.native.scss

@@ -22,11 +22,6 @@
 	color: $alert-red;
 }
 
-.mediaUploadProgress {
-	flex: 1;
-	background-color: $gray-lighten-30;
-}
-
 .modalIcon {
 	width: 80px;
 	height: 80px;

packages/block-library/src/video/edit.native.js

@@ -27,6 +27,7 @@ import {
 	Caption,
 	MediaPlaceholder,
 	MediaUpload,
+	MediaUploadProgress,
 	MEDIA_TYPE_VIDEO,
 	BlockControls,
 	InspectorControls,
@@ -38,7 +39,6 @@ import { doAction, hasAction } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
-import MediaUploadProgress from '../image/media-upload-progress';
 import style from './style.scss';
 import SvgIcon from './icon';
 import SvgIconRetry from './icon-retry';