<div class="modal fade" id="activate-user-modal" tabindex="-1" role="dialog" aria-labelledby="activate-user-modal"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content custom-rounded-edges">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">
                    Activate User
                </h5>

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <div class="modal-body">
                <form data-url="" id="activate-user-form" method="POST">
                    @csrf
                    @method('patch')
                    <div class="form-group">
                        <div class="form-group row justify-content-center">
                            <label for="group" class="col-md-2 col-form-label">Group</label>
                            <div class="col-md-4">
                                <select class="form-control" id="user-group" name="user-group"
                                    placeholder="Select a Group">
                                    <option value="">Select a group</option>

                                    @foreach($groups as $group)
                                    <option value="{{ $group->group_ID }}">{{ $group->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                    </div>
                    <div class="text-center">
                        <button type="button" id="saveBtn-activate-user" class="btn btn-primary mx-2 px-5 py-2">
                            Save
                        </button>
                        <button type="button" id="cancelBtn-activate-user" class="btn btn-light mx-2 px-5 py-2"
                            data-dismiss="modal">
                            Cancel
                        </button>
                        <div class="mt-3">
                            <div id="activate-user-confirm" class="alert bootstrap-alert-success mx-4 mb-3" role="alert"
                                style="display: none">
                            </div>
                            <div id="activate-user-error" class="alert bootstrap-alert-danger mx-4 mb-3" role="alert"
                                style="display: none">
                            </div>
                        </div>

                    </div>
                </form>
            </div>
        </div>
    </div>
</div>