diff --git a/src/features/forwards/core/components/ForwardComponent.js b/src/features/forwards/core/components/ForwardComponent.js index 4cd2c11..12615a5 100644 --- a/src/features/forwards/core/components/ForwardComponent.js +++ b/src/features/forwards/core/components/ForwardComponent.js @@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next"; import ForwardIcon from "@material-ui/icons/Forward"; import ForwardSummary from "./ForwardSummary"; -const ForwardComponent = ({ forward }) => { +const ForwardComponent = ({ forward, handleForwardClick }) => { const { t } = useTranslation(); return ( @@ -15,7 +15,12 @@ const ForwardComponent = ({ forward }) => { Icon={} title={t("Forward.Label", forward)} subtitle={t("Forward.Subtitle", forward)} - Summary={} + Summary={ + + } Content={
...
} />
@@ -25,7 +30,8 @@ const ForwardComponent = ({ forward }) => { }; ForwardComponent.propTypes = { - forward: PropTypes.object.isRequired + forward: PropTypes.object.isRequired, + handleForwardClick: PropTypes.func.isRequired }; export default ForwardComponent; diff --git a/src/features/forwards/core/components/ForwardContainer.js b/src/features/forwards/core/components/ForwardContainer.js index 33806c7..e20454a 100644 --- a/src/features/forwards/core/components/ForwardContainer.js +++ b/src/features/forwards/core/components/ForwardContainer.js @@ -4,6 +4,7 @@ import ForwardComponent from "./ForwardComponent"; import { useParams } from "react-router"; import { connect } from "react-redux"; import { bindActionCreators } from "redux"; +import { loadServerData } from "../../../server/actionCreators"; import { loadSessionForwards } from "../../../session/actionCreators"; import Spinner from "../../../../components/common/Spinner"; import styles from "../../../../components/common/styles/divStyles"; @@ -12,29 +13,49 @@ import { makeStyles } from "@material-ui/core/styles"; const useStyles = makeStyles(styles); -const ForwardContainer = ({ actions, forward }) => { +const ForwardContainer = ({ actions, forward, domain }) => { const params = useParams(); const classes = useStyles(); const { t } = useTranslation(); const { sessionId } = params; + if (!domain) { + actions.loadServerData(); + } + if (!forward) { actions.loadSessionForwards(sessionId); + } + + const loading = !domain || !forward; + if (loading) { return ; } + const handleForwardClick = forward => event => { + const url = `${domain.scheme}://${domain.name}${ + forward.from + }${forward.suffix || ""}`; + window.open(url, "_blank"); + event.preventDefault(); + }; + return (

{t("Forward.Title", forward)}

- +
); }; ForwardContainer.propTypes = { actions: PropTypes.object.isRequired, - forward: PropTypes.object + forward: PropTypes.object, + domain: PropTypes.object }; function mapStateToProps(state, props) { @@ -43,13 +64,17 @@ function mapStateToProps(state, props) { const forward = session?.find(z => z.forwardId === forwardId); return { - forward + forward, + domain: state.server.data.domain }; } function mapDispatchToProps(dispatch) { return { - actions: bindActionCreators({ loadSessionForwards }, dispatch) + actions: bindActionCreators( + { loadServerData, loadSessionForwards }, + dispatch + ) }; } diff --git a/src/features/forwards/core/components/ForwardSummary.js b/src/features/forwards/core/components/ForwardSummary.js index c1ece8b..b291366 100644 --- a/src/features/forwards/core/components/ForwardSummary.js +++ b/src/features/forwards/core/components/ForwardSummary.js @@ -1,13 +1,13 @@ import React from "react"; import PropTypes from "prop-types"; -import { Grid } from "@material-ui/core"; +import { Grid, Link } from "@material-ui/core"; import { makeStyles } from "@material-ui/core/styles"; import { useTranslation } from "react-i18next"; import styles from "../../../../components/common/styles/gridStyles"; const useStyles = makeStyles(styles); -const ForwardSummary = ({ forward }) => { +const ForwardSummary = ({ forward, handleForwardClick }) => { const classes = useStyles(); const { t } = useTranslation(); @@ -15,7 +15,11 @@ const ForwardSummary = ({ forward }) => { {`${t("Forward.From")}: `} - {forward.from} + + + {forward.from} + + @@ -27,7 +31,8 @@ const ForwardSummary = ({ forward }) => { }; ForwardSummary.propTypes = { - forward: PropTypes.object.isRequired + forward: PropTypes.object.isRequired, + handleForwardClick: PropTypes.func.isRequired }; export default ForwardSummary;