Fixes after rebase

app/api/api.rb

@@ -147,6 +147,7 @@ def to_json_camel_case(val)
     'reaction' => Reaction,
     'sample' => Sample,
     'cell_line' => CelllineSample,
+    'device_description' => DeviceDescription,
   }.freeze
 
   mount Chemotion::LiteratureAPI

app/api/entities/device_description_entity.rb

@@ -62,6 +62,10 @@ class DeviceDescriptionEntity < ApplicationEntity
     expose :measures_to_plan_offline_period
     expose :restart_after_planned_offline_period
 
+    expose_timestamps
+
+    private
+
     def type
       'device_description'
     end

app/assets/stylesheets/application.scss

@@ -59,6 +59,7 @@
  *= require elements_table.scss
  *= require export-collections.scss
  *= require format-container.scss
+ *= require form_fields.scss
  *= require generic_element.scss
  *= require inventory-label-settings.scss
  *= require ketcher.scss

app/assets/stylesheets/form_fields.scss

@@ -149,6 +149,10 @@
   height: 34px;
 }
 
+.grouped-fields-row .react-datepicker-wrapper {
+  width: 100%;
+}
+
 .grouped-fields-row.cols-4 .form-group {
   width: 24%;
 }

app/models/comment.rb

@@ -65,8 +65,10 @@ class Comment < ApplicationRecord
 
   enum device_description_section: {
     properties: 'device_description_properties',
+    detail: 'device_description_detail',
     analyses: 'device_description_analyses',
     attachments: 'device_description_attachments',
+    maintenance: 'device_description_maintenance',
   }, _prefix: true
 
   enum header_section: {

app/models/profile.rb

@@ -88,6 +88,7 @@ def data_default_layout
                   'screen' => 4,
                   'research_plan' => 5,
                   'cell_line' => -1000,
+                  'device_description' => -1100,
                 })
   end
 end

app/packs/src/apps/mydb/elements/details/deviceDescriptions/DeviceDescriptionDetails.js

@@ -1,4 +1,4 @@
-import React, { useState, useContext } from 'react';
+import React, { useState, useEffect, useContext } from 'react';
 import {
   Panel, ButtonToolbar, Button, Tabs, Tab, Tooltip, OverlayTrigger
 } from 'react-bootstrap';
@@ -11,7 +11,11 @@ import MaintenanceForm from './maintenanceTab/MaintenanceForm';
 
 import ElementCollectionLabels from 'src/apps/mydb/elements/labels/ElementCollectionLabels';
 import HeaderCommentSection from 'src/components/comments/HeaderCommentSection';
+import CommentSection from 'src/components/comments/CommentSection';
+import CommentActions from 'src/stores/alt/actions/CommentActions';
 import CommentModal from 'src/components/common/CommentModal';
+import { commentActivation } from 'src/utilities/CommentHelper';
+import MatrixCheck from 'src/components/common/MatrixCheck';
 import ConfirmClose from 'src/components/common/ConfirmClose';
 import PrintCodeButton from 'src/components/common/PrintCodeButton';
 import ElementDetailSortTab from 'src/apps/mydb/elements/details/ElementDetailSortTab';
@@ -45,6 +49,12 @@ const DeviceDescriptionDetails = ({ toggleFullScreen }) => {
   const submitLabel = deviceDescription.isNew ? 'Create' : 'Save';
   let tabContents = [];
 
+  useEffect(() => {
+    if (MatrixCheck(currentUser.matrix, commentActivation) && !deviceDescription.isNew) {
+      CommentActions.fetchComments(deviceDescription);
+    }
+  }, []);
+
   const tabContentComponents = {
     properties: PropertiesForm,
     detail: DetailsForm,
@@ -78,6 +88,10 @@ const DeviceDescriptionDetails = ({ toggleFullScreen }) => {
 
     tabContents.push(
       <Tab eventKey={key} title={title} key={`${key}_${deviceDescription.id}`} disabled={disabled(i)}>
+        {
+          !deviceDescription.isNew &&
+          <CommentSection section={`device_description_${key}`} element={deviceDescription} />
+        }
         {React.createElement(tabContentComponents[key], {
           key: `${deviceDescription.id}-${key}`,
           readonly: isReadOnly()
@@ -135,7 +149,7 @@ const DeviceDescriptionDetails = ({ toggleFullScreen }) => {
 
   const deviceDescriptionHeader = () => {
     const saveBtnDisplay = deviceDescription.isEdited ? '' : 'none';
-    const datetp = formatTimeStampsOfElement(deviceDescription || {});
+    const titleTooltip = formatTimeStampsOfElement(deviceDescription || {});
     const defCol = currentCollection && currentCollection.is_shared === false
       && currentCollection.is_locked === false && currentCollection.label !== 'All' ? currentCollection.id : null;
 
@@ -148,7 +162,7 @@ const DeviceDescriptionDetails = ({ toggleFullScreen }) => {
 
     return (
       <div>
-        <OverlayTrigger placement="bottom" overlay={<Tooltip id="screenDatesx">{datetp}</Tooltip>}>
+        <OverlayTrigger placement="bottom" overlay={<Tooltip id="deviceDescriptionDates">{titleTooltip}</Tooltip>}>
           <span>
             <i className="icon-device_description" />
             &nbsp; <span>{deviceDescription.name}</span> &nbsp;

app/packs/src/apps/mydb/elements/details/deviceDescriptions/FormFields.js

@@ -397,7 +397,7 @@ const mulipleRowInput = (element, store, label, field, rowFields, info) => {
 
 const datePickerInput = (element, store, field, label, info) => {
   const value = elementFieldValue(element, store, field);
-  const selectedDate = value ? moment(value) : null;
+  const selectedDate = value ? value : null;
 
   return (
     <FormGroup key={`${store.key_prefix}-${label}`} className="gu_date_picker">
@@ -407,15 +407,15 @@ const datePickerInput = (element, store, field, label, info) => {
         onChange={handleFieldChanged(store, field, 'date', element.type)}
         popperPlacement="bottom-start"
         isClearable
-        dateFormat="DD-MM-YY"
+        dateFormat="dd-MM-YY"
       />
     </FormGroup>
   );
 }
 
 const timePickerInput = (element, store, field, label, info) => {
   const value = elementFieldValue(element, store, field);
-  const selectedDate = value ? moment(value) : null;
+  const selectedDate = value ? value : null;
 
   return (
     <FormGroup key={`${store.key_prefix}-${label}`} className="gu_date_picker">
@@ -437,7 +437,7 @@ const timePickerInput = (element, store, field, label, info) => {
 }
 
 const dateTimePickerInput = (element, store, field, label, info) => {
-  const selectedDate = element[field] ? moment(element[field]) : null;
+  const selectedDate = element[field] ? element[field] : null;
 
   return (
     <FormGroup key={`${store.key_prefix}-${label}`} className="gu_date_picker">
@@ -448,8 +448,8 @@ const dateTimePickerInput = (element, store, field, label, info) => {
         timeFormat="HH:mm"
         timeIntervals={15}
         timeCaption="Time"
-        dateFormat="DD/MM/yyyy HH:mm"
-        placeholderText="DD/MM/YYYY hh:mm"
+        dateFormat="dd/MM/yyyy HH:mm"
+        placeholderText="dd/MM/YYYY HH:mm"
         popperPlacement="bottom-end"
         selected={selectedDate}
         onChange={handleFieldChanged(store, field, 'datetime', element.type)}

app/packs/src/apps/mydb/elements/details/deviceDescriptions/OntologyFields.js

@@ -3,7 +3,8 @@ import { FormGroup, Modal, Button, ListGroup, ListGroupItem, Panel, ButtonToolba
 import OntologySelect from './OntologySelect';
 import { cloneDeep } from 'lodash';
 import { GenInterface, GenButtonReload } from 'chem-generic-ui';
-import { FlowViewerBtn } from 'src/apps/generic/Utils';
+import { GenFlowViewerBtn } from 'chem-generic-ui';
+import { renderFlowModal } from 'src/apps/generic/Utils';
 import RevisionViewerBtn from 'src/components/generic/RevisionViewerBtn';
 import OntologySortableList from './OntologySortableList';
 
@@ -196,8 +197,8 @@ const setSelectedSegmentId = (segment, store) => {
 const segmentVersionToolbar = (store, segment, segmentKlass, handleSegmentsChange, handleRetrieveRevision, i, j) => {
   return (
     <ButtonToolbar style={{ margin: '5px 0px' }} key={`revisions-buttons-${i}-${j}`}>
-      <FlowViewerBtn generic={segment} />
       <div onClick={() => setSelectedSegmentId(segment, store)}>
+        <GenFlowViewerBtn generic={segment} fnClick={renderFlowModal} />
         <RevisionViewerBtn
           fnRetrieve={handleRetrieveRevision}
           generic={segment}

app/packs/src/apps/mydb/elements/list/AttachmentList.js

@@ -46,6 +46,7 @@ export const attachmentThumbnail = (attachment) => {
               src: attachment.preview,
             }
         }
+        hasPop={false}
         disableClick
       />
       <div className="large-preview-modal">