From 34df8617d2d72c3672d5738e1afcf51a0af8adcf Mon Sep 17 00:00:00 2001
From: Fredrik Strand Oseberg <fredrik.no@gmail.com>
Date: Mon, 20 Sep 2021 16:59:04 +0200
Subject: [PATCH] Fix/strategy permissions (#337)

* fix: only show actions if applicable to the current user

* fix: remove API access from admin settings

* fix: update snapshot
---
 .../StrategyCardHeader/StrategyCardHeader.jsx | 100 ++++++++++--------
 .../__snapshots__/routes-test.jsx.snap        |   1 -
 frontend/src/component/menu/routes.js         |   2 +-
 3 files changed, 58 insertions(+), 45 deletions(-)

diff --git a/frontend/src/component/feature/strategy/StrategyCard/StrategyCardHeader/StrategyCardHeader.jsx b/frontend/src/component/feature/strategy/StrategyCard/StrategyCardHeader/StrategyCardHeader.jsx
index 94ba5af18f..774960ae61 100644
--- a/frontend/src/component/feature/strategy/StrategyCard/StrategyCardHeader/StrategyCardHeader.jsx
+++ b/frontend/src/component/feature/strategy/StrategyCard/StrategyCardHeader/StrategyCardHeader.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 
 import { CardHeader, Typography, IconButton, Tooltip } from '@material-ui/core';
@@ -7,6 +7,8 @@ import { Edit, Delete } from '@material-ui/icons';
 import { useStyles } from './StrategyCardHeader.styles.js';
 import { ReactComponent as ReorderIcon } from '../../../../../assets/icons/reorder.svg';
 import ConditionallyRender from '../../../../common/ConditionallyRender/ConditionallyRender';
+import AccessContext from '../../../../../contexts/AccessContext';
+import { UPDATE_FEATURE } from '../../../../AccessProvider/permissions';
 
 const StrategyCardHeader = ({
     name,
@@ -15,6 +17,8 @@ const StrategyCardHeader = ({
     editStrategy,
     disableDelete,
 }) => {
+    const { hasAccess } = useContext(AccessContext);
+
     const styles = useStyles();
 
     return (
@@ -33,54 +37,64 @@ const StrategyCardHeader = ({
                             {name}
                         </Typography>
                     </Tooltip>
-                    <div className={styles.strategyCardHeaderActions}>
-                        <Tooltip title="Edit strategy">
-                            <IconButton onClick={editStrategy}>
-                                <Edit
-                                    className={styles.strateyCardHeaderIcon}
-                                />
-                            </IconButton>
-                        </Tooltip>
-                        {connectDragSource(
-                            <span>
-                                <Tooltip title="Drag and drop strategy to reorder. This only affects the order of which your strategies are evaluated.">
-                                    <IconButton>
-                                        <ReorderIcon />
-                                    </IconButton>
-                                </Tooltip>
-                            </span>
-                        )}
-                        <ConditionallyRender
-                            condition={disableDelete}
-                            show={
-                                <Tooltip title="One strategy must always be applied. You can not delete this strategy.">
-                                    <span>
-                                        <IconButton
-                                            onClick={removeStrategy}
-                                            disabled={disableDelete}
-                                        >
-                                            <Delete
-                                                className={
-                                                    styles.strateyCardHeaderIcon
-                                                }
-                                            />
-                                        </IconButton>
-                                    </span>
-                                </Tooltip>
-                            }
-                            elseShow={
-                                <Tooltip title="Delete strategy">
-                                    <IconButton onClick={removeStrategy}>
-                                        <Delete
+                    <ConditionallyRender
+                        condition={hasAccess(UPDATE_FEATURE)}
+                        show={
+                            <div className={styles.strategyCardHeaderActions}>
+                                <Tooltip title="Edit strategy">
+                                    <IconButton onClick={editStrategy}>
+                                        <Edit
                                             className={
                                                 styles.strateyCardHeaderIcon
                                             }
                                         />
                                     </IconButton>
                                 </Tooltip>
-                            }
-                        />
-                    </div>
+
+                                {connectDragSource(
+                                    <span>
+                                        <Tooltip title="Drag and drop strategy to reorder. This only affects the order of which your strategies are evaluated.">
+                                            <IconButton>
+                                                <ReorderIcon />
+                                            </IconButton>
+                                        </Tooltip>
+                                    </span>
+                                )}
+                                <ConditionallyRender
+                                    condition={disableDelete}
+                                    show={
+                                        <Tooltip title="One strategy must always be applied. You can not delete this strategy.">
+                                            <span>
+                                                <IconButton
+                                                    onClick={removeStrategy}
+                                                    disabled={disableDelete}
+                                                >
+                                                    <Delete
+                                                        className={
+                                                            styles.strateyCardHeaderIcon
+                                                        }
+                                                    />
+                                                </IconButton>
+                                            </span>
+                                        </Tooltip>
+                                    }
+                                    elseShow={
+                                        <Tooltip title="Delete strategy">
+                                            <IconButton
+                                                onClick={removeStrategy}
+                                            >
+                                                <Delete
+                                                    className={
+                                                        styles.strateyCardHeaderIcon
+                                                    }
+                                                />
+                                            </IconButton>
+                                        </Tooltip>
+                                    }
+                                />
+                            </div>
+                        }
+                    />
                 </>
             }
             disableTypography
diff --git a/frontend/src/component/menu/__tests__/__snapshots__/routes-test.jsx.snap b/frontend/src/component/menu/__tests__/__snapshots__/routes-test.jsx.snap
index 6b5705c4d7..618f8ebfbd 100644
--- a/frontend/src/component/menu/__tests__/__snapshots__/routes-test.jsx.snap
+++ b/frontend/src/component/menu/__tests__/__snapshots__/routes-test.jsx.snap
@@ -333,7 +333,6 @@ Array [
     "component": [Function],
     "layout": "main",
     "menu": Object {
-      "adminSettings": true,
       "advanced": true,
       "mobile": true,
     },
diff --git a/frontend/src/component/menu/routes.js b/frontend/src/component/menu/routes.js
index 1967bdc841..63175e8289 100644
--- a/frontend/src/component/menu/routes.js
+++ b/frontend/src/component/menu/routes.js
@@ -380,7 +380,7 @@ export const routes = [
         component: AdminApi,
         type: 'protected',
         layout: 'main',
-        menu: { mobile: true, advanced: true, adminSettings: true },
+        menu: { mobile: true, advanced: true },
     },
     {
         path: '/admin/users',