diff --git a/babel.config.js b/babel.config.js index 9e35d73..812ce6f 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,9 +1,13 @@ "use strict"; -module.exports = function (api){ +module.exports = function (api) { api.cache.never(); return { - plugins: ["@babel/proposal-export-default-from"], - "presets": - ["@babel/preset-env", "@babel/preset-react"], -}}; \ No newline at end of file + plugins: [ + "@babel/proposal-export-default-from", + "@babel/plugin-proposal-class-properties" + ], + "presets": + ["@babel/preset-env", "@babel/preset-react"], + } +}; diff --git a/docs/iframe.html b/docs/iframe.html index 668d33a..5177c39 100644 --- a/docs/iframe.html +++ b/docs/iframe.html @@ -57,4 +57,4 @@ console.warn('unable to connect to parent frame for connecting dev tools'); }

No Preview

Sorry, but you either have no stories or none are selected somehow.

     
-
\ No newline at end of file +
\ No newline at end of file diff --git a/docs/index.html b/docs/index.html index eb7b3c8..a169c1e 100644 --- a/docs/index.html +++ b/docs/index.html @@ -11,4 +11,4 @@ } } catch (e) { console.warn('unable to connect to parent frame for connecting dev tools'); - }
\ No newline at end of file + }
\ No newline at end of file diff --git a/package.json b/package.json index aef501b..f45d25e 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,7 @@ "devDependencies": { "@babel/cli": "^7.2.0", "@babel/core": "^7.2.2", + "@babel/plugin-proposal-class-properties": "^7.8.3", "@babel/plugin-proposal-export-default-from": "^7.2.0", "@babel/preset-env": "^7.2.0", "@babel/preset-react": "^7.0.0", diff --git a/samples/photo_album/package.json b/samples/photo_album/package.json index 28fb297..58c9a5a 100644 --- a/samples/photo_album/package.json +++ b/samples/photo_album/package.json @@ -12,7 +12,7 @@ "babel-runtime": "6.26.0", "case-sensitive-paths-webpack-plugin": "2.1.1", "chalk": "1.1.3", - "cloudinary-react": "^1.1.4", + "cloudinary-react": "^1.3.1", "css-loader": "2.1.1", "dotenv": "4.0.0", "eslint": "4.18.2", diff --git a/samples/photo_album/src/components/Photo.js b/samples/photo_album/src/components/Photo.js index 41d2e87..cec147f 100644 --- a/samples/photo_album/src/components/Photo.js +++ b/samples/photo_album/src/components/Photo.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import { Image, Transformation } from 'cloudinary-react'; import { url } from '../utils/CloudinaryService'; import PhotoThumbnails from './PhotoThumbnails'; +import {CloudinaryContext} from 'cloudinary-react'; class Photo extends Component { constructor(props) { @@ -64,6 +65,8 @@ class Photo extends Component { showLess() { this.setState({ showMore: false }); } + + static contextType = CloudinaryContext.contextType; } Photo.propTypes = { @@ -71,9 +74,4 @@ Photo.propTypes = { publicId: PropTypes.string, }; -Photo.contextTypes = { - cloudName: PropTypes.string, - uploadPreset: PropTypes.string, -}; - export default Photo; diff --git a/samples/photo_album/src/components/PhotoList.js b/samples/photo_album/src/components/PhotoList.js index 755d9ef..db0ddd9 100644 --- a/samples/photo_album/src/components/PhotoList.js +++ b/samples/photo_album/src/components/PhotoList.js @@ -7,6 +7,7 @@ import { photosUploaded } from '../actions'; import Photo from './Photo'; import FacebookImage from './FacebookImage'; import Introduction from './Introduction'; +import {CloudinaryContext} from 'cloudinary-react'; class PhotoList extends Component { render() { @@ -69,6 +70,8 @@ class PhotoList extends Component { } }); } + + static contextType = CloudinaryContext.contextType; } PhotoList.propTypes = { @@ -76,11 +79,6 @@ PhotoList.propTypes = { onPhotosUploaded: PropTypes.func, }; -PhotoList.contextTypes = { - cloudName: PropTypes.string, - uploadPreset: PropTypes.string, -}; - const PhotoListContainer = connect( state => ({ photos: state.photos }), { diff --git a/samples/photo_album/src/components/PhotosUploader.js b/samples/photo_album/src/components/PhotosUploader.js index b3931be..1a9ebe9 100644 --- a/samples/photo_album/src/components/PhotosUploader.js +++ b/samples/photo_album/src/components/PhotosUploader.js @@ -6,6 +6,7 @@ import request from 'superagent'; import Dropzone from 'react-dropzone'; import { photosUploaded, updateUploadedPhoto } from '../actions'; import UploadedPhotoStatusContainer from './UploadedPhotosStatus'; +import {CloudinaryContext} from "cloudinary-react"; class PhotosUploader extends Component { constructor(props, context) { @@ -135,6 +136,8 @@ class PhotosUploader extends Component { this.props.onPhotosUploaded([response.body]); } + + static contextType = CloudinaryContext.contextType; } PhotosUploader.propTypes = { @@ -143,11 +146,6 @@ PhotosUploader.propTypes = { onPhotosUploaded: PropTypes.func, }; -PhotosUploader.contextTypes = { - cloudName: PropTypes.string, - uploadPreset: PropTypes.string, -}; - const PhotosUploaderContainer = connect( state => state, { diff --git a/samples/photo_album/src/components/UploadedPhotosStatus.js b/samples/photo_album/src/components/UploadedPhotosStatus.js index 2b454f9..039933d 100644 --- a/samples/photo_album/src/components/UploadedPhotosStatus.js +++ b/samples/photo_album/src/components/UploadedPhotosStatus.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import request from 'superagent'; import { deleteUploadedPhoto } from '../actions'; +import {CloudinaryContext} from "cloudinary-react"; class UploadedPhotoStatus extends Component { render() { @@ -78,6 +79,8 @@ class UploadedPhotoStatus extends Component { this.props.uploadedPhoto.response.body.public_id ); } + + static contextType = CloudinaryContext.contextType; } UploadedPhotoStatus.propTypes = { @@ -85,11 +88,6 @@ UploadedPhotoStatus.propTypes = { onDeleteUploadedPhoto: PropTypes.func, }; -UploadedPhotoStatus.contextTypes = { - cloudName: PropTypes.string, - uploadPreset: PropTypes.string, -}; - const UploadedPhotoStatusContainer = connect( state => state, { diff --git a/samples/photo_album/src/index.js b/samples/photo_album/src/index.js index c2b8578..09dedb4 100644 --- a/samples/photo_album/src/index.js +++ b/samples/photo_album/src/index.js @@ -5,7 +5,7 @@ import { Provider } from 'react-redux'; import App from './components/App'; import PhotosListReducer from './reducers/PhotosListReducer'; import UploadedPhotosReducer from './reducers/UploadedPhotosReducer'; -import Config from './config/config'; +import config from './config/config'; const rootReducer = combineReducers({ photos: PhotosListReducer, @@ -13,11 +13,11 @@ const rootReducer = combineReducers({ }); const store = createStore(rootReducer); +const {cloud_name, upload_preset} = config; render( - + , document.getElementById('root') ); diff --git a/samples/photo_album/src/utils/CloudinaryService.js b/samples/photo_album/src/utils/CloudinaryService.js index 7bb3b60..4f10470 100644 --- a/samples/photo_album/src/utils/CloudinaryService.js +++ b/samples/photo_album/src/utils/CloudinaryService.js @@ -1,9 +1,14 @@ import { Cloudinary as CoreCloudinary, Util } from 'cloudinary-core'; export const url = (publicId, options) => { - const scOptions = Util.withSnakeCaseKeys(options); - const cl = CoreCloudinary.new(); - return cl.url(publicId, scOptions); + try { + const scOptions = Util.withSnakeCaseKeys(options); + const cl = CoreCloudinary.new(); + return cl.url(publicId, scOptions); + } catch (e) { + console.error(e); + return null; + } }; export const openUploadWidget = (options, callback) => { diff --git a/src/components/CloudinaryComponent/CloudinaryComponent.js b/src/components/CloudinaryComponent/CloudinaryComponent.js index 0cb27be..832907a 100644 --- a/src/components/CloudinaryComponent/CloudinaryComponent.js +++ b/src/components/CloudinaryComponent/CloudinaryComponent.js @@ -113,9 +113,10 @@ class CloudinaryComponent extends PureComponent { let cl = Cloudinary.new(options); return cl.url(extendedProps.publicId, transformation); } + + static contextType = CloudinaryContextType; } -CloudinaryComponent.contextType = CloudinaryContextType; CloudinaryComponent.propTypes = typesFrom(Transformation.PARAM_NAMES.map(camelCase)); CloudinaryComponent.propTypes.publicId = PropTypes.string; CloudinaryComponent.propTypes.responsive = PropTypes.bool; diff --git a/src/components/CloudinaryContext/CloudinaryContext.js b/src/components/CloudinaryContext/CloudinaryContext.js index ed04a98..34bf137 100644 --- a/src/components/CloudinaryContext/CloudinaryContext.js +++ b/src/components/CloudinaryContext/CloudinaryContext.js @@ -34,6 +34,5 @@ class CloudinaryContext extends CloudinaryComponent { CloudinaryContext.propTypes = {...CloudinaryComponent.propTypes, includeOwnBody: PropTypes.bool}; CloudinaryContext.defaultProps = {includeOwnBody: false}; -CloudinaryContext.contextType = CloudinaryContextType; export default CloudinaryContext;