use function from hook instead of hook itself

invokeai/frontend/web/src/features/controlLayers/components/CanvasAddEntityButtons.tsx

@@ -21,9 +21,7 @@ export const CanvasAddEntityButtons = memo(() => {
   const addControlLayer = useAddControlLayer();
   const addGlobalReferenceImage = useAddGlobalReferenceImage();
   const addRegionalReferenceImage = useAddRegionalReferenceImage();
-  const isReferenceImageEnabled = useIsEntityTypeEnabled('reference_image');
-  const isRegionalGuidanceEnabled = useIsEntityTypeEnabled('regional_guidance');
-  const isControlLayerEnabled = useIsEntityTypeEnabled('control_layer');
+  const isEntityTypeEnabled = useIsEntityTypeEnabled();
 
   return (
     <Flex w="full" h="full" justifyContent="center" gap={4}>
@@ -37,7 +35,7 @@ export const CanvasAddEntityButtons = memo(() => {
               justifyContent="flex-start"
               leftIcon={<PiPlusBold />}
               onClick={addGlobalReferenceImage}
-              isDisabled={!isReferenceImageEnabled}
+              isDisabled={!isEntityTypeEnabled('reference_image')}
             >
               {t('controlLayers.globalReferenceImage')}
             </Button>
@@ -63,7 +61,7 @@ export const CanvasAddEntityButtons = memo(() => {
               justifyContent="flex-start"
               leftIcon={<PiPlusBold />}
               onClick={addRegionalGuidance}
-              isDisabled={!isRegionalGuidanceEnabled}
+              isDisabled={!isEntityTypeEnabled('regional_guidance')}
             >
               {t('controlLayers.regionalGuidance')}
             </Button>
@@ -75,7 +73,7 @@ export const CanvasAddEntityButtons = memo(() => {
               justifyContent="flex-start"
               leftIcon={<PiPlusBold />}
               onClick={addRegionalReferenceImage}
-              isDisabled={!isRegionalGuidanceEnabled}
+              isDisabled={!isEntityTypeEnabled('regional_guidance')}
             >
               {t('controlLayers.regionalReferenceImage')}
             </Button>
@@ -90,7 +88,7 @@ export const CanvasAddEntityButtons = memo(() => {
               justifyContent="flex-start"
               leftIcon={<PiPlusBold />}
               onClick={addControlLayer}
-              isDisabled={!isControlLayerEnabled}
+              isDisabled={!isEntityTypeEnabled('control_layer')}
             >
               {t('controlLayers.controlLayer')}
             </Button>

invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList/EntityListGlobalActionBarAddLayerMenu.tsx

@@ -22,9 +22,7 @@ export const EntityListGlobalActionBarAddLayerMenu = memo(() => {
   const addRegionalReferenceImage = useAddRegionalReferenceImage();
   const addRasterLayer = useAddRasterLayer();
   const addControlLayer = useAddControlLayer();
-  const isReferenceImageEnabled = useIsEntityTypeEnabled('reference_image');
-  const isRegionalGuidanceEnabled = useIsEntityTypeEnabled('regional_guidance');
-  const isControlLayerEnabled = useIsEntityTypeEnabled('control_layer');
+  const isEntityTypeEnabled = useIsEntityTypeEnabled();
 
   return (
     <Menu>
@@ -41,7 +39,11 @@ export const EntityListGlobalActionBarAddLayerMenu = memo(() => {
       />
       <MenuList>
         <MenuGroup title={t('controlLayers.global')}>
-          <MenuItem icon={<PiPlusBold />} onClick={addGlobalReferenceImage} isDisabled={!isReferenceImageEnabled}>
+          <MenuItem
+            icon={<PiPlusBold />}
+            onClick={addGlobalReferenceImage}
+            isDisabled={!isEntityTypeEnabled('reference_image')}
+          >
             {t('controlLayers.globalReferenceImage')}
           </MenuItem>
         </MenuGroup>
@@ -49,15 +51,23 @@ export const EntityListGlobalActionBarAddLayerMenu = memo(() => {
           <MenuItem icon={<PiPlusBold />} onClick={addInpaintMask}>
             {t('controlLayers.inpaintMask')}
           </MenuItem>
-          <MenuItem icon={<PiPlusBold />} onClick={addRegionalGuidance} isDisabled={!isRegionalGuidanceEnabled}>
+          <MenuItem
+            icon={<PiPlusBold />}
+            onClick={addRegionalGuidance}
+            isDisabled={!isEntityTypeEnabled('regional_guidance')}
+          >
             {t('controlLayers.regionalGuidance')}
           </MenuItem>
-          <MenuItem icon={<PiPlusBold />} onClick={addRegionalReferenceImage} isDisabled={!isRegionalGuidanceEnabled}>
+          <MenuItem
+            icon={<PiPlusBold />}
+            onClick={addRegionalReferenceImage}
+            isDisabled={!isEntityTypeEnabled('regional_guidance')}
+          >
             {t('controlLayers.regionalReferenceImage')}
           </MenuItem>
         </MenuGroup>
         <MenuGroup title={t('controlLayers.layer_other')}>
-          <MenuItem icon={<PiPlusBold />} onClick={addControlLayer} isDisabled={!isControlLayerEnabled}>
+          <MenuItem icon={<PiPlusBold />} onClick={addControlLayer} isDisabled={!isEntityTypeEnabled('control_layer')}>
             {t('controlLayers.controlLayer')}
           </MenuItem>
           <MenuItem icon={<PiPlusBold />} onClick={addRasterLayer}>

invokeai/frontend/web/src/features/controlLayers/hooks/useIsEntityTypeEnabled.ts

@@ -3,26 +3,29 @@ import { selectIsCogView4, selectIsSD3 } from 'features/controlLayers/store/para
 import type { CanvasEntityType } from 'features/controlLayers/store/types';
 import { useCallback } from 'react';
 
-export const useIsEntityTypeEnabled = (entityType: CanvasEntityType) => {
+export const useIsEntityTypeEnabled = () => {
   const isSD3 = useAppSelector(selectIsSD3);
   const isCogView4 = useAppSelector(selectIsCogView4);
 
-  const isEntityTypeEnabled = useCallback(() => {
-    switch (entityType) {
-      case 'reference_image':
-        return !isSD3 && !isCogView4;
-      case 'regional_guidance':
-        return !isSD3 && !isCogView4;
-      case 'control_layer':
-        return !isSD3 && !isCogView4;
-      case 'inpaint_mask':
-        return true;
-      case 'raster_layer':
-        return true;
-      default:
-        break;
-    }
-  }, [entityType, isSD3, isCogView4]);
+  const isEntityTypeEnabled = useCallback(
+    (entityType: CanvasEntityType) => {
+      switch (entityType) {
+        case 'reference_image':
+          return !isSD3 && !isCogView4;
+        case 'regional_guidance':
+          return !isSD3 && !isCogView4;
+        case 'control_layer':
+          return !isSD3 && !isCogView4;
+        case 'inpaint_mask':
+          return true;
+        case 'raster_layer':
+          return true;
+        default:
+          break;
+      }
+    },
+    [isSD3, isCogView4]
+  );
 
   return isEntityTypeEnabled;
 };