Request info: Display accession cards

Signed-off-by: Matija Obreza <matija.obreza@croptrust.org>

locales/en/translations.json

@@ -1888,7 +1888,7 @@
         "shippingAddress": "Shipping address",
         "notes": "Notes",
         "dispatchedTo": "Dispatched to",
-        "requestedAccessionIds": "Requested accession ids"
+        "requestedAccessions": "Requested accessions"
       }
     }
   },

src/requests/actions/admin.ts

 import * as _ from 'lodash';
 
 // constants
-import {ADMIN_APPEND_MATERIAL_REQUESTS, ADMIN_RECEIVE_MATERIAL_REQUEST, ADMIN_RECEIVE_MATERIAL_REQUESTS} from 'requests/constants';
+import {
+  ADMIN_APPEND_MATERIAL_REQUESTS,
+  ADMIN_RECEIVE_MATERIAL_REQUEST,
+  ADMIN_RECEIVE_MATERIAL_REQUEST_ACCESSIONS,
+  ADMIN_RECEIVE_MATERIAL_REQUESTS,
+} from 'requests/constants';
 
 // actions
 import navigateTo from 'actions/navigation';
 
 // services
 import RequestService from 'service/genesys/RequestService';
+import AccessionService from 'service/genesys/AccessionService';
 
 // models
 import MaterialRequest from 'model/request/MaterialRequest';
 import FilteredPage, { IPageRequest } from 'model/FilteredPage';
 import Page from 'model/Page';
 import MaterialRequestFilter from 'model/request/MaterialRequestFilter';
+import Accession from 'model/accession/Accession';
 
 
 const receiveRequests = (paged: FilteredPage<MaterialRequest>, error = null) => ({
@@ -31,6 +38,11 @@ const receiveRequest = (request: MaterialRequest, error = null) => ({
   payload: { request, error },
 });
 
+const receiveRequestAccessions = (accessions: Accession[]) => ({
+  type: ADMIN_RECEIVE_MATERIAL_REQUEST_ACCESSIONS,
+  payload: {accessions},
+});
+
 
 const refreshRequestPID = (request: MaterialRequest) => (dispatch, getState) => {
   const page = getState().requests.admin.paged;
@@ -63,6 +75,7 @@ export const loadMoreRequests = (paged?: FilteredPage<MaterialRequest>) => (disp
 export const loadMaterialRequest = (uuid: string) => (dispatch) => {
   return RequestService.getRequest(uuid)
     .then((request) => {
+      dispatch(loadRequestAccessions(request));
       dispatch(receiveRequest(request));
     })
     .catch((error) => {
@@ -73,6 +86,7 @@ export const loadMaterialRequest = (uuid: string) => (dispatch) => {
 export const recheckPidAction = (uuid: string) => (dispatch) => {
   return RequestService.recheckPid(uuid)
     .then((request) => {
+      dispatch(loadRequestAccessions(request));
       dispatch(receiveRequest(request));
       dispatch(refreshRequestPID(request));
     })
@@ -85,6 +99,7 @@ export const recheckPidAction = (uuid: string) => (dispatch) => {
 export const validateRequestAction = (uuid: string) => (dispatch) => {
   return RequestService.validateRequest(uuid)
     .then((request) => {
+      dispatch(loadRequestAccessions(request));
       dispatch(receiveRequest(request));
     })
     .catch((error) => {
@@ -95,6 +110,7 @@ export const validateRequestAction = (uuid: string) => (dispatch) => {
 export const sendValidationEmailAction = (uuid: string) => (dispatch) => {
   return RequestService.sendValidationEmail(uuid)
     .then((request) => {
+      dispatch(loadRequestAccessions(request));
       dispatch(receiveRequest(request));
     })
     .catch((error) => {
@@ -102,6 +118,12 @@ export const sendValidationEmailAction = (uuid: string) => (dispatch) => {
     });
 };
 
+const loadRequestAccessions = (request: MaterialRequest) => (dispatch) => {
+  return AccessionService.uuidFromIds(request.body.accessionIds)
+    .then((uuids) => AccessionService.listAllByUuid(uuids)
+      .then((accessions) => dispatch(receiveRequestAccessions(accessions))));
+};
+
 export const applyFilters = (filters: string | MaterialRequestFilter, page: IPageRequest = { page: 0 }) => (dispatch) => {
   return RequestService.list(filters, page)
     .then((paged) => {

src/requests/constants.ts

@@ -8,5 +8,6 @@ export const REQUEST_INFO_FORM = 'requests/form/REQUEST_INFO_FORM';
 export const ADMIN_RECEIVE_MATERIAL_REQUESTS = 'requests/admin/RECEIVE_MATERIAL_REQUESTS';
 export const ADMIN_APPEND_MATERIAL_REQUESTS = 'requests/admin/APPEND_MATERIAL_REQUESTS';
 export const ADMIN_RECEIVE_MATERIAL_REQUEST = 'requests/admin/RECEIVE_MATERIAL_REQUEST';
+export const ADMIN_RECEIVE_MATERIAL_REQUEST_ACCESSIONS = 'requests/admin/RECEIVE_MATERIAL_REQUEST_ACCESSIONS';
 
 export const REQUEST_FILTER_FORM = 'Form/request/admin/REQUEST_FILTER_FORM';

src/requests/reducers/admin.ts

@@ -3,16 +3,24 @@ import update from 'immutability-helper';
 import { IReducerAction } from 'model/common.model';
 import MaterialRequest from 'model/request/MaterialRequest';
 import FilteredPage from 'model/FilteredPage';
+import Accession from 'model/accession/Accession';
 
-import {ADMIN_APPEND_MATERIAL_REQUESTS, ADMIN_RECEIVE_MATERIAL_REQUEST, ADMIN_RECEIVE_MATERIAL_REQUESTS} from 'requests/constants';
+import {
+  ADMIN_APPEND_MATERIAL_REQUESTS,
+  ADMIN_RECEIVE_MATERIAL_REQUEST,
+  ADMIN_RECEIVE_MATERIAL_REQUEST_ACCESSIONS,
+  ADMIN_RECEIVE_MATERIAL_REQUESTS,
+} from 'requests/constants';
 
 const INITIAL_STATE: {
     request: Request;
+    accessions: Accession[];
     requestError: any;
     paged: FilteredPage<MaterialRequest>;
     pagedError: any;
 } = {
     request: null,
+    accessions: null,
     requestError: null,
     paged: null,
     pagedError: null,
@@ -29,6 +37,7 @@ function adminRequests(state = INITIAL_STATE, action: IReducerAction) {
             if (receivedIndex !== -1) {
                 return update(state, {
                     request: { $set: request },
+                    accessions: {$set: null},
                     paged: {
                         content: {
                           [receivedIndex]: {$set: request},
@@ -39,12 +48,19 @@ function adminRequests(state = INITIAL_STATE, action: IReducerAction) {
             } else {
                 return update(state, {
                     request: { $set: request},
+                    accessions: {$set: null},
                     paged: {$set: null},
                     requestError: {$set: error},
                 });
             }
         }
 
+        case ADMIN_RECEIVE_MATERIAL_REQUEST_ACCESSIONS: {
+            const {accessions} = action.payload;
+            return update(state, {
+              accessions: {$set: accessions},
+            });
+        }
         case ADMIN_RECEIVE_MATERIAL_REQUESTS: {
             const { paged, error } = action.payload;
             return update(state, {

src/requests/translations.json

@@ -42,7 +42,7 @@
         "shippingAddress": "Shipping address",
         "notes": "Notes",
         "dispatchedTo": "Dispatched to",
-        "requestedAccessionIds": "Requested accession ids"
+        "requestedAccessions": "Requested accessions"
       }
     }
   },

src/requests/ui/admin/DisplayPage.tsx

@@ -8,6 +8,7 @@ import { loadMaterialRequest, sendValidationEmailAction, recheckPidAction, valid
 
 // Models
 import MaterialRequest from 'model/request/MaterialRequest';
+import Accession from 'model/accession/Accession';
 
 // UI
 import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
@@ -19,6 +20,7 @@ import ActionButton from 'ui/common/buttons/ActionButton';
 import BackButton from 'ui/common/buttons/BackButton';
 import Markdown from 'ui/common/markdown';
 import PageTitle from 'ui/common/PageTitle';
+import AccessionCard from 'accessions/ui/c/AccessionCard';
 
 interface IDisplayPageProps extends React.ClassAttributes<any> {
   t: any;
@@ -29,6 +31,7 @@ interface IDisplayPageProps extends React.ClassAttributes<any> {
   recheckPid: any;
   validateRequest: any;
   sendValidationEmail: any;
+  requestAccessions: Accession[];
 }
 
 class DisplayPage extends React.Component<IDisplayPageProps, any> {
@@ -50,7 +53,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
 
   public render() {
 
-    const {request, t, recheckPid, sendValidationEmail, validateRequest} = this.props;
+    const {request, t, recheckPid, sendValidationEmail, validateRequest, requestAccessions} = this.props;
 
 
     return request === null ? (<Loading/>) : (
@@ -78,8 +81,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
                 { request.body.requestInfo && <PropertiesItem title={ t('requests.common.purposeTypeLabel') }>{ t(`requests.common.purposeType.${request.body.requestInfo.purposeType}`) }</PropertiesItem> }
                 { request.body.requestInfo && <PropertiesItem title={ t(`requests.common.preacceptSMTA`) }>{ request.body.requestInfo.preacceptSMTA ? 'Yes' : 'No' }</PropertiesItem> }
                 { request.body.requestInfo && <PropertiesItem title={ t('requests.admin.p.display.notes') }>{ request.body.requestInfo.notes }</PropertiesItem> }
-                <PropertiesItem title={ t('requests.admin.p.display.requestedAccessionIds') }>{ request.body.accessionIds.reduce((id, acc) => `${acc}, ${id}`) }</PropertiesItem>
-              </Properties>
+                </Properties>
             </MainSection>
             { request.body.pid && request.body.pid.type === 'in' &&
               <PageSection title={ t('requests.admin.p.display.recipientPIDInformation') }>
@@ -125,6 +127,15 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
                 </Properties>
               </PageSection>
             }
+
+            { requestAccessions && requestAccessions.length > 0 &&
+              <div>
+                <h3 style={ { marginTop: '1em' } }>{ t('requests.admin.p.display.requestedAccessions') }</h3>
+                <div className="container-spacing-horizontal mb-15">
+                  { requestAccessions.map((accession, index) => <AccessionCard key={ accession.uuid } index={ index } accession={ accession } />) }
+                </div>
+              </div>
+            }
           </PageContents>
         }
       </div>
@@ -134,6 +145,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
 
 const mapStateToProps = (state, ownProps) => ({
   request: state.requests.admin.request,
+  requestAccessions: state.requests.admin.accessions,
   requestId: ownProps.match.params.uuid,
 });
 

src/service/genesys/AccessionService.ts

@@ -14,6 +14,7 @@ import AccessionAuditLog from 'model/accession/AccessionAuditLog';
 const URL_GET_BY_DOI = `/api/v1/acn/{doi}`; // UrlTemplate doesn't like the / in DOI
 const URL_GET_BY_UUID = UrlTemplate.parse(`/api/v1/acn/{uuid}`);
 const URL_GEO_JSON = `/api/v1/acn/geoJson`;
+const URL_UUID_FROM_IDS = `/api/v1/acn/id`;
 const URL_LIST_BY_UUID = `/api/v1/acn/for-uuid`;
 const URL_GET_ACCESSION_AUDIT_LOG_BY_DOI = `/api/v1/acn/auditlog/{doi}`; // UrlTemplate doesn't like the / in DOI
 const URL_GET_ACCESSION_AUDIT_LOG_BY_UUID = UrlTemplate.parse(`/api/v1/acn/auditlog/{uuid}`);
@@ -89,6 +90,24 @@ class AccessionService {
     }).then(({ data }) => data as any);
   }
 
+  /**
+   * uuidFromIds at /api/v1/acn/id
+   *
+   * @param ids ids
+   */
+  public static uuidFromIds(ids: number[]): Promise<string[]> {
+
+    const apiUrl = URL_UUID_FROM_IDS;
+    // console.log(`Fetching from ${apiUrl}`);
+    const content = { data: ids };
+
+    return axiosBackend.request({
+      url: apiUrl,
+      method: 'POST',
+      ...content,
+    }).then(({ data }) => data as string[]);
+  }
+
   /**
    * getAccessionAuditLogByDoi at /api/v1/acn/auditlog/{doi}
    *