bugfix/collection-group-user-permissions (#192)

USACE · Nov 16, 2023 · 9d65caa · 9d65caa
1 parent d3d89f3
commit 9d65caa
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 38 deletions.
diff --git a/src/app-pages/collection-group/collection-group.jsx b/src/app-pages/collection-group/collection-group.jsx
@@ -5,25 +5,25 @@ import { Add, KeyboardArrowDown, KeyboardArrowUp } from '@mui/icons-material';
 
 import Button from '../../app-components/button';
 import Card from '../../app-components/card';
-import collectionGroupForm from '../../common/forms/collection-group-form';
-import collectionGroupTimeseriesPicker from './collectiongroup-timeseries-picker';
+import CollectionGroupForm from '../../common/forms/collection-group-form';
+import CollectionGroupTimeseriesPicker from './collectiongroup-timeseries-picker';
 import LoginMessage from '../../app-components/login-message';
 import RoleFilter from '../../app-components/role-filter';
 import TimeseriesList from './collectiongroup-timeseries-list';
 import TimestampModeSwitcher from './collectiongroup-timestamp-mode-switcher';
 
 export default connect(
-  'doCollectionGroupRemoveTimeseries',
   'doModalOpen',
   'doNotificationFire',
+  'doCollectionGroupRemoveTimeseries',
   'doTimeseriesMeasurementsSave',
   'selectAppTime',
   'selectCollectionGroupDetailByRoute',
   'selectProjectsByRoute',
   ({
-    doCollectionGroupRemoveTimeseries,
     doModalOpen,
     doNotificationFire,
+    doCollectionGroupRemoveTimeseries,
     doTimeseriesMeasurementsSave,
     appTime,
     collectionGroupDetailByRoute: detail,
@@ -90,7 +90,7 @@ export default connect(
                   size='small'
                   className='text-left'
                   handleClick={(e) => {
-                    doModalOpen(collectionGroupForm, { item: detail });
+                    doModalOpen(CollectionGroupForm, { item: detail });
                     e.stopPropagation();
                   }}
                   text='Edit'
@@ -122,7 +122,7 @@ export default connect(
                           variant='link'
                           size='small'
                           handleClick={(e) => {
-                            doModalOpen(collectionGroupTimeseriesPicker);
+                            doModalOpen(CollectionGroupTimeseriesPicker);
                             e.stopPropagation();
                           }}
                           text='Add'
@@ -142,16 +142,16 @@ export default connect(
                     <Card.Body>
                       <div style={{ maxHeight: '600px', overflow: 'auto' }}>
                         <TimeseriesList
-                          items={detail.timeseries}
                           date={date}
+                          items={detail.timeseries}
+                          handleItemSaveValue={handleTimeseriesSaveValue}
                           handleItemDelete={(item) => {
                             doCollectionGroupRemoveTimeseries({
                               projectId: detail.project_id,
                               collectionGroupId: detail.id,
                               timeseriesId: item.id,
                             });
                           }}
-                          handleItemSaveValue={handleTimeseriesSaveValue}
                         />
                       </div>
                     </Card.Body>

diff --git a/src/app-pages/collection-group/collectiongroup-timeseries-list.jsx b/src/app-pages/collection-group/collectiongroup-timeseries-list.jsx
@@ -19,17 +19,22 @@ const TimeseriesListEntry = ({
       <div className='d-flex flex-row' style={{ minWidth: '420px' }}>
         <div className='d-flex flex-column my-2'>
           <div className='h5 mb-1'>
-            <a href={`/${item.project_slug}/instruments/${item.instrument_slug}`}>
-              {item.instrument}
-            </a>
-            <RoleFilter allowRoles={[`${item.project_slug.toUpperCase()}.*`]}>
-              <Button
-                variant='link'
-                className='text-secondary h-100'
-                handleClick={() => handleItemDelete(item)}
-                icon={<DeleteOutline color='error' fontSize='small' sx={{ marginBottom: '4px' }} />}
-                title='Remove from group'
-              />
+            <RoleFilter
+              allowRoles={[`${item.project_slug.toUpperCase()}.*`]}
+              alt={() => <span>{item.instrument}</span>}
+            >
+              <>
+                <a href={`/${item.project_slug}/instruments/${item.instrument_slug}`}>
+                  {item.instrument}
+                </a>
+                <Button
+                  variant='link'
+                  className='text-secondary h-100'
+                  handleClick={() => handleItemDelete(item)}
+                  icon={<DeleteOutline color='error' fontSize='small' sx={{ marginBottom: '4px' }} />}
+                  title='Remove from group'
+                />
+              </>
             </RoleFilter>
           </div>
           <div className='h6'>
@@ -54,28 +59,30 @@ const TimeseriesListEntry = ({
           </div>
         </div>
         {/* Column 3 */}
-        <div className='d-flex flex-row'>
-          <div className='input-group'>
-            <input
-              type='number'
-              value={value}
-              className='form-control'
-              placeholder='Enter value...'
-              onChange={(e) => setValue(e.target.value)}
-            />
-            <div className='input-group-append'>
-              <Button
-                variant='secondary'
-                handleClick={() => {
-                  handleItemSaveValue(item, value);
-                  setValue('');
-                }}
-                text='Add'
-                icon={<Add fontSize='inherit' sx={{ marginBottom: '3px' }} />}
+        <RoleFilter allowRoles={[`${item.project_slug.toUpperCase()}.*`]}>
+          <div className='d-flex flex-row'>
+            <div className='input-group'>
+              <input
+                type='number'
+                value={value}
+                className='form-control'
+                placeholder='Enter value...'
+                onChange={(e) => setValue(e.target.value)}
               />
+                <div className='input-group-append'>
+                  <Button
+                    variant='secondary'
+                    handleClick={() => {
+                      handleItemSaveValue(item, value);
+                      setValue('');
+                    }}
+                    text='Add'
+                    icon={<Add fontSize='inherit' sx={{ marginBottom: '3px' }} />}
+                  />
+                </div>
             </div>
           </div>
-        </div>
+        </RoleFilter>
       </div>
     </div>
   );