Use Offline everywhere

Author: djhi

packages/ra-ui-materialui/src/field/ReferenceField.tsx

@@ -25,6 +25,7 @@ import { LinearProgress } from '../layout';
 import { Link } from '../Link';
 import type { FieldProps } from './types';
 import { genericMemo } from './genericMemo';
+import { Offline } from '../Offline';
 
 /**
  * Fetch reference record, and render its representation, or delegate rendering to child component.
@@ -104,6 +105,7 @@ export interface ReferenceFieldProps<
 
 // useful to prevent click bubbling in a datagrid with rowClick
 const stopPropagation = e => e.stopPropagation();
+const defaultOffline = <Offline />;
 
 export const ReferenceFieldView = <
     RecordType extends Record<string, any> = Record<string, any>,
@@ -115,7 +117,7 @@ export const ReferenceFieldView = <
         children,
         className,
         emptyText,
-        offline = 'ra.notification.offline',
+        offline = defaultOffline,
         reference,
         sx,
     } = props;
@@ -148,32 +150,7 @@ export const ReferenceFieldView = <
     }
     if (!referenceRecord) {
         if (isPaused) {
-            if (typeof offline === 'string') {
-                return (
-                    <Stack direction="row" alignItems="center" gap={1}>
-                        <ErrorIcon
-                            role="presentation"
-                            color="error"
-                            fontSize="small"
-                        />
-                        <Typography
-                            component="span"
-                            variant="body2"
-                            sx={{ color: 'error.main' }}
-                        >
-                            {typeof offline === 'string' ? (
-                                <Translate i18nKey={offline}>
-                                    {offline}
-                                </Translate>
-                            ) : (
-                                offline
-                            )}
-                        </Typography>
-                    </Stack>
-                );
-            }
-            // We either have a ReactNode, a boolean or null|undefined
-            return offline || null;
+            return offline;
         }
         return emptyText ? (
             <Typography component="span" variant="body2">

packages/ra-ui-materialui/src/field/ReferenceManyCount.tsx

@@ -19,6 +19,9 @@ import ErrorIcon from '@mui/icons-material/Error';
 import { FieldProps } from './types';
 import { sanitizeFieldRestProps } from './sanitizeFieldRestProps';
 import { Link } from '../Link';
+import { Offline } from '../Offline';
+
+const defaultOffline = <Offline />;
 
 /**
  * Fetch and render the number of records related to the current one
@@ -43,7 +46,7 @@ export const ReferenceManyCount = <RecordType extends RaRecord = RaRecord>(
         filter,
         sort,
         link,
-        offline,
+        offline = defaultOffline,
         resource,
         source = 'id',
         timeout = 1000,
@@ -69,13 +72,7 @@ export const ReferenceManyCount = <RecordType extends RaRecord = RaRecord>(
     let body: ReactNode = total;
 
     if (isPaused && total == null) {
-        body = offline ?? (
-            <ErrorIcon
-                color="error"
-                fontSize="small"
-                titleAccess="ra.notification.offline"
-            />
-        );
+        body = offline;
     }
 
     if (isPending && !isPaused && oneSecondHasPassed) {

packages/ra-ui-materialui/src/field/ReferenceOneField.tsx

@@ -17,6 +17,9 @@ import {
 
 import { FieldProps } from './types';
 import { ReferenceFieldView } from './ReferenceField';
+import { Offline } from '../Offline';
+
+const defaultOffline = <Offline />;
 
 /**
  * Render the related record in a one-to-one relationship
@@ -40,7 +43,7 @@ export const ReferenceOneField = <
         source = 'id',
         target,
         emptyText,
-        offline: offlineProp = 'ra-references.single_offline',
+        offline = defaultOffline,
         sort,
         filter,
         link,
@@ -84,15 +87,6 @@ export const ReferenceOneField = <
             emptyText
         ) : null;
 
-    const offline =
-        typeof offlineProp === 'string' ? (
-            <Typography component="span" variant="body2">
-                {offlineProp && translate(offlineProp, { _: offlineProp })}
-            </Typography>
-        ) : offlineProp ? (
-            offlineProp
-        ) : null;
-
     if (
         !record ||
         (!controllerProps.isPending &&