Bagaimana Cara Membuat Dynamic Form dengan Livewire ?

Selamat malam, saya sedang membuat dynamic form opsi dengan livewire. Saya ada masalah ketika saya coba klik button  tambah opsi , form input di opsi 1 malah tidak tampil seperti gambar di bawah ini.

opsi 1.jpg

opsi 2.jpg

Bagaimana cara mengatasi masalah ini, supaya ketika klik tambah ospi, form input di opsi tetap di tampilkan ? terimaka kasih, dan berikut ini kode yang sudah saya buat

PengajuanMagang.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use Illuminate\Support\Facades\Validator;
use App\Models\{Magang, Peserta};
use App\Notifications\PengajuanMagang as NotificationsPengajuanMagang;

class PengajuanMagang extends Component
{
    public $nama, $email, $nama_perusahaan, $alamat_perusahaan, $telp_perusahaan, $email_perusahaan, $contact_person, $magang_id;
    public $updateMode = False;
    public $inputs = [];
    public $i = 1;

    protected $rules = [
        'email'                 => 'required|exists:pesertas,email',
        'nama_perusahaan.0'     => 'required',
        'alamat_perusahaan.0'   => 'required',
        'telp_perusahaan.0'     => 'required',
        'email_perusahaan.0'    => 'required',
        'nama_perusahaan.*'     => 'required',
        'alamat_perusahaan.*'   => 'required',
        'telp_perusahaan.*'     => 'required',
        'email_perusahaan.*'    => 'required'
    ];

    protected $messages = [
        'email.required'                => 'Email tidak boleh kosong.',
        'email.exists'                  => 'Alamat email tidak terdaftar di program kami.',
        'nama_perusahaan.0.required'    => 'Nama perusahaan tidak boleh kosong.',
        'alamat_perusahaan.0.required'  => 'Alamat perusahaan tidak boleh kosong.',
        'telp_perusahaan.0.required'    => 'Telephone perusahaan tidak boleh kosong.',
        'email_perusahaan.0.required'   => 'Email perusahaan tidak boleh kosong.',
        'nama_perusahaan.*.required'    => 'Nama perusahaan tidak boleh kosong.',
        'alamat_perusahaan.*.required'  => 'Alamat perusahaan tidak boleh kosong.',
        'telp_perusahaan.*.required'    => 'Telephone perusahaan tidak boleh kosong.',
        'email_perusahaan.*.required'   => 'Email perusahaan tidak boleh kosong.'
    ];

    public function add($i)
    {
        $i = $i + 1;
        $this->i = $i;
        array_push($this->inputs, $i);
    }

    public function remove($i)
    {
        unset($this->inputs[$i]);
    }

    private function resetInputFields(){
        $this->nama                 = '';
        $this->email                = '';
        $this->nama_perusahaan      = '';
        $this->alamat_perusahaan    = '';
        $this->telp_perusahaan      = '';
        $this->email_perusahaan     = '';
        $this->contact_person       = '';
        $this->i = 1;
    }

    public function save()
    {
        $this->validate();

        $peserta = Peserta::where('email',$this->email)->first();

        foreach ($this->nama_perusahaan as $key => $value) {
            Magang::create([
                'peserta_id'        => $peserta->id,
                'nama_perusahaan'   => $this->nama_perusahaan[$key],
                'alamat_perusahaan' => $this->alamat_perusahaan[$key],
                'telp_perusahaan'   => $this->telp_perusahaan[$key],
                'email_perusahaan'  => $this->email_perusahaan[$key],
                'contact_person'    => $this->contact_person[$key],
                'status'            => 0
            ]);
        }
        $this->inputs = [];

        $this->resetInputFields();

        $peserta->notify(new NotificationsPengajuanMagang($peserta));

        $this->alert('success', 'Data Berhasil Terkirim', [
            'position'          =>  'center',
            'timer'             =>  3000,
            'toast'             =>  false,
            'text'              =>  'Kami Akan Segera Melakukan Pemeriksaan Data',
            'confirmButtonText' =>  'Ok',
            'cancelButtonText'  =>  'Cancel',
            'showCancelButton'  =>  false,
            'showConfirmButton' =>  false,
        ]);

    }

    public function render()
    {
        return view('livewire.pengajuan-magang')
                ->extends('layouts.front')
                ->section('content');
    }
}

pengajuan-magang.blade.php

<div>
    <div class="card rounded-3">
        <div class="card-body">
            <div class="alert alert-primary" role="alert">
                Silakan usulkan 3 nama Industry terdekat (bisa Hotel, Resto, Coffee Shop, atau Bakery Shop)  yang ingin kamu jadikan tempat Practical Learning.
            </div>
            <form class="row g-3" wire:submit.prevent="save">
                @csrf
                <label><strong>Pengajuan Magang</strong></label>
                <div class="col-md-6">
                    <label for="nama" class="form-label">Nama</label>
                    <input type="text" wire:model="nama" class="form-control @error('nama') is-invalid @enderror" id="nama" placeholder="Nama Kamu">
                    @error('nama')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                <div class="col-md-6">
                    <label for="email" class="form-label">Email</label>
                    <input type="email" wire:model="email" class="form-control @error('email') is-invalid @enderror" id="email" aria-describedby="email" placeholder="Email Kamu">
                    @error('email')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                    <div id="email" class="form-text"><span class="text-danger">*</span> Masukkan alamat email yang kamu gunakan saat mendaftar program.</div>
                </div>
                <label><strong>Opsi 1</strong></label>
                <div class="col-md-6">
                    <label for="nama_perusahaan" class="form-label">Nama Perusahaan</label>
                    <input type="text" wire:model="nama_perusahaan.0" class="form-control @error('nama_perusahaan.0') is-invalid @enderror" id="nama_perusahaan" placeholder="Nama Perusahaan">
                    @error('nama_perusahaan.0')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                <div class="col-md-6">
                    <label for="telp_perusahaan" class="form-label">Telp Perusahaan</label>
                    <input type="text" wire:model="telp_perusahaan.0" class="form-control @error('telp_perusahaan.0') is-invalid @enderror" id="telp_perusahaan" placeholder="Telephone Perusahaan">
                    @error('telp_perusahaan.0')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                <div class="col-md-6">
                    <label for="email_perusahaan" class="form-label">Email Perusahaan</label>
                    <input type="email" wire:model="email_perusahaan.0" class="form-control @error('email_perusahaan.0') is-invalid @enderror" id="email_perusahaan" placeholder="Email Perusahaan">
                    @error('email_perusahaan.0')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                <div class="col-md-6">
                    <label for="contact_person" class="form-label">Contact Person</label>
                    <input type="text" wire:model="contact_person.0" class="form-control @error('contact_person.0') is-invalid @enderror" id="contact_person" placeholder="Contact Person">
                    @error('contact_person.0')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                <div class="col-12">
                    <label for="alamat_perusahaan" class="form-label">Alamat Perusahaan</label>
                    <input type="text" wire:model="alamat_perusahaan.0" class="form-control @error('alamat_perusahaan.0') is-invalid @enderror" id="alamat_perusahaan" placeholder="Contoh: Kec. Pakem, Kab. Sleman">
                    @error('alamat_perusahaan.0')
                    <div class="invalid-feedback">
                        {{ $message }}
                    </div>
                    @enderror
                </div>
                @foreach ($inputs as $key => $value)
                <hr>
                <div wire:key="opsi-key-{{ $key }}">
                    <div class="row">
                        <div class="d-flex mx-auto">
                            <label><strong>Opsi {{ $value }}</strong></label>
                            <button class="btn btn-danger btn-sm ms-auto" wire:click.prevent="remove({{ $key }})">Hapus</button>
                        </div>
                        <div class="col-md-6">
                            <label for="nama_perusahaan" class="form-label">Nama Perusahaan</label>
                            <input type="text" wire:model="nama_perusahaan.{{ $value }}" class="form-control @error('nama_perusahaan.'.$value) is-invalid @enderror" id="nama_perusahaan" placeholder="Nama Perusahaan">
                            @error('nama_perusahaan.'.$value)
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="telp_perusahaan" class="form-label">Telp Perusahaan</label>
                            <input type="text" wire:model="telp_perusahaan.{{ $value }}" class="form-control @error('telp_perusahaan.'.$value) is-invalid @enderror" id="telp_perusahaan" placeholder="Telephone Perusahaan">
                            @error('telp_perusahaan.'.$value)
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="email_perusahaan" class="form-label">Email Perusahaan</label>
                            <input type="email" wire:model="email_perusahaan.{{ $value }}" class="form-control @error('email_perusahaan.'.$value) is-invalid @enderror" id="email_perusahaan" placeholder="Email Perusahaan">
                            @error('email_perusahaan.'.$value)
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="contact_person" class="form-label">Contact Person</label>
                            <input type="text" wire:model="contact_person.{{ $value }}" class="form-control @error('contact_person.'.$value) is-invalid @enderror" id="contact_person" placeholder="Contact Person">
                            @error('contact_person.'.$value)
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <div class="col-12">
                            <label for="alamat_perusahaan" class="form-label">Alamat Perusahaan</label>
                            <input type="text" wire:model="alamat_perusahaan.{{ $value }}" class="form-control @error('alamat_perusahaan.'.$value) is-invalid @enderror" id="alamat_perusahaan" placeholder="Contoh: Kec. Pakem, Kab. Sleman">
                            @error('alamat_perusahaan.'.$value)
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                    </div>
                </div>
                @endforeach
                <div>
                    <button class="btn btn-success" type="button" wire:click.prevent="add({{$i}})">Tambah Opsi</button>
                </div>
                <div class="d-grid gap-2">
                    <button class="btn btn-submit" wire:target="save" wire:loading.attr="disabled">
                    <span wire:loading.remove wire:target="save">
                    Ajukan
                    </span>
                    <span wire:loading wire:target="save" class="text-center">
                    <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
                    Loading...
                    </span>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>