isobar-nz / silverstripe-catalogmanager

Catalog administration via a LeftAndMain like interface. Lets you create and edit pages outside of the site tree
36 stars 26 forks source link

No Settings or History tabs #65

Open dawb opened 4 years ago

dawb commented 4 years ago

When editing a page via the modeladmin it doesn't display the standard Content, Settings and History tabs that appear when editing a page within the sitetree. Is there a setting that can be enabled to display these or is there a template removing these from displaying?

Thanks

davejtoews commented 4 years ago

@dawb I've had this problem myself and there is not a simple setting that can be changed. There's a few different things that need to be tweaked to get those tabs back.

The ModelAdmin area needs to load the Versioned javascript.

You can accomplish that with a config change:

SilverStripe\Admin\LeftAndMain:
   extensions:
     - SilverStripe\VersionedAdmin\Extensions\CMSMainExtension

The GridField needs a different configuration

I extended the Catalog Admin and borrowed from the LumberJack module to create the GridField

https://github.com/silverstripe/silverstripe-lumberjack

My subclass also needs GridFieldExtensions

https://github.com/symbiote/silverstripe-gridfieldextensions

Add the class below to your project and extend it for your ModelAdmin instead of CatalogPageAdmin

<?php

 namespace YourNamespace;

 use LittleGiant\CatalogManager\ModelAdmin\CatalogPageAdmin;
 use LittleGiant\CatalogManager\Actions\GridFieldPublishAction;
 use LittleGiant\CatalogManager\Forms\CatalogPageGridFieldItemRequest;
 use SilverStripe\Forms\FieldList;
 use SilverStripe\Forms\Form;
 use SilverStripe\Forms\GridField\GridField;
 use SilverStripe\Forms\GridField\GridFieldDeleteAction;
 use SilverStripe\Forms\GridField\GridFieldDetailForm;
 use SilverStripe\Lumberjack\Forms\GridFieldConfig_Lumberjack;
 use SilverStripe\ORM\ValidationResult;
 use SilverStripe\Versioned\Versioned;
 use Symbiote\GridFieldExtensions\GridFieldOrderableRows;

 abstract class CatalogWithLumberJackAdmin extends CatalogPageAdmin
 {
     /**
      * @param \SilverStripe\CMS\Model\SiteTree|\LittleGiant\CatalogManager\Extensions\CatalogPageExtension $model
      * @param null|string $id
      * @param null|string $fields
      * @return \SilverStripe\Forms\Form
      */
     protected function getCatalogEditForm($model, $id = null, $fields = null)
     {
         $originalStage = Versioned::get_stage();
         Versioned::set_stage(Versioned::DRAFT);
         $listField = GridField::create(
             $this->sanitiseClassName($this->modelClass),
             false,
             $this->getList(),
             $fieldConfig = GridFieldConfig_Lumberjack::create(static::config()->get('page_length'))
                 ->removeComponentsByType(GridFieldDeleteAction::class)
                 ->addComponent(new GridfieldPublishAction())
         );
         Versioned::set_stage($originalStage);

         /** @var \SilverStripe\Forms\GridField\GridFieldDetailForm $detailForm */
         $detailForm = $listField->getConfig()->getComponentByType(GridFieldDetailForm::class);
         if ($detailForm !== null) {
             $detailForm->setItemRequestClass(CatalogPageGridFieldItemRequest::class);
         }

         $sortField = $model->getSortFieldName();
         if ($sortField !== null) {
             $fieldConfig->addComponent(new GridFieldOrderableRows($sortField));
         }

         $form = Form::create(
             $this,
             'EditForm',
             new FieldList($listField),
             new FieldList()
         )->setHTMLID('Form_EditForm');

         if (count($model->getCatalogParents()) === 0) {
             $form->setMessage($this->getMissingParentsMessage($model), ValidationResult::TYPE_WARNING);
         }

         return $form;
     }
 }

Templates need to be modified

app/templates/SilverStripe/Admin/Includes/CMSBreadcrumbs.ss

<div class="breadcrumbs-wrapper flexbox-area-grow" data-pjax-fragment="Breadcrumbs">
    <% loop $Breadcrumbs %>
        <% if $Last %>
            <span class="cms-panel-link crumb last">$Title<% if $Extra %>$Extra<% end_if %></span>
        <% else %>
            <a class="cms-panel-link crumb" href="$Link">$Title</a>
            <span class="sep">/</span>
        <% end_if %>
    <% end_loop %>
 </div>

app/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Content.ss

<div id="pages-controller-cms-content" class="has-panel cms-content flexbox-area-grow fill-width fill-height $BaseCSSClasses" data-layout-type="border" data-pjax-fragment="Content" data-ignore-tab-state="true">
    $Tools

    <div class="fill-height flexbox-area-grow">
        <div class="cms-content-header north">
            <div class="cms-content-header-info flexbox-area-grow vertical-align-items fill-width">
                <a href="$BreadcrumbsBackLink" class="btn btn-secondary btn--no-text font-icon-left-open-big hidden-lg-up toolbar__back-button"></a>
                <% include SilverStripe\\Admin\\CMSBreadcrumbs %>
            </div>

            <div class="cms-content-header-tabs cms-tabset">
                <ul class="cms-tabset-nav-primary nav nav-tabs">
                    <li class="nav-item content-treeview<% if $TabIdentifier == 'edit' %> ui-tabs-active<% end_if %>">
                        <a href="$LinkPageEdit" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageEdit">
                            <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabContent 'Content' %>
                        </a>
                    </li>
                    <li class="nav-item content-listview<% if $TabIdentifier == 'settings' %> ui-tabs-active<% end_if %>">
                        <a href="$LinkPageSettings" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageSettings">
                            <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabSettings 'Settings' %>
                        </a>
                    </li>
                    <li class="nav-item content-listview<% if $TabIdentifier == 'history' %> ui-tabs-active<% end_if %>">
                        <a href="$LinkPageHistory" class="nav-link cms-panel-link" title="Form_EditForm" data-href="$LinkPageHistory">
                            <%t SilverStripe\\CMS\\Controllers\\CMSMain.TabHistory 'History' %>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="flexbox-area-grow fill-height">
            $EditForm
        </div>
    </div>
 </div>

Breadcrumbs/back button still need tweaking

The solution above works, but the breadcrumb and back button can send you back into the SiteTree instead of the ModelAdmin area. I'm hoping I'll find a solution for that yet, but as of right now all the above is sitting on a neglected branch of the project I'm currently working on until I have time to wrap up these details.

I'd love to see Settings and History work out-of-the-box for this module. Maybe what I've done here can be the basis of a pull request.

davejtoews commented 4 years ago

Another possible solution: I pulled this from a thread on this topic in the SilverStripe Slack. I haven't tried this but it was suggested by another user.

Create a custom GridField edit button:

<?php
namespace YourNamespace;

use SilverStripe\Forms\GridField\GridFieldEditButton;
class GridFieldSiteTreeEditButton extends GridFieldEditButton
{
    public function getUrl($gridField, $record, $columnName)
    {
        return $record->CMSEditLink();
    }
    public function getExtraData($gridField, $record, $columnName)
    {
        return [
            "classNames" => "font-icon-edit location-redirect"
        ];
    }
}

Use the custom button to modify the GridField in your ModelAdmin

class YourModelAdmin extends CatalogPageAdmin
{
    public function doInit()
    {
        parent::doInit();
        Requirements::customScript(
            <<<JS
(function($) {
    $(document).ready(function(){
        $(this).on('click', '.location-redirect', function() {
            location.href = $(this).attr('href');
        })
    })
})(jQuery);
JS
        );
    }

    public function getEditForm($id = null, $fields = null)
    {
        $form = parent::getEditForm($id, $fields);
        if ($gridField = $form->Fields()->dataFieldByName($this->sanitiseClassName($this->modelClass))) {
            if ($gridField instanceof GridField) {
                $config = $gridField->getConfig();
                $config->removeComponentsByType(GridFieldEditButton::class);
                $config->addComponent(new GridFieldSiteTreeEditButton());
            }
        }
        return $form;
    }
}