namespace App\Actions\Fortify;

use Laravel\Fortify\Contracts\TwoFactorAuthenticationProvider;

class EnableTwoFactorAuthentication
{
    public function __construct(protected TwoFactorAuthenticationProvider $provider) {}

    public function __invoke($user): void
    {
        $user->forceFill([
            'two_factor_secret' => encrypt($this->provider->generateSecretKey()),
            'two_factor_recovery_codes' => encrypt(json_encode($this->provider->generateRecoveryCodes())),
        ])->save();
    }
}

<script setup>
import { ref, computed } from 'vue';

const props = defineProps({ characters: Array });
const selectedElement = ref('all');

const filteredCharacters = computed(() => {
  if (selectedElement.value === 'all') return props.characters;
  return props.characters.filter(c => c.element === selectedElement.value);
});
</script>

namespace App\Models;

use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Relations\BelongsTo;

class Character extends Model
{
    protected $fillable = ['name', 'slug', 'element_id'];

    public function element(): BelongsTo
    {
        return $this->belongsTo(Element::class);
    }
}