@applica-software-guru/react-admin 1.5.320 → 1.5.321

package/package.json

@@ -107,5 +107,5 @@
   "type": "module",
   "types": "dist/index.d.ts",
   "typings": "dist/index.d.ts",
-  "version": "1.5.320"
+  "version": "1.5.321"
 }

package/src/components/ra-lists/ListView.tsx

@@ -48,7 +48,7 @@ function ListView<RecordType extends RaRecord = any>(props: ListViewProps): Reac
     return null;
   }
 
-  function renderList() {
+  function renderList(shouldRenderEmptyList: boolean) {
     return (
       <div
         className={ListClasses.main}
@@ -73,7 +73,7 @@ function ListView<RecordType extends RaRecord = any>(props: ListViewProps): Reac
           />
         ) : null}
         {!error && (
-          <Content className={ListClasses.content}>
+          <Content className={ListClasses.content} sx={shouldRenderEmptyList ? { background: 'transparent' } : {}}>
             {bulkActionButtons && children && React.isValidElement<any>(children)
               ? cloneElement(children, { bulkActionButtons })
               : children}
@@ -97,6 +97,8 @@ function ListView<RecordType extends RaRecord = any>(props: ListViewProps): Reac
     return empty !== false && cloneElement(empty, { className: ListClasses.noResults, hasCreate });
   }
 
+  const shouldRenderEmptyList = !isLoading && data?.length === 0;
+
   const shouldRenderEmptyPage =
     !isLoading && data?.length === 0 && !Object.keys(filterValues).length && empty !== false;
 
@@ -113,7 +115,26 @@ function ListView<RecordType extends RaRecord = any>(props: ListViewProps): Reac
   const wrapperProps =
     !isLoading && !shouldRenderEmptyPage && (!aside || isFilterSidebar) ? { content: false } : undefined;
   return (
-    <Root className={clsx('list-page', className)} {...rest}>
+    <Root
+      className={clsx('list-page', className)}
+      {...rest}
+      sx={
+        shouldRenderEmptyList
+          ? {
+              '& .MuiPaper-root': {
+                backgroundColor: 'transparent',
+                border: 'none'
+              },
+              '& .RaList-actions': {
+                border: '1px solid',
+                borderRadius: `${theme.shape.borderRadius}px`,
+                borderColor: theme.palette.mode === 'dark' ? theme.palette.divider : theme.palette.grey.A800,
+                backgroundColor: theme.palette.background.paper
+              }
+            }
+          : {}
+      }
+    >
       <Title title={title} defaultTitle={defaultTitle} preferenceKey={`${resource}.list.title`} />
       <Wrapper {...wrapperProps}>
         {isLoading ? (
@@ -129,7 +150,7 @@ function ListView<RecordType extends RaRecord = any>(props: ListViewProps): Reac
         ) : shouldRenderEmptyPage ? (
           renderEmpty()
         ) : (
-          renderList()
+          renderList(shouldRenderEmptyList)
         )}
       </Wrapper>
       {hasAsideSidebar ? <AsideCard aside={aside} /> : null}