fix: loading layout of results and sort button

IQSS · Dec 17, 2024 · 0eaebdc · 0eaebdc
1 parent 510c60d
commit 0eaebdc
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 18 deletions.
diff --git a/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx b/src/sections/collection/collection-items-panel/items-list/ItemsList.tsx
@@ -100,28 +100,28 @@ export const ItemsList = forwardRef(
           {areItemsAvailable && (
             <>
               <header>
-                {isLoadingItems ? (
-                  <SkeletonTheme>
-                    <Skeleton height={19} width={190} />
-                  </SkeletonTheme>
-                ) : (
-                  <Row>
-                    <Col>
+                <Row>
+                  <Col>
+                    {isLoadingItems ? (
+                      <SkeletonTheme>
+                        <Skeleton height={19} width={190} />
+                      </SkeletonTheme>
+                    ) : (
                       <PaginationResultsInfo
                         paginationInfo={paginationInfo}
                         accumulated={accumulatedCount}
                       />
-                    </Col>
-                    <Col className={styles['sort-button']}>
-                      <ItemsSortBy
-                        isLoadingCollectionItems={isLoadingItems}
-                        currentSortType={sortSelected}
-                        currentSortOrder={orderSelected}
-                        currentSearchText={searchText}
-                        onSortChange={onSortChange}></ItemsSortBy>
-                    </Col>
-                  </Row>
-                )}
+                    )}
+                  </Col>
+                  <Col className={styles['sort-button']}>
+                    <ItemsSortBy
+                      isLoadingCollectionItems={isLoadingItems}
+                      currentSortType={sortSelected}
+                      currentSortOrder={orderSelected}
+                      currentSearchText={searchText}
+                      onSortChange={onSortChange}></ItemsSortBy>
+                  </Col>
+                </Row>
               </header>
 
               <ul data-testid="items-list">

diff --git a/src/sections/collection/collection-items-panel/items-list/ItemsSortBy.tsx b/src/sections/collection/collection-items-panel/items-list/ItemsSortBy.tsx
@@ -88,6 +88,7 @@ export function ItemsSortBy({
       title={t('sort.title')}
       id="collection-items-sort"
       variant="secondary"
+      disabled={isLoadingCollectionItems}
       onSelect={handleSortChange}>
       {Object.values(sortOptions).map((sortByOption) => (
         <DropdownButtonItem