fix: [UIE-9478] - IAM: disable tag edit

packages/manager/.changeset/pr-13046-fixed-1762164490931.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Fixed
+---
+
+IAM: tags editing was enabled for restricted users ([#13046](https://github.com/linode/manager/pull/13046))

packages/manager/src/features/Images/ImagesLanding/EditImageDrawer.test.tsx

@@ -38,7 +38,7 @@ vi.mock('@linode/api-v4', async () => {
 
 beforeEach(() => {
   queryMocks.usePermissions.mockReturnValue({
-    data: { update_image: true },
+    data: { update_image: true, is_account_admin: true },
   });
   queryMocks.useQueryWithPermissions.mockReturnValue({
     data: [props.image],

packages/manager/src/features/Images/ImagesLanding/EditImageDrawer.tsx

@@ -1,6 +1,13 @@
 import { yupResolver } from '@hookform/resolvers/yup';
 import { useUpdateImageMutation } from '@linode/queries';
-import { ActionsPanel, Drawer, Notice, TextField } from '@linode/ui';
+import {
+  ActionsPanel,
+  Box,
+  Drawer,
+  Notice,
+  TextField,
+  TooltipIcon,
+} from '@linode/ui';
 import { Stack, Typography } from '@linode/ui';
 import { updateImageSchema } from '@linode/validation';
 import * as React from 'react';
@@ -30,6 +37,10 @@ export const EditImageDrawer = (props: Props) => {
   );
   const canUpdateImage = permissions?.update_image;
 
+  const { data: accountPermissions } = usePermissions('account', [
+    'is_account_admin',
+  ]);
+
   const defaultValues = {
     description: image?.description ?? undefined,
     label: image?.label,
@@ -153,15 +164,36 @@ export const EditImageDrawer = (props: Props) => {
         control={control}
         name="tags"
         render={({ field, fieldState }) => (
-          <TagsInput
-            disabled={!canUpdateImage}
-            label="Tags"
-            onChange={(tags) => field.onChange(tags.map((tag) => tag.value))}
-            tagError={fieldState.error?.message}
-            value={
-              field.value?.map((tag) => ({ label: tag, value: tag })) ?? []
-            }
-          />
+          <Stack
+            alignItems="center"
+            direction="row"
+            spacing={1}
+            sx={{ display: 'flex' }}
+          >
+            <Box sx={{ flex: 1 }}>
+              <TagsInput
+                disabled={!accountPermissions?.is_account_admin}
+                label="Tags"
+                onChange={(tags) =>
+                  field.onChange(tags.map((tag) => tag.value))
+                }
+                tagError={fieldState.error?.message}
+                value={
+                  field.value?.map((tag) => ({ label: tag, value: tag })) ?? []
+                }
+              />
+            </Box>
+            {!accountPermissions?.is_account_admin && (
+              <TooltipIcon
+                status="info"
+                sxTooltipIcon={{
+                  padding: 0,
+                  top: 20,
+                }}
+                text="You don't have permissions to edit tags. Please contact an account administrator for details."
+              />
+            )}
+          </Stack>
         )}
       />
 

packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/SummaryPanel.test.tsx

@@ -22,7 +22,7 @@ const queryMocks = vi.hoisted(() => ({
   useParams: vi.fn().mockReturnValue({}),
   userPermissions: vi.fn(() => ({
     data: {
-      update_nodebalancer: false,
+      is_account_admin: false,
     },
   })),
 }));
@@ -212,7 +212,7 @@ describe('SummaryPanel', () => {
   it('should enable "Add a tag" if user has permission', () => {
     queryMocks.userPermissions.mockReturnValue({
       data: {
-        update_nodebalancer: true,
+        is_account_admin: true,
       },
     });
     const { getByText } = renderWithTheme(<SummaryPanel />, {

packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/SummaryPanel.tsx

@@ -39,11 +39,9 @@ export const SummaryPanel = () => {
   );
   const displayFirewallLink = !!attachedFirewallData?.data?.length;
 
-  const { data: permissions } = usePermissions(
-    'nodebalancer',
-    ['update_nodebalancer'],
-    nodebalancer?.id
-  );
+  const { data: accountPermissions } = usePermissions('account', [
+    'is_account_admin',
+  ]);
 
   const flags = useIsNodebalancerVPCEnabled();
 
@@ -261,7 +259,7 @@ export const SummaryPanel = () => {
           Tags
         </StyledTitle>
         <TagCell
-          disabled={!permissions.update_nodebalancer}
+          disabled={!accountPermissions.is_account_admin}
           entity="NodeBalancer"
           tags={nodebalancer?.tags}
           updateTags={(tags) => updateNodeBalancer({ tags })}

packages/manager/src/features/Volumes/Partials/VolumesActionMenu.tsx

@@ -35,6 +35,7 @@ export const VolumesActionMenu = (props: Props) => {
 
   const { data: accountPermissions } = usePermissions('account', [
     'create_volume',
+    'is_account_admin',
   ]);
   const { data: volumePermissions, isLoading } = usePermissions(
     'volume',
@@ -76,15 +77,11 @@ export const VolumesActionMenu = (props: Props) => {
         : undefined,
     },
     MANAGE_TAGS: {
-      disabled: !volumePermissions?.update_volume,
+      disabled: !accountPermissions?.is_account_admin,
       onClick: handlers.handleManageTags,
       title: 'Manage Tags',
-      tooltip: !volumePermissions?.update_volume
-        ? getRestrictedResourceText({
-            action: 'edit',
-            isSingular: true,
-            resourceType: 'Volumes',
-          })
+      tooltip: !accountPermissions?.is_account_admin
+        ? "You don't have permissions to manage tags. Please contact an account administrator for details."
         : undefined,
     },
     RESIZE: {

packages/manager/src/features/Volumes/VolumeDetails/VolumeEntityDetails/VolumeEntityDetailFooter.tsx

@@ -15,11 +15,9 @@ interface Props {
 export const VolumeEntityDetailFooter = ({ volume }: Props) => {
   const { enqueueSnackbar } = useSnackbar();
   const { mutateAsync: updateVolume } = useVolumeUpdateMutation(volume.id);
-  const { data: volumePermissions } = usePermissions(
-    'volume',
-    ['update_volume'],
-    volume.id
-  );
+  const { data: accountPermissions } = usePermissions('account', [
+    'is_account_admin',
+  ]);
 
   const updateTags = React.useCallback(
     async (tags: string[]) => {
@@ -37,7 +35,7 @@ export const VolumeEntityDetailFooter = ({ volume }: Props) => {
 
   return (
     <TagCell
-      disabled={!volumePermissions.update_volume}
+      disabled={!accountPermissions.is_account_admin}
       entity="Volume"
       sx={{
         width: '100%',

packages/manager/src/features/Volumes/VolumeDrawers/ManageTagsDrawer/ManageTagsDrawer.tsx

@@ -19,6 +19,10 @@ interface Props {
 export const ManageTagsDrawer = (props: Props) => {
   const { isFetching, onClose: _onClose, open, volume, volumeError } = props;
 
+  const { data: accountPermissions } = usePermissions('account', [
+    'is_account_admin',
+  ]);
+
   const { data: permissions } = usePermissions(
     'volume',
     ['update_volume'],
@@ -89,7 +93,7 @@ export const ManageTagsDrawer = (props: Props) => {
           name="tags"
           render={({ field, fieldState }) => (
             <TagsInput
-              disabled={!canUpdateVolume}
+              disabled={!accountPermissions?.is_account_admin}
               label="Tags"
               name="tags"
               onChange={(selected) =>