[FE-38] White-labeling: frontend custom branding per hub

[yusuftomilola]

Overview

Hub operators want to show their own brand (logo, name, primary colour) to members instead of the default ManageHub branding. White-labeling makes the platform resellable as a branded product — critical for hub software vendors.

Context

• Dashboard layout: frontend/components/dashboard/DashboardLayout.tsx
• Top navbar: frontend/components/ui/Navbar.tsx
• Global CSS: frontend/app/globals.css — uses CSS custom properties for colour theming
• Hub settings API: GET /hub-settings/branding — to be created alongside this frontend task (a small backend addition: store branding config in a HubSettings DB table or JSON config)

Tasks

• Create backend/src/hub-settings/ module with a HubSettings entity (id, hubName, logoUrl, primaryColorHex, faviconUrl) — seed with ManageHub defaults
• GET /hub-settings/branding — public endpoint returning branding config
• PATCH /hub-settings/branding — admin updates branding (admin only)
• On frontend app load: fetch GET /hub-settings/branding in a root layout component; apply:
  • document.documentElement.style.setProperty('--color-primary', primaryColorHex) for the theme colour
  • Replace the ManageHub logo <img src> in Navbar and DashboardSidebar with logoUrl
  • Replace ManageHub text in sidebar and page <title> with hubName
  • Set custom favicon via Next.js metadata API
• Add /admin/settings/branding page: upload logo (Cloudinary), upload favicon, colour picker for primary colour, hub name input, save button
• If GET /hub-settings/branding fails, fall back silently to ManageHub defaults (no error shown to members)

Files to Modify / Create

• New: backend/src/hub-settings/ (module, entity, controller, service)
• frontend/components/dashboard/DashboardLayout.tsx
• frontend/components/ui/Navbar.tsx
• New: frontend/app/admin/settings/branding/page.tsx