ElementTabsRelations doesn't work on my nova 1.0.12

[DonDiegoAA]

I followed the instructions, but the presentation does not change with ElementTabsRelations, no tabs.

ElementTabsRelations::make('Tabs')
            ->addTab('Contacts', BelongsToMany::make('Contacts', 'contacts') )
            ->addTab('Events', BelongsToMany::make('Events', 'events') )
            ->addTab('Documents', HasMany::make('Documents', 'documents') )
            ->activeTab('Contacts'),

[fat4lix]

Hello, I'll check this soon. I think it's broken in the new version of Nova

[michaelchunn]

Does not work for me either. I was excited to see this feature set.

[cloudstudio]

+1, thanks for you time

[fat4lix]

This is a problem. Nova tries to get a related field using the fields()function, but does not find it because the related fields is inside ElementsTabsRelations. To work around this issue, you can override the availableFields() function in your resource, like this.

public function availableFields(NovaRequest $request)
    {
        $fields = $this->fields($request);
        $tabsRelationsField = collect($fields)
            ->first(function($field){
                return get_class($field) == ElementTabsRelations::class;
            });
        $relatedFields = collect($tabsRelationsField->tabs)
            ->map(function($tab){
                return $tab['field']->hideFromDetail();
            })->toArray();

        return new FieldCollection(
            array_values(
                $this->filter(array_merge($fields, $relatedFields))
            )
        );
    }

[cloudstudio]

@fat4lix thanks for all !

I try this solution, but is not working for me :(

No errors, just show relations like normal mode.

[fat4lix]

@cloudstudio Can you show me your fields() function please?

[DonDiegoAA]

Hello,

I tried your solution too, but still doesn't work for me.

First I had this error:
Class 'App\Nova\FieldCollection' not found

Then I add
use Laravel\Nova\Fields\FieldCollection;
No more error, but still no tabs around my relationships

Her is my fields function:

public function fields(Request $request)
{
    return [
        ID::make()->sortable(),

        Text::make('Type', function () {
            if( $this->category == 'staff' ) {
                return "Staff";
            }elseif( $this->category == 'member' ) {
                return "Member";
            }elseif( $this->category == 'external' ) {
                return "External";
            }
           
        })->onlyOnIndex(),

        RadioButton::make('Type','category')
        ->options([
            'staff' => 'Contact of the federation\'s staff',
            'member' => 'Member',
            'external' => 'External contact',
        ])
        ->default('member') // optional
        ->sortable()
        ->rules('required')->hideFromIndex(),

        Text::make('Name', function () {
            return $this->first_name.' '.$this->last_name;
        })->onlyOnDetail(),
        Text::make('First Name')->sortable()->rules('required', 'max:255')->hideFromDetail(),
        Text::make('Last Name')->sortable()->rules('required', 'max:255')->hideFromDetail(),

        RadioButton::make('Gender')
        ->options([
            'm' => 'Man',
            'f' => 'Woman',
        ])
        ->default('m') // optional
        ->sortable()
        ->rules('required')->hideFromIndex(),

        Text::make('Organisation')->sortable()->rules('max:255'),
        Text::make('Function')->sortable()->rules('max:255')->hideFromIndex(),

        Email::make('Email')->sortable()->rules('nullable', 'email', 'max:255')->clickable()->clickableOnIndex(),
        Text::make('Phone')->sortable()->rules('max:255')->hideFromIndex(),
        Country::make('Country')->displayUsingLabels()->sortable()->rules('max:2')->hideFromIndex(),
        Avatar::make('Photo')->disk('contact')->rules('nullable', 'image','mimes:jpg,jpeg,png,gif')->exceptOnForms(),
        ImageCropper::make('Photo')->disk('contact')->rules('nullable', 'image','mimes:jpg,jpeg,png,gif')->onlyOnForms(),
        Url::make('Twitter')->rules('nullable','url','max:255')->clickable()->hideFromIndex(),
        Url::make('Facebook')->rules('nullable','url','max:255')->clickable()->hideFromIndex(),
        Url::make('Linkedin')->rules('nullable','url','max:255')->clickable()->hideFromIndex(),
        Textarea::make('Followed Topics')->hideFromIndex(),
        Text::make('Working groups',function (){
            $thematicsStr = '';
            foreach ($this->thematics as $key => $value) {
                if( !empty($thematicsStr) ) {
                    $thematicsStr.= "<br/>";    
                }
                $thematicsStr.= '<span style="white-space: pre;"><a href="/backoffice/resources/thematics/'.$value->id.'" class="no-underline dim text-primary font-bold" >'.$value->title.'</a></span>';
                    
            }
            return $thematicsStr;
        })->asHtml()->exceptOnForms(),

        ElementSwitch::make('Active')
          ->falseLabel('No')
          ->trueLabel('Yes')
          ->showLabels()
          ->sortable()->rules('required', 'boolean'),

        ElementTabsRelations::make('Tabs')
            ->addTab('Working group', BelongsToMany::make('Working group','thematics', Thematic::class) )
            ->addTab('Meetings', HasMany::make('Meetings', 'meetings') )
            ->activeTab('meetings')
            ->borderCard()

    ];
}

[cloudstudio]

@fat4lix i remove it, but is something like @DonDiegoAA

[vootrunner]

@fat4lix - any progress on this? The problem persists with Nova 1.0.16. The work around to override availableFields() doesn't solve the problem.

[XGhozt]

Can confirm, this isn't working in Nova v1.1.3.

[vootrunner]

@fat4lix - I don't want to be presumptuous, but should we consider this an abandoned project? If you are just swamped with other things, a quick note saying something to that effect would go a long way.

I appreciate the effort that you've put into the package, and I'm not trying to be rude. ElementTabsRelations is the primary reason I started using Element UI, and I don't have the time to fork and fix it on my own.

-Sam

[XGhozt]

@vootrunner -- hopefully this project isn't dead... but you might want to check out this alternative for tabs: https://github.com/arsenaltech/nova-tab

[johnpaulmedina]

So this is rendering the vue directives correctly but nothing is being rendered as a tab - just outputs as normal. When inspecting the code I am seeing the proper but those components do not render as expected

[n0n0n0n0]

Any fixes guys?

[tanthammar]

Still not working in 1.1.7

[yatinB07]

any update for this guys.
Because it still not work in 1.2.0

[n0n0n0n0]

it looks like this project abandoned

[pirattero]

=(