Decouple twenty-ui Avatar from app server-URL config (#21968)

Makes `twenty-ui`'s `Avatar` render the `avatarUrl` it receives instead
of building it from `window._env_`/`window.location` at module load, so
the library no longer depends on the app environment. URL resolution
moves to `twenty-front` via a `getAbsoluteImageUrl` helper applied at
the call sites.

Part of making twenty-ui a standalone library.

packages/twenty-front/src/modules/settings/admin-panel/components/SettingsAdminGeneral.tsx

@@ -29,6 +29,7 @@ import {
   AdminPanelRecentUsersDocument,
   AdminPanelTopWorkspacesDocument,
 } from '~/generated-admin/graphql';
+import { getAbsoluteImageUrl } from '~/utils/image/getAbsoluteImageUrl';
 
 const StyledEmptyState = styled.div`
   color: ${themeCssVariables.font.color.tertiary};
@@ -136,7 +137,7 @@ export const SettingsAdminGeneral = () => {
                       overflow="hidden"
                     >
                       <Avatar
-                        avatarUrl={user.avatarUrl}
+                        avatarUrl={getAbsoluteImageUrl(user.avatarUrl)}
                         placeholder={
                           `${user.firstName || ''} ${user.lastName || ''}`.trim() ||
                           user.email
@@ -160,7 +161,7 @@ export const SettingsAdminGeneral = () => {
                       {user.workspaceId ? (
                         <>
                           <Avatar
-                            avatarUrl={user.workspaceLogo}
+                            avatarUrl={getAbsoluteImageUrl(user.workspaceLogo)}
                             placeholder={user.workspaceName || ''}
                             placeholderColorSeed={user.workspaceId}
                             size="sm"
@@ -232,7 +233,7 @@ export const SettingsAdminGeneral = () => {
                       overflow="hidden"
                     >
                       <Avatar
-                        avatarUrl={workspace.logoUrl}
+                        avatarUrl={getAbsoluteImageUrl(workspace.logoUrl)}
                         placeholder={workspace.name || ''}
                         placeholderColorSeed={workspace.id}
                         size="md"

packages/twenty-front/src/modules/settings/admin-panel/components/SettingsAdminWorkspaceContent.tsx

@@ -12,7 +12,6 @@ import { useContext } from 'react';
 import { SettingsPath } from 'twenty-shared/types';
 import {
   formatUpgradeCommandName,
-  getImageAbsoluteURI,
   getSettingsPath,
   isDefined,
 } from 'twenty-shared/utils';
@@ -30,8 +29,8 @@ import { OverflowingTextWithTooltip } from 'twenty-ui/surfaces';
 import { H2Title } from 'twenty-ui/typography';
 import { Section } from 'twenty-ui/layout';
 import { themeCssVariables } from 'twenty-ui/theme-constants';
-import { REACT_APP_SERVER_BASE_URL } from '~/config';
 import { dateLocaleState } from '~/localization/states/dateLocaleState';
+import { getAbsoluteImageUrl } from '~/utils/image/getAbsoluteImageUrl';
 import { formatDateTimeString } from '~/utils/string/formatDateTimeString';
 
 type SettingsAdminWorkspaceContentProps = {
@@ -83,14 +82,11 @@ export const SettingsAdminWorkspaceContent = ({
           })}
           leftComponent={
             <AvatarOrIcon
-              avatarUrl={
-                getImageAbsoluteURI({
-                  imageUrl: isNonEmptyString(activeWorkspace?.logo)
-                    ? activeWorkspace?.logo
-                    : DEFAULT_WORKSPACE_LOGO,
-                  baseUrl: REACT_APP_SERVER_BASE_URL,
-                }) ?? ''
-              }
+              avatarUrl={getAbsoluteImageUrl(
+                isNonEmptyString(activeWorkspace?.logo)
+                  ? activeWorkspace?.logo
+                  : DEFAULT_WORKSPACE_LOGO,
+              )}
             />
           }
         />