Назначение составной ссылки с использованием ссылки Gatsby через реквизиты

У меня есть компонент под названием Plan, который использует компонент Gatsby Link. Это выглядит примерно так:

const Plan = props => (
  ...
  <Button>
    <Link to = {props.goTo}>Learn More</Link>
  </Button>
  ...
)

Это позволяет мне использовать компонент следующим образом: <Plan goTo='events' />, который создаст следующий URL-адрес: www.sitename.com/events.

Однако я действительно хочу, чтобы каждый URL-адрес включал каталог advertise следующим образом: www.sitename.com/advertise/events. Однако я не хочу включать advertise в реквизит goTo.

Чтобы получить этот результат, я попробовал следующее:

const Plan = props => (
  ...
  <Button>
    <Link to=`advertise/${props.goTo}`>Learn More</Link>
  </Button>
  ...
)

Но это не работает.

Итак, мне интересно, как я могу это сделать.

Есть идеи?

Обновлено:

Просто для ясности - вот как я использую компонент:

  <Plan goTo = "events" />
  <PLan goTo = "banner-ads" />

В настоящее время это приводит к следующему HTML (с удаленными именами классов):

<button><a href = "/events">Learn More</a></button>
<button><a href = "/banner-ads">Learn More</a></button>

Я хочу использовать компонент в точно так же (<Plan goTo='events' />), но HTML должен быть немного другим:

<button><a href = "/advertise/events">Learn More</a></button>
<button><a href = "/advertise/banner-ads">Learn More</a></button>

[обратите внимание на добавление /advertise в начале атрибута href]