@griddo/ax 10.3.12 → 10.3.14

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@griddo/ax",
   "description": "Griddo Author Experience",
-  "version": "10.3.12",
+  "version": "10.3.14",
   "authors": [
     "Álvaro Sánchez' <alvaro.sanches@secuoyas.com>",
     "Carlos Torres <carlos.torres@secuoyas.com>",
@@ -230,5 +230,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "155bbf95546aff2816751d26cdbf7ba39893f80f"
+  "gitHead": "d9d0cd327717be48374506340e8ed0c533ea34d4"
 }

package/src/modules/FileDrive/index.tsx

@@ -658,9 +658,9 @@ const FileDrive = (props: IProps) => {
                   </S.FoldersWrapper>
                 </S.SectionWrapper>
               )}
-              <S.SectionWrapper>
+              <S.BigSectionWrapper>
                 <S.SectionHeader>
-                  <S.SectionTitle>Documents</S.SectionTitle>
+                  {totalItems > 0 && <S.SectionTitle>Documents</S.SectionTitle>}
                   {totalItems > 0 && isGrid && (
                     <BulkGridHeader
                       showBulk={areItemsSelected(filesIds)}
@@ -673,20 +673,13 @@ const FileDrive = (props: IProps) => {
                   )}
                   {!hasFolders && isRoot && !isSearching && <NewFolderButton />}
                 </S.SectionHeader>
-                <S.DocumentsWrapper>
-                  {items.length > 0 ? (
-                    isGrid ? (
-                      <GridList />
-                    ) : (
-                      <ListTable />
-                    )
-                  ) : (
-                    <S.EmptyStateWrapper data-testid="empty-state">
-                      {isSearching ? <EmptyState {...emptySearchStateProps} /> : <EmptyState {...emptyProps} />}
-                    </S.EmptyStateWrapper>
-                  )}
-                </S.DocumentsWrapper>
-              </S.SectionWrapper>
+                <S.DocumentsWrapper>{isGrid ? <GridList /> : <ListTable />}</S.DocumentsWrapper>
+                {totalItems === 0 && !hasFolders && (
+                  <S.EmptyStateWrapper data-testid="empty-state" margin={!isRoot}>
+                    {isSearching ? <EmptyState {...emptySearchStateProps} /> : <EmptyState {...emptyProps} />}
+                  </S.EmptyStateWrapper>
+                )}
+              </S.BigSectionWrapper>
             </>
           )}
         </S.ContentWrapper>

package/src/modules/FileDrive/style.tsx

@@ -30,11 +30,19 @@ const FolderPanelContent = styled.div`
 const ContentWrapper = styled.div`
   width: 100%;
   overflow: auto;
+  display: flex;
+  flex-direction: column;
 `;
 
 const SectionWrapper = styled.div`
   width: 100%;
   padding: ${(p) => p.theme.spacing.m};
+  display: flex;
+  flex-direction: column;
+`;
+
+const BigSectionWrapper = styled(SectionWrapper)`
+  flex-grow: 1;
 `;
 
 const SectionHeader = styled.div`
@@ -57,8 +65,10 @@ const ButtonWrapper = styled.div`
   flex-shrink: 0;
 `;
 
-const EmptyStateWrapper = styled.div`
+const EmptyStateWrapper = styled.div<{ margin: boolean }>`
   width: 100%;
+  flex-grow: 1;
+  margin-top: ${(p) => (p.margin ? "-100px" : "auto")};
 `;
 
 const DocumentsWrapper = styled.div`
@@ -137,7 +147,7 @@ const Filters = styled.div`
   flex-shrink: 0;
   & > * {
     &:not(:last-child) {
-      margin-right: ${p => p.theme.spacing.m};
+      margin-right: ${(p) => p.theme.spacing.m};
     }
   }
 `;
@@ -177,4 +187,5 @@ export {
   TabsWrapper,
   ResizeHandle,
   Filters,
+  BigSectionWrapper,
 };