Add admin avatars and app logos (#20001)

## Summary
- Add user avatars and workspace logos to the admin general table and
workspace member detail view
- Show app icons in the admin app registrations table and reuse the
shared application display component
- Expose the needed avatar and logo fields through admin GraphQL queries
and backend lookup/statistics services
- Keep workspace fallback behavior consistent when no logo is set and
clean up a few local table styling duplicates

## Testing
- `./node_modules/.bin/tsc -p packages/twenty-front/tsconfig.json
--noEmit --pretty false`
- Manual UI verification of the admin general, workspace detail, and
apps tables

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Thomas des Francs
2026-04-26 19:15:20 +02:00
committed by GitHub
parent 499067ae14
commit fb8b9cb86c
20 changed files with 643 additions and 284 deletions
@@ -0,0 +1,41 @@
import { useApplicationAvatarColors } from '@/applications/hooks/useApplicationAvatarColors';
import { Avatar, OverflowingTextWithTooltip } from 'twenty-ui/display';
type ApplicationDisplayData = {
id?: string | null;
name?: string | null;
universalIdentifier?: string | null;
logoUrl?: string | null;
applicationRegistration?: {
logoUrl?: string | null;
} | null;
};
type ApplicationDisplayProps = {
application: ApplicationDisplayData;
};
export const ApplicationDisplay = ({
application,
}: ApplicationDisplayProps) => {
const colors = useApplicationAvatarColors(application);
const name = application.name ?? '';
const logoUrl =
application.logoUrl ?? application.applicationRegistration?.logoUrl;
return (
<>
<Avatar
type="app"
size="md"
avatarUrl={logoUrl ?? undefined}
placeholder={name}
placeholderColorSeed={application.universalIdentifier ?? name}
color={colors?.color}
backgroundColor={colors?.backgroundColor}
borderColor={colors?.borderColor}
/>
<OverflowingTextWithTooltip text={name} />
</>
);
};