How to use @commercetools-frontend/sdk - 10 common examples

const mergeObjectValues = object =>
  Object.entries(object).reduce((acc, [, value]) => ({ ...acc, ...value }), {});

const patchedGetCorrelationId = () =>
  getCorrelationId({
    userId: selectUserId({ apolloCache: apolloClient }),
  });

const createInternalReducer = (injectedReducers = {}) =>
  combineReducers({
    requestsInFlight: requestsInFlightReducer,
    notifications: notificationsReducer,
    ...injectedReducers,
  });

const sdkMiddleware = createSdkMiddleware({
  getCorrelationId: patchedGetCorrelationId,
  getProjectKey: selectProjectKeyFromUrl,
  getTeamId: selectTeamIdFromLocalStorage,
});

export const applyDefaultMiddlewares = (...middlewares) =>
  applyMiddleware(...middlewares, thunk, loggerMiddleware);

// We use a factory as it's more practicable for tests
// The application can import the configured store (the default export)
export const createReduxStore = (
  preloadedState = { requestsInFlight: null },
  // additional middleware, used for testing
  additionalMiddlewares = []
) => {
  const store = createStore(

const reduxStore = (() => {
    if (store) return store;

    if (sdkMocks.length === 0) return createReduxStore(storeState);

    const testingMiddleware = createSdkTestMiddleware(sdkMocks);
    return createReduxStore(storeState, [testingMiddleware]);
  })();

it('should pass action creator args to ', () => {
    expect(wrapper.find(Sdk.Get)).toHaveProp('actionCreatorArgs', [
      { perPage: 25, page: 1 },
    ]);
  });
});

requestAccessToken: payload =>
    dispatch(sdkActions.post({ uri: `/tokens/sso`, payload })),
});

export const pushMetricHistogram = ({ payload }) =>
  sdkActions.post({
    uri: '/metrics/histograms',
    mcApiProxyTarget: MC_API_PROXY_TARGETS.MC_METRICS,
    payload: JSON.stringify(payload),
  });

requestAccessToken: payload =>
    dispatch(sdkActions.post({ uri: `/tokens`, payload })),
});

export const pushDependencyVersionCounter = ({ payload }) =>
  sdkActions.post({
    uri: '/metrics/counters',
    mcApiProxyTarget: MC_API_PROXY_TARGETS.MC_METRICS,
    payload: JSON.stringify(payload),
  });

pimSearchProductIds: searchText =>
      dispatch(
        sdkActions.post({
          uri: `/${ownProps.applicationContext.project.key}/search/products`,
          mcApiProxyTarget: MC_API_PROXY_TARGETS.PIM_SEARCH,
          payload: {
            query: {
              fullText: {
                field: 'name',
                language: ownProps.applicationContext.dataLocale,
                value: searchText,
              },
            },
            sort: [
              {
                field: 'name',
                language: ownProps.applicationContext.dataLocale,
                order: 'desc',
              },

  fetchServerVersion: () => dispatch(sdkActions.get({ uri: '/version' })),
});

export const fetchStateMachines = requestOptions =>
  sdkActions.get({
    mcApiProxyTarget: MC_API_PROXY_TARGETS.COMMERCETOOLS_PLATFORM,
    service: 'states',
    options: requestOptions,
  });