Moved common and utils services to their own service providers

This commit is contained in:
Alejandro Celaya 2018-12-18 20:19:22 +01:00
parent 4b1f5e9f4c
commit eec79043cc
13 changed files with 83 additions and 45 deletions

View file

@ -0,0 +1,32 @@
import ScrollToTop from '../ScrollToTop';
import MainHeader from '../MainHeader';
import Home from '../Home';
import MenuLayout from '../MenuLayout';
import AsideMenu from '../AsideMenu';
const provideServices = (bottle, connect, withRouter) => {
bottle.constant('ScrollToTop', ScrollToTop);
bottle.decorator('ScrollToTop', withRouter);
bottle.serviceFactory('MainHeader', MainHeader, 'ServersDropdown');
bottle.decorator('MainHeader', withRouter);
bottle.serviceFactory('Home', () => Home);
bottle.decorator('Home', connect([ 'servers' ], [ 'resetSelectedServer' ]));
bottle.serviceFactory(
'MenuLayout',
MenuLayout,
'TagsList',
'ShortUrls',
'AsideMenu',
'CreateShortUrl',
'ShortUrlVisits'
);
bottle.decorator('MenuLayout', connect([ 'selectedServer', 'shortUrlsListParams' ], [ 'selectServer' ]));
bottle.decorator('MenuLayout', withRouter);
bottle.serviceFactory('AsideMenu', AsideMenu, 'DeleteServerButton');
};
export default provideServices;

View file

@ -2,20 +2,13 @@ import Bottle from 'bottlejs';
import { withRouter } from 'react-router-dom'; import { withRouter } from 'react-router-dom';
import { connect as reduxConnect } from 'react-redux'; import { connect as reduxConnect } from 'react-redux';
import { pick } from 'ramda'; import { pick } from 'ramda';
import axios from 'axios';
import App from '../App'; import App from '../App';
import ScrollToTop from '../common/ScrollToTop'; import provideCommonServices from '../common/services/provideServices';
import MainHeader from '../common/MainHeader';
import Home from '../common/Home';
import MenuLayout from '../common/MenuLayout';
import AsideMenu from '../common/AsideMenu';
import ColorGenerator from '../utils/ColorGenerator';
import Storage from '../utils/Storage';
import buildShlinkApiClient from '../api/ShlinkApiClientBuilder';
import provideShortUrlsServices from '../short-urls/services/provideServices'; import provideShortUrlsServices from '../short-urls/services/provideServices';
import provideServersServices from '../servers/services/provideServices'; import provideServersServices from '../servers/services/provideServices';
import provideVisitsServices from '../visits/services/provideServices'; import provideVisitsServices from '../visits/services/provideServices';
import provideTagsServices from '../tags/services/provideServices'; import provideTagsServices from '../tags/services/provideServices';
import provideUtilsServices from '../utils/services/provideServices';
const bottle = new Bottle(); const bottle = new Bottle();
const { container } = bottle; const { container } = bottle;
@ -29,44 +22,16 @@ const mapActionService = (map, actionName) => ({
const connect = (propsFromState, actionServiceNames) => const connect = (propsFromState, actionServiceNames) =>
reduxConnect( reduxConnect(
propsFromState ? pick(propsFromState) : null, propsFromState ? pick(propsFromState) : null,
Array.isArray(actionServiceNames) ? actionServiceNames.reduce(mapActionService, {}) : actionServiceNames actionServiceNames.reduce(mapActionService, {})
); );
bottle.constant('ScrollToTop', ScrollToTop);
bottle.decorator('ScrollToTop', withRouter);
bottle.serviceFactory('App', App, 'MainHeader', 'Home', 'MenuLayout', 'CreateServer'); bottle.serviceFactory('App', App, 'MainHeader', 'Home', 'MenuLayout', 'CreateServer');
bottle.serviceFactory('MainHeader', MainHeader, 'ServersDropdown'); provideCommonServices(bottle, connect, withRouter);
bottle.decorator('MainHeader', withRouter);
bottle.serviceFactory('Home', () => Home);
bottle.decorator('Home', connect([ 'servers' ], [ 'resetSelectedServer' ]));
bottle.serviceFactory(
'MenuLayout',
MenuLayout,
'TagsList',
'ShortUrls',
'AsideMenu',
'CreateShortUrl',
'ShortUrlVisits'
);
bottle.decorator('MenuLayout', connect([ 'selectedServer', 'shortUrlsListParams' ], [ 'selectServer' ]));
bottle.decorator('MenuLayout', withRouter);
bottle.serviceFactory('AsideMenu', AsideMenu, 'DeleteServerButton');
bottle.constant('localStorage', global.localStorage);
bottle.service('Storage', Storage, 'localStorage');
bottle.service('ColorGenerator', ColorGenerator, 'Storage');
bottle.constant('axios', axios);
bottle.serviceFactory('buildShlinkApiClient', buildShlinkApiClient, 'axios');
provideShortUrlsServices(bottle, connect); provideShortUrlsServices(bottle, connect);
provideServersServices(bottle, connect, withRouter); provideServersServices(bottle, connect, withRouter);
provideTagsServices(bottle, connect); provideTagsServices(bottle, connect);
provideVisitsServices(bottle, connect); provideVisitsServices(bottle, connect);
provideUtilsServices(bottle);
export default container; export default container;

View file

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import './Tag.scss'; import './Tag.scss';
import { colorGeneratorType } from '../../utils/ColorGenerator'; import { colorGeneratorType } from '../../utils/services/ColorGenerator';
const propTypes = { const propTypes = {
text: PropTypes.string, text: PropTypes.string,

View file

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import * as PropTypes from 'prop-types'; import * as PropTypes from 'prop-types';
import { colorGeneratorType } from '../../utils/ColorGenerator'; import { colorGeneratorType } from '../../utils/services/ColorGenerator';
import './TagBullet.scss'; import './TagBullet.scss';
const propTypes = { const propTypes = {

View file

@ -1,5 +1,5 @@
import { isEmpty, reject } from 'ramda'; import { isEmpty, reject } from 'ramda';
import { buildShlinkApiClientWithAxios as buildShlinkApiClient } from '../../api/ShlinkApiClientBuilder'; import { buildShlinkApiClientWithAxios as buildShlinkApiClient } from '../../utils/services/ShlinkApiClientBuilder';
import { TAG_DELETED } from './tagDelete'; import { TAG_DELETED } from './tagDelete';
import { TAG_EDITED } from './tagEdit'; import { TAG_EDITED } from './tagEdit';

View file

@ -0,0 +1,15 @@
import axios from 'axios';
import Storage from './Storage';
import ColorGenerator from './ColorGenerator';
import buildShlinkApiClient from './ShlinkApiClientBuilder';
const provideServices = (bottle) => {
bottle.constant('localStorage', global.localStorage);
bottle.service('Storage', Storage, 'localStorage');
bottle.service('ColorGenerator', ColorGenerator, 'Storage');
bottle.constant('axios', axios);
bottle.serviceFactory('buildShlinkApiClient', buildShlinkApiClient, 'axios');
};
export default provideServices;

View file

@ -1,5 +1,5 @@
import * as sinon from 'sinon'; import * as sinon from 'sinon';
import ColorGenerator from '../../src/utils/ColorGenerator'; import ColorGenerator from '../../../src/utils/services/ColorGenerator';
describe('ColorGenerator', () => { describe('ColorGenerator', () => {
let colorGenerator; let colorGenerator;

View file

@ -1,6 +1,6 @@
import sinon from 'sinon'; import sinon from 'sinon';
import { head, last } from 'ramda'; import { head, last } from 'ramda';
import ShlinkApiClient from '../../src/api/ShlinkApiClient'; import ShlinkApiClient from '../../../src/utils/services/ShlinkApiClient';
describe('ShlinkApiClient', () => { describe('ShlinkApiClient', () => {
const createAxiosMock = (extraData) => () => const createAxiosMock = (extraData) => () =>

View file

@ -0,0 +1,26 @@
import buildShlinkApiClient from '../../../src/utils/services/ShlinkApiClientBuilder';
describe('ShlinkApiClientBuilder', () => {
const builder = buildShlinkApiClient({});
it('creates new instances when provided params are different', () => {
const firstApiClient = builder({ url: 'foo', apiKey: 'bar' });
const secondApiClient = builder({ url: 'bar', apiKey: 'bar' });
const thirdApiClient = builder({ url: 'bar', apiKey: 'foo' });
expect(firstApiClient).not.toBe(secondApiClient);
expect(firstApiClient).not.toBe(thirdApiClient);
expect(secondApiClient).not.toBe(thirdApiClient);
});
it('returns existing instances when provided params are the same', () => {
const params = { url: 'foo', apiKey: 'bar' };
const firstApiClient = builder(params);
const secondApiClient = builder(params);
const thirdApiClient = builder(params);
expect(firstApiClient).toBe(secondApiClient);
expect(firstApiClient).toBe(thirdApiClient);
expect(secondApiClient).toBe(thirdApiClient);
});
});