Need to improve JS function using a few || (logical or) or mayby another solution

Question

I have function it works good but I want to improve that

  const canPrepareReview = (): boolean => {
if (loading) return true;
if (Object.keys(assets).length !== 0) return true;
return master;

}

  <Button
    disabled={!canPrepareReview()}
  >

I try to use something like this

  <Button
    disabled={loading || master || Object.keys(assetsSelected).length === 0}
  >     

but it does not work So any ideas on how it can be improved?

Answer 1

The function evaluates:

loading || Object.keys(assets).length !== 0 || master

But in the first disabled attribute, the function result is negated, so we evaluate:

!(loading || Object.keys(assets).length !== 0 || master)

If you put that as expression in the disabled attribute, it should give equivalent behaviour as in the function-based solution.

However, defining the function is actually better practice. Don't bloat attributes with complex expressions.