From 6c4f047f368d2ee848d21f894b23652d4c8544e7 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 10:59:32 +0000 Subject: [PATCH 01/17] Correct deps to hook --- packages/block-library/src/navigation/edit/index.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index e2c56da7797b9e..eefd59a8d61fb8 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -238,10 +238,12 @@ function Navigation( { ); } }, [ - createNavigationMenuStatus, - createNavigationMenuError, - createNavigationMenuPost, - fallbackNavigationMenus, + createNavigationMenuIsError, + createNavigationMenuIsSuccess, + handleUpdateMenu, + hideNavigationMenuStatusNotice, + isCreatingNavigationMenu, + showNavigationMenuStatusNotice, ] ); // Attempt to retrieve and prioritize any existing navigation menu unless: From 8a1d588b98d36e7698e1672a7de5f313cac553b6 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:00:10 +0000 Subject: [PATCH 02/17] Add refs to hook --- packages/block-library/src/navigation/edit/index.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index eefd59a8d61fb8..8e08d7551a495e 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -274,9 +274,11 @@ function Navigation( { setRef( fallbackNavigationMenus[ 0 ].id ); }, [ ref, + setRef, isCreatingNavigationMenu, fallbackNavigationMenus, hasUncontrolledInnerBlocks, + __unstableMarkNextChangeAsNotPersistent, ] ); const isEntityAvailable = From f2647d1efa3095a7c9dea437140444d1736d258b Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:02:04 +0000 Subject: [PATCH 03/17] Add missing deps to effect --- packages/block-library/src/navigation/edit/index.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 8e08d7551a495e..20aa659efe8353 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -346,7 +346,16 @@ function Navigation( { 'publish' ); } - }, [ hasResolvedNavigationMenus, hasUnsavedBlocks ] ); + }, [ + hasResolvedNavigationMenus, + hasUnsavedBlocks, + classicMenus, + convertClassicMenu, + createNavigationMenu, + fallbackNavigationMenus?.length, + isConvertingClassicMenu, + ref, + ] ); const navRef = useRef(); From 32ac1929dd09d5565124d0a7ef2a06abf76e64d0 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:03:05 +0000 Subject: [PATCH 04/17] Make setRef referentially stable --- packages/block-library/src/navigation/edit/index.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 20aa659efe8353..7cff54a695eced 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -107,9 +107,12 @@ function Navigation( { const ref = attributes.ref; - const setRef = ( postId ) => { - setAttributes( { ref: postId } ); - }; + const setRef = useCallback( + ( postId ) => { + setAttributes( { ref: postId } ); + }, + [ setAttributes ] + ); const recursionId = `navigationMenu/${ ref }`; const hasAlreadyRendered = useHasRecursion( recursionId ); From 8c460a8ebbd3adaec7c053da0d9a28ee263a6d83 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:05:15 +0000 Subject: [PATCH 05/17] Simplify dep on created Navigation Menu Post ID --- packages/block-library/src/navigation/edit/index.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 7cff54a695eced..fe2a321468fa14 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -148,6 +148,8 @@ function Navigation( { isError: createNavigationMenuIsError, } = useCreateNavigationMenu( clientId ); + const { id: createNavigationMenuPostId } = createNavigationMenuPost; + const createUntitledEmptyNavigationMenu = () => { createNavigationMenu( '' ); }; @@ -224,7 +226,7 @@ function Navigation( { } if ( createNavigationMenuIsSuccess ) { - handleUpdateMenu( createNavigationMenuPost.id, { + handleUpdateMenu( createNavigationMenuPostId, { focusNavigationBlock: true, } ); @@ -247,6 +249,7 @@ function Navigation( { hideNavigationMenuStatusNotice, isCreatingNavigationMenu, showNavigationMenuStatusNotice, + createNavigationMenuPostId, ] ); // Attempt to retrieve and prioritize any existing navigation menu unless: @@ -465,7 +468,7 @@ function Navigation( { } if ( createNavigationMenuIsSuccess ) { - handleUpdateMenu( createNavigationMenuPost.id, { + handleUpdateMenu( createNavigationMenuPostId, { focusNavigationBlock: true, } ); @@ -482,7 +485,7 @@ function Navigation( { }, [ createNavigationMenuStatus, createNavigationMenuError, - createNavigationMenuPost, + createNavigationMenuPostId, createNavigationMenuIsError, createNavigationMenuIsSuccess, isCreatingNavigationMenu, From 5842725db9900012902790aa3aeccf723b7adb39 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:05:35 +0000 Subject: [PATCH 06/17] Add missing dep --- packages/block-library/src/navigation/edit/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index fe2a321468fa14..7e7d688ea440aa 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -250,6 +250,7 @@ function Navigation( { isCreatingNavigationMenu, showNavigationMenuStatusNotice, createNavigationMenuPostId, + fallbackNavigationMenus, ] ); // Attempt to retrieve and prioritize any existing navigation menu unless: From 23ca67bc9d89169122580b692d0039a91d881007 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:06:17 +0000 Subject: [PATCH 07/17] Include dependency --- packages/block-library/src/navigation/edit/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 7e7d688ea440aa..7dd7b0325621df 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -441,7 +441,7 @@ function Navigation( { selectBlock( clientId ); } }, - [ selectBlock, clientId ] + [ selectBlock, clientId, setRef ] ); const onSelectClassicMenu = async ( classicMenu ) => { From e5978fc5c01e0d22bf3fab0cfa9f06051f985b92 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:07:01 +0000 Subject: [PATCH 08/17] Add deps to notice handling effect --- packages/block-library/src/navigation/edit/index.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 7dd7b0325621df..89b5c81611b47d 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -512,7 +512,12 @@ function Navigation( { __( 'Classic menu import failed.' ) ); } - }, [ classicMenuConversionStatus, classicMenuConversionError ] ); + }, [ + classicMenuConversionStatus, + classicMenuConversionError, + hideClassicMenuConversionNotice, + showClassicMenuConversionNotice, + ] ); // Spacer block needs orientation from context. This is a patch until // https://github.com/WordPress/gutenberg/issues/36197 is addressed. From 1cc3a6b4d0e8f4dc7da79a5d803608b768fb68f7 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:07:56 +0000 Subject: [PATCH 09/17] Add deps to spacer orientation effect --- packages/block-library/src/navigation/edit/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 89b5c81611b47d..a182bfbe6d867e 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -526,7 +526,11 @@ function Navigation( { __unstableMarkNextChangeAsNotPersistent(); setAttributes( { orientation } ); } - }, [ orientation ] ); + }, [ + orientation, + __unstableMarkNextChangeAsNotPersistent, + setAttributes, + ] ); useEffect( () => { if ( ! enableContrastChecking ) { From 1084289a3c714e43cbdfd8807a6e1ebe577d8b2c Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:09:04 +0000 Subject: [PATCH 10/17] Add deps to color contrast checking --- packages/block-library/src/navigation/edit/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index a182bfbe6d867e..68a31537a2a541 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -560,7 +560,11 @@ function Navigation( { setDetectedOverlayBackgroundColor ); } - } ); + }, [ + enableContrastChecking, + overlayTextColor.color, + overlayBackgroundColor.color, + ] ); useEffect( () => { if ( ! isSelected && ! isInnerBlockSelected ) { From 4e015f06769534441bf6c7d67388baf15df810b8 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:10:08 +0000 Subject: [PATCH 11/17] Add deps to Notice hook --- packages/block-library/src/navigation/edit/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 68a31537a2a541..65bbd05b61bba7 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -605,6 +605,9 @@ function Navigation( { canUserCreateNavigationMenu, hasResolvedCanUserCreateNavigationMenu, ref, + hideNavigationMenuPermissionsNotice, + showNavigationMenuPermissionsNotice, + navMenuResolvedButMissing, ] ); const hasManagePermissions = From f9e56ee71410d25294d54f1949b459763f390e6b Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:11:36 +0000 Subject: [PATCH 12/17] Add missing deps to label setting hook --- .../src/navigation/edit/navigation-menu-selector.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/packages/block-library/src/navigation/edit/navigation-menu-selector.js b/packages/block-library/src/navigation/edit/navigation-menu-selector.js index eb221cbd27a7c2..a7458fd3011654 100644 --- a/packages/block-library/src/navigation/edit/navigation-menu-selector.js +++ b/packages/block-library/src/navigation/edit/navigation-menu-selector.js @@ -103,10 +103,14 @@ function NavigationMenuSelector( { setIsCreatingMenu( false ); } }, [ - isCreatingMenu, - createNavigationMenuIsError, + hasResolvedNavigationMenus, createNavigationMenuIsSuccess, - setIsCreatingMenu, + canUserCreateNavigationMenu, + createNavigationMenuIsError, + isCreatingMenu, + menuUnavailable, + noBlockMenus, + noMenuSelected, ] ); const NavigationMenuSelectorDropdown = ( From ee085e769e81c9b6394aa2c448343b3121eb7b05 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:16:33 +0000 Subject: [PATCH 13/17] Referentially stablise convertClassicMenuToBlockMenu --- .../use-convert-classic-menu-to-block-menu.js | 165 +++++++++--------- 1 file changed, 82 insertions(+), 83 deletions(-) diff --git a/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js b/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js index 8731cb5c32045e..29be140d345daf 100644 --- a/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js +++ b/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js @@ -36,89 +36,88 @@ function useConvertClassicToBlockMenu( clientId ) { const [ status, setStatus ] = useState( CLASSIC_MENU_CONVERSION_IDLE ); const [ error, setError ] = useState( null ); - async function convertClassicMenuToBlockMenu( - menuId, - menuName, - postStatus = 'publish' - ) { - let navigationMenu; - let classicMenuItems; - - // 1. Fetch the classic Menu items. - try { - classicMenuItems = await registry - .resolveSelect( coreStore ) - .getMenuItems( { - menus: menuId, - per_page: -1, - context: 'view', - } ); - } catch ( err ) { - throw new Error( - sprintf( - // translators: %s: the name of a menu (e.g. Header navigation). - __( `Unable to fetch classic menu "%s" from API.` ), - menuName - ), - { - cause: err, - } - ); - } - - // Handle offline response which resolves to `null`. - if ( classicMenuItems === null ) { - throw new Error( - sprintf( - // translators: %s: the name of a menu (e.g. Header navigation). - __( `Unable to fetch classic menu "%s" from API.` ), - menuName - ) - ); - } - - // 2. Convert the classic items into blocks. - const { innerBlocks } = menuItemsToBlocks( classicMenuItems ); - - // 3. Create the `wp_navigation` Post with the blocks. - try { - navigationMenu = await createNavigationMenu( - menuName, - innerBlocks, - postStatus - ); - - /** - * Immediately trigger editEntityRecord to change the wp_navigation post status to 'publish'. - * This status change causes the menu to be displayed on the front of the site and sets the post state to be "dirty". - * The problem being solved is if saveEditedEntityRecord was used here, the menu would be updated on the frontend and the editor _automatically_, - * without user interaction. - * If the user abandons the site editor without saving, there would still be a wp_navigation post created as draft. - */ - await editEntityRecord( - 'postType', - 'wp_navigation', - navigationMenu.id, - { - status: postStatus, - }, - { throwOnError: true } - ); - } catch ( err ) { - throw new Error( - sprintf( - // translators: %s: the name of a menu (e.g. Header navigation). - __( `Unable to create Navigation Menu "%s".` ), - menuName - ), - { - cause: err, - } - ); - } - - return navigationMenu; - } + const convertClassicMenuToBlockMenu = useCallback( + async ( menuId, menuName, postStatus = 'publish' ) => { + let navigationMenu; + let classicMenuItems; + + // 1. Fetch the classic Menu items. + try { + classicMenuItems = await registry + .resolveSelect( coreStore ) + .getMenuItems( { + menus: menuId, + per_page: -1, + context: 'view', + } ); + } catch ( err ) { + throw new Error( + sprintf( + // translators: %s: the name of a menu (e.g. Header navigation). + __( `Unable to fetch classic menu "%s" from API.` ), + menuName + ), + { + cause: err, + } + ); + } + + // Handle offline response which resolves to `null`. + if ( classicMenuItems === null ) { + throw new Error( + sprintf( + // translators: %s: the name of a menu (e.g. Header navigation). + __( `Unable to fetch classic menu "%s" from API.` ), + menuName + ) + ); + } + + // 2. Convert the classic items into blocks. + const { innerBlocks } = menuItemsToBlocks( classicMenuItems ); + + // 3. Create the `wp_navigation` Post with the blocks. + try { + navigationMenu = await createNavigationMenu( + menuName, + innerBlocks, + postStatus + ); + + /** + * Immediately trigger editEntityRecord to change the wp_navigation post status to 'publish'. + * This status change causes the menu to be displayed on the front of the site and sets the post state to be "dirty". + * The problem being solved is if saveEditedEntityRecord was used here, the menu would be updated on the frontend and the editor _automatically_, + * without user interaction. + * If the user abandons the site editor without saving, there would still be a wp_navigation post created as draft. + */ + await editEntityRecord( + 'postType', + 'wp_navigation', + navigationMenu.id, + { + status: postStatus, + }, + { throwOnError: true } + ); + } catch ( err ) { + throw new Error( + sprintf( + // translators: %s: the name of a menu (e.g. Header navigation). + __( `Unable to create Navigation Menu "%s".` ), + menuName + ), + { + cause: err, + } + ); + } + + return navigationMenu; + }, + [ createNavigationMenu, editEntityRecord, registry ] + ); const convert = useCallback( async ( menuId, menuName, postStatus ) => { From 528cab3e421564b61edc547405c5068dcc5e2873 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:17:20 +0000 Subject: [PATCH 14/17] Remove unneeded dep --- .../src/navigation/edit/use-create-navigation-menu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/use-create-navigation-menu.js b/packages/block-library/src/navigation/edit/use-create-navigation-menu.js index 79fcd7d6925451..b4e7372f03cbc5 100644 --- a/packages/block-library/src/navigation/edit/use-create-navigation-menu.js +++ b/packages/block-library/src/navigation/edit/use-create-navigation-menu.js @@ -90,7 +90,7 @@ export default function useCreateNavigationMenu( clientId ) { } ); } ); }, - [ serialize, saveEntityRecord, editEntityRecord, generateDefaultTitle ] + [ saveEntityRecord, editEntityRecord, generateDefaultTitle ] ); return { From d71a83990e54b89c0e9f9f30dff10922040c984e Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:22:25 +0000 Subject: [PATCH 15/17] Add missing deps to Notices hook --- .../block-library/src/navigation/edit/use-navigation-notice.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/edit/use-navigation-notice.js b/packages/block-library/src/navigation/edit/use-navigation-notice.js index 490e11b1a221f9..6d25f041775af9 100644 --- a/packages/block-library/src/navigation/edit/use-navigation-notice.js +++ b/packages/block-library/src/navigation/edit/use-navigation-notice.js @@ -23,7 +23,7 @@ function useNavigationNotice( { name, message = '' } = {} ) { type: 'snackbar', } ); }, - [ noticeRef, createWarningNotice ] + [ noticeRef, createWarningNotice, message, name ] ); const hideNotice = useCallback( () => { From 1f01231221a2e3053e5c3a9ad146cd51a1952a0e Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:22:44 +0000 Subject: [PATCH 16/17] =?UTF-8?q?Disable=20ED=20rule=20and=20add=20context?= =?UTF-8?q?=20as=20to=20why=20it=E2=80=99s=20ommitted?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../navigation/edit/unsaved-inner-blocks.js | 79 +++++++++++-------- 1 file changed, 46 insertions(+), 33 deletions(-) diff --git a/packages/block-library/src/navigation/edit/unsaved-inner-blocks.js b/packages/block-library/src/navigation/edit/unsaved-inner-blocks.js index f83f29621579b1..167b43b9e5bcd5 100644 --- a/packages/block-library/src/navigation/edit/unsaved-inner-blocks.js +++ b/packages/block-library/src/navigation/edit/unsaved-inner-blocks.js @@ -120,40 +120,53 @@ export default function UnsavedInnerBlocks( { const { hasResolvedNavigationMenus } = useNavigationMenu(); // Automatically save the uncontrolled blocks. - useEffect( () => { - // The block will be disabled when used in a BlockPreview. - // In this case avoid automatic creation of a wp_navigation post. - // Otherwise the user will be spammed with lots of menus! - // - // Also ensure other navigation menus have loaded so an - // accurate name can be created. - // - // Don't try saving when another save is already - // in progress. - // - // And finally only create the menu when the block is selected, - // which is an indication they want to start editing. - if ( - isDisabled || - isSaving || - ! hasResolvedDraftNavigationMenus || - ! hasResolvedNavigationMenus || - ! hasSelection || - ! innerBlocksAreDirty - ) { - return; - } + useEffect( + () => { + // The block will be disabled when used in a BlockPreview. + // In this case avoid automatic creation of a wp_navigation post. + // Otherwise the user will be spammed with lots of menus! + // + // Also ensure other navigation menus have loaded so an + // accurate name can be created. + // + // Don't try saving when another save is already + // in progress. + // + // And finally only create the menu when the block is selected, + // which is an indication they want to start editing. + if ( + isDisabled || + isSaving || + ! hasResolvedDraftNavigationMenus || + ! hasResolvedNavigationMenus || + ! hasSelection || + ! innerBlocksAreDirty + ) { + return; + } - createNavigationMenu( null, blocks ); - }, [ - createNavigationMenu, - isDisabled, - isSaving, - hasResolvedDraftNavigationMenus, - hasResolvedNavigationMenus, - innerBlocksAreDirty, - hasSelection, - ] ); + createNavigationMenu( null, blocks ); + }, + /* The dependency "blocks" is intentionally omitted here. + * This is because making blocks a dependency would cause + * createNavigationMenu to run on every block change whereas + * we only want it to run when the blocks are first detected + * as dirty. + * A better solution might be to add a hard saving lock using + * a ref to avoid having to disbale theses eslint rules. + */ + /* eslint-disable react-hooks/exhaustive-deps */ + [ + createNavigationMenu, + isDisabled, + isSaving, + hasResolvedDraftNavigationMenus, + hasResolvedNavigationMenus, + innerBlocksAreDirty, + hasSelection, + ] + /* eslint-enable react-hooks/exhaustive-deps */ + ); const Wrapper = isSaving ? Disabled : 'div'; From 97006f269f0fa61ad1a5694408f3c3831eba81c7 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Thu, 2 Mar 2023 11:25:43 +0000 Subject: [PATCH 17/17] Fix bug with destructuring a potentially null property --- .../src/navigation/edit/index.js | 32 +++++++++---------- 1 file changed, 15 insertions(+), 17 deletions(-) diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js index 65bbd05b61bba7..027b3b87a0a8a7 100644 --- a/packages/block-library/src/navigation/edit/index.js +++ b/packages/block-library/src/navigation/edit/index.js @@ -148,8 +148,6 @@ function Navigation( { isError: createNavigationMenuIsError, } = useCreateNavigationMenu( clientId ); - const { id: createNavigationMenuPostId } = createNavigationMenuPost; - const createUntitledEmptyNavigationMenu = () => { createNavigationMenu( '' ); }; @@ -215,6 +213,17 @@ function Navigation( { [ navigationMenus ] ); + const handleUpdateMenu = useCallback( + ( menuId, options = { focusNavigationBlock: false } ) => { + const { focusNavigationBlock } = options; + setRef( menuId ); + if ( focusNavigationBlock ) { + selectBlock( clientId ); + } + }, + [ selectBlock, clientId, setRef ] + ); + // This useEffect adds snackbar and speak status notices when menus are created. // If there are no fallback navigation menus then we don't show these messages, // because this means that we are creating the first, fallback navigation menu. @@ -226,7 +235,7 @@ function Navigation( { } if ( createNavigationMenuIsSuccess ) { - handleUpdateMenu( createNavigationMenuPostId, { + handleUpdateMenu( createNavigationMenuPost?.id, { focusNavigationBlock: true, } ); @@ -249,7 +258,7 @@ function Navigation( { hideNavigationMenuStatusNotice, isCreatingNavigationMenu, showNavigationMenuStatusNotice, - createNavigationMenuPostId, + createNavigationMenuPost?.id, fallbackNavigationMenus, ] ); @@ -433,17 +442,6 @@ function Navigation( { ] = useState(); const [ detectedOverlayColor, setDetectedOverlayColor ] = useState(); - const handleUpdateMenu = useCallback( - ( menuId, options = { focusNavigationBlock: false } ) => { - const { focusNavigationBlock } = options; - setRef( menuId ); - if ( focusNavigationBlock ) { - selectBlock( clientId ); - } - }, - [ selectBlock, clientId, setRef ] - ); - const onSelectClassicMenu = async ( classicMenu ) => { const navMenu = await convertClassicMenu( classicMenu.id, @@ -469,7 +467,7 @@ function Navigation( { } if ( createNavigationMenuIsSuccess ) { - handleUpdateMenu( createNavigationMenuPostId, { + handleUpdateMenu( createNavigationMenuPost?.id, { focusNavigationBlock: true, } ); @@ -486,7 +484,7 @@ function Navigation( { }, [ createNavigationMenuStatus, createNavigationMenuError, - createNavigationMenuPostId, + createNavigationMenuPost?.id, createNavigationMenuIsError, createNavigationMenuIsSuccess, isCreatingNavigationMenu,