[Compiler Bug]: Unclear preserve-manual-memoization error message.

[cpojer]

What kind of issue is this?

• React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization)
• babel-plugin-react-compiler (build issue installing or using the Babel plugin)
• eslint-plugin-react-compiler (build issue installing or using the eslint plugin)
• react-compiler-healthcheck (build issue installing or using the healthcheck script)

Link to repro

https://playground.react.dev/#N4Igzg9grgTgxgUxALhAgHgBwjALgAjggDswDcIAZCOAQwBsBhWgW01oEsBzY-AXnwAKADq9Crdt2LJ81OkwmceAJQgB3fAB98xKPXoAaUQEoZchszZLe23fv4A+UfnFWp+AGQfnL15J4AdAAmHABmoRxwergAnvgAhAJ29J7eYi50boEcQak+GYpSAfQIAG4I9GB56X7WAcSsCNW+tUXEGARe+a2B6u0wVV01mf7EAWD0UFzNviN1uLRcYN0A-PjA3S5BCGBwMByYuBwkMnNF27v7h8c22gDkd0Y1W2ERUfSxp4WBIeGR0TEni0XDkvlkxjkgcCSuVKmDRsUyhUwFCWg0WAh4XV0QhUb52uhcFi2h08S4JlNiYEKVw8QBfboyZIAblEogw2Dw+FCUGIcCOJHwUDACHMCnBACEYgBlSZcQQ0mRkfbELimWQ0CzfGw6PQpDZiIikAhnHhVATChAAFVoACMSoI7qbiHdjKyxDAELhYLxLQBZBAsCCCQTGRzrbqhHBCI1kfA5fAQUL4ADytoAVgh+QEANYIGJgQTOsDGMMG4GEEhx538HqkADaOQAuu6K2EY9rxnL+HwBDSy5tfJ7vTBeBQxZZRkXtW7BwyavOWsOfbr9K38HSDPh68WtzSm7PiPOQAYQEaIlwUCAOGwcOQYpgmsB8AAFOUcYgp65VjfcmAQFh8DuW07QqABaTB32IMDPVofkwKINgOBKGAAHoQjIO53VEQRy3wVDUMQzBkNoAViD9CBthkYQQAYegaJ8BBiFKDh-2IDFiCJCNiG6Ji7RKF9PRFGBygAUXQDgyA-LgAyDDgAC9SJuABxKBaBgWhOIQHYZFwGAoFxbpSgYHJSIQQSdgQESEHEySjlVWSIAUpSSFU9TNNwbSwF0-SEB8ec6XwMAlLACIdlfdSjgYAAeN8pg-L8yLABw3RPcAAAt1AASS00cGDAFBQnyhA6SAA

Repro steps

The above example calls a module-local function return toLocalCampaign(campaign); and somehow that trips up the preserve-manual-memoization rule. It's unclear why it fails, and the error message does not provide any guidance, so raising it here as a bug. I thought maybe it's because that function could mutate the campaign variable, but doing toLocalCampaign({...campaign}) also does not work.

Help!

How often does this bug happen?

Every time

What version of React are you using?

latest

What version of React Compiler are you using?

latest

[cpojer]

Interestingly, this version passes:

export function useLocalCampaignBySlug(slug: string): LocalCampaign | null {
  const campaigns = useTable('campaign');
  return useMemo(() => {
    let c = null;
    for (const id of Object.keys(campaigns)) {
      const campaign = campaigns[id];
      if (campaign.slug === slug) {
        c = toLocalCampaign(campaign);
        return c;
      }
    }
    return c;
  }, [campaigns, slug]);
}

That makes me think this pattern could be improved in the React Compiler.