Logo missing on Login Screen in dev docker Container

[jheinitz]

Hello,

we are using 0.23.0 of AKHQ which is working fine. we have configured basic-auth for the UI with noaccess to be the default. This means that the Login screen appears when we open the URL in the Browser.
Today I made some tests using the latest dev image and I recognized that the AKHQ Logo is missing on the Login Screen. Is there a reason for this and will it be available in the next official release?

Please let me know if you need anything else from my side to find the reason for the missing logo.

Kind regards
Jens

[tchiotludo]

it's clearly a bug, we need to fix that before the imminent release 😢

[jheinitz]

I don't know if it is related, but I use these html-head: settings to display a colored string under the logo:

  html-head: "<style type=\"text/css\">\n  .logo-wrapper:after {\n    display: block;\n
    \   content: \"test\";\n    height: 24px;\n    position: relative;\n    text-transform:
    capitalize;\n    font-weight: bold;\n    text-align: center;\n    background-color:
    darkgreen;\n    color: white;\n    font-size: 24px;\n    margin-top: 8px;\n  }\n</style>\n"

This works fine with 0.23.0 but does not work with the latest dev docker image.

Any idea?

[AlexisSouquiere]

The issue seems to be linked to a wrong URI when loading the logo.

0.23.0

dev image (/ui/ui/static/...)

I don't know yet what is the issue and what could have changed on assets management. I'll try to take some time to investigate

[tooptoop4]

maybe #1355 is related or micronaut-projects/micronaut-core#8948?

[AlexisSouquiere]

For me there is no link with this PR or even Micronaut. #1355 is related to the returnTo variable that is set when leaving a component. The issue with Micronaut is about context-path that we don't use by default (we use it in my organization that why a fixed issue on it). I would think about something related to webpack.

I'm seeing a new entry in the asset-manifest.json for the logo

We don't have it in 0.23.0 or with another key

This new entry could explain that we try to retrieve the logo from /ui/ui because of the relative ./ui path.

@lucapette any idea ? I'm not sure at all but it's the only idea I have

[tooptoop4]

how about this theory? dd8ea4f upgraded "react-scripts" from "3.4.1" to "^5.0.1", https://github.com/facebook/create-react-app/blob/v3.4.1/packages/react-scripts/package.json#L79 shows "webpack": "4.42.0" while https://github.com/facebook/create-react-app/blob/v5.0.1/packages/react-scripts/package.json#L74 shows "webpack": "^5.64.4". https://stackoverflow.com/questions/71254243/webpack-5-webpack-tries-to-resolve-root-relative-paths-to-images-in-scss-or-c has reference to webpack/webpack#15499 which sounds a little similar and mentions that it worked in webpack 4 but not webpack 5

[AlexisSouquiere]

I have create #1449 that is fixing the issue.
I don't really know what was the issue or even if it's the right way to fix it but changing the way we load the logo to load it as a React component seems to work.
When merged, can you please check @jheinitz that it's working again ?

[jheinitz]

Hi! Thanks for fixing it. I will give it a try as soon as the new docker image is available and give feedback here.

[tchiotludo]

done in #1449