Font Library: Update uninstall/delete on client side

lib/experimental/fonts/font-library/class-wp-rest-font-families-controller.php

@@ -263,6 +263,8 @@ public function delete_item( $request ) {
 		foreach ( $this->get_font_face_ids( $font_family_id ) as $font_face_id ) {
 			wp_delete_post( $font_face_id, true );
 		}
+
+		return $deleted;
 	}
 
 	/**

packages/edit-site/src/components/global-styles/font-library-modal/context.js

@@ -17,7 +17,7 @@ import { __ } from '@wordpress/i18n';
 import {
 	fetchGetFontFamilyBySlug,
 	fetchInstallFontFamily,
-	fetchUninstallFonts,
+	fetchUninstallFontFamily,
 	fetchFontCollections,
 	fetchFontCollection,
 } from './resolvers';
@@ -296,13 +296,21 @@ function FontLibraryProvider( { children } ) {
 		}
 	}
 
-	async function uninstallFont( font ) {
+	async function uninstallFont( fontFamilyToUninstall ) {
 		try {
-			// Uninstall the font (remove the font files from the server and the post from the database).
-			const response = await fetchUninstallFonts( [ font ] );
+			// Get the font family data by slug.
+			const fontFamilyToUninstallData = await fetchGetFontFamilyBySlug(
+				fontFamilyToUninstall.slug
+			);
+
+			// Uninstall the font (remove the font files from the server and the posts from the database).
+			const uninstalledFontFamily = await fetchUninstallFontFamily(
+				fontFamilyToUninstallData.id
+			);
+
 			// Deactivate the font family (remove the font family from the global styles).
-			if ( 0 === response.errors.length ) {
-				deactivateFontFamily( font );
+			if ( uninstalledFontFamily.deleted ) {
+				deactivateFontFamily( fontFamilyToUninstall );
 				// Save the global styles to the database.
 				await saveSpecifiedEntityEdits(
 					'root',
@@ -311,9 +319,11 @@ function FontLibraryProvider( { children } ) {
 					[ 'settings.typography.fontFamilies' ]
 				);
 			}
+
 			// Refresh the library (the library font families from database).
 			refreshLibrary();
-			return response;
+
+			return uninstalledFontFamily;
 		} catch ( error ) {
 			// eslint-disable-next-line no-console
 			console.error( error );

packages/edit-site/src/components/global-styles/font-library-modal/installed-fonts.js

@@ -48,15 +48,24 @@ function InstalledFonts() {
 	const [ notice, setNotice ] = useState( null );
 
 	const handleConfirmUninstall = async () => {
-		const response = await uninstallFont( libraryFontSelected );
-		// TODO: Refactor uninstall notices
-		// const uninstallNotice = getNoticeFromUninstallResponse( response );
-		// setNotice( uninstallNotice );
-		// If the font was succesfully uninstalled it is unselected
-		if ( ! response?.errors?.length ) {
+		try {
+			await uninstallFont( libraryFontSelected );
+			setNotice( {
+				type: 'success',
+				message: __( 'Fonts were uninstalled successfully.' ),
+			} );
+
+			// If the font was succesfully uninstalled it is unselected
 			handleUnselectFont();
+			setIsConfirmDeleteOpen( false );
+		} catch ( error ) {
+			setNotice( {
+				type: 'error',
+				message:
+					__( 'There was an error uninstalling the fonts.' ) +
+					error.message,
+			} );
 		}
-		setIsConfirmDeleteOpen( false );
 	};
 
 	const handleUninstallClick = async () => {

packages/edit-site/src/components/global-styles/font-library-modal/resolvers.js

@@ -57,14 +57,10 @@ export async function fetchGetFontFamilyBySlug( slug ) {
 	} );
 }
 
-export async function fetchUninstallFonts( fonts ) {
-	const data = {
-		font_families: fonts,
-	};
+export async function fetchUninstallFontFamily( fontFamilyId ) {
 	const config = {
-		path: '/wp/v2/font-families',
+		path: `/wp/v2/font-families/${ fontFamilyId }?force=true`,
 		method: 'DELETE',
-		data,
 	};
 	return apiFetch( config );
 }