<script setup>
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { library } from '@fortawesome/fontawesome-svg-core'
import * as SolidIcons from '@fortawesome/free-solid-svg-icons'

const props = defineProps({
    name: { type: String, required: true },
})

function toPascalCase(str) {
    return str
        .split('-')
        .map(part => part.charAt(0).toUpperCase() + part.slice(1))
        .join('')
}

const iconName = `fa${toPascalCase(props.name)}`

if (SolidIcons[iconName]) {
    library.add(SolidIcons[iconName])
}
</script>

<template>
    <font-awesome-icon :icon="name" />
</template>
