feat: [WD-19338] Custom ISO Permission checks (canonical#1120)

## Done

- Restrict upload of Custom ISOs to those with permissions.

Fixes:
- Users without permissions being able to upload Custom ISOs.

## QA

1. Run the LXD-UI:
- On the demo server via the link posted by @webteam-app below. This is
only available for PRs created by collaborators of the repo. Ask
@mas-who or @edlerd for access.
- With a local copy of this branch, [build and run as described in the
docs](../CONTRIBUTING.md#setting-up-for-development).
2. Perform the following QA steps:
- As a user without Custom ISO permissions, attempt to upload a Custom
ISO.
- As a user with Custom ISO permissions, attempt to upload a Custom ISO.

## Screenshots


![image](https://github.com/user-attachments/assets/2d68a9a4-5665-421f-8416-780fa206146f)

src/pages/images/actions/UploadCustomIsoBtn.tsx

@@ -7,17 +7,21 @@ import { queryKeys } from "util/queryKeys";
 import { useToastNotification } from "context/toastNotificationProvider";
 import ResourceLink from "components/ResourceLink";
 import { useSmallScreen } from "context/useSmallScreen";
+import { useProjectEntitlements } from "util/entitlements/projects";
+import { useProject } from "context/useProjects";
 
 interface Props {
   className?: string;
-  project: string;
+  projectName: string;
 }
 
-const UploadCustomIsoBtn: FC<Props> = ({ className, project }) => {
+const UploadCustomIsoBtn: FC<Props> = ({ className, projectName }) => {
   const toastNotify = useToastNotification();
   const { openPortal, closePortal, isOpen, Portal } = usePortal();
   const queryClient = useQueryClient();
   const isSmallScreen = useSmallScreen();
+  const { data: project } = useProject(projectName);
+  const { canCreateStorageVolumes } = useProjectEntitlements();
 
   const handleCancel = () => closePortal();
 
@@ -26,7 +30,7 @@ const UploadCustomIsoBtn: FC<Props> = ({ className, project }) => {
       <>
         Custom ISO{" "}
         <ResourceLink
-          to={`/ui/project/${project}/storage/custom-isos`}
+          to={`/ui/project/${projectName}/storage/custom-isos`}
           type="iso-volume"
           value={name}
         />{" "}
@@ -44,6 +48,12 @@ const UploadCustomIsoBtn: FC<Props> = ({ className, project }) => {
         onClick={openPortal}
         className={className}
         hasIcon={!isSmallScreen}
+        disabled={!canCreateStorageVolumes(project)}
+        title={
+          canCreateStorageVolumes(project)
+            ? "Upload custom ISO"
+            : "You do not have permission to create custom ISOs in this project."
+        }
       >
         {!isSmallScreen && <Icon name="upload" light />}
         <span>Upload custom ISO</span>

src/pages/storage/CustomIsoList.tsx

@@ -168,7 +168,10 @@ const CustomIsoList: FC = () => {
           <Icon className="external-link-icon" name="external-link" />
         </a>
       </p>
-      <UploadCustomIsoBtn className="empty-state-button" project={project} />
+      <UploadCustomIsoBtn
+        className="empty-state-button"
+        projectName={project}
+      />
     </EmptyState>
   ) : (
     <div className="custom-iso-list">
@@ -233,7 +236,7 @@ const CustomIsoList: FC = () => {
             <PageHeader.BaseActions>
               <UploadCustomIsoBtn
                 className="u-float-right u-no-margin--bottom"
-                project={project}
+                projectName={project}
               />
             </PageHeader.BaseActions>
           )}