Динамическое определение активной вкладки

Question

У меня 3 вкладки.В некоторых случаях первый скрыт.Первый является активным.Если он скрыт, второй должен быть активным.

.html код:

    <div class="Settings">
    <ul class="nav nav-tabs p">
        <li class="nav-item active i-tab">
            <a class="nav-link" data-toggle="tab" href="#bla" data-bind="text: strings.iTabHeader, visible: isVis"></a>
        </li>
        <li class="nav-item f-tab">
            <a class="nav-link" data-toggle="tab" href="#blabla" data-bind="text: strings.fTabHeader"></a>
        </li>
        <li class="nav-item b-tab">
            <a class="nav-link" data-toggle="tab" href="#blablabla" data-bind="text: strings.bTabHeader"></a>
        </li>
    </ul>

    <div class="tab-content">
        <div id="iSettingMenu" class="tab-pane fade in active">
            <div data-bind="compose: iSettings"></div>
        </div>

        <div id="fSettingsMenu" class="tab-pane fade in active">
            <div data-bind="compose: fSettings"></div>
        </div>

        <div id="bSettingsMenu" class="tab-pane fade">
            <div data-bind="compose: bSettings"></div>
        </div>
     </div>
</div>

.js Код:

this.isvis = ko.computed(function () {
            return this.Type() === 'xxxx';
        }.bind(this));