feat(tenant): per-theme logos + file-upload + button UI polish

Replace the single tenant avatar with a pair of theme-scoped brand logos.
Render only the theme-matching <img> server-side and swap src on theme
toggle via a JS hook — no reload, no double request, no CSS tricks.

Tenant logos
- TenantLogoService (ImageUploadTrait) with theme whitelist and per-theme
  storage storage/tenants/{uuid}/logo/{light|dark}/, SIZES 128/256/512
- Public serving endpoint auth/tenant-logo-file so login can show the
  logo pre-auth; matching authenticated admin preview endpoint
- appTenantLogoUrl(?size, ?theme) with 4-step fallback cascade; PDF +
  mail always request 'light'
- Admin tenant edit: avatar block replaced by "Tenant logos" details
  block inside the Master-data tab, two side-by-side slots via Pico
  .grid with the core app-file-upload partial
- Policy rename ABILITY_ADMIN_TENANTS_AVATAR_VIEW -> LOGO_VIEW, action
  routes logo / logo-delete / logo-file with theme body/query param
- API endpoint path kept (backward compat), internals on new service
- CLI tenant:logo-migrate-avatars moves legacy avatar/ -> logo/light/
  idempotently (--dry-run, --yes, --cleanup)
- i18n "Tenant image" removed, 12 new keys synced across de/en

File upload component
- Full-width preview + filename/actions below (3D stack layout)
- Fixed 16:9 aspect ratio with 1rem inner padding for consistent
  preview size across any logo aspect
- Transparency checker pattern as background so black logos stay
  visible on dark mode and white logos on light mode
- form="" + deleteFormId support so the partial works with barrier
  forms inside another form

Buttons
- width:100% dropped from button[type="submit"]; scoped back via
  .login-main for the auth-flow primary CTA
- .outline base rule now tints background via color-mix of --app-color
  so secondary/primary/danger outlines all gain a subtle surface
- .outline.secondary restyled Stripe-style in both themes: solid white
  chip with soft shadow in light, solid elevated dark chip with white
  text in dark; neutral border replaces role-colored border
- .app-action-success/.app-action-danger outlines get color-mix bg +
  theme-aware outline-text tokens for stronger contrast
- Filled .primary/.app-action-success/.app-action-danger get raised
  box-shadow (inset highlight + drop) — opt-in via class so chrome
  buttons stay flat
- Dropped the legacy .secondary utility that was clobbering the
  custom-property cascade with a hardcoded muted color

Theme swap
- Logo img carries data-src-light + data-src-dark; theme-toggle JS
  swaps src when data-theme changes, keeping the topbar/login logo in
  sync without a page reload

Quality gates: PHPUnit (2045), PHPStan L5, CS-Fixer, docs link/drift,
codex skills sync — all green.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-24 20:25:53 +02:00
parent dbeac6b095
commit 6e3fc63c1d
43 changed files with 1009 additions and 282 deletions

View File

@@ -14,7 +14,7 @@ class TenantAuthorizationPolicy implements AuthorizationPolicyInterface
public const ABILITY_ADMIN_TENANTS_EDIT_SUBMIT = 'admin.tenants.edit.submit';
public const ABILITY_ADMIN_TENANTS_DELETE = 'admin.tenants.delete';
public const ABILITY_ADMIN_TENANTS_CUSTOM_FIELDS_MANAGE = 'admin.tenants.custom_fields.manage';
public const ABILITY_ADMIN_TENANTS_AVATAR_VIEW = 'admin.tenants.avatar.view';
public const ABILITY_ADMIN_TENANTS_LOGO_VIEW = 'admin.tenants.logo.view';
public const ABILITY_ADMIN_TENANTS_MEDIA_UPDATE = 'admin.tenants.media.update';
public function __construct(
@@ -32,7 +32,7 @@ class TenantAuthorizationPolicy implements AuthorizationPolicyInterface
self::ABILITY_ADMIN_TENANTS_EDIT_SUBMIT,
self::ABILITY_ADMIN_TENANTS_DELETE,
self::ABILITY_ADMIN_TENANTS_CUSTOM_FIELDS_MANAGE,
self::ABILITY_ADMIN_TENANTS_AVATAR_VIEW,
self::ABILITY_ADMIN_TENANTS_LOGO_VIEW,
self::ABILITY_ADMIN_TENANTS_MEDIA_UPDATE,
], true);
}
@@ -46,7 +46,7 @@ class TenantAuthorizationPolicy implements AuthorizationPolicyInterface
self::ABILITY_ADMIN_TENANTS_EDIT_SUBMIT => $this->authorizeAdminTenantsEditSubmit($context),
self::ABILITY_ADMIN_TENANTS_DELETE => $this->authorizeAdminTenantsDelete($context),
self::ABILITY_ADMIN_TENANTS_CUSTOM_FIELDS_MANAGE => $this->authorizeAdminTenantCustomFieldsManage($context),
self::ABILITY_ADMIN_TENANTS_AVATAR_VIEW => $this->authorizeAdminTenantAvatarView($context),
self::ABILITY_ADMIN_TENANTS_LOGO_VIEW => $this->authorizeAdminTenantLogoView($context),
self::ABILITY_ADMIN_TENANTS_MEDIA_UPDATE => $this->authorizeAdminTenantMediaUpdate($context),
default => AuthorizationDecision::deny(500, 'authorization_ability_not_supported'),
};
@@ -147,7 +147,7 @@ class TenantAuthorizationPolicy implements AuthorizationPolicyInterface
return $this->authorizeTenantWithPermission($context, PermissionService::CUSTOM_FIELDS_MANAGE);
}
private function authorizeAdminTenantAvatarView(array $context): AuthorizationDecision
private function authorizeAdminTenantLogoView(array $context): AuthorizationDecision
{
$actorUserId = $this->actorUserId($context);
if (!$this->hasPermission($actorUserId, PermissionService::TENANTS_VIEW)

View File

@@ -4,92 +4,113 @@ namespace MintyPHP\Service\Tenant;
use MintyPHP\Service\Image\ImageUploadTrait;
class TenantAvatarService
/**
* Tenant-scoped brand logo with per-theme variants (light + dark).
*
* Storage layout: storage/tenants/{uuid}/logo/{light|dark}/
* Each theme directory holds one original file plus three resized variants
* (128/256/512). Consumers that lack a theme context (PDF, e-mail) always ask
* for 'light' this is the by-design invariant.
*
* The theme parameter is whitelisted on every public method; invalid values
* short-circuit to empty results so callers never need to repeat the check.
*
* @api
*/
class TenantLogoService
{
use ImageUploadTrait;
public const THEME_LIGHT = 'light';
public const THEME_DARK = 'dark';
/** @var list<string> */
public const THEMES = [self::THEME_LIGHT, self::THEME_DARK];
private const MAX_SIZE = 5242880; // 5 MB
private const SIZES = [64, 128, 256];
private const DEFAULT_SIZE = 128;
private const SIZES = [128, 256, 512];
private const DEFAULT_SIZE = 256;
public function isValidUuid(string $uuid): bool
{
return self::imageIsValidUuid($uuid);
}
public function isValidTheme(string $theme): bool
{
return in_array($theme, self::THEMES, true);
}
public function storageBase(): string
{
return self::imageStorageBase();
}
public function tenantDir(string $uuid): string
public function tenantLogoDir(string $uuid, string $theme): string
{
return $this->storageBase() . '/tenants/' . $uuid . '/avatar';
return $this->storageBase() . '/tenants/' . $uuid . '/logo/' . $theme;
}
public function findAvatarPath(string $uuid, ?int $size = null): ?string
public function findLogoPath(string $uuid, string $theme, ?int $size = null): ?string
{
if (!$this->isValidUuid($uuid)) {
if (!$this->isValidUuid($uuid) || !$this->isValidTheme($theme)) {
return null;
}
$dirs = $this->avatarDirs($uuid);
foreach ($dirs as $dir) {
if (!is_dir($dir)) {
continue;
}
if ($size) {
$size = $this->normalizeSize($size);
$variant = $this->findVariantPath($dir, $size);
if ($variant) {
return $variant;
}
}
$defaultVariant = $this->findVariantPath($dir, self::DEFAULT_SIZE);
if ($defaultVariant) {
return $defaultVariant;
}
$original = self::imageFindOriginalPath($dir);
if ($original) {
return $original;
$dir = $this->tenantLogoDir($uuid, $theme);
if (!is_dir($dir)) {
return null;
}
if ($size) {
$size = $this->normalizeSize($size);
$variant = $this->findVariantPath($dir, $size);
if ($variant) {
return $variant;
}
}
return null;
$defaultVariant = $this->findVariantPath($dir, self::DEFAULT_SIZE);
if ($defaultVariant) {
return $defaultVariant;
}
$original = self::imageFindOriginalPath($dir);
return $original ?: null;
}
public function hasAvatar(string $uuid): bool
public function hasLogo(string $uuid, string $theme): bool
{
$path = $this->findAvatarPath($uuid);
$path = $this->findLogoPath($uuid, $theme);
return $path ? is_file($path) : false;
}
public function delete(string $uuid): bool
public function delete(string $uuid, string $theme): bool
{
if (!$this->isValidUuid($uuid)) {
if (!$this->isValidUuid($uuid) || !$this->isValidTheme($theme)) {
return false;
}
foreach ($this->avatarDirs($uuid) as $dir) {
if (!is_dir($dir)) {
continue;
}
$matches = array_merge(
glob($dir . '/avatar-*.*') ?: [],
glob($dir . '/avatar.*') ?: [],
glob($dir . '/original.*') ?: []
);
foreach ($matches as $file) {
if (is_file($file)) {
@unlink($file);
}
$dir = $this->tenantLogoDir($uuid, $theme);
if (!is_dir($dir)) {
return true;
}
$matches = array_merge(
glob($dir . '/logo-*.*') ?: [],
glob($dir . '/logo.*') ?: [],
glob($dir . '/original.*') ?: []
);
foreach ($matches as $file) {
if (is_file($file)) {
@unlink($file);
}
}
return true;
}
public function saveUpload(string $uuid, array $file): array
public function saveUpload(string $uuid, string $theme, array $file): array
{
if (!$this->isValidUuid($uuid)) {
return ['ok' => false, 'error' => t('Tenant not found')];
}
if (!$this->isValidTheme($theme)) {
return ['ok' => false, 'error' => t('Invalid theme')];
}
if (empty($file) || !isset($file['tmp_name'])) {
return ['ok' => false, 'error' => t('No file uploaded')];
}
@@ -111,12 +132,12 @@ class TenantAvatarService
return ['ok' => false, 'error' => t('Invalid image file')];
}
$dir = $this->tenantDir($uuid);
$dir = $this->tenantLogoDir($uuid, $theme);
if (!is_dir($dir) && !mkdir($dir, 0755, true) && !is_dir($dir)) {
return ['ok' => false, 'error' => t('Upload failed')];
}
$this->delete($uuid);
$this->delete($uuid, $theme);
$originalPath = $dir . '/original.' . $ext;
if (!move_uploaded_file($tmpPath, $originalPath)) {
return ['ok' => false, 'error' => t('Upload failed')];
@@ -126,7 +147,7 @@ class TenantAvatarService
$variantExt = function_exists('imagewebp') ? 'webp' : 'jpg';
if (!$isSvg && self::imageCanResize()) {
foreach (self::SIZES as $size) {
$target = $dir . '/avatar-' . $size . '.' . $variantExt;
$target = $dir . '/logo-' . $size . '.' . $variantExt;
self::imageResizeAndFit($originalPath, $target, $size, $size, $variantExt);
}
}
@@ -149,7 +170,7 @@ class TenantAvatarService
private function findVariantPath(string $dir, int $size): ?string
{
$matches = glob($dir . '/avatar-' . $size . '.*');
$matches = glob($dir . '/logo-' . $size . '.*');
if (!$matches) {
return null;
}
@@ -158,19 +179,4 @@ class TenantAvatarService
});
return $matches[0];
}
private function avatarDirs(string $uuid): array
{
$dirs = [$this->tenantDir($uuid)];
$legacy = $this->legacyTenantDir($uuid);
if ($legacy !== $dirs[0]) {
$dirs[] = $legacy;
}
return $dirs;
}
private function legacyTenantDir(string $uuid): string
{
return $this->storageBase() . '/tenants/' . $uuid;
}
}

View File

@@ -10,7 +10,7 @@ use MintyPHP\Service\Access\PermissionService;
class TenantServicesFactory
{
private ?TenantScopeService $tenantScopeService = null;
private ?TenantAvatarService $tenantAvatarService = null;
private ?TenantLogoService $tenantLogoService = null;
private ?TenantFaviconService $tenantFaviconService = null;
public function __construct(
@@ -29,9 +29,9 @@ class TenantServicesFactory
);
}
public function createTenantAvatarService(): TenantAvatarService
public function createTenantLogoService(): TenantLogoService
{
return $this->tenantAvatarService ??= new TenantAvatarService();
return $this->tenantLogoService ??= new TenantLogoService();
}
public function createTenantFaviconService(): TenantFaviconService

View File

@@ -7,6 +7,7 @@ use Dompdf\Options;
use Endroid\QrCode\QrCode;
use Endroid\QrCode\Writer\PngWriter;
use MintyPHP\Service\Branding\BrandingLogoService;
use MintyPHP\Service\Tenant\TenantLogoService;
use Throwable;
use ZipArchive;
@@ -14,7 +15,8 @@ class UserAccessPdfService
{
public function __construct(
private readonly UserAccessTemplateService $userAccessTemplateService,
private readonly BrandingLogoService $brandingLogoService
private readonly BrandingLogoService $brandingLogoService,
private readonly ?TenantLogoService $tenantLogoService = null
) {
}
@@ -29,7 +31,8 @@ class UserAccessPdfService
$locale = (string) ($context['locale'] ?? '');
$vars = is_array($context['vars'] ?? null) ? $context['vars'] : [];
$vars['pdf_title'] = self::buildPdfTitle($locale);
$vars['app_logo_url'] = $this->resolveLogoDataUri();
$tenantUuid = (string) ($user['tenant_uuid'] ?? $user['primary_tenant_uuid'] ?? '');
$vars['app_logo_url'] = $this->resolveLogoDataUri($tenantUuid);
$vars['login_qr_data_uri'] = self::buildLoginQrDataUri((string) ($vars['login_url'] ?? ''));
$vars['generated_at'] = gmdate('Y-m-d H:i:s') . ' UTC';
@@ -152,13 +155,22 @@ class UserAccessPdfService
return $html;
}
private function resolveLogoDataUri(): string
private function resolveLogoDataUri(string $tenantUuid = ''): string
{
$path = '';
$mime = '';
// Prefer tenant/app branding logo first.
if ($this->brandingLogoService->hasLogo()) {
// Prefer tenant light-logo if available (PDF has no theme context; always-light).
if ($this->tenantLogoService !== null && $tenantUuid !== '' && $this->tenantLogoService->hasLogo($tenantUuid, TenantLogoService::THEME_LIGHT)) {
$logoPath = $this->tenantLogoService->findLogoPath($tenantUuid, TenantLogoService::THEME_LIGHT, 128);
if ($logoPath && is_file($logoPath)) {
$path = $logoPath;
$mime = $this->tenantLogoService->detectMime($logoPath);
}
}
// Fallback to global app-branding logo.
if ($path === '' && $this->brandingLogoService->hasLogo()) {
$logoPath = $this->brandingLogoService->findLogoPath(128);
if ($logoPath && is_file($logoPath)) {
$path = $logoPath;