Fix assets page permissions handling

Signed-off-by: Émile Ré <nemile.re@gmail.com>

apps/console/src/pages/organizations/assets/AssetDetailsPage.tsx

@@ -32,8 +32,6 @@ import { VendorsMultiSelectField } from "/components/form/VendorsMultiSelectFiel
 import type { AssetGraphNodeQuery } from "/__generated__/core/AssetGraphNodeQuery.graphql";
 import { useFormWithSchema } from "/hooks/useFormWithSchema";
 import { useOrganizationId } from "/hooks/useOrganizationId";
-import { use } from "react";
-import { PermissionsContext } from "/providers/PermissionsContext";
 
 const updateAssetSchema = z.object({
   name: z.string().min(1, "Name is required"),
@@ -58,7 +56,6 @@ export default function AssetDetailsPage(props: Props) {
   const organizationId = useOrganizationId();
   const { snapshotId } = useParams<{ snapshotId?: string }>();
   const isSnapshotMode = Boolean(snapshotId);
-  const { isAuthorized } = use(PermissionsContext);
 
   validateSnapshotConsistency(assetEntry, snapshotId);
 
@@ -125,7 +122,7 @@ export default function AssetDetailsPage(props: Props) {
               : __("Virtual")}
           </Badge>
         </div>
-        {!isSnapshotMode && isAuthorized("Asset", "deleteAsset") && (
+        {!isSnapshotMode && asset.node.canDelete && (
           <ActionDropdown variant="secondary">
             <DropdownItem
               variant="danger"
@@ -189,13 +186,11 @@ export default function AssetDetailsPage(props: Props) {
         />
 
         <div className="flex justify-end">
-          {formState.isDirty &&
-            !isSnapshotMode &&
-            isAuthorized("Asset", "updateAsset") && (
-              <Button type="submit" disabled={formState.isSubmitting}>
-                {formState.isSubmitting ? __("Updating...") : __("Update")}
-              </Button>
-            )}
+          {formState.isDirty && !isSnapshotMode && asset.node.canUpdate && (
+            <Button type="submit" disabled={formState.isSubmitting}>
+              {formState.isSubmitting ? __("Updating...") : __("Update")}
+            </Button>
+          )}
         </div>
       </form>
     </div>

apps/console/src/pages/organizations/assets/AssetsPage.tsx

@@ -1,7 +1,6 @@
 import { usePageTitle } from "@probo/hooks";
 import { useTranslate } from "@probo/i18n";
 import { Button, IconPlusLarge, PageHeader } from "@probo/ui";
-import { use } from "react";
 import {
   graphql,
   usePaginationFragment,
@@ -17,7 +16,6 @@ import { SnapshotBanner } from "/components/SnapshotBanner";
 import { assetsQuery } from "/hooks/graph/AssetGraph";
 import type { AssetGraphListQuery } from "/__generated__/core/AssetGraphListQuery.graphql";
 import { useOrganizationId } from "/hooks/useOrganizationId";
-import { PermissionsContext } from "/providers/PermissionsContext";
 
 const paginatedAssetsFragment = graphql`
   fragment AssetsPageFragment on Organization
@@ -61,6 +59,8 @@ const paginatedAssetsFragment = graphql`
             }
           }
           createdAt
+          canUpdate: permission(action: "core:asset:update")
+          canDelete: permission(action: "core:asset:delete")
         }
       }
     }
@@ -88,10 +88,7 @@ export default function AssetsPage(props: Props) {
   const assets = pagination.data.assets?.edges.map((edge) => edge.node);
   const connectionId = pagination.data.assets.__id;
 
-  const { isAuthorized } = use(PermissionsContext);
-  const canWrite =
-    isAuthorized("Asset", "updateAsset") ||
-    isAuthorized("Asset", "deleteAsset");
+  const canWrite = assets.some((asset) => asset.canDelete || asset.canUpdate);
   usePageTitle(__("Assets"));
 
   return (
@@ -103,7 +100,7 @@ export default function AssetsPage(props: Props) {
           "Manage your organization's assets and their classifications.",
         )}
       >
-        {!isSnapshotMode && isAuthorized("Organization", "createAsset") && (
+        {!isSnapshotMode && data.node.canCreateAsset && (
           <CreateAssetDialog
             connection={connectionId}
             organizationId={organizationId}