mediapicker - npm Package Compare versions

Comparing version 11.1.5 to 11.2.0-INNO-1

CHANGELOG.md

 ## MediaPicker
 
+#### 11.2.0 (2017-11)
+
+  * **feat:**
+    * Added GIPHY file picking support to Media Picker Popup [#514](https://bitbucket.org/atlassian/mediakit-web/pull-requests/514/giphy-in-mediapicker/diff)
+      * Added 'SEARCH_GIPHY_ACTION', 'SEARCH_GIPHY_ACTION_FULFILLED' and 'SEARCH_GIPHY_ACTION_FAILED' actions
+      * Added `giphyView.tsx` view and associated `giphySidebarItem.tsx`
+    * Fixed hover state for sidebar items
+      * `cursor: pointer` is only set for inactive sidebar items
+      * background hover state is only set for inactive sidebar items
+    * Fixed request being sent to `/picker/service/{serviceName}/{accountId}/folder` when there were no connected accounts and/or the service selected was NOT dropbox or google
+
 #### 11.1.5 (2017-11-06)
@@ -19,3 +30,3 @@
 
- * **patch:**
+  * **patch:**
     * Converted Media Picker Popup Navigation components to styled-components [#510](https://bitbucket.org/atlassian/mediakit-web/pull-requests/510/feat-popup-make-navigation-components/diff)
@@ -22,0 +33,0 @@ * Navigation, Breadcrumbs, Refresh Button and Account Dropdown now use styled-components internally

lib/types/popup/src/domain/index.d.ts

@@ -6,2 +6,3 @@ import { Auth, AuthProvider } from '@atlaskit/media-core';
 export { SourceFile, SourceFileOwner, ClientBasedSourceFileOwner, AsapBasedSourceFileOwner } from './source-file';
+import { PublicImageResponse } from '../tools/fetcher/fetcher';
 export interface State {
@@ -22,3 +23,7 @@ readonly apiUrl: string;
     readonly lastUploadIndex: number;
+    readonly giphy: GiphyState;
 }
+export interface GiphyState {
+    readonly imageResults: PublicImageResponse[];
+}
 export interface Recents {
@@ -57,3 +62,4 @@ readonly nextKey: string;
     readonly items: ServiceFolderItem[];
-    readonly loading: boolean;
+    readonly isLoading: boolean;
+    readonly hasError: boolean;
     readonly path: Path;
@@ -85,3 +91,4 @@ readonly service: ServiceAccountLink;
 }
-export declare type ServiceName = 'google' | 'dropbox' | 'upload';
+export declare type ServiceName = 'google' | 'dropbox' | 'upload' | 'giphy';
+export declare const isRemoteCloudAccount: (serviceName: ServiceName) => boolean;
 export declare type ServiceStatus = 'forbidden' | 'scope_unsupported' | 'scope_insufficient' | 'expired' | 'refresh_needed' | 'available';
@@ -120,3 +127,2 @@ export interface Service {
     readonly name: string;
-    readonly parentId: string;
     readonly size: number;
@@ -123,0 +129,0 @@ readonly date: number;

package.json

 {
   "name": "mediapicker",
-  "version": "11.1.5",
+  "version": "11.2.0-INNO-1",
   "description": "Library for handling file uploads",
@@ -5,0 +5,0 @@ "main": "./lib/mediapicker.js",

popup/package.json

@@ -21,2 +21,3 @@ {
     "@atlaskit/flag": "^6.1.0",
+    "@atlaskit/field-text": "^4.0.1",
     "@atlaskit/icon": "^6.5.4",
@@ -28,2 +29,3 @@ "@atlaskit/media-card": "^21.2.1",
     "@atlaskit/util-shared-styles": "^2.2.1",
+    "@types/bricks.js": "^1.8.0",
     "@types/dateformat": "^1.0.1",
@@ -34,2 +36,4 @@ "@types/enzyme": "^2.8.1",
     "@types/jest": "^20.0.2",
+    "@types/lodash.chunk": "^4.2.3",
+    "@types/lodash.debounce": "^4.0.3",
     "@types/lodash.random": "^3.2.3",
@@ -51,2 +55,3 @@ "@types/react": "^15.0.35",
     "babel-preset-stage-0": "^6.5.0",
+    "bricks.js": "^1.8.0",
     "chai": "^3.5.0",
@@ -68,2 +73,4 @@ "classnames": "^2.2.3",
     "less-loader": "^2.2.2",
+    "lodash.chunk": "^4.2.0",
+    "lodash.debounce": "^4.0.8",
     "lodash.random": "^3.2.0",
@@ -103,4 +110,3 @@ "mocha": "^2.4.5",
     "webpack-bundle-analyzer": "^2.9.0"
-  },
-  "dependencies": {}
+  }
 }

popup/src/domain/index.ts

@@ -14,2 +14,4 @@ import { Auth, AuthProvider } from '@atlaskit/media-core';
 
+import { PublicImageResponse } from '../tools/fetcher/fetcher';
+
 export interface State {
@@ -31,4 +33,9 @@ readonly apiUrl: string;
   readonly lastUploadIndex: number;
+  readonly giphy: GiphyState;
 }
 
+export interface GiphyState {
+  readonly imageResults: PublicImageResponse[];
+}
+
 export interface Recents {
@@ -72,3 +79,4 @@ readonly nextKey: string;
   readonly items: ServiceFolderItem[];
-  readonly loading: boolean;
+  readonly isLoading: boolean;
+  readonly hasError: boolean;
   readonly path: Path;
@@ -106,4 +114,8 @@ readonly service: ServiceAccountLink;
 
-export type ServiceName = 'google' | 'dropbox' | 'upload';
+export type ServiceName = 'google' | 'dropbox' | 'upload' | 'giphy';
 
+export const isRemoteCloudAccount = (serviceName: ServiceName): boolean => {
+  return serviceName === 'google' || serviceName === 'dropbox';
+};
+
 export type ServiceStatus =
@@ -154,3 +166,2 @@ | 'forbidden'
   readonly name: string;
-  readonly parentId: string;
   readonly size: number;
@@ -157,0 +168,0 @@ readonly date: number;

popup/src/mocks/index.ts

@@ -9,3 +9,4 @@ import { State } from '../domain';
     items: [],
-    loading: false,
+    hasError: false,
+    isLoading: false,
     path: [],
@@ -38,3 +39,6 @@ service: {
   isUploading: false,
-  userAuthProvider: jest.fn()
+  userAuthProvider: jest.fn(),
+  giphy: {
+    imageResults: []
+  }
 };
@@ -106,3 +110,5 @@
   fetchCloudAccountFile: jest.fn(),
-  copyFile: jest.fn()
+  copyFile: jest.fn(),
+  fetchTrendingGifs: jest.fn(),
+  fetchGifsRelevantToSearch: jest.fn()
 });
@@ -109,0 +115,0 @@

popup/src/store/store.ts

@@ -25,2 +25,3 @@ import { createStore as createReduxStore, applyMiddleware, Middleware } from 'redux';
 import { handleCloudFetchingEvent } from '../middleware/handleCloudFetchingEvent';
+import searchGiphy from '../middleware/searchGiphy';
 
@@ -88,5 +89,6 @@ /* Reducers */
         getPreview(fetcher, authService, parentChannel) as Middleware,
-        handleCloudFetchingEvent(parentChannel) as Middleware
+        handleCloudFetchingEvent(parentChannel) as Middleware,
+        searchGiphy(fetcher)
       )
     )
   );

src/components/dropzone.spec.ts

@@ -63,21 +63,15 @@ import { expect } from 'chai';
 
-  let axiosStub: sinon.SinonStub;
-
   const breakDropzoneActivation = () => {
-    // To break dropzone initialisation
-    axiosStub = sinon
-      .stub(axios, 'get')
-      .callsFake(() => Promise.reject(new Error('No connection')));
+    (axios.get as any).mockReturnValue(Promise.reject(new Error('No connection')));
   };
 
   const mockDropZoneUIRequest = () => {
-    axiosStub = sinon
-      .stub(axios, 'get')
-      .callsFake(() => Promise.resolve({ data: '<div class="mediaPickerDropzone"/>' }));
+    (axios.get as any).mockReturnValue(
+      Promise.resolve({ data: '<div class="mediaPickerDropzone"/>' })
+    );
   };
 
   afterEach(() => {
-    if (axiosStub) {
-      axiosStub.restore();
-      axiosStub = undefined;
+    if (axios) {
+      (axios.get as any).mockClear();
     }
@@ -84,0 +78,0 @@ });

src/service/mediaClient.spec.ts

 import { expect } from 'chai';
 import * as sinon from 'sinon';
-import * as axios from 'axios';
+import axios from 'axios';
 
@@ -229,3 +229,2 @@ import {
     let authProvider: sinon.SinonStub;
-    let axiosRequestStub: sinon.SinonStub;
     let mediaClient: MediaClient;
@@ -235,3 +234,2 @@
       authProvider = sinon.stub();
-      axiosRequestStub = sinon.stub(axios, 'request');
       mediaClient = new MediaClient(apiUrl, authProvider);
@@ -241,3 +239,5 @@ });
     afterEach(() => {
-      axiosRequestStub.restore();
+      if (axios) {
+        (axios.request as any).mockClear();
+      }
     });
@@ -248,3 +248,3 @@
       authProvider.rejects(error);
-      axiosRequestStub.resolves(response);
+      (axios.request as any).mockReturnValue(Promise.resolve(response));
 
@@ -265,3 +265,3 @@ mediaClient
 
-      axiosRequestStub.callsFake(params => {
+      (axios.request as any).mockImplementationOnce((params: any) => {
         expect(params.headers).contain({
@@ -288,3 +288,3 @@ Authorization: 'Bearer some-token',
 
-      axiosRequestStub.callsFake(params => {
+      (axios.request as any).mockImplementationOnce((params: any) => {
         expect(params).to.deep.equal({
@@ -338,3 +338,3 @@ url: 'https://media.api/some-method',
 
-      axiosRequestStub.callsFake(params => {
+      (axios.request as any).mockImplementationOnce((params: any) => {
         expect(params.headers).to.contain({
@@ -357,3 +357,3 @@ 'Content-Type': 'application/json; charset=utf-8'
 
-      axiosRequestStub.callsFake(params => {
+      (axios.request as any).mockImplementationOnce((params: any) => {
         expect(params.headers).to.not.contain({
@@ -383,5 +383,6 @@ 'Content-Type': 'application/json; charset=utf-8'
       };
-      axiosRequestStub.onFirstCall().rejects(error);
-      axiosRequestStub.onSecondCall().resolves(response);
 
+      (axios.request as any).mockReturnValueOnce(Promise.reject(error));
+      (axios.request as any).mockReturnValueOnce(Promise.resolve(response));
+
       return mediaClient
@@ -408,5 +409,6 @@ .call({
       };
-      axiosRequestStub.onFirstCall().rejects(error);
-      axiosRequestStub.onSecondCall().resolves(response);
 
+      (axios.request as any).mockReturnValueOnce(Promise.reject(error));
+      (axios.request as any).mockReturnValueOnce(Promise.resolve(response));
+
       return mediaClient
@@ -427,4 +429,4 @@ .call({
 
-      axiosRequestStub.onFirstCall().resolves(response);
-      axiosRequestStub.onSecondCall().resolves(response);
+      (axios.request as any).mockReturnValueOnce(Promise.resolve(response));
+      (axios.request as any).mockReturnValueOnce(Promise.resolve(response));
 
@@ -431,0 +433,0 @@ return mediaClient

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26059565

increased by2.46%

Number of package files

686

increased by2.85%

Lines of code

33037

increased by5.76%

Worsened metrics

Number of low quality alerts

3

increased by50%

No dependency changes