fix: change getAsset to not return a promise (#3232)

* fix: change getAsset to not return a promise

* fix: update markdown widget per getAsset changes

* test: fix editor component image test

* docs: update getAsset docs

packages/netlify-cms-core/src/reducers/__tests__/medias.spec.ts

@@ -1,5 +1,12 @@
 import { Map, fromJS } from 'immutable';
-import { addAssets, addAsset, removeAsset } from '../../actions/media';
+import {
+  addAssets,
+  addAsset,
+  removeAsset,
+  loadAssetRequest,
+  loadAssetSuccess,
+  loadAssetFailure,
+} from '../../actions/media';
 import reducer from '../medias';
 import { createAssetProxy } from '../../valueObjects/AssetProxy';
 
@@ -7,14 +14,37 @@ describe('medias', () => {
   const asset = createAssetProxy({ url: 'url', path: 'path' });
 
   it('should add assets', () => {
-    expect(reducer(fromJS({}), addAssets([asset]))).toEqual(Map({ path: asset }));
+    expect(reducer(fromJS({}), addAssets([asset]))).toEqual(
+      Map({ path: { asset, isLoading: false, error: null } }),
+    );
   });
 
   it('should add asset', () => {
-    expect(reducer(fromJS({}), addAsset(asset))).toEqual(Map({ path: asset }));
+    expect(reducer(fromJS({}), addAsset(asset))).toEqual(
+      Map({ path: { asset, isLoading: false, error: null } }),
+    );
   });
 
   it('should remove asset', () => {
     expect(reducer(fromJS({ path: asset }), removeAsset(asset.path))).toEqual(Map());
   });
+
+  it('should mark asset as loading', () => {
+    expect(reducer(fromJS({}), loadAssetRequest(asset.path))).toEqual(
+      Map({ path: { isLoading: true } }),
+    );
+  });
+
+  it('should mark asset as not loading', () => {
+    expect(reducer(fromJS({}), loadAssetSuccess(asset.path))).toEqual(
+      Map({ path: { isLoading: false, error: null } }),
+    );
+  });
+
+  it('should set loading error', () => {
+    const error = new Error('some error');
+    expect(reducer(fromJS({}), loadAssetFailure(asset.path, error))).toEqual(
+      Map({ path: { isLoading: false, error } }),
+    );
+  });
 });

packages/netlify-cms-core/src/reducers/medias.ts

@@ -1,5 +1,12 @@
 import { fromJS } from 'immutable';
-import { ADD_ASSETS, ADD_ASSET, REMOVE_ASSET } from '../actions/media';
+import {
+  ADD_ASSETS,
+  ADD_ASSET,
+  REMOVE_ASSET,
+  LOAD_ASSET_REQUEST,
+  LOAD_ASSET_SUCCESS,
+  LOAD_ASSET_FAILURE,
+} from '../actions/media';
 import AssetProxy from '../valueObjects/AssetProxy';
 import { Medias, MediasAction } from '../types/redux';
 
@@ -9,21 +16,36 @@ const medias = (state: Medias = fromJS({}), action: MediasAction) => {
       const payload = action.payload as AssetProxy[];
       let newState = state;
       payload.forEach(asset => {
-        newState = newState.set(asset.path, asset);
+        newState = newState.set(asset.path, { asset, isLoading: false, error: null });
       });
       return newState;
     }
     case ADD_ASSET: {
-      const payload = action.payload as AssetProxy;
-      return state.set(payload.path, payload);
+      const asset = action.payload as AssetProxy;
+      return state.set(asset.path, { asset, isLoading: false, error: null });
     }
     case REMOVE_ASSET: {
       const payload = action.payload as string;
       return state.delete(payload);
     }
+    case LOAD_ASSET_REQUEST: {
+      const { path } = action.payload as { path: string };
+      return state.set(path, { ...state.get(path), isLoading: true });
+    }
+    case LOAD_ASSET_SUCCESS: {
+      const { path } = action.payload as { path: string };
+      return state.set(path, { ...state.get(path), isLoading: false, error: null });
+    }
+    case LOAD_ASSET_FAILURE: {
+      const { path, error } = action.payload as { path: string; error: Error };
+      return state.set(path, { ...state.get(path), isLoading: false, error });
+    }
     default:
       return state;
   }
 };
 
+export const selectIsLoadingAsset = (state: Medias) =>
+  Object.values(state.toJS()).some(state => state.isLoading);
+
 export default medias;