Fixed changing selected server

This commit is contained in:
Alejandro Celaya 2018-08-04 08:23:44 +02:00
parent daf67e1d43
commit 5517fcdde5
3 changed files with 23 additions and 8 deletions

View file

@ -5,10 +5,11 @@ import { Link } from 'react-router-dom';
import { DropdownItem, DropdownMenu, DropdownToggle, UncontrolledDropdown } from 'reactstrap'; import { DropdownItem, DropdownMenu, DropdownToggle, UncontrolledDropdown } from 'reactstrap';
import { listServers } from './reducers/server'; import { listServers } from './reducers/server';
import { selectServer } from '../servers/reducers/selectedServer';
export class ServersDropdown extends React.Component { export class ServersDropdown extends React.Component {
renderServers = () => { renderServers = () => {
const { servers, selectedServer } = this.props; const { servers, selectedServer, selectServer } = this.props;
if (isEmpty(servers)) { if (isEmpty(servers)) {
return <DropdownItem disabled><i>Add a server first...</i></DropdownItem> return <DropdownItem disabled><i>Add a server first...</i></DropdownItem>
@ -20,6 +21,7 @@ export class ServersDropdown extends React.Component {
tag={Link} tag={Link}
to={`/server/${id}/list-short-urls/1`} to={`/server/${id}/list-short-urls/1`}
active={selectedServer && selectedServer.id === id} active={selectedServer && selectedServer.id === id}
onClick={() => selectServer(id)} // FIXME This should be implicit
> >
{name} {name}
</DropdownItem> </DropdownItem>
@ -41,4 +43,4 @@ export class ServersDropdown extends React.Component {
} }
} }
export default connect(pick(['servers', 'selectedServer']), { listServers })(ServersDropdown); export default connect(pick(['servers', 'selectedServer']), { listServers, selectServer })(ServersDropdown);

View file

@ -1,15 +1,18 @@
import ShlinkApiClient from '../../api/ShlinkApiClient'; import ShlinkApiClient from '../../api/ShlinkApiClient';
import ServersService from '../../servers/services/ServersService'; import ServersService from '../../servers/services/ServersService';
import { resetShortUrlParams } from '../../short-urls/reducers/shortUrlsListParams'
const SELECT_SERVER = 'shlink/selectedServer/SELECT_SERVER'; const SELECT_SERVER = 'shlink/selectedServer/SELECT_SERVER';
const RESET_SELECTED_SERVER = 'shlink/selectedServer/RESET_SELECTED_SERVER'; const RESET_SELECTED_SERVER = 'shlink/selectedServer/RESET_SELECTED_SERVER';
export default function reducer(state = null, action) { const defaultState = null;
export default function reducer(state = defaultState, action) {
switch (action.type) { switch (action.type) {
case SELECT_SERVER: case SELECT_SERVER:
return action.selectedServer; return action.selectedServer;
case RESET_SELECTED_SERVER: case RESET_SELECTED_SERVER:
return null; return defaultState;
default: default:
return state; return state;
} }
@ -17,12 +20,14 @@ export default function reducer(state = null, action) {
export const resetSelectedServer = () => ({ type: RESET_SELECTED_SERVER }); export const resetSelectedServer = () => ({ type: RESET_SELECTED_SERVER });
export const selectServer = serverId => { export const selectServer = serverId => dispatch => {
dispatch(resetShortUrlParams());
const selectedServer = ServersService.findServerById(serverId); const selectedServer = ServersService.findServerById(serverId);
ShlinkApiClient.setConfig(selectedServer); ShlinkApiClient.setConfig(selectedServer);
return { dispatch({
type: SELECT_SERVER, type: SELECT_SERVER,
selectedServer selectedServer
} })
}; };

View file

@ -1,10 +1,18 @@
import { LIST_SHORT_URLS } from './shortUrlsList'; import { LIST_SHORT_URLS } from './shortUrlsList';
export default function reducer(state = { page: 1 }, action) { const RESET_SHORT_URL_PARAMS = 'shlink/shortUrlsListParams/RESET_SHORT_URL_PARAMS';
const defaultState = { page: 1 };
export default function reducer(state = defaultState, action) {
switch (action.type) { switch (action.type) {
case LIST_SHORT_URLS: case LIST_SHORT_URLS:
return { ...state, ...action.params }; return { ...state, ...action.params };
case RESET_SHORT_URL_PARAMS:
return defaultState;
default: default:
return state; return state;
} }
} }
export const resetShortUrlParams = () => ({ type: RESET_SHORT_URL_PARAMS });