This is an automated email from the ASF dual-hosted git repository.
linxinyuan pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/texera.git
The following commit(s) were added to refs/heads/main by this push:
new bc53831a66 feat: add current branding preview to admin settings (#3700)
bc53831a66 is described below
commit bc53831a662491e3e5e1fd2f26fef9cf6c683bcc
Author: Xuan Gu <[email protected]>
AuthorDate: Tue Aug 26 21:49:49 2025 -0700
feat: add current branding preview to admin settings (#3700)
### **Purpose**
This PR resolves issue #3699 where the branding preview on the Admin
General Settings page was only applied to newly uploaded assets. It
extends the preview functionality to also display the currently used
assets (logo, mini logo, favicon), improving clarity and usability for
administrators.
### **Changes**
- **Branding Preview**: Load default values from the database and
display the current branding in the preview section (logo, mini logo,
favicon), reusing the same UI as for new uploads.
- **Save/Reset Logic**: Simplified saveLogos() and resetBranding() to
follow the same patterns as other settings for consistency.
- Combined save/reset into a single feedback message to avoid redundancy
(e.g., “Branding saved successfully”, “Branding reset”, or error
messages).
- **Reload Delay**: Extracted reload timing into a constant private
readonly RELOAD_DELAY = 1000. Branding changes now refresh after 1s.
### **Demonstration**
| Before | After |
|--------|-------|
| <img width="760" height="457" alt="before-preview"
src="https://github.com/user-attachments/assets/9a31a697-5553-4545-a1d6-0aaa95305b30";
/> | <img width="817" height="457" alt="after-preview"
src="https://github.com/user-attachments/assets/b7dfff61-7ce7-4e8c-b330-7c9828e9f175";
/> |
Co-authored-by: Xinyuan Lin <[email protected]>
---
.../admin/settings/admin-settings.component.ts | 99 +++++++++-------------
1 file changed, 40 insertions(+), 59 deletions(-)
diff --git
a/core/gui/src/app/dashboard/component/admin/settings/admin-settings.component.ts
b/core/gui/src/app/dashboard/component/admin/settings/admin-settings.component.ts
index 863ea67b81..cb28e24c30 100644
---
a/core/gui/src/app/dashboard/component/admin/settings/admin-settings.component.ts
+++
b/core/gui/src/app/dashboard/component/admin/settings/admin-settings.component.ts
@@ -58,15 +58,35 @@ export class AdminSettingsComponent implements OnInit {
readonly MAX_FILE_SIZE_MB = 5242880; // 5 TiB maximum object size (5 * 1024
* 1024 MiB)
readonly MAX_TOTAL_PARTS = 10000; // S3 maximum parts per upload
+ private readonly RELOAD_DELAY = 1000;
+
constructor(
private adminSettingsService: AdminSettingsService,
private message: NzMessageService
) {}
ngOnInit(): void {
+ this.loadBranding();
this.loadTabs();
this.loadDatasetSetting();
}
+ private loadBranding(): void {
+ this.adminSettingsService
+ .getSetting("logo")
+ .pipe(untilDestroyed(this))
+ .subscribe(value => (this.logoData = value || null));
+
+ this.adminSettingsService
+ .getSetting("mini_logo")
+ .pipe(untilDestroyed(this))
+ .subscribe(value => (this.miniLogoData = value || null));
+
+ this.adminSettingsService
+ .getSetting("favicon")
+ .pipe(untilDestroyed(this))
+ .subscribe(value => (this.faviconData = value || null));
+ }
+
private loadTabs(): void {
(Object.keys(this.sidebarTabs) as (keyof SidebarTabs)[]).forEach(tab => {
this.adminSettingsService
@@ -112,76 +132,37 @@ export class AdminSettingsComponent implements OnInit {
}
saveLogos(): void {
+ const saveRequests = [];
if (this.logoData) {
- this.adminSettingsService
- .updateSetting("logo", this.logoData)
- .pipe(untilDestroyed(this))
- .subscribe({
- next: () => this.message.success("Logo saved successfully."),
- error: () => this.message.error("Failed to save logo."),
- });
+ saveRequests.push(this.adminSettingsService.updateSetting("logo",
this.logoData));
}
-
if (this.miniLogoData) {
- this.adminSettingsService
- .updateSetting("mini_logo", this.miniLogoData)
- .pipe(untilDestroyed(this))
- .subscribe({
- next: () => this.message.success("Mini logo saved successfully."),
- error: () => this.message.error("Failed to save mini logo."),
- });
+ saveRequests.push(this.adminSettingsService.updateSetting("mini_logo",
this.miniLogoData));
}
-
if (this.faviconData) {
- this.adminSettingsService
- .updateSetting("favicon", this.faviconData)
+ saveRequests.push(this.adminSettingsService.updateSetting("favicon",
this.faviconData));
+ }
+
+ if (saveRequests.length > 0) {
+ forkJoin(saveRequests)
.pipe(untilDestroyed(this))
.subscribe({
- next: () => this.message.success("Favicon saved successfully."),
- error: () => this.message.error("Failed to save favicon."),
+ next: () => {
+ this.message.success("Branding saved successfully.");
+ setTimeout(() => window.location.reload(), this.RELOAD_DELAY);
+ },
+ error: () => this.message.error("Failed to save branding."),
});
}
-
- if (this.logoData || this.miniLogoData || this.faviconData) {
- setTimeout(() => window.location.reload(), 500);
- }
}
resetBranding(): void {
- this.adminSettingsService
- .resetSetting("logo")
- .pipe(untilDestroyed(this))
- .subscribe({
- next: () => {
- this.logoData = null;
- this.message.success("Logo reset to default.");
- },
- error: () => this.message.error("Failed to reset logo."),
- });
-
- this.adminSettingsService
- .resetSetting("mini_logo")
- .pipe(untilDestroyed(this))
- .subscribe({
- next: () => {
- this.miniLogoData = null;
- this.message.success("Mini logo reset to default.");
- },
- error: () => this.message.error("Failed to reset mini logo."),
- });
-
- this.adminSettingsService
- .resetSetting("favicon")
- .pipe(untilDestroyed(this))
- .subscribe({
- next: () => {
- this.faviconData = null;
- this.message.success("Favicon reset to default.");
- },
- error: () => this.message.error("Failed to reset favicon."),
- });
+ ["logo", "mini_logo", "favicon"].forEach(setting =>
+
this.adminSettingsService.resetSetting(setting).pipe(untilDestroyed(this)).subscribe({})
+ );
- setTimeout(() => window.location.reload(), 500);
+ this.message.info("Resetting branding...");
+ setTimeout(() => window.location.reload(), this.RELOAD_DELAY);
}
saveTabs(tab: keyof SidebarTabs): void {
@@ -206,7 +187,7 @@ export class AdminSettingsComponent implements OnInit {
});
this.message.info("Resetting tabs...");
- setTimeout(() => window.location.reload(), 500);
+ setTimeout(() => window.location.reload(), this.RELOAD_DELAY);
}
saveDatasetSettings(): void {
@@ -250,6 +231,6 @@ export class AdminSettingsComponent implements OnInit {
].forEach(setting =>
this.adminSettingsService.resetSetting(setting).pipe(untilDestroyed(this)).subscribe({}));
this.message.info("Resetting dataset settings...");
- setTimeout(() => window.location.reload(), 500);
+ setTimeout(() => window.location.reload(), this.RELOAD_DELAY);
}
}
