diff --git a/docs/02-app/02-api-reference/01-directives/use-cache.mdx b/docs/02-app/02-api-reference/01-directives/use-cache.mdx
index 1e6d8d2427efb..b1684a064bc91 100644
--- a/docs/02-app/02-api-reference/01-directives/use-cache.mdx
+++ b/docs/02-app/02-api-reference/01-directives/use-cache.mdx
@@ -230,15 +230,16 @@ When defining multiple caching behaviors, in the same route or component tree, i
 
 **Decision hierarchy for cache boundaries:**
 
-1. Next.js will use the shortest cache profile found within the whole `use cache` boundary, excluding inner `use cache`directives.
+1. Next.js will use the shortest cache profile found within the whole `use cache` boundary, excluding inner `use cache` directives.
 2. If no cache profile exists then the shortest profile times from all inner `use cache` calls applies to this `use cache`. If there are no inner `use cache`'s then the default is used
 3. Inner caches at two levels deep, do not affect the outer cache since they have already provided their duration to their parent.
 
 For example, if you add the `use cache` directive to your page, without specifying a cache profile, the default cache profile will be applied implicitly (`cacheLife(”default”)`). If a component imported into the page also uses the `use cache` directive with its own cache profile, the outer and inner cache profiles are compared, and shortest duration set in the profiles will be applied.
 
-```tsx filename="app/components/parent.tsx" highlight={5,6,19,20}
+```tsx filename="app/components/parent.tsx" highlight={5,6}
 // Parent component
 import { unstable_cacheLife as cacheLife } from 'next/cache'
+import { ChildComponent } from './child'
 
 export async function ParentComponent() {
   'use cache'
@@ -250,13 +251,18 @@ export async function ParentComponent() {
     </div>
   )
 }
+```
+
+And in a separate file, we defined the Child component that was imported:
 
+```tsx filename="app/components/child.tsx" highlight={4,5}
 // Child component
 import { unstable_cacheLife as cacheLife } from 'next/cache'
 
 export async function ChildComponent() {
   'use cache'
   cacheLife('hours')
+  return <div>Child Content</div>
 
   // This component's cache will respect the shorter 'hours' profile
 }