Angular: Using Entity "Refresh list" button makes pagination links multiply requests

[OmarHawk]

Overview of the issue

Each click on the "Refresh list" button on top the entity list will increase the requests made to the backend for fetching another page by one. I.e. If I click 5 times on the reload list button, a click on link for page 2 of the pagination will cause 6 requests be made. This can sum of to large amounts of absolutely unnecessary requests and serious performance issues.

Here's a short video of the reproduction with a default generated application in which you can see the network console and at the end 3 requests instead of 1 request being made, after I had hit the "Refresh list" button twice right before.

2024-01-22_15h13_32.mp4

Motivation for or Use Case

Not loading anything unnecessarily. And potentially requesting the list of entries of an entity more than once per requested page makes no sense to me.

Reproduce the error

1. Have an entity with more than one page in the list view (i.e. more than 20 entries)
2. Go to list view of the entity
3. Click x times on the refresh list button
4. Click on page 2 of the list view
5. See in network console that the request for page 2 is done x+1 times

Related issues

Nothing found

Suggest a Fix

JHipster Version(s)

8.1.0 (but was already in 7.9.3, we just hoped it may get resolved with an update, so we didn't report it till now)

JHipster configuration, a .yo-rc.json file generated in the root folder

.yo-rc.json file

{
  "generator-jhipster": {
    "applicationType": "monolith",
    "authenticationType": "oauth2",
    "baseName": "testjhi81",
    "buildTool": "maven",
    "cacheProvider": "no",
    "clientFramework": "angular",
    "clientTestFrameworks": [],
    "clientTheme": "none",
    "creationTimestamp": 1705930509243,
    "databaseType": "sql",
    "devDatabaseType": "mysql",
    "devServerPort": 4200,
    "enableGradleEnterprise": null,
    "enableHibernateCache": false,
    "enableSwaggerCodegen": false,
    "enableTranslation": true,
    "entities": [
      "EntityA"
    ],
    "feignClient": false,
    "gradleEnterpriseHost": null,
    "jhipsterVersion": "8.1.0",
    "languages": [
      "de",
      "en"
    ],
    "lastLiquibaseTimestamp": 1705930569000,
    "messageBroker": false,
    "microfrontend": null,
    "microfrontends": [],
    "nativeLanguage": "de",
    "packageName": "com.mycompany.myapp",
    "prodDatabaseType": "mysql",
    "reactive": false,
    "searchEngine": "elasticsearch",
    "serverPort": null,
    "serverSideOptions": [
      "searchEngine:elasticsearch"
    ],
    "serviceDiscoveryType": false,
    "skipUserManagement": true,
    "testFrameworks": [],
    "websocket": false,
    "withAdminUi": true
  }
}

Environment and Tools

openjdk version "17.0.7" 2023-04-18 LTS
OpenJDK Runtime Environment (Red_Hat-17.0.7.0+7-1) (build 17.0.7+7-LTS)
OpenJDK 64-Bit Server VM (Red_Hat-17.0.7.0+7-1) (build 17.0.7+7-LTS, mixed mode, sharing)

git version 2.43.0.windows.1

node: v18.19.0
npm: 10.2.3

Docker version 24.0.2-rd, build e63f5fa

JDL for the Entity configuration(s) entityName.json files generated in the .jhipster directory

JDL entity definitions

@ChangelogDate("20240122133609")
entity EntityA {
  name String
}

dto EntityA with mapstruct
paginate EntityA with pagination
service EntityA with serviceImpl
search EntityA with elasticsearch
filter EntityA

Browsers and Operating System

Could reproduce with Chrome 120.0.6099.225 and Firefox 121.0.1 (64-Bit), both on Windows 10

• Checking this box is mandatory (this is just to show you read everything)

[qmonmert]

@DanielFran I confirm bug