diff --git a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNode.tsx b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNode.tsx
index d2e0667ab2..a33a854c3b 100644
--- a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNode.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNode.tsx
@@ -8,6 +8,7 @@ import InvocationNodeFooter from './InvocationNodeFooter';
 import InvocationNodeHeader from './InvocationNodeHeader';
 import InputField from './fields/InputField';
 import OutputField from './fields/OutputField';
+import { useWithFooter } from 'features/nodes/hooks/useWithFooter';
 
 type Props = {
   nodeId: string;
@@ -20,6 +21,7 @@ type Props = {
 const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
   const inputConnectionFieldNames = useConnectionInputFieldNames(nodeId);
   const inputAnyOrDirectFieldNames = useAnyOrDirectInputFieldNames(nodeId);
+  const withFooter = useWithFooter(nodeId);
   const outputFieldNames = useOutputFieldNames(nodeId);
 
   return (
@@ -41,7 +43,7 @@ const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
               h: 'full',
               py: 2,
               gap: 1,
-              borderBottomRadius: 0,
+              borderBottomRadius: withFooter ? 0 : 'base',
             }}
           >
             <Flex sx={{ flexDir: 'column', px: 2, w: 'full', h: 'full' }}>
@@ -74,7 +76,7 @@ const InvocationNode = ({ nodeId, isOpen, label, type, selected }: Props) => {
               ))}
             </Flex>
           </Flex>
-          <InvocationNodeFooter nodeId={nodeId} />
+          {withFooter && <InvocationNodeFooter nodeId={nodeId} />}
         </>
       )}
     </NodeWrapper>
diff --git a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx
index ba1f7977ab..ec5085221e 100644
--- a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/InvocationNodeFooter.tsx
@@ -5,6 +5,7 @@ import EmbedWorkflowCheckbox from './EmbedWorkflowCheckbox';
 import SaveToGalleryCheckbox from './SaveToGalleryCheckbox';
 import UseCacheCheckbox from './UseCacheCheckbox';
 import { useHasImageOutput } from 'features/nodes/hooks/useHasImageOutput';
+import { useFeatureStatus } from '../../../../../system/hooks/useFeatureStatus';
 
 type Props = {
   nodeId: string;
@@ -12,6 +13,7 @@ type Props = {
 
 const InvocationNodeFooter = ({ nodeId }: Props) => {
   const hasImageOutput = useHasImageOutput(nodeId);
+  const isCacheEnabled = useFeatureStatus('invocationCache').isFeatureEnabled;
   return (
     <Flex
       className={DRAG_HANDLE_CLASSNAME}
@@ -25,7 +27,7 @@ const InvocationNodeFooter = ({ nodeId }: Props) => {
         justifyContent: 'space-between',
       }}
     >
-      <UseCacheCheckbox nodeId={nodeId} />
+      {isCacheEnabled && <UseCacheCheckbox nodeId={nodeId} />}
       {hasImageOutput && <EmbedWorkflowCheckbox nodeId={nodeId} />}
       {hasImageOutput && <SaveToGalleryCheckbox nodeId={nodeId} />}
     </Flex>
diff --git a/invokeai/frontend/web/src/features/nodes/hooks/useWithFooter.ts b/invokeai/frontend/web/src/features/nodes/hooks/useWithFooter.ts
index 57941eaec8..4d2a58cc35 100644
--- a/invokeai/frontend/web/src/features/nodes/hooks/useWithFooter.ts
+++ b/invokeai/frontend/web/src/features/nodes/hooks/useWithFooter.ts
@@ -1,31 +1,14 @@
-import { createSelector } from '@reduxjs/toolkit';
-import { stateSelector } from 'app/store/store';
-import { useAppSelector } from 'app/store/storeHooks';
-import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
-import { some } from 'lodash-es';
+import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
 import { useMemo } from 'react';
-import { FOOTER_FIELDS } from '../types/constants';
-import { isInvocationNode } from '../types/types';
+import { useHasImageOutput } from './useHasImageOutput';
 
-export const useHasImageOutputs = (nodeId: string) => {
-  const selector = useMemo(
-    () =>
-      createSelector(
-        stateSelector,
-        ({ nodes }) => {
-          const node = nodes.nodes.find((node) => node.id === nodeId);
-          if (!isInvocationNode(node)) {
-            return false;
-          }
-          return some(node.data.outputs, (output) =>
-            FOOTER_FIELDS.includes(output.type)
-          );
-        },
-        defaultSelectorOptions
-      ),
-    [nodeId]
+export const useWithFooter = (nodeId: string) => {
+  const hasImageOutput = useHasImageOutput(nodeId);
+  const isCacheEnabled = useFeatureStatus('invocationCache').isFeatureEnabled;
+
+  const withFooter = useMemo(
+    () => hasImageOutput || isCacheEnabled,
+    [hasImageOutput, isCacheEnabled]
   );
-
-  const withFooter = useAppSelector(selector);
   return withFooter;
 };