HAI-1947 Show buttons in application view according to user permissions

src/domain/application/applicationView/ApplicationView.test.tsx

@@ -1,9 +1,10 @@
 import React from 'react';
 import { rest } from 'msw';
-import { render, screen } from '../../../testUtils/render';
+import { render, screen, waitFor } from '../../../testUtils/render';
 import ApplicationViewContainer from './ApplicationViewContainer';
 import { waitForLoadingToFinish } from '../../../testUtils/helperFunctions';
 import { server } from '../../mocks/test-server';
+import { SignedInUser } from '../../hanke/hankeUsers/hankeUser';
 
 test('Correct information about application should be displayed', async () => {
   render(<ApplicationViewContainer id={4} />);
@@ -56,7 +57,7 @@ test('Should show error notification if loading application fails', async () =>
 test('Should be able to go editing application when editing is possible', async () => {
   const { user } = render(<ApplicationViewContainer id={4} />);
 
-  await waitForLoadingToFinish();
+  await waitFor(() => screen.findByRole('button', { name: 'Muokkaa hakemusta' }));
   await user.click(screen.getByRole('button', { name: 'Muokkaa hakemusta' }));
 
   expect(window.location.pathname).toBe('/fi/johtoselvityshakemus/4/muokkaa');
@@ -73,8 +74,7 @@ test('Application edit button should not be displayed when editing is not possib
 test('Should be able to cancel application if it is possible', async () => {
   const { user } = render(<ApplicationViewContainer id={4} />);
 
-  await waitForLoadingToFinish();
-
+  await waitFor(() => screen.findByRole('button', { name: 'Peru hakemus' }));
   await user.click(screen.getByRole('button', { name: 'Peru hakemus' }));
   await user.click(screen.getByRole('button', { name: 'Vahvista' }));
 
@@ -90,3 +90,25 @@ test('Should not be able to cancel application if it has moved to handling in Al
 
   expect(screen.queryByRole('button', { name: 'Peru hakemus' })).not.toBeInTheDocument();
 });
+
+test('Should not show Edit application and Cancel application buttons if user does not have EDIT_APPLICATIONS permission', async () => {
+  server.use(
+    rest.get('/api/hankkeet/:hankeTunnus/whoami', async (req, res, ctx) => {
+      return res(
+        ctx.status(200),
+        ctx.json<SignedInUser>({
+          hankeKayttajaId: '3fa85f64-5717-4562-b3fc-2c963f66afa6',
+          kayttooikeustaso: 'KATSELUOIKEUS',
+          kayttooikeudet: ['VIEW'],
+        }),
+      );
+    }),
+  );
+
+  render(<ApplicationViewContainer id={4} />);
+
+  await waitForLoadingToFinish();
+
+  expect(screen.queryByRole('button', { name: 'Muokkaa hakemusta' })).not.toBeInTheDocument();
+  expect(screen.queryByRole('button', { name: 'Peru hakemus' })).not.toBeInTheDocument();
+});

src/domain/application/applicationView/ApplicationView.tsx

@@ -38,6 +38,7 @@ import { ApplicationCancel } from '../components/ApplicationCancel';
 import AttachmentSummary from '../components/AttachmentSummary';
 import useAttachments from '../hooks/useAttachments';
 import FeatureFlags from '../../../common/components/featureFlags/FeatureFlags';
+import UserRightsCheck from '../../hanke/hankeUsers/UserRightsCheck';
 
 type Props = {
   application: Application;
@@ -119,21 +120,25 @@ function ApplicationView({ application, hanke, onEditApplication }: Props) {
 
         <InformationViewHeaderButtons>
           {isPending ? (
-            <Button
-              theme="coat"
-              iconLeft={<IconPen aria-hidden="true" />}
-              onClick={onEditApplication}
-            >
-              {t('hakemus:buttons:editApplication')}
-            </Button>
+            <UserRightsCheck requiredRight="EDIT_APPLICATIONS" hankeTunnus={hanke?.hankeTunnus}>
+              <Button
+                theme="coat"
+                iconLeft={<IconPen aria-hidden="true" />}
+                onClick={onEditApplication}
+              >
+                {t('hakemus:buttons:editApplication')}
+              </Button>
+            </UserRightsCheck>
           ) : null}
           {hanke ? (
-            <ApplicationCancel
-              applicationId={id}
-              alluStatus={alluStatus}
-              hankeTunnus={hanke?.hankeTunnus}
-              buttonIcon={<IconTrash aria-hidden />}
-            />
+            <UserRightsCheck requiredRight="EDIT_APPLICATIONS" hankeTunnus={hanke?.hankeTunnus}>
+              <ApplicationCancel
+                applicationId={id}
+                alluStatus={alluStatus}
+                hankeTunnus={hanke?.hankeTunnus}
+                buttonIcon={<IconTrash aria-hidden />}
+              />
+            </UserRightsCheck>
           ) : null}
         </InformationViewHeaderButtons>
       </InformationViewHeader>

src/domain/hanke/hankeUsers/UserRightsCheck.tsx

@@ -14,7 +14,7 @@ function UserRightsCheck({
   /** User right that is required to render children */
   requiredRight: keyof typeof Rights;
   /** hankeTunnus of the hanke that the right is required for */
-  hankeTunnus: string;
+  hankeTunnus?: string;
   children: React.ReactElement;
 }) {
   const { data: signedInUser } = useUserRightsForHanke(hankeTunnus);