diff --git a/frontend/src/components/navigation/org.js b/frontend/src/components/navigation/org.js
index 09754983..64dcad75 100644
--- a/frontend/src/components/navigation/org.js
+++ b/frontend/src/components/navigation/org.js
@@ -16,7 +16,7 @@ const {
} = ReactRedux;
const {
- Link,
+ NavLink
} = ReactRouter;
const {
@@ -110,7 +110,7 @@ const OrgNavigation = ({
return (
-
+
{
({
isActive,
@@ -134,7 +134,7 @@ const OrgNavigation = ({
}
-
+
);
});
diff --git a/frontend/src/components/section/index.js b/frontend/src/components/section/index.js
index 9105f140..4d3a28fc 100644
--- a/frontend/src/components/section/index.js
+++ b/frontend/src/components/section/index.js
@@ -18,7 +18,7 @@ const {
} = ReactIntl;
const {
- Link
+ NavLink
} = ReactRouter;
const {
@@ -43,9 +43,9 @@ const Section = (props) => {
const navLinks = links.map((link) => (
-
+
-
+
));
diff --git a/frontend/src/containers/app.js b/frontend/src/containers/app.js
index 34b33f80..e73d615b 100644
--- a/frontend/src/containers/app.js
+++ b/frontend/src/containers/app.js
@@ -23,8 +23,8 @@ const {
} = ReactRedux;
const {
- Miss,
- Match
+ Switch,
+ Route
} = ReactRouter;
const {
@@ -80,19 +80,18 @@ const App = connect()(React.createClass({
}
}));
-module.exports = (props) => {
- return (
-
-
-
-
-
-
-
-
-
-
- );
-};
+module.exports = (props) => (
+
+
+
+
+
+
+
+
+
+
+
+);
diff --git a/frontend/src/containers/home/index.js b/frontend/src/containers/home/index.js
index bd0e38f8..15b397ae 100644
--- a/frontend/src/containers/home/index.js
+++ b/frontend/src/containers/home/index.js
@@ -14,8 +14,8 @@ const {
} = ReactRedux;
const {
- Match,
- Miss
+ Route,
+ Switch
} = ReactRouter;
const {
@@ -25,21 +25,24 @@ const {
const Home = ({
orgs = []
}) => {
-
const notFound = !orgs.length
?
: Redirect(`/${orgs[0].id}`);
+
return (
-
-
+
+
+
+
);
};
+
Home.propTypes = {
orgs: React.PropTypes.arrayOf(PropTypes.org)
};
diff --git a/frontend/src/containers/new-project/billing.js b/frontend/src/containers/new-project/billing.js
index c945ef19..6fa1f5e9 100644
--- a/frontend/src/containers/new-project/billing.js
+++ b/frontend/src/containers/new-project/billing.js
@@ -58,10 +58,10 @@ Billing.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
// TODO add cards - as above
- org: orgByIdSelector(params.org)(state),
+ org: orgByIdSelector(match.params.org)(state),
router: state.app.router
});
diff --git a/frontend/src/containers/new-project/index.js b/frontend/src/containers/new-project/index.js
index 16b575da..d35d1834 100644
--- a/frontend/src/containers/new-project/index.js
+++ b/frontend/src/containers/new-project/index.js
@@ -6,28 +6,26 @@ const Billing = require('@containers/new-project/billing');
const NewBilling = require('@containers/new-project/new-billing');
const {
- Match
+ Switch,
+ Route
} = ReactRouter;
-module.exports = () => {
-
- return (
-
-
-
-
-
- );
-};
+module.exports = () => (
+
+
+
+
+
+);
diff --git a/frontend/src/containers/new-project/new-billing.js b/frontend/src/containers/new-project/new-billing.js
index c75d9794..dc5f173b 100644
--- a/frontend/src/containers/new-project/new-billing.js
+++ b/frontend/src/containers/new-project/new-billing.js
@@ -52,10 +52,10 @@ NewBilling.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
// TODO add cards - as above
- org: orgByIdSelector(params.org)(state),
+ org: orgByIdSelector(match.params.org)(state),
router: state.app.router
});
diff --git a/frontend/src/containers/new-project/new-project.js b/frontend/src/containers/new-project/new-project.js
index 99b920db..7bd8128b 100644
--- a/frontend/src/containers/new-project/new-project.js
+++ b/frontend/src/containers/new-project/new-project.js
@@ -42,9 +42,9 @@ NewProject.propTypes = {
// TODO we'll need to know whether there any cards
// otherwise go to new billing straight away
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
+ org: orgByIdSelector(match.params.org)(state),
router: state.app.router
});
diff --git a/frontend/src/containers/org/index.js b/frontend/src/containers/org/index.js
index 5462bfc9..b8d26974 100644
--- a/frontend/src/containers/org/index.js
+++ b/frontend/src/containers/org/index.js
@@ -21,8 +21,8 @@ const {
} = ReactRedux;
const {
- Match,
- Miss
+ Switch,
+ Route
} = ReactRouter;
const {
@@ -41,30 +41,34 @@ const Org = ({
}
const missMatch = !sections.length ? null : (
-
+
);
const navMatches = sections.map((name) => (
-
));
navMatches.push(
-
);
return (
-
- {navMatches}
+
{missMatch}
-
+ {navMatches}
+
);
};
@@ -74,8 +78,8 @@ Org.propTypes = {
};
const mapStateToProps = (state, ownProps) => ({
- org: orgByIdSelector(ownProps.params.org)(state),
- sections: orgSectionsSelector(ownProps.params.org)(state)
+ org: orgByIdSelector(ownProps.match.params.org)(state),
+ sections: orgSectionsSelector(ownProps.match.params.org)(state)
});
module.exports = connect(mapStateToProps)(Org);
diff --git a/frontend/src/containers/org/people.js b/frontend/src/containers/org/people.js
index 4be9f3ff..8fab1e0c 100644
--- a/frontend/src/containers/org/people.js
+++ b/frontend/src/containers/org/people.js
@@ -35,11 +35,11 @@ const People = (props) => {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- people: peopleByOrgIdSelector(params.org)(state),
+ people: peopleByOrgIdSelector(match.params.org)(state),
UI: orgUISelector(state),
- parentIndex: orgIndexSelector(params.org)(state),
+ parentIndex: orgIndexSelector(match.params.org)(state),
platformMembers: membersSelector(state)
});
diff --git a/frontend/src/containers/org/projects.js b/frontend/src/containers/org/projects.js
index f76c02bd..234ed533 100644
--- a/frontend/src/containers/org/projects.js
+++ b/frontend/src/containers/org/projects.js
@@ -6,7 +6,8 @@ const Projects = require('@containers/projects');
const Project = require('@containers/project');
const {
- Match
+ Switch,
+ Route
} = ReactRouter;
module.exports = () => {
@@ -17,16 +18,16 @@ module.exports = () => {
);
return (
-
-
+
-
-
+
);
};
diff --git a/frontend/src/containers/org/section.js b/frontend/src/containers/org/section.js
index 22b88bbd..2520489e 100644
--- a/frontend/src/containers/org/section.js
+++ b/frontend/src/containers/org/section.js
@@ -43,8 +43,8 @@ OrgSection.propTypes = {
};
const mapStateToProps = (state, ownProps) => ({
- org: orgByIdSelector(ownProps.params.org)(state),
- sections: orgSectionsSelector(ownProps.params.org)(state)
+ org: orgByIdSelector(ownProps.match.params.org)(state),
+ sections: orgSectionsSelector(ownProps.match.params.org)(state)
});
module.exports = connect(
diff --git a/frontend/src/containers/project/index.js b/frontend/src/containers/project/index.js
index b2000f9b..6734c0bd 100644
--- a/frontend/src/containers/project/index.js
+++ b/frontend/src/containers/project/index.js
@@ -19,8 +19,8 @@ const {
} = ReactRedux;
const {
- Match,
- Miss
+ Switch,
+ Route
} = ReactRouter;
const {
@@ -35,22 +35,22 @@ const Project = ({
sections = []
}) => {
const navMatches = sections.map((name) => (
-
));
const missMatch = !sections.length ? null : (
-
+
);
return (
-
+
{navMatches}
{missMatch}
-
+
);
};
@@ -61,10 +61,10 @@ Project.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
- project: projectByIdSelector(params.projectId)(state),
+ org: orgByIdSelector(match.params.org)(state),
+ project: projectByIdSelector(match.params.projectId)(state),
sections: projectSectionsSelector(state)
});
diff --git a/frontend/src/containers/project/instances.js b/frontend/src/containers/project/instances.js
index 2909f1b5..0767f8c0 100644
--- a/frontend/src/containers/project/instances.js
+++ b/frontend/src/containers/project/instances.js
@@ -47,9 +47,9 @@ Instances.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- instances: instancesByProjectIdSelector(params.projectId)(state)
+ instances: instancesByProjectIdSelector(match.params.projectId)(state)
});
const mapDispatchToProps = (dispatch) => ({
diff --git a/frontend/src/containers/project/section.js b/frontend/src/containers/project/section.js
index cc7ab6fd..0931e6af 100644
--- a/frontend/src/containers/project/section.js
+++ b/frontend/src/containers/project/section.js
@@ -57,10 +57,10 @@ ProjectSection.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
- project: projectByIdSelector(params.projectId)(state),
+ org: orgByIdSelector(match.params.org)(state),
+ project: projectByIdSelector(match.params.projectId)(state),
sections: projectSectionsSelector(state)
});
diff --git a/frontend/src/containers/project/services.js b/frontend/src/containers/project/services.js
index 4fb1d3ac..0f099ea6 100644
--- a/frontend/src/containers/project/services.js
+++ b/frontend/src/containers/project/services.js
@@ -6,7 +6,8 @@ const Services = require('@containers/services');
const Service = require('@containers/service');
const {
- Match
+ Switch,
+ Route
} = ReactRouter;
module.exports = () => {
@@ -17,16 +18,16 @@ module.exports = () => {
);
return (
-
-
+
-
-
+
);
};
diff --git a/frontend/src/containers/projects/index.js b/frontend/src/containers/projects/index.js
index cf390a5e..acbc0b2f 100644
--- a/frontend/src/containers/projects/index.js
+++ b/frontend/src/containers/projects/index.js
@@ -24,7 +24,7 @@ const {
} = selectors;
const {
- Link
+ NavLink
} = ReactRouter;
const Projects = (props) => {
@@ -40,9 +40,12 @@ const Projects = (props) => {
const _projects = projects.map((project) => (
-
+
{project.name}
-
+
));
@@ -75,10 +78,10 @@ Projects.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
- projects: projectsByOrgIdSelector(params.org)(state),
+ org: orgByIdSelector(match.params.org)(state),
+ projects: projectsByOrgIdSelector(match.params.org)(state),
router: state.app.router
});
diff --git a/frontend/src/containers/service/index.js b/frontend/src/containers/service/index.js
index 8d2e92ee..dac779eb 100644
--- a/frontend/src/containers/service/index.js
+++ b/frontend/src/containers/service/index.js
@@ -23,8 +23,8 @@ const {
} = ReactRedux;
const {
- Match,
- Miss
+ Switch,
+ Route
} = ReactRouter;
const {
@@ -78,22 +78,24 @@ const Service = ({
}];
const navMatches = sections.map((name) => (
-
));
const missMatch = !sections.length ? null : (
-
+
);
return (
- {navMatches}
- {missMatch}
+
+ {navMatches}
+ {missMatch}
+
);
};
@@ -106,12 +108,12 @@ Service.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
- project: projectByIdSelector(params.projectId)(state),
+ org: orgByIdSelector(match.params.org)(state),
+ project: projectByIdSelector(match.params.projectId)(state),
sections: serviceSectionsSelector(state),
- service: serviceByIdSelector(params.serviceId)(state)
+ service: serviceByIdSelector(match.params.serviceId)(state)
});
module.exports = connect(
diff --git a/frontend/src/containers/service/instances.js b/frontend/src/containers/service/instances.js
index 019d38d2..862e16c3 100644
--- a/frontend/src/containers/service/instances.js
+++ b/frontend/src/containers/service/instances.js
@@ -46,9 +46,9 @@ Instances.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- instances: instancesByServiceIdSelector(params.serviceId)(state)
+ instances: instancesByServiceIdSelector(match.params.serviceId)(state)
});
const mapDispatchToProps = (dispatch) => ({
diff --git a/frontend/src/containers/service/metrics.js b/frontend/src/containers/service/metrics.js
index e13e9c4b..d9e08459 100644
--- a/frontend/src/containers/service/metrics.js
+++ b/frontend/src/containers/service/metrics.js
@@ -20,11 +20,11 @@ const {
} = actions;
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- datasets: metricsByServiceIdSelector(params.serviceId)(state),
+ datasets: metricsByServiceIdSelector(match.params.serviceId)(state),
metricTypes: metricTypesSelector(state),
- service: serviceByIdSelector(params.serviceId)(state)
+ service: serviceByIdSelector(match.params.serviceId)(state)
});
const mapDispatchToProps = (dispatch) => ({
diff --git a/frontend/src/containers/services/index.js b/frontend/src/containers/services/index.js
index 8eb3bdeb..fbe2b15f 100644
--- a/frontend/src/containers/services/index.js
+++ b/frontend/src/containers/services/index.js
@@ -53,11 +53,11 @@ Services.propTypes = {
};
const mapStateToProps = (state, {
- params = {}
+ match = {}
}) => ({
- org: orgByIdSelector(params.org)(state),
- project: projectByIdSelector(params.projectId)(state),
- services: servicesByProjectIdSelector(params.projectId)(state)
+ org: orgByIdSelector(match.params.org)(state),
+ project: projectByIdSelector(match.params.projectId)(state),
+ services: servicesByProjectIdSelector(match.params.projectId)(state)
});
module.exports = connect(
diff --git a/frontend/src/root.js b/frontend/src/root.js
index 6f18c206..daa7b3fe 100644
--- a/frontend/src/root.js
+++ b/frontend/src/root.js
@@ -31,7 +31,7 @@ module.exports = () => {
- {App}
+
diff --git a/frontend/src/state/reducers/index.js b/frontend/src/state/reducers/index.js
index 85a6e4b7..c86db954 100644
--- a/frontend/src/state/reducers/index.js
+++ b/frontend/src/state/reducers/index.js
@@ -8,6 +8,7 @@ module.exports = () => {
return combineReducers({
account: require('@state/reducers/account'),
app: require('@state/reducers/app'),
+ datacenters: (state = {}) => state,
form: require('redux-form').reducer,
instances: require('@state/reducers/instances'),
intl: require('@state/reducers/intl'),