Fields: Fix React Compiler mutation errors (WordPress#66464)

Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
bph · Oct 25, 2024 · b2d692c · b2d692c
1 parent 399d585
commit b2d692c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/packages/fields/src/fields/slug/slug-edit.tsx b/packages/fields/src/fields/slug/slug-edit.tsx
@@ -38,15 +38,15 @@ const SlugEdit = ( {
 	const permalinkPrefix = prefix;
 	const permalinkSuffix = suffix;
 	const isEditable = PERMALINK_POSTNAME_REGEX.test( permalinkTemplate );
-	const originalSlug = useRef( slug );
-	const slugToDisplay = slug || originalSlug.current;
+	const originalSlugRef = useRef( slug );
+	const slugToDisplay = slug || originalSlugRef.current;
 	const permalink = isEditable
 		? `${ permalinkPrefix }${ slugToDisplay }${ permalinkSuffix }`
 		: safeDecodeURIComponent( data.link || '' );
 
 	useEffect( () => {
-		if ( slug && originalSlug.current === undefined ) {
-			originalSlug.current = slug;
+		if ( slug && originalSlugRef.current === undefined ) {
+			originalSlugRef.current = slug;
 		}
 	}, [ slug ] );
 
@@ -111,7 +111,7 @@ const SlugEdit = ( {
 						} }
 						onBlur={ () => {
 							if ( slug === '' ) {
-								onChangeControl( originalSlug.current );
+								onChangeControl( originalSlugRef.current );
 							}
 						} }
 						aria-describedby={ postUrlSlugDescriptionId }

diff --git a/packages/fields/src/fields/slug/slug-view.tsx b/packages/fields/src/fields/slug/slug-view.tsx
@@ -10,15 +10,15 @@ import type { BasePost } from '../../types';
 
 const SlugView = ( { item }: { item: BasePost } ) => {
 	const slug = item.slug;
-	const originalSlug = useRef( slug );
+	const originalSlugRef = useRef( slug );
 
 	useEffect( () => {
-		if ( slug && originalSlug.current === undefined ) {
-			originalSlug.current = slug;
+		if ( slug && originalSlugRef.current === undefined ) {
+			originalSlugRef.current = slug;
 		}
 	}, [ slug ] );
 
-	const slugToDisplay = slug || originalSlug.current;
+	const slugToDisplay = slug || originalSlugRef.current;
 
 	return `/${ slugToDisplay ?? '' }`;
 };