Problem/Motivation

We do not want our editors to see the FEE options in a particular blocks - for example, the sidebar as it can all get a bit messy...

front-end-editing-continers-links

Prior to v1.60x, we used to be able to do this using some simple CSS...

// Don't show them in the Sidebar otherwise there is a mass of them.
.region.region-sidebar-first {
  .frontend-editing-actions {
    display: none;
  }
}

But it no longer seems to work?

CommentFileSizeAuthor
#13 front-end-editing-patched-but-still-no-disablement.png14.48 KBsirclickalot
#11 front_end_editing_patch_cannot_apply_hunk.png47.83 KBsirclickalot
#2 frontend-editing-in-sidebar.gif276.82 KBsirclickalot
front-end-editing-continers-links.png30.02 KBsirclickalot

Issue fork frontend_editing-3428005

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

SirClickalot created an issue. See original summary.

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented
StatusFileSize
new frontend-editing-in-sidebar.gif276.82 KB

Update

Forgive me, it turned out that with v1.6x I just needed to add some extra CSS to deal with the :hover state...

// Don't show them in the Sidebar otherwise there is a mass of them.
.region.region-sidebar-first {
  .frontend-editing {
    &:hover {
      display: none;
    }
  }
  .frontend-editing-actions {
    display: none;
  }
}

Manic jiggling

HOWEVER, this then resulted in a whole lot more 'jiggling' ! ...

frontend-editing-in-sidebar

Conclusion

Would it be a good idea to simply allow us to exempt entire regions from Front End Editing?
That seems to me to be a much more efficient than always including it and then having to override and hide it.

Thanks

a.dmitriiev’s picture

a.dmitriiev commented

In this issue https://www.drupal.org/project/frontend_editing/issues/3436377 there were improvements done, please try 1.x-dev version and check if it helps to improve the behavior.

Frontend editing works on entity level, so unfortunately, there is no context about the block or region where the content is included. Adding actions or not is decided by entity type and bundle only, as it is the only thing that is available in the rendered view of the entity. It is also possible, of course, to add view mode of the entity as a condition, so that for some view modes the links are added and for some not, but not for regions.

a.dmitriiev’s picture

a.dmitriiev commented
Related issues: +#3427666: Paragraphs on the page all collapse to nothing after an edit

I think this issue is related to https://www.drupal.org/project/frontend_editing/issues/3427666 . My guess from the previous comment was correct. I have checked https://www.drupal.org/project/ptoc module and it uses a special view mode ptoc for the paragraphs in the sidebar. So it seems that what is needed is skip adding frontend editing links for this view mode, and this will fix the problem.

I will add setting or a hook, where entity's view mode will be taken into account when deciding whether to show the links or not.

a.dmitriiev opened merge request !53

a.dmitriiev’s picture

a.dmitriiev commented
Status: Active » Needs review

I have added view display on the entity to the context of hook that decides whether frontend editing is allowed for current bundle or not. Here is an example how the hook can help:


function YOUR_MODULE_NAME_fe_allowed_bundles_alter(array &$bundles, array $context) {
  if ($context['entity_type'] == 'paragraph' && $context['view_display']->getMode() == 'ptoc') {
    if (isset($bundles[$context['entity_type'] . '.' . $context['bundle']])) {
      unset($bundles[$context['entity_type'] . '.' . $context['bundle']]);
    }
  }
}

Please check MR and add the hook to your custom module, this should help.

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented

I have implemented that hook in my custom module...

49 function custom_drupal_overrides_fe_allowed_bundles_alter(array &$bundles, array $context) {
50  if ($context['entity_type'] == 'paragraph' && $context['view_display']->getMode() == 'ptoc') {
51    if (isset($bundles[$context['entity_type'] . '.' . $context['bundle']])) {
52      unset($bundles[$context['entity_type'] . '.' . $context['bundle']]);
53    }
54  }
55 }

I have check the markup of the sidebar region to be sure that the view mode used in indeed 'ptoc'..

<div class="contextual-region paragraph paragraph--type--sections paragraph--view-mode--ptoc">

The hook triggers a fatal error...

Error: Call to a member function getMode() on null in custom_drupal_overrides_fe_allowed_bundles_alter() (line 50 of modules\custom\custom_drupal_overrides\custom_drupal_overrides.module).
Drupal\Core\Extension\ModuleHandler->alter('fe_allowed_bundles', Array, Array) (Line: 102)
frontend_editing_allow_bundle(Object) (Line: 226)
frontend_editing_entity_view_alter(Array, Object, Object) (Line: 545)
Drupal\Core\Extension\ModuleHandler->alter('paragraph_view', Array, Object, Object) (Line: 304)
Drupal\Core\Entity\EntityViewBuilder->buildMultiple(Array) (Line: 18)
Drupal\paragraphs\ParagraphViewBuilder->buildMultiple(Array) (Line: 238)
...etc.

Have I misundertood or got something wrong?

Thanks!

a.dmitriiev’s picture

a.dmitriiev commented

Are you using the code from MR https://git.drupalcode.org/project/frontend_editing/-/merge_requests/53/... ? This change to alter hook is not yet in any stable version. When you confirm that it is solid solution and it works, I will add it to the next release.

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented

Ah sorry, I had not applied the patch.

I have now and I am seeing something different this time and it turns out that this happens even if DO NOT implement the hook!

Error: Object of class Drupal\Core\Entity\Entity\EntityViewDisplay could not be converted to string in implode() (line 106 of modules\contrib\frontend_editing\frontend_editing.module).
frontend_editing_allow_bundle(Object, Object) (Line: 229)
frontend_editing_entity_view_alter(Array, Object, Object) (Line: 545)
Drupal\Core\Extension\ModuleHandler->alter('paragraph_view', Array, Object, Object) (Line: 304)
Drupal\Core\Entity\EntityViewBuilder->buildMultiple(Array) (Line: 18)
Drupal\paragraphs\ParagraphViewBuilder->buildMultiple(Array) (Line: 238)
Drupal\Core\Entity\EntityViewBuilder->build(Array)
call_user_func_array(Array, Array) (Line: 111)
Drupal\Core\Render\Renderer->doTrustedCallback(Array, Array, 'Render #pre_render callbacks must be methods of a class that implements \Drupal\Core\Security\TrustedCallbackInterface or be an anonymous function. The callback was %s. See https://www.drupal.org/node/2966725', 'exception', 'Drupal\Core\Render\Element\RenderCallbackInterface') (Line: 859)
Drupal\Core\Render\Renderer->doCallback('#pre_render', Array, Array) (Line: 421)
Drupal\Core\Render\Renderer->doRender(Array, ) (Line: 240)
Drupal\Core\Render\Renderer->render(Array) (Line: 475)
Drupal\Core\Template\TwigExtension->escapeFilter(Object, Array, 'html', NULL, 1) (Line: 67)
__TwigTemplate_b1b98e840831171f3e0d4f9338367c60->doDisplay(Array, Array) (Line: 394)
Twig\Template->displayWithErrorHandling(Array, Array) (Line: 367)
Twig\Template->display(Array) (Line: 379)
Twig\Template->render(Array) (Line: 38)
Twig\TemplateWrapper->render(Array) (Line: 39)
twig_render_template('themes/custom/bit_by_bit/templates/field.html.twig', Array) (Line: 348)
Drupal\Core\Theme\ThemeManager->render('field', Array) (Line: 480)
Drupal\Core\Render\Renderer->doRender(Array) (Line: 493)
Drupal\Core\Render\Renderer->doRender(Array, ) (Line: 240)
Drupal\Core\Render\Renderer->render(Array) (Line: 475)
Drupal\Core\Template\TwigExtension->escapeFilter(Object, Array, 'html', NULL, 1) (Line: 110)
__TwigTemplate_a6db597d22cdddbe606634145491090f->doDisplay(Array, Array) (Line: 394)
Twig\Template->displayWithErrorHandling(Array, Array) (Line: 367)
Twig\Template->display(Array) (Line: 379)
Twig\Template->render(Array) (Line: 38)
Twig\TemplateWrapper->render(Array) (Line: 39)
twig_render_template('themes/contrib/bootstrap5/templates/content/node.html.twig', Array) (Line: 348)
Drupal\Core\Theme\ThemeManager->render('node', Array) (Line: 480)
Drupal\Core\Render\Renderer->doRender(Array, ) (Line: 240)
Drupal\Core\Render\Renderer->render(Array, ) (Line: 238)
Drupal\Core\Render\MainContent\HtmlRenderer->Drupal\Core\Render\MainContent\{closure}() (Line: 627)
Drupal\Core\Render\Renderer->executeInRenderContext(Object, Object) (Line: 239)
Drupal\Core\Render\MainContent\HtmlRenderer->prepare(Array, Object, Object) (Line: 128)
Drupal\Core\Render\MainContent\HtmlRenderer->renderResponse(Array, Object, Object) (Line: 90)
Drupal\Core\EventSubscriber\MainContentViewSubscriber->onViewRenderArray(Object, 'kernel.view', Object)
call_user_func(Array, Object, 'kernel.view', Object) (Line: 111)
Drupal\Component\EventDispatcher\ContainerAwareEventDispatcher->dispatch(Object, 'kernel.view') (Line: 186)
a.dmitriiev’s picture

a.dmitriiev commented

I have updated MR, please try once again.

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented
StatusFileSize
new front_end_editing_patch_cannot_apply_hunk.png47.83 KB

In attempting to path with latest, I am seeing a message saying "Cannot apply 1 hunk"...

front_end_editing_patch_cannot_apply_hunk

To be clear, I rolled back from the applying the previous release of the previous '53' patch.

a.dmitriiev’s picture

a.dmitriiev commented

Please try patch from the diff directly: https://git.drupalcode.org/project/frontend_editing/-/merge_requests/53....

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented
StatusFileSize
new front-end-editing-patched-but-still-no-disablement.png14.48 KB

Patch applied, no errors now but still no disablement in my sidebar ;-(

front-end-editing-patched-but-still-no-disablement

Markup

<div class="field__item"><div class="frontend-editing contextual-region paragraph paragraph--type--text paragraph--view-mode--ptoc">
  <a href="#paragraph-9868">
            <div class="is-a-group-title-Yes field field--name-field-title field--type-string field--label-hidden field__item">Familiar from maths</div>
      </a>
  <div data-contextual-id="paragraph:root_parent_type=node&amp;root_parent=7503&amp;paragraph=9868:changed=1708355429&amp;langcode=en" data-contextual-token="lz_SaL5-uPuhBMdvkApsaT80OgBuSWy6_iLcZ4wlHl4" data-drupal-ajax-container="" data-once="contextual-render" class="contextual"><button class="trigger focusable visually-hidden" type="button" aria-pressed="false">Open  configuration options</button><ul class="contextual-links" hidden=""><li><a href="/paragraphs_edit/node/7503/paragraphs/9868/edit?destination=/node/7503">Edit</a></li><li><a href="/paragraphs_edit/node/7503/paragraphs/9868/clone?destination=/node/7503">Clone</a></li><li><a href="/paragraphs_edit/node/7503/paragraphs/9868/delete?destination=/node/7503">Delete</a></li></ul></div><div class="frontend-editing-actions" data-entity-type="paragraph" data-once="frontend-editing-processed"><div class="common-actions-container"><div class="title-edit-container"><span class="action-title">Title and descriptive text</span><a href="/frontend-editing/form/paragraph/9868" title="Edit" class="frontend-editing-open-sidebar frontend-editing__action frontend-editing__action--edit">Edit</a></div>
<div class="move-paragraphs icons-container"><a href="/frontend-editing/paragraphs/9868/down" title="Move down" class="no-ajax frontend-editing__action frontend-editing__action--down">Move down</a></div>
</div>
<div class="add-paragraphs icons-container"><a href="/frontend-editing/paragraphs/add/paragraph/9860/field_content/9868/1?view_mode_id=ptoc" title="Add before" class="frontend-editing-open-sidebar frontend-editing__action frontend-editing__action--before">Add before</a><a href="/frontend-editing/paragraphs/add/paragraph/9860/field_content/9868/0?view_mode_id=ptoc" title="Add after" class="frontend-editing-open-sidebar frontend-editing__action frontend-editing__action--after">Add after</a></div>
</div>
</div>
</div>

Module code

function custom_drupal_overrides_fe_allowed_bundles_alter(array &$bundles, array $context) {
  if ($context['entity_type'] == 'paragraph' && $context['view_display']->getMode() == 'ptoc') {
    if (isset($bundles[$context['entity_type'] . '.' . $context['bundle']])) {
      unset($bundles[$context['entity_type'] . '.' . $context['bundle']]);
    }
  }
}
a.dmitriiev’s picture

a.dmitriiev commented

Have you cleared the caches after you have created the hook implementation in your custom module?

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented

Yes, cleared cache several times but no hooking in it seems.

a.dmitriiev’s picture

a.dmitriiev commented

Ok, I have installed ptoc module. The example of alter hook usage was wrong, it of course should be like this:

function YOUR_MODULE_fe_allowed_bundles_alter(array &$bundles, array $context) {
  if ($context['entity_type'] == 'paragraph' && $context['view_display']->getMode() == 'ptoc') {
    $key = array_search($context['entity_type'] . '.' . $context['bundle'], $bundles);
    if ($key) {
      unset($bundles[$key]);
    }
  }
}

Please confirm, then I will merge MR

sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented

@a.dmitriiev yep, that's got it!
Thank you!

  • a.dmitriiev committed 1e1d8492 on 1.x 
    Issue #3428005 by a.dmitriiev: Hiding the Front End Editing containers...
a.dmitriiev’s picture

a.dmitriiev commented
Status: Needs review » Fixed
a.dmitriiev’s picture

a.dmitriiev commented

Added to 1.6.2 release

  • a.dmitriiev committed f40ce881 on 2.x 
    Issue #3428005 by a.dmitriiev: Hiding the Front End Editing containers...

  • a.dmitriiev committed f40ce881 on feature/3436684-proof-of-concept 
    Issue #3428005 by a.dmitriiev: Hiding the Front End Editing containers...
sirclickalot’s picture

sirclickalot
Primary language English
Location Somerset
commented
Status: Fixed » Closed (fixed)