<template>
    <TableComponent :loading="ingresses == null">
        <div class="resource-container ingress-container">
        <div class="header">
            <p>Name</p>
            <p>Namespace</p>
            <p>Ingress Class Name</p>
            <p>Rules</p>
            <p>Actions</p>
        </div>
        <IngressComponent :ingress="ingress" v-for="ingress, index in ingresses" class="resource" :class="{ even: index % 2 }"></IngressComponent>
    </div>
    </TableComponent>
</template>

<script setup lang="ts">
import type { Ingress } from '~/classes/Ingress';
import { ResourceRepo } from '~/classes/ResourceRepo';

const ingresses = ResourceRepo.init<Ingress>().load('ingresses').get();
</script>

<style scoped>
.ingress-container {
    grid-template-columns: 1fr 1fr  1fr 1fr auto;
}
</style>