Value isn't updating

   <p class='bg-white'>
       {globalStore.initiativeOrder?.[0].currentHP}
   </p>
   <For
       each={globalStore.initiativeOrder}
       fallback={<></>}>
       {(combatUnit, index) => {
       return (
           <>
               <div
                   data-index={index}
                   class={`flex flex-row items-start justify-around gap-4 text-3xl cursor-pointer m-4 ${combatUnit.isInParty ? 'text-slate-700 hover:text-black' : 'text-red-700 hover:text-red-900'}`}
                   onclick={() => handleUnitNameClick(combatUnit)}>
                   <img
                       src={combatUnit.characterPortrait}
                       alt={combatUnit.name}
                       class='border-2'
                   />
                   <span class='w-full'>
                       {combatUnit.name}
                       {combatUnit.currentHP}
                   </span>
              </div>
          </>
       );
    }}
 </For>