feat: [M3-7684] - Disable Create Volume button with tooltiptext on 'Empty State Landing Page' for Restricted Users

[pmakode-akamai]

Description 📝

To prevent unauthorized access to specific flows and provide clearer guidance, we aim to restrict entry to users without the required permissions.

Here, we are restricting users from creating new Volume from the Empty State Landing Page when they do not have access or have read-only access.

Changes 🔄

• For restricted users:
  • Disabled Create Volume Button on the Empty State Landing Page

Target release date 🗓️

July 8th, 2024

Preview 📷

Before	After

How to test 🧪

Prerequisites

(How to setup test environment)

• Log into two accounts side by side:
  • An unrestricted admin user account: full access
  • A restricted user account (use Incognito for this)
    - Start with Read Only for everything

Reproduction steps

• Landing:
  • Observe as restricted user, notice shows and you cannot create Volumes

Verification steps

• After changes, observe tooltips are tailored to the action.

As an Author I have considered 🤔

Check all that apply

• 👀 Doing a self review
• ❔ Our contribution guidelines
• 🤏 Splitting feature into small PRs
• ➕ Adding a changeset
• 🧪 Providing/Improving test coverage
• 🔐 Removing all sensitive information from the code and PR description
• 🚩 Using a feature flag to protect the release
• 👣 Providing comprehensive reproduction steps
• 📑 Providing or updating our documentation
• 🕛 Scheduling a pair reviewing session
• 📱 Providing mobile support
• ♿ Providing accessibility support

[github-actions]

Coverage Report: ✅
Base Coverage: 82.18%
Current Coverage: 82.18%

[dwiley-akamai]

Congrats on opening your first PR for CM @pmakode-akamai! 🎉 (edit: oh, technically your second 😆)

"Create Volume" button on Volumes landing page is disabled for restricted users without the appropriate permission, and the appropriate tooltip shows up ✅

Can you add a changeset for these changes? Our CONTRIBUTING.md doc explains how to do it here in step 7.

[bnussman-akamai]

Looks good!

Here's an example of a unit test we could write to check for this new feature

Unit Test Example

import { waitFor } from '@testing-library/react';
import React from 'react';

import { grantsFactory, profileFactory } from 'src/factories';
import { makeResourcePage } from 'src/mocks/serverHandlers';
import { HttpResponse, http, server } from 'src/mocks/testServer';
import { renderWithTheme } from 'src/utilities/testHelpers';

import { VolumesLandingEmptyState } from './VolumesLandingEmptyState';

describe('VolumesLandingEmptyState', () => {
  it('disables the create button if the user does not have permission to create volumes', async () => {
    server.use(
      http.get('*/v4/profile', () => {
        const profile = profileFactory.build({ restricted: true });
        return HttpResponse.json(profile);
      }),
      http.get('*/v4/profile/grants', () => {
        const grants = grantsFactory.build({ global: { add_volumes: false } });
        return HttpResponse.json(grants);
      }),
      http.get('*/v4/volumes', () => {
        return HttpResponse.json(makeResourcePage([]));
      })
    );

    const { getByText } = renderWithTheme(<VolumesLandingEmptyState />);

    await waitFor(() => {
      const createVolumeButton = getByText('Create Volume').closest('button');

      expect(createVolumeButton).toBeDisabled();
      expect(createVolumeButton).toHaveAttribute(
        'data-qa-tooltip',
        "You don't have permissions to create Volumes. Please contact your account administrator to request the necessary permissions."
      );
    });
  });
});

[pmakode-akamai]

Congrats on opening your first PR for CM @pmakode-akamai! 🎉 (edit: oh, technically your second 😆)

"Create Volume" button on Volumes landing page is disabled for restricted users without the appropriate permission, and the appropriate tooltip shows up ✅

Can you add a changeset for these changes? Our CONTRIBUTING.md doc explains how to do it here in step 7.

Thanks @dwiley-akamai! I have added the changeset. Can you please check?

[dwiley-akamai]

Thanks for adding the changeset! I left a couple of comments on it, I think it'd be more accurate to consider this a change rather than an addition but things look good otherwise 🚀