Elastic Search With Angular UI Fails To Search From the Browser

[RDsideNow]

Overview of the issue

When searching in the UI no results are filtered based on what is searched.

Motivation for or Use Case

Elastic search is not working properly

Reproduce the error

Import attached jdl create a few order entities and search for something specific that would filter out other orders. If i use the swagger tool it works, but when using the UI on the entity list page it does not.

Related issues

I don't think so.

Suggest a Fix

I think it has to do with the query string but im not entirely sure.

JHipster Version(s)

7.4.0

JHipster configuration

Environment and Tools

openjdk version "12.0.2" 2019-07-16 OpenJDK Runtime Environment AdoptOpenJDK (build 12.0.2+10) OpenJDK 64-Bit Server VM AdoptOpenJDK (build 12.0.2+10, mixed mode)

git version 2.23.0

node: v14.18.1

npm: 8.1.4

Docker version 20.10.7, build f0df350

docker-compose version 1.29.2, build 5becea4c

The .yo-rc.json file generated in the root folder is mandatory for bug reports. This will help us to replicate the scenario. You should remove any sensitive information like the rememberMe key or the jwtSecretKey key.

{ "generator-jhipster": { "authenticationType": "oauth2", "clientFramework": "angularX", "serverPort": "8080", "serviceDiscoveryType": "eureka", "skipUserManagement": true, "withAdminUi": true, "baseName": "appgateway", "buildTool": "gradle", "databaseType": "sql", "devDatabaseType": "postgresql", "cacheProvider": "no", "enableHibernateCache": false, "enableSwaggerCodegen": false, "enableTranslation": true, "jhiPrefix": "jhi", "languages": [ "fr", "es", "en" ], "messageBroker": "kafka", "prodDatabaseType": "postgresql", "searchEngine": "elasticsearch", "testFrameworks": [ "gatling", "cucumber", "cypress" ], "websocket": false, "enableGradleEnterprise": false, "gradleEnterpriseHost": "", "applicationType": "gateway", "packageName": "com.appgateway", "packageFolder": "com/appgateway", "clientPackageManager": "npm", "nativeLanguage": "en", "dtoSuffix": "DTO", "jhipsterVersion": "7.4.0", "entitySuffix": "", "reactive": true, "clientTheme": "none", "clientThemeVariant": "", "applicationIndex": 0, "applications": { "ordering": { "serverPort": "10001", "applicationIndex": 1 } } } }

---

If you have a JDL please wrap it in below structure

JDL definitions

     paginate * with pagination
dto * with mapstruct
filter *
search Order with elasticsearch
application {
config {
baseName appgateway,
applicationType gateway,
packageName com.appgateway,
serverPort 8080,
serviceDiscoveryType eureka,
authenticationType oauth2,
cacheProvider hazelcast,
enableHibernateCache false,
databaseType sql,
devDatabaseType postgresql,
prodDatabaseType postgresql,
enableSwaggerCodegen false,
searchEngine elasticsearch,
buildTool gradle,
messageBroker kafka,
clientPackageManager npm,
testFrameworks [
gatling,
cucumber,
cypress
],
enableTranslation true,
nativeLanguage en,
languages [
fr,
es,
en
],
jhiPrefix jhi,
dtoSuffix DTO,
clientFramework angularX
}
entities *
}
application {
config {
baseName ordering,
applicationType microservice,
packageName com.ordering,
serverPort 10001,
serviceDiscoveryType eureka,
authenticationType oauth2,
cacheProvider hazelcast,
enableHibernateCache false,
databaseType sql,
devDatabaseType postgresql,
prodDatabaseType postgresql,
enableSwaggerCodegen false,
searchEngine elasticsearch,
buildTool gradle,
messageBroker kafka,
clientPackageManager npm,
testFrameworks [
gatling,
cucumber,
cypress
],
enableTranslation true,
nativeLanguage en,
languages [
fr,
es,
en
],
jhiPrefix jhi,
dtoSuffix DTO
}
entities Order, OrderItemOption, OrderItem, OrderVehicle
}
entity Order {
orderType OrderType required,
lossDate ZonedDateTime required,
isRoadside Boolean,
isSalvage Boolean,
hasPayout Boolean,
hasDestination Boolean,
milesToDestination BigDecimal,
coverageVerificationType CoverageVerifyType required,
dateCoverageVerified Instant,
orderNumber Long unique,
submittedDate Instant,
canceledDate Instant,
completedDate Instant,
voidedDate Instant,
status OrderStatusType required,
cancelReason OrderCancelReason,
requestType RequestType required
}
enum OrderCancelReason {
NO_LONGER_NEEDS_ASSISTANCE,
COST_IS_TOO_HIGH
}
enum RequestType {
EMERGENCY_ROADSIDE_ASSISTANCE,
ACCIDENT_SCENE_TRANSPORT,
NON_EMERGENCY_SALVAGE_TRANSPORT
}
enum CoverageVerifyType {
DATA,
NOT_REQUIRED,
UNVERIFIED
}
enum OrderStatusType {
DRAFT,
SUBMITTED,
ACTIVE,
CANCELED,
COMPLETED,
VOID
}
enum OrderType {
DISPATCH,
REIMBURSEMENT,
INFORMATIONAL,
TECHNICAL_ASSISTANCE
}
entity OrderItem {
}
entity OrderItemOption {
itemOptionId String unique required,
description String required,
requestType RequestType required,
requiresDestination Boolean,
isFee Boolean,
expired Boolean,
}
entity OrderVehicle {
drivetrain DrivetrainType required,
vin String,
licensePlate String,
licenseState String,
year Integer required,
make String required,
model String required,
body String
}
enum DrivetrainType {
FRONT_WHEEL_DRIVE,
REAR_WHEEL_DRIVE,
ALL_WHEEL_DRIVE,
FOUR_WHEEL_DRIVE
}
relationship ManyToOne {
OrderItem{orderItem(description) required} to OrderItemOption{order}
}
relationship OneToMany {
Order{orderItem} to OrderItem{order required}
}
relationship OneToOne {
Order{orderVehicle} to OrderVehicle
}
microservice Order, OrderItemOption, OrderVehicle with ordering
  

-->

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

Browsers and Operating System

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

[ko5tik]

Also looking on it - there is no annotations on entity classes beside @document. so basicaly nothing gets indexed.

[github-actions[bot]]

This issue is stale because it has been open 30 days with no activity. Our core developers tend to be more verbose on denying. If there is no negative comment, possibly this feature will be accepted. We are accepting PRs :smiley:. Comment or this will be closed in 7 days

[RDsideNow]

Can this be reopened?

[ko5tik]

Can you look / supply what is actually indexed in the elasticsearch? Actual implementation performs indexing on the objects coming from the rest service, and they may be not the objects stored in your database.

I opened an issue : https://github.com/jhipster/generator-jhipster/issues/17488

[RDsideNow]

Yea ill have to take a look but i think the issue is with the fe request to the backend.

[RDsideNow]

Only reason i say so is with the swagger ui i could successfully use the search feature. Just not from the list page with the search box

[DanielFran]

@RDsideNow Can you confirm if #18741 fix your issue?

[Tcharl]

Hello,

I tried to reproduce with the exact same jdl and the latest version.

As the OrderItem is not in any microservice, it's generated as part of the gateway (so in reactive) thus leading to exception because of the two-many relationship.

Can you please provide the working jdl sample please?

paginate * with pagination
dto * with mapstruct
filter *
search Order with elasticsearch
application {

    config {
        baseName appgateway,
        applicationType gateway,
        packageName com.appgateway,
        serverPort 8080,
        serviceDiscoveryType eureka,
        authenticationType oauth2,
        cacheProvider hazelcast,
        enableHibernateCache false,
        databaseType sql,
        devDatabaseType postgresql,
        prodDatabaseType postgresql,
        enableSwaggerCodegen false,
        searchEngine elasticsearch,
        buildTool gradle,
        messageBroker kafka,
        clientPackageManager npm,
        testFrameworks [
            gatling,
            cucumber,
            cypress
        ],
        enableTranslation true,
        nativeLanguage en,
        languages [
            fr,
            es,
            en
        ],
        jhiPrefix jhi,
        dtoSuffix DTO,
        clientFramework angularX
    }
    entities *
}

application {
    config {
        baseName ordering,
        applicationType microservice,
        packageName com.ordering,
        serverPort 10001,
        serviceDiscoveryType eureka,
        authenticationType oauth2,
        cacheProvider hazelcast,
        enableHibernateCache false,
        databaseType sql,
        devDatabaseType postgresql,
        prodDatabaseType postgresql,
        enableSwaggerCodegen false,
        searchEngine elasticsearch,
        buildTool gradle,
        messageBroker kafka,
        clientPackageManager npm,
        testFrameworks [
            gatling,
            cucumber,
            cypress
        ],
        enableTranslation true,
        nativeLanguage en,
        languages [
            fr,
            es,
            en
        ],
        jhiPrefix jhi,
        dtoSuffix DTO
    }
    entities Order, OrderItemOption, OrderItem, OrderVehicle
}


entity Order {
    orderType OrderType required,
    lossDate ZonedDateTime required,
    isRoadside Boolean,
    isSalvage Boolean,
    hasPayout Boolean,
    hasDestination Boolean,
    milesToDestination BigDecimal,
    coverageVerificationType CoverageVerifyType required,
    dateCoverageVerified Instant,
    orderNumber Long unique,
    submittedDate Instant,
    canceledDate Instant,
    completedDate Instant,
    voidedDate Instant,
    status OrderStatusType required,
    cancelReason OrderCancelReason,
    requestType RequestType required
}


enum OrderCancelReason {
    NO_LONGER_NEEDS_ASSISTANCE,
    COST_IS_TOO_HIGH
}


enum RequestType {
    EMERGENCY_ROADSIDE_ASSISTANCE,
    ACCIDENT_SCENE_TRANSPORT,
    NON_EMERGENCY_SALVAGE_TRANSPORT
}


enum CoverageVerifyType {
    DATA,
    NOT_REQUIRED,
    UNVERIFIED
}

enum OrderStatusType {
    DRAFT,
    SUBMITTED,
    ACTIVE,
    CANCELED,
    COMPLETED,
    VOID
}


enum OrderType {
    DISPATCH,
    REIMBURSEMENT,
    INFORMATIONAL,
    TECHNICAL_ASSISTANCE
}


entity OrderItem {

}


entity OrderItemOption {
    itemOptionId String unique required,
    description String required,
    requestType RequestType required,
    requiresDestination Boolean,
    isFee Boolean,
    expired Boolean,
}


entity OrderVehicle {
    drivetrain DrivetrainType required,
    vin String,
    licensePlate String,
    licenseState String,
    year Integer required,
    make String required,
    model String required,
    body String
}


enum DrivetrainType {
   FRONT_WHEEL_DRIVE,
   REAR_WHEEL_DRIVE,
    ALL_WHEEL_DRIVE,
    FOUR_WHEEL_DRIVE
}


relationship ManyToOne {
    OrderItem{orderItem(description) required} to OrderItemOption{order}
}


relationship OneToMany {
    Order{orderItem} to OrderItem{order required}
}


relationship OneToOne {
    Order{orderVehicle} to OrderVehicle
}


microservice Order, OrderItemOption, OrderVehicle with ordering

[RDsideNow]

Sorry, i think i posted on the wrong issue

I can confirm that as of version 7.8.1 this issue is still present

If is use the swagger page search, the results return as expected

try this JDL

paginate * with pagination dto * with mapstruct filter * search Order with elasticsearch application {

config {
    baseName appgateway,
    applicationType gateway,
    packageName com.appgateway,
    serverPort 8080,
    serviceDiscoveryType eureka,
    authenticationType oauth2,
    cacheProvider hazelcast,
    enableHibernateCache false,
    databaseType sql,
    devDatabaseType postgresql,
    prodDatabaseType postgresql,
    enableSwaggerCodegen false,
    searchEngine elasticsearch,
    buildTool gradle,
    messageBroker kafka,
    clientPackageManager npm,
    testFrameworks [
        gatling,
        cucumber,
        cypress
    ],
    enableTranslation true,
    nativeLanguage en,
    languages [
        fr,
        es,
        en
    ],
    jhiPrefix jhi,
    dtoSuffix DTO,
    clientFramework angularX
}
entities *

}

application { config { baseName ordering, applicationType microservice, packageName com.ordering, serverPort 10001, serviceDiscoveryType eureka, authenticationType oauth2, cacheProvider hazelcast, enableHibernateCache false, databaseType sql, devDatabaseType postgresql, prodDatabaseType postgresql, enableSwaggerCodegen false, searchEngine elasticsearch, buildTool gradle, messageBroker kafka, clientPackageManager npm, testFrameworks [ gatling, cucumber, cypress ], enableTranslation true, nativeLanguage en, languages [ fr, es, en ], jhiPrefix jhi, dtoSuffix DTO } entities Order, OrderItemOption, OrderItem, OrderVehicle }

entity Order { orderType OrderType required, lossDate ZonedDateTime required, isRoadside Boolean, isSalvage Boolean, hasPayout Boolean, hasDestination Boolean, milesToDestination BigDecimal, coverageVerificationType CoverageVerifyType required, dateCoverageVerified Instant, orderNumber Long unique, submittedDate Instant, canceledDate Instant, completedDate Instant, voidedDate Instant, status OrderStatusType required, cancelReason OrderCancelReason, requestType RequestType required }

enum OrderCancelReason { NO_LONGER_NEEDS_ASSISTANCE, COST_IS_TOO_HIGH }

enum RequestType { EMERGENCY_ROADSIDE_ASSISTANCE, ACCIDENT_SCENE_TRANSPORT, NON_EMERGENCY_SALVAGE_TRANSPORT }

enum CoverageVerifyType { DATA, NOT_REQUIRED, UNVERIFIED }

enum OrderStatusType { DRAFT, SUBMITTED, ACTIVE, CANCELED, COMPLETED, VOID }

enum OrderType { DISPATCH, REIMBURSEMENT, INFORMATIONAL, TECHNICAL_ASSISTANCE }

entity OrderItem {

}

entity OrderItemOption { itemOptionId String unique required, description String required, requestType RequestType required, requiresDestination Boolean, isFee Boolean, expired Boolean, }

entity OrderVehicle { drivetrain DrivetrainType required, vin String, licensePlate String, licenseState String, year Integer required, make String required, model String required, body String }

enum DrivetrainType { FRONT_WHEEL_DRIVE, REAR_WHEEL_DRIVE, ALL_WHEEL_DRIVE, FOUR_WHEEL_DRIVE }

relationship ManyToOne { OrderItem{orderItem(description) required} to OrderItemOption{order} }

relationship OneToMany { Order{orderItem} to OrderItem{order required} }

relationship OneToOne { Order{orderVehicle} to OrderVehicle }

microservice Order, OrderItemOption, OrderItem, OrderVehicle with ordering

[OmarHawk]

Well, according to your screenshots, it doesn't find the correct API endpoint in Angular. Seems as if it is below some sub path, which the Swagger UI correctly makes use of, but the Angular UI does not...

Swagger: Frontend:

[RDsideNow]

@OmarHawk im not sure. This is with the generated code unmodified. I am using the micro front ends. Is that possibly the issue?

[github-actions[bot]]

This issue is stale because it has been open for too long without any activity. Due to the moving nature of jhipster generated application, bugs can become invalid. If this issue still applies please comment otherwise it will be closed in 7 days