How can I turn this if statement into a ternary (javascript)

I've written this if statement that returns jsx elements (react) and i was this to be full ternary (not only the one in the second scope:

jsx:

if (pageState === 'ready') {
      return (
        <>
          <Particles className="particles" params={params} />
          <Navigation isSignedIn={isSignedIn} onRouteChange={onRouteChange} />
          {route === 'home'
            ? <>
              <Rank name={this.state.user.name} entries={this.state.user.entries} />
              <LinkForm inputChange={onInputChange} onSubmit={onSubmit} />
              <ImageBox box={box} imageSrc={imageUrl} />
            </>
            : (
              route === 'signin'
                ? <SignIn loadUser={loadUser} onRouteChange={onRouteChange} />
                : <SignUp loadUser={loadUser} onRouteChange={onRouteChange} />
            )
          }
        </>
      )
    } else if (pageState === 'loading') {
      return (
        <>
          <Particles className="particles" params={params} />
          <Loader />
        </>
      )
    }