<template>
    <div>
        <p class="grid-element">{{ persistentVolumeClaim.metadata.name }}</p>
        <p class="grid-element">{{ persistentVolumeClaim.metadata.namespace }}</p>
        <p class="grid-element">{{ calcAge(persistentVolumeClaim.metadata.creationTimestamp) }}</p>
        <p class="grid-element">{{ persistentVolumeClaim.spec.storageClassName }}</p>
        <p class="grid-element">{{ persistentVolumeClaim.spec.accessModes.map(mode => mapAccessMode(mode)).join(", ") }}</p>
        <div class="grid-element">
            <ActionButton>delete</ActionButton>
        </div>
    </div>
</template>

<script setup lang="ts">
import type { PersistentVolumeClaim } from '~/classes/PersistentVolumeClaim';
import { calcAge } from '~/classes/Pod';

defineProps<{
    persistentVolumeClaim: PersistentVolumeClaim
}>();

function mapAccessMode(accessMode: string): string
{
    switch (accessMode)
    {
        case "ReadWriteOnce": {
            return "RWO"
        }
        case "ReadOnlyMany": {
            return "ROX"
        }
        case "ReadWriteMany": {
            return "RWX";
        }
        case "ReadWriteOncePod": {
            return "RWOP";
        }
    }
    return accessMode;
}
</script>