feat: change favicon

This commit is contained in:
Benedetto Marco Serinelli 2024-02-10 22:51:52 +01:00
parent 6b8cf40ce2
commit 9cf310865a
4 changed files with 98 additions and 55 deletions

View file

@ -1,6 +1,6 @@
package com.provectus.kafka.ui.controller;
import com.provectus.kafka.ui.api.PreferenceseApi;
import com.provectus.kafka.ui.api.PreferencesApi;
import com.provectus.kafka.ui.model.ApplicationsPreferencesDTO;
import lombok.RequiredArgsConstructor;
import lombok.extern.slf4j.Slf4j;
@ -13,14 +13,31 @@ import reactor.core.publisher.Mono;
@RestController
@RequiredArgsConstructor
@Slf4j
public class PreferencesController implements PreferenceseApi {
public class PreferencesController implements PreferencesApi {
@Value("${kafka.ui.preferences.removegitlink}")
private String kafkaUiRemoveGitLink;
@Value("${kafka.ui.preferences.removeGitlink}")
private boolean kafkaUiRemoveGitLink;
@Value("${kafka.ui.preferences.removeDiscordLink}")
private boolean kafkaUiRemovDiscordLink;
@Value("${kafka.ui.preferences.appName}")
private String kafkaUiAppName;
@Value("${kafka.ui.preferences.favicon}")
private String kafkaUiFavicon;
@Value("${kafka.ui.preferences.logo}")
private String kafkaUiIcon;
@Override
public Mono<ResponseEntity<ApplicationsPreferencesDTO>> getPreferences(ServerWebExchange exchange) {
return null;
ApplicationsPreferencesDTO res = new ApplicationsPreferencesDTO();
res.setAppName(kafkaUiAppName);
res.setRemoveDiscordLink(kafkaUiRemoveGitLink);
res.setRemoveGitLink(kafkaUiRemovDiscordLink);
res.setLogo(kafkaUiIcon);
res.setFavicon(kafkaUiFavicon);
return Mono.just(
ResponseEntity.ok(res
)
);
}
}

File diff suppressed because one or more lines are too long

View file

@ -18,7 +18,7 @@ paths:
/api/preferences:
get:
tags:
- Preferencese
- Preferences
summary: getPreferences
operationId: getPreferences
responses:
@ -2082,6 +2082,12 @@ components:
appName:
type: string
example: "App Kafka UI My Preferences"
favicon:
type: string
example: "Base64 faicon"
logo:
type: string
example: "Base 64 icon"
TopicSerdeSuggestion:
type: object
properties:

View file

@ -1,57 +1,72 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Favicons -->
<link rel="icon" href="<%= PUBLIC_PATH %>/favicon/favicon.ico" sizes="any" />
<link rel="icon" href="<%= PUBLIC_PATH %>/favicon/icon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="<%= PUBLIC_PATH %>/favicon/apple-touch-icon.png" />
<link rel="manifest" href="<%= PUBLIC_PATH %>/manifest.json" />
<!-- Favicons -->
<link rel="icon" href="<%= PUBLIC_PATH %>/favicon/favicon.ico" sizes="any" />
<link rel="icon" href="<%= PUBLIC_PATH %>/favicon/icon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="<%= PUBLIC_PATH %>/favicon/apple-touch-icon.png" />
<link rel="manifest" href="<%= PUBLIC_PATH %>/manifest.json" />
<title>UI for Apache Kafka</title>
<script type="text/javascript">
window.basePath = '<%= PUBLIC_PATH %>';
<title>UI for Apache Kafka</title>
<script type="text/javascript">
window.basePath = '<%= PUBLIC_PATH %>';
window.__assetsPathBuilder = function (importer) {
return window.basePath+ "/" + importer;
};
fetch(window.basePath+'/api/preferences')
.then(function(response) {
return response.json();
})
.then(function(jsonResponse) {
// do something with jsonResponse
let $favicon = document.querySelector('link[rel*="icon"]')
if ($favicon !== null) {
$favicon.href = jsonResponse.favicon
} else {
$favicon = document.createElement('link')
$favicon.rel = 'icon'
$favicon.href = jsonResponse.favicon
document.head.appendChild($favicon)
}
});
</script>
<style>
@font-face {
font-family: 'Inter';
src: url('<%= PUBLIC_PATH %>/fonts/Inter-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
}
window.__assetsPathBuilder = function (importer) {
return window.basePath+ "/" + importer;
};
</script>
<style>
@font-face {
font-family: 'Inter';
src: url('<%= PUBLIC_PATH %>/fonts/Inter-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('<%= PUBLIC_PATH %>/fonts/Inter-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: 'Inter';
src: url('<%= PUBLIC_PATH %>/fonts/Inter-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: 'Roboto Mono';
src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: 'Roboto Mono';
src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Medium.ttf') format('truetype');
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: 'Roboto Mono';
src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
</style>
</head>
@font-face {
font-family: 'Roboto Mono';
src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Regular.ttf') format('truetype');
font-weight: 400;
font-display: swap;
}
</style>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body>
</html>