N°8673 - Avoid server overload when user access news page with a lot of unread news (#816)

This commit is contained in:
jf-cbd
2026-02-23 15:35:31 +01:00
committed by GitHub
parent 48e584503e
commit d5f2303ed2
5 changed files with 60 additions and 31 deletions

View File

@@ -72,9 +72,12 @@ $ibo-panel--icon--spacing--as-medallion--is-sticking: $ibo-panel--icon--spacing-
$ibo-panel--icon--bottom--as-medallion--is-sticking: -12px !default;
$ibo-panel--icon--border--as-medallion--is-sticking: 1px $ibo-panel--base-border-style $ibo-panel--base-border-color !default;
$ibo-panel--icon-background--size--must-contain: contain !default;
$ibo-panel--icon-background--size--must-cover: cover !default;
$ibo-panel--icon-background--size--must-zoomout: 66.67% !default;
$ibo-panel--icon-background--size--must-contain: contain !default; // deprecated, to be removed in favor of $ibo-panel--icon-img--size--must-contain
$ibo-panel--icon-background--size--must-cover: cover !default; // deprecated, to be removed in favor of $ibo-panel--icon-img--size--must-cover
$ibo-panel--icon-background--size--must-zoomout: 66.67% !default; // deprecated, to be removed in favor of $ibo-panel--icon-img--size--must-zoomout
$ibo-panel--icon-img--size--must-contain: $ibo-panel--icon-background--size--must-contain !default; // TODO remove when dealing with N°9317
$ibo-panel--icon-img--size--must-cover: $ibo-panel--icon-background--size--must-cover !default; // TODO remove when dealing with N°9317
$ibo-panel--icon-img--size--must-zoomout: $ibo-panel--icon-background--size--must-zoomout !default; // TODO remove when dealing with N°9317
$ibo-panel--title--font-size--is-sticking: $ibo-font-size-150 !default;
$ibo-panel--title--color: $ibo-color-grey-900 !default;
@@ -179,24 +182,25 @@ $ibo-panel--is-selectable--body--after--font-size: $ibo-font-size-700 !default;
min-height: $ibo-panel--icon--size;
}
.ibo-panel--icon-background {
.ibo-panel--icon-img, .ibo-panel--icon-background { // second class is deprecated, remove it when dealing with N°9317
width: 100%;
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: $ibo-panel--icon-background--size--must-contain;
background-size: $ibo-panel--icon-img--size--must-contain;
}
.ibo-panel--icon-background--must-contain {
background-size: $ibo-panel--icon-background--size--must-contain;
.ibo-panel--icon-img--must-contain, .ibo-panel--icon-background--must-contain { // second class is deprecated, remove it when dealing with N°9317
background-size: $ibo-panel--icon-img--size--must-contain;
}
.ibo-panel--icon-background--must-cover {
background-size: $ibo-panel--icon-background--size--must-cover;
.ibo-panel--icon-img--must-cover, .ibo-panel--icon-background--must-cover { // second class is deprecated, remove it when dealing with N°9317
background-size: $ibo-panel--icon-img--size--must-cover;
}
.ibo-panel--icon-background--must-zoomout {
background-size: $ibo-panel--icon-background--size--must-zoomout;
.ibo-panel--icon-img--must-zoomout, .ibo-panel--icon-background--must-zoomout { // second class is deprecated, remove it when dealing with N°9317
width: $ibo-panel--icon-img--size--must-zoomout;
height: $ibo-panel--icon-img--size--must-zoomout;
}
.ibo-panel--title {

View File

@@ -11,9 +11,12 @@ $ibo-title--icon--size: 90px !default;
$ibo-title--icon--size-2: 80px !default;
$ibo-title--icon--size-3: 70px !default;
$ibo-title--icon-background--size--must-contain: contain !default;
$ibo-title--icon-background--size--must-cover: cover !default;
$ibo-title--icon-background--size--must-zoomout: 66.67% !default;
$ibo-title--icon-background--size--must-contain: contain !default; // deprecated, to be removed in favor of $ibo-title--icon-img--size--must-contain
$ibo-title--icon-background--size--must-cover: cover !default; // deprecated, to be removed in favor of $ibo-title--icon-img--size--must-cover
$ibo-title--icon-background--size--must-zoomout: 66.67% !default; // deprecated, to be removed in favor of $ibo-title--icon-img--size--must-zoomout
$ibo-title--icon-img--size--must-contain: $ibo-title--icon-background--size--must-contain !default; // TODO remove when dealing with N°9317
$ibo-title--icon-img--size--must-cover: $ibo-title--icon-background--size--must-cover !default; // TODO remove when dealing with N°9317
$ibo-title--icon-img--size--must-zoomout: $ibo-title--icon-background--size--must-zoomout !default; // TODO remove when dealing with N°9317
.ibo-title {
@@ -44,24 +47,23 @@ $ibo-title--icon-background--size--must-zoomout: 66.67% !default;
min-height: $ibo-title--icon--size-3;
}
.ibo-title--icon-background {
.ibo-title--icon-img, .ibo-title--icon-background { // second class is deprecated, remove it when dealing with N°9317
width: 100%;
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: $ibo-title--icon-background--size--must-contain;
object-position: center;
background-size: $ibo-title--icon-img--size--must-contain;
}
.ibo-title--icon-background--must-contain {
background-size: $ibo-title--icon-background--size--must-contain;
.ibo-title--icon-img--must-contain, .ibo-title--icon-background--must-contain { // second class is deprecated, remove it when dealing with N°9317
background-size: $ibo-title--icon-img--size--must-contain;
}
.ibo-title--icon-background--must-cover {
background-size: $ibo-title--icon-background--size--must-cover;
.ibo-title--icon-img--must-cover, .ibo-title--icon-background--must-cover { // second class is deprecated, remove it when dealing with N°9317
background-size: $ibo-title--icon-img--size--must-cover;
}
.ibo-title--icon-background--must-zoomout {
background-size: $ibo-title--icon-background--size--must-zoomout;
.ibo-title--icon-img--must-zoomout, .ibo-title--icon-background--must-zoomout { // second class is deprecated, remove it when dealing with N°9317
background-size: $ibo-title--icon-img--size--must-zoomout;
}
.ibo-title--for-object-details {

View File

@@ -33,6 +33,10 @@ class UIContentBlock extends UIBlock implements iUIContentBlock
protected $aDeferredBlocks;
/** @var bool If set to true, the content block will have a surrounding <div> no matter its options / CSS classes / ... */
protected $bHasForcedDiv;
/** @var bool if set to true, the icon will be lazy loaded
* @since 3.2.3
*/
protected bool $bHasLazyLoadIcon;
/**
* UIContentBlock constructor.
@@ -48,6 +52,7 @@ class UIContentBlock extends UIBlock implements iUIContentBlock
$this->aSubBlocks = [];
$this->aDeferredBlocks = [];
$this->bHasForcedDiv = false;
$this->bHasLazyLoadIcon = false;
$this->SetCSSClasses($aContainerClasses);
}
@@ -220,4 +225,24 @@ class UIContentBlock extends UIBlock implements iUIContentBlock
$this->bHasForcedDiv = $bHasForcedDiv;
return $this;
}
/**
* @see static::$bHasLazyLoadIcon
* @return bool
*/
public function HasLazyLoadIcon(): bool
{
return $this->bHasLazyLoadIcon;
}
/**
* @see static::$bHasLazyLoadIcon
* @param bool $bLazyLoadIcon
* @return $this
*/
public function SetHasLazyLoadIcon(bool $bLazyLoadIcon)
{
$this->bHasLazyLoadIcon = $bLazyLoadIcon;
return $this;
}
}

View File

@@ -7,14 +7,11 @@ use Combodo\iTop\Application\Branding;
use Combodo\iTop\Application\TwigBase\Controller\Controller;
use Combodo\iTop\Application\UI\Base\Component\Button\Button;
use Combodo\iTop\Application\UI\Base\Component\Button\ButtonUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Component\ButtonGroup\ButtonGroupUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Component\Html\Html;
use Combodo\iTop\Application\UI\Base\Component\Input\InputUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Component\Input\Toggler;
use Combodo\iTop\Application\UI\Base\Component\Panel\Panel;
use Combodo\iTop\Application\UI\Base\Component\Panel\PanelUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Component\PopoverMenu\PopoverMenu;
use Combodo\iTop\Application\UI\Base\Component\PopoverMenu\PopoverMenuItem\PopoverMenuItemFactory;
use Combodo\iTop\Application\UI\Base\Component\Title\TitleUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Component\Toolbar\ToolbarUIBlockFactory;
use Combodo\iTop\Application\UI\Base\Layout\Object\ObjectSummary;
@@ -29,13 +26,10 @@ use CoreException;
use DBObjectSearch;
use DBObjectSet;
use Dict;
use JSPopupMenuItem;
use MetaModel;
use SecurityException;
use URLPopupMenuItem;
use UserRights;
use utils;
use appUserPreferences;
/**
* Class iTopNewsroomController
@@ -376,6 +370,7 @@ JS
$sReadColor = $oEvent->Get('read') === 'no' ? 'ibo-notifications--view-all--item--unread' : 'ibo-notifications--view-all--item--read';
$sReadLabel = $oEvent->Get('read') === 'no' ? Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Unread:Label') : Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Read:Label');
$oEventBlock = new ObjectSummary($oEvent);
$oEventBlock->SetHasLazyLoadIcon(true);
$oEventBlock->SetCSSColorClass($sReadColor);
$oEventBlock->SetSubTitle($sReadLabel);
$oEventBlock->SetClassLabel('');

View File

@@ -18,7 +18,10 @@
{% if oUIBlock.HasIcon() %}
<div class="ibo-panel--icon" data-role="ibo-panel--icon">
{% block iboPanelIcon %}
<div class="ibo-panel--icon-background ibo-panel--icon-background--must-{{ oUIBlock.GetIconCoverMethod() }}" data-role="ibo-panel--icon-background" style="background-image: url('{{ oUIBlock.GetIconUrl()|raw }}');"></div>
<img class="ibo-panel--icon-background ibo-panel--icon-img--must-{{ oUIBlock.GetIconCoverMethod() }}
ibo-panel--icon-background--must-{{ oUIBlock.GetIconCoverMethod() }}"
{% if oUIBlock.HasLazyLoadIcon %} loading="lazy" {% endif %}
data-role="ibo-panel--icon-img" src="{{ oUIBlock.GetIconUrl()|raw }}" alt="" aria-hidden="true">
{% endblock %}
</div>
{% endif %}