Merge pull request #48 from EmmanuelDemey/master

fix: test if documents is available

src/js/actions/constants/operations/documents.js

@@ -3,3 +3,9 @@ export const LOAD_OPERATIONS_DOCUMENTS_SUCCESS =
 	'LOAD_OPERATIONS_DOCUMENTS_SUCCESS';
 export const LOAD_OPERATIONS_DOCUMENTS_FAILURE =
 	'LOAD_OPERATIONS_DOCUMENTS_FAILURE';
+
+export const LOAD_OPERATIONS_DOCUMENT = 'LOAD_OPERATIONS_DOCUMENT';
+export const LOAD_OPERATIONS_DOCUMENT_SUCCESS =
+	'LOAD_OPERATIONS_DOCUMENT_SUCCESS';
+export const LOAD_OPERATIONS_DOCUMENT_FAILURE =
+	'LOAD_OPERATIONS_DOCUMENT_FAILURE';

src/js/actions/operations/documents/item.js

@@ -0,0 +1,32 @@
+import api from 'js/remote-api/api';
+import * as A from 'js/actions/constants';
+
+export default id => dispatch => {
+	dispatch({
+		type: A.LOAD_OPERATIONS_DOCUMENT,
+		payload: {
+			id,
+		},
+	});
+	/**
+	 * @param {{ uri: { substr: (arg0: any) => void; lastIndexOf: (arg0: string) => number; }; }} results
+	 */
+	/**
+	 * @param {any} err
+	 */
+	return api.getDocument(id).then(
+		results =>
+			dispatch({
+				type: A.LOAD_OPERATIONS_DOCUMENT_SUCCESS,
+				payload: {
+					...results,
+					id: results.uri.substr(results.uri.lastIndexOf('/') + 1),
+				},
+			}),
+		err =>
+			dispatch({
+				type: A.LOAD_OPERATIONS_DOCUMENT_FAILURE,
+				payload: { err },
+			})
+	);
+};

src/js/actions/operations/documents/list.js

@@ -13,7 +13,16 @@ export default () => dispatch => {
 		results =>
 			dispatch({
 				type: A.LOAD_OPERATIONS_DOCUMENTS_SUCCESS,
-				payload: { results: sortByLabel(results) },
+				payload: {
+					results: sortByLabel(
+						results.map(doc => {
+							return {
+								...doc,
+								id: doc.uri.substr(doc.uri.lastIndexOf('/') + 1),
+							};
+						})
+					),
+				},
 			}),
 		err => {
 			dispatch({

src/js/components/operations/document/index.js

@@ -32,7 +32,7 @@ export const mapStateToProps = state => {
 		documentStores: sortByLabel(
 			getOperationsDocuments(state).map(document => {
 				return {
-					id: document.uri.substr(document.uri.lastIndexOf('/') + 1),
+					id: document.id,
 					label: document.labelLg1 || document.labelLg2,
 					uri: document.uri,
 				};

src/js/components/operations/document/index.spec.js

@@ -27,12 +27,10 @@ describe('DocumentHomeContainer', () => {
 		expect(result).toEqual({
 			documentStores: [
 				{
-					id: '1',
 					label: 'labelLg1',
 					uri: 'uri/1',
 				},
 				{
-					id: '2',
 					label: 'labelLg2',
 					uri: 'uri/2',
 				},

src/js/components/operations/document/visualization/home.js

@@ -0,0 +1,63 @@
+import { Note } from 'js/components/shared/note/note';
+import D from 'js/i18n';
+import PropTypes from 'prop-types';
+import React from 'react';
+
+/**
+ * @typedef OperationsDocumentationVisualizationProps
+ * @property {any} attr
+ * @property {boolean} secondLang
+ * @property {{ lg1: string, lg2: string }} langs
+ *
+ * @param {OperationsDocumentationVisualizationProps} props
+ */
+function OperationsDocumentationVisualization({
+	attr,
+	secondLang,
+	langs: { lg1, lg2 },
+}) {
+	return (
+		<React.Fragment>
+			<div className="row">
+				<Note
+					text={attr.descriptionLg1}
+					title={D.descriptionTitle}
+					lang={lg1}
+					alone={!secondLang}
+					allowEmpty={true}
+					context="operations"
+				/>
+				{secondLang && (
+					<Note
+						text={attr.descriptionLg2}
+						title={D.descriptionTitle}
+						lang={lg2}
+						alone={false}
+						allowEmpty={true}
+						context="operations"
+					/>
+				)}
+			</div>
+			<div className="row">
+				<Note
+					text={
+						<a href={attr.url} rel="noopener noreferrer" target="_blank">
+							{attr.url}
+						</a>
+					}
+					title={D.titleLink}
+					lang={lg1}
+					alone={true}
+					allowEmpty={true}
+					context="operations"
+				/>
+			</div>
+		</React.Fragment>
+	);
+}
+
+OperationsDocumentationVisualization.propTypes = {
+	attr: PropTypes.object.isRequired,
+};
+
+export default OperationsDocumentationVisualization;

src/js/components/operations/document/visualization/index.js

@@ -0,0 +1,105 @@
+import { saveSecondLang } from 'js/actions/app';
+import loadDocument from 'js/actions/operations/documents/item';
+import Button from 'js/components/shared/button';
+import Loading from 'js/components/shared/loading';
+import PageSubtitle from 'js/components/shared/page-subtitle';
+import PageTitle from 'js/components/shared/page-title';
+import CheckSecondLang from 'js/components/shared/second-lang-checkbox';
+import D from 'js/i18n';
+import * as select from 'js/reducers';
+import { getSecondLang } from 'js/reducers/app';
+import { getCurrentDocument } from 'js/reducers/operations/selector';
+import buildExtract from 'js/utils/build-extract';
+import { goBack } from 'js/utils/redirection';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router-dom';
+import OperationsDocumentVisualization from './home';
+import { compose } from 'recompose';
+
+const extractId = buildExtract('id');
+
+class DocumentationVisualizationContainer extends Component {
+	static propTypes = {
+		document: PropTypes.object.isRequired,
+		id: PropTypes.string.isRequired,
+		langs: PropTypes.object,
+		secondLang: PropTypes.bool,
+		saveSecondLang: PropTypes.func,
+	};
+
+	componentWillMount() {
+		if (!this.props.document.id) {
+			this.props.loadDocument(this.props.id);
+		}
+	}
+
+	render() {
+		const { id, document, langs, secondLang, saveSecondLang } = this.props;
+
+		if (!document.id)
+			return <Loading textType="loading" context="operations" />;
+
+		return (
+			<div className="container">
+				<CheckSecondLang secondLang={secondLang} onChange={saveSecondLang} />
+
+				<PageTitle
+					title={document.labelLg1 || document.labelLg2}
+					context="operations"
+				/>
+				{secondLang && document.labelLg2 && (
+					<PageSubtitle subTitle={document.labelLg2} context="operations" />
+				)}
+
+				<div className="row btn-line">
+					<Button
+						action={goBack(this.props, '/operations/documents')}
+						label={D.btnReturn}
+						context="operations"
+					/>
+
+					<div className="col-md-8 centered" />
+
+					<Button
+						action={`/operations/document/${document.id}/modify`}
+						label={D.btnUpdate}
+						context="operations"
+					/>
+				</div>
+				<OperationsDocumentVisualization
+					id={id}
+					attr={document}
+					langs={langs}
+					secondLang={secondLang}
+					saveSecondLang={saveSecondLang}
+				/>
+			</div>
+		);
+	}
+}
+
+export const mapStateToProps = (state, ownProps) => {
+	const id = extractId(ownProps);
+	const document = getCurrentDocument(state);
+	return {
+		id,
+		document: id === document.id ? document : {},
+		langs: select.getLangs(state),
+		secondLang: getSecondLang(state),
+	};
+};
+
+const mapDispatchToProps = {
+	saveSecondLang,
+	loadDocument,
+};
+
+export default compose(
+	connect(
+		mapStateToProps,
+		mapDispatchToProps
+	),
+	withRouter
+)(DocumentationVisualizationContainer);

src/js/components/operations/msd/pages/sims-visualisation/index.js

@@ -51,16 +51,20 @@ export default function SimsVisualisation({
 									),
 								}}
 							/>
-							<DocumentsBloc
-								documents={currentSection.documents.filter(isDocument)}
-								localPrefix={isSecondLang ? 'Lg2' : 'Lg1'}
-								objectType="documents"
-							/>
-							<DocumentsBloc
-								documents={currentSection.documents.filter(isLink)}
-								localPrefix={isSecondLang ? 'Lg2' : 'Lg1'}
-								objectType="links"
-							/>
+							{currentSection.documents && (
+								<>
+									<DocumentsBloc
+										documents={currentSection.documents.filter(isDocument)}
+										localPrefix={isSecondLang ? 'Lg2' : 'Lg1'}
+										objectType="documents"
+									/>
+									<DocumentsBloc
+										documents={currentSection.documents.filter(isLink)}
+										localPrefix={isSecondLang ? 'Lg2' : 'Lg1'}
+										objectType="links"
+									/>
+								</>
+							)}
 						</>
 					)}
 					{currentSection.rangeType === CODE_LIST &&

src/js/components/router/operations.js

@@ -7,6 +7,7 @@ import OperationsSeriesContainer from 'js/components/operations/series/';
 import OperationsContainer from 'js/components/operations/operations/';
 import OperationsIndicatorsContainer from 'js/components/operations/indicators/';
 import OperationsDocumentsContainer from 'js/components/operations/document/';
+import DocumentationVisualizationContainer from 'js/components/operations/document/visualization';
 
 import OperationsFamilyVisualizationContainer from 'js/components/operations/families/visualization/';
 import OperationsSeriesVisualizationContainer from 'js/components/operations/series/visualization/';
@@ -51,6 +52,11 @@ class RootComponent extends Component {
 					path="/operations/documents"
 					component={OperationsDocumentsContainer}
 				/>
+				<Route
+					exact
+					path="/operations/document/:id"
+					component={DocumentationVisualizationContainer}
+				/>
 				<Route
 					exact
 					path="/operations/family/create"

src/js/reducers/operations/documents.js

@@ -3,6 +3,9 @@ import {
 	LOAD_OPERATIONS_DOCUMENTS,
 	LOAD_OPERATIONS_DOCUMENTS_SUCCESS,
 	LOAD_OPERATIONS_DOCUMENTS_FAILURE,
+	LOAD_OPERATIONS_DOCUMENT,
+	LOAD_OPERATIONS_DOCUMENT_SUCCESS,
+	LOAD_OPERATIONS_DOCUMENT_FAILURE,
 } from 'js/actions/constants/operations/documents';
 import { isDocument } from 'js/components/operations/document/utils';
 /**
@@ -19,7 +22,7 @@ export const operationsDocuments = function(
 			return {
 				status: LOADING,
 			};
-		case LOAD_OPERATIONS_DOCUMENTS_SUCCESS:
+			case LOAD_OPERATIONS_DOCUMENTS_SUCCESS:
 			const full = action.payload.results;
 			const [documents, links] = full.reduce(
 				(acc, element) => {
@@ -45,3 +48,27 @@ export const operationsDocuments = function(
 			return state;
 	}
 };
+
+export const operationsCurrentDocument = function(
+	state = { status: NOT_LOADED, results: {} },
+	action
+) {
+	switch (action.type) {
+		case LOAD_OPERATIONS_DOCUMENT:
+			return {
+				status: LOADING,
+			};
+		case LOAD_OPERATIONS_DOCUMENT_SUCCESS:
+			return {
+				status: LOADED,
+				results: action.payload,
+			};
+		case LOAD_OPERATIONS_DOCUMENT_FAILURE:
+			return {
+				status: ERROR,
+				err: action.payload.err,
+			};
+		default:
+			return state;
+	}
+};

src/js/reducers/operations/selector.js

@@ -18,3 +18,6 @@ export const getOperationsDocuments = (state, group = 'full') => {
 export const getOperationsDocumentsStatus = state => {
 	return state.operationsDocuments.status;
 };
+export const getCurrentDocument = state => {
+	return state.operationsCurrentDocument.results || {};
+};

src/js/remote-api/api.js

@@ -11,7 +11,7 @@ const api = {
 		res => res,
 	],
 	getDocumentsList: () => ['documents'],
-
+	getDocument: id => [`documents/${id}`],
 	getDissStatusList: () => ['disseminationStatus'],
 	getStampList: () => ['stamps'],
 	getRoleList: () => ['roles'],