I think canUser is more correct than useResourcePermissions.

WordPress · Feb 14, 2024 · 5b7e83b · 5b7e83b
1 parent f221b5a
commit 5b7e83b
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 5 deletions.
diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/index.js b/packages/edit-site/src/components/global-styles/font-library-modal/index.js
@@ -6,7 +6,8 @@ import {
 	Modal,
 	privateApis as componentsPrivateApis,
 } from '@wordpress/components';
-import { useResourcePermissions } from '@wordpress/core-data';
+import { useSelect } from '@wordpress/data';
+import { store as coreStore } from '@wordpress/core-data';
 import { useContext } from '@wordpress/element';
 
 /**
@@ -48,12 +49,16 @@ function FontLibraryModal( {
 	initialTabId = 'installed-fonts',
 } ) {
 	const { collections, setNotice } = useContext( FontLibraryContext );
-	const { canCreate } = useResourcePermissions( 'font-families' );
+
+	const canUserCreate = useSelect( ( select ) => {
+		const { canUser } = select( coreStore );
+		return canUser( 'create', 'font-families' );
+	} );
 
 	const tabs = [
 		...DEFAULT_TABS,
-		...( canCreate ? UPLOAD_TABS : [] ),
-		...( canCreate ? tabsFromCollections( collections || [] ) : [] ),
+		...( canUserCreate ? UPLOAD_TABS : [] ),
+		...( canUserCreate ? tabsFromCollections( collections || [] ) : [] ),
 	];
 
 	// Reset notice when new tab is selected.

diff --git a/packages/edit-site/src/components/global-styles/font-library-modal/installed-fonts.js b/packages/edit-site/src/components/global-styles/font-library-modal/installed-fonts.js
@@ -12,6 +12,8 @@ import {
 	Spinner,
 	FlexItem,
 } from '@wordpress/components';
+import { store as coreStore } from '@wordpress/core-data';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -173,11 +175,17 @@ function InstalledFonts() {
 function Footer( { shouldDisplayDeleteButton, handleUninstallClick } ) {
 	const { saveFontFamilies, fontFamiliesHasChanges, isInstalling } =
 		useContext( FontLibraryContext );
+
+	const canUserDelete = useSelect( ( select ) => {
+		const { canUser } = select( coreStore );
+		return canUser( 'delete', 'font-families' );
+	} );
+
 	return (
 		<HStack justify="flex-end">
 			{ isInstalling && <ProgressBar /> }
 			<div>
-				{ shouldDisplayDeleteButton && (
+				{ canUserDelete && shouldDisplayDeleteButton && (
 					<Button
 						isDestructive
 						variant="tertiary"