fix: [M3-10533] - Fix misleading "Receive a transfer" tooltip when user lacks permissions (linode#12813)

* save work

* updates

* changeset

* remove s

* update tests

Author: coliu-akamai

packages/manager/.changeset/pr-12813-fixed-1757003337258.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Fixed
+---
+
+Misleading 'Receive a transfer' tooltip message when user lacks permission ([#12813](https://github.com/linode/manager/pull/12813))

packages/manager/src/features/EntityTransfers/EntityTransfersLanding/TransferControls.test.tsx

@@ -49,7 +49,7 @@ describe('TransferControls', () => {
     expect(makeServiceTransferBtn).not.toHaveAttribute('aria-disabled', 'true');
   });
 
-  it('should disable "Review Details" button if the user does not have accept_service_transfer permission', async () => {
+  it('should disable "Review Details" button and transfer textfield if the user does not have accept_service_transfer permission', async () => {
     const { getByRole } = renderWithTheme(
       <TransferControls permissions={queryMocks.userPermissions().data} />
     );
@@ -58,6 +58,15 @@ describe('TransferControls', () => {
       name: 'Review Details',
     });
     expect(reviewBtn).toHaveAttribute('aria-disabled', 'true');
+    expect(reviewBtn).toHaveAttribute(
+      'data-qa-tooltip',
+      'You do not have permission to receive service transfers.'
+    );
+
+    const tokenTextfield = getByRole('textbox', {
+      name: 'Receive a Service Transfer',
+    });
+    expect(tokenTextfield).toBeDisabled();
   });
 
   it('should enable "Review Details" button if the user has accept_service_transfer permission', async () => {
@@ -72,6 +81,13 @@ describe('TransferControls', () => {
       <TransferControls permissions={queryMocks.userPermissions().data} />
     );
 
+    const reviewBtnBeforeInput = getByRole('button', {
+      name: 'Review Details',
+    });
+    expect(reviewBtnBeforeInput).toHaveAttribute(
+      'data-qa-tooltip',
+      'Enter a service transfer token to review the details and accept the transfer.'
+    );
     const input = getByPlaceholderText('Enter a token');
     await userEvent.type(input, 'test-token');
 

packages/manager/src/features/EntityTransfers/EntityTransfersLanding/TransferControls.tsx

@@ -66,6 +66,7 @@ export const TransferControls = React.memo((props: Props) => {
             direction="row"
           >
             <StyledTextField
+              disabled={!permissions.accept_service_transfer}
               hideLabel
               label="Receive a Service Transfer"
               onChange={handleInputChange}
@@ -76,7 +77,11 @@ export const TransferControls = React.memo((props: Props) => {
               buttonType="primary"
               disabled={!permissions.accept_service_transfer || token === ''}
               onClick={() => setConfirmDialogOpen(true)}
-              tooltipText="Enter a service transfer token to review the details and accept the transfer."
+              tooltipText={
+                !permissions.accept_service_transfer
+                  ? 'You do not have permission to receive service transfers.'
+                  : 'Enter a service transfer token to review the details and accept the transfer.'
+              }
             >
               Review Details
             </StyledReviewButton>