Tive a impressão de haver um pequeno erro aqui:

Uma estratégia interessante para resolver esse problema é criar um componente que irá ajudar a deixar o código mais limpo, e poderá ser reutilizado em todo o projeto. Vamos dar uma olhada:

interface RenderIfProps {
 condition: boolean;
}

export const RenderIf: React.FC<RenderIfProps> = ({condition}, children) => {
 return condition ? children : <></>;
};

Mais precisamente na declaração da função RenderIf, acredito que children seja uma propriedade do objeto que ela recebe como primeiro parâmetro, e não segundo parâmetro. Tentei copiar o código do jeito que está aqui, e acabei tendo um erro:

Unhandled Runtime Error
Error: Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead.

Assim passou a funcionar:

import React, { ReactElement } from 'react'

interface RenderIfProps {
  condition: boolean
  children: ReactElement<any, any>
}

export const RenderIf: React.FC<RenderIfProps> = ({ condition, children }) => {
  return condition ? children : <></>
}