searchanddisplace-core/resources/js/components/layout/Header.vue

<template>
    <div class="header">
        <!-- Left side of header -->
        <div class="left">
            <Button @click="onHomeButtonClick" class="p-button-primary" label="Search and Displace" />
        </div>

        <!-- Right side of header -->
        <div class="right">
            <a href="/regex/create" style="margin-right: 1rem;">
                <Button class="fc-button">Add regex</Button>
            </a>

            <a href="/searchers">
                <Button class="fc-button">Searchers</Button>
            </a>
        </div>
    </div>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';

@Component
export default class AppHeader extends Vue {
    onHomeButtonClick() {
        window.location.href = '/';
    }
}
</script>