<script>
import { s__ } from '~/locale';

const HEADERS = {
  name: s__('ApprovalRule|Name'),
  members: s__('ApprovalRule|Approvers'),
  approvalsRequired: s__('ApprovalRule|No. approvals required'),
  branches: s__('Target branch'),
};

export default {
  props: {
    rules: {
      type: Array,
      required: true,
    },
  },
  HEADERS,
};
</script>

<template>
  <table class="table m-0">
    <thead class="thead-white text-nowrap">
      <slot name="thead" v-bind="$options.HEADERS"></slot>
    </thead>
    <tbody>
      <slot name="tbody" :rules="rules"></slot>
    </tbody>
  </table>
</template>
