Can't castShadow when creating instances and use Merged for gltf models

[jobaa11]

I recently refactored my gltf models as instances and now I am having trouble figuring out where I need to place the castShadow prop to show up. Here is how updated my gltf file.

import { useGLTF, Merged } from '@react-three/drei'
import { useRef, useState, createContext, useMemo, useContext } from 'react'
import { useFrame } from '@react-three/fiber';

const context = createContext()


export function SkirtInstances({ children, ...props }) {

  const { nodes } = useGLTF('/models/skirt/skirt-transformed.glb')
  for (let node in nodes) {
    nodes[node].castShadow = true;
  }

  const instances = useMemo(() => ({ Cube021: nodes['Cube021'], Cube021_1: nodes['Cube021_1'], Cube021_2: nodes['Cube021_2'], }), [nodes])
  return (
   
    <Merged meshes={instances} {...props}>
      {(instances) => <context.Provider value={instances} children={children} />}
    </Merged>
    
  )
}

export function Skirt(props) {
  const [spin, setSpin] = useState(true)
  const mesh = useRef(null);
  useFrame(() => (mesh.current.rotation.y += spin ? 0.004 : 0));
  const instances = useContext(context)
  return (
    <group {...props} dispose={null} onClick={(e) => setSpin(!spin)} ref={mesh}>
      <group position={[0, 0.4, 0]} scale={[1.24, 2.05, 1.24]}>
          <instances.Cube021 color={props.mesh} />
          <instances.Cube021_1 color={props.stripes} />
          <instances.Cube021_2 color={props.sole} />
      </group>
    </group>
  )
}

This is how my file looked before where I was able to castShadows (although if I rendered the the same model, the same instance would render, hence why I refactored with instance/merge)

import { useRef, useState } from 'react'
import { useGLTF } from '@react-three/drei'
import { useFrame } from '@react-three/fiber'

export default function Skirt(props) {
  const [spin, setSpin] = useState(true)
  const mesh = useRef(null);
  useFrame(() => (mesh.current.rotation.y += spin ? 0.004 : 0));
  const { nodes, materials } = useGLTF('/models/skirt/skirt-transformed.glb')
  return (
    <group onClick={(e) => setSpin(!spin)} ref={mesh} {...props} dispose={null}>
      <group position={[0, 0.4, 0]} scale={[1.24, 2.05, 1.24]}>
        <mesh castShadow geometry={nodes.Cube021.geometry} material={materials.main} material-color={props.mesh} />
        <mesh castShadow geometry={nodes.Cube021_1.geometry} material={materials.linens} material-color={props.stripes} />
        <mesh castShadow geometry={nodes.Cube021_2.geometry} material={materials['top layer']} material-color={props.sole} />
      </group>
    </group>
  )
}

Any suggestions would be greatly appreciated!

[sho-yasuda-06]

adding castShadow to <Merged/> solved the problem.

<Merged castShadow receiveShadow meshes={instances} {...props}>