fix: Connected Dapp scroll

RabbyHub · Sep 14, 2023 · 2bbbe34 · 2bbbe34
1 parent 4ce416b
commit 2bbbe34
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 38 deletions.
diff --git a/src/ui/views/Dashboard/components/RecentConnections/index.tsx b/src/ui/views/Dashboard/components/RecentConnections/index.tsx
@@ -158,51 +158,53 @@ const RecentConnections = ({
       <PageHeader forceShowBack onBack={handleCancel}>
         {t('page.dashboard.recentConnection.title')}
       </PageHeader>
-      {visible && (
+      <div className="auto-lock-option-list">
+        {visible && (
+          <ConnectionList
+            onRemove={handleRemove}
+            data={pinnedList}
+            onFavoriteChange={handleFavoriteChange}
+            title={t('page.dashboard.recentConnection.pinned')}
+            empty={
+              <div className="list-empty">
+                {t('page.dashboard.recentConnection.noPinnedDapps')}
+              </div>
+            }
+            extra={
+              pinnedList.length > 0
+                ? t('page.dashboard.recentConnection.dragToSort')
+                : null
+            }
+            onClick={handleClick}
+            onSort={handleSort}
+            sortable={true}
+          ></ConnectionList>
+        )}
         <ConnectionList
           onRemove={handleRemove}
-          data={pinnedList}
+          onClick={handleClick}
           onFavoriteChange={handleFavoriteChange}
-          title={t('page.dashboard.recentConnection.pinned')}
+          data={recentList}
+          title={t('page.dashboard.recentConnection.recentlyConnected')}
+          extra={
+            recentList.length > 0 ? (
+              <a onClick={handleRemoveAll}>
+                {t('page.dashboard.recentConnection.disconnectAll')}
+              </a>
+            ) : null
+          }
           empty={
-            <div className="list-empty">
-              {t('page.dashboard.recentConnection.noPinnedDapps')}
+            <div className="list-empty mb-[-24px] rounded-b-none">
+              <Empty
+                desc={t(
+                  'page.dashboard.recentConnection.noRecentlyConnectedDapps'
+                )}
+                className="pt-[68px] pb-[181px]"
+              ></Empty>
             </div>
           }
-          extra={
-            pinnedList.length > 0
-              ? t('page.dashboard.recentConnection.dragToSort')
-              : null
-          }
-          onClick={handleClick}
-          onSort={handleSort}
-          sortable={true}
         ></ConnectionList>
-      )}
-      <ConnectionList
-        onRemove={handleRemove}
-        onClick={handleClick}
-        onFavoriteChange={handleFavoriteChange}
-        data={recentList}
-        title={t('page.dashboard.recentConnection.recentlyConnected')}
-        extra={
-          recentList.length > 0 ? (
-            <a onClick={handleRemoveAll}>
-              {t('page.dashboard.recentConnection.disconnectAll')}
-            </a>
-          ) : null
-        }
-        empty={
-          <div className="list-empty mb-[-24px] rounded-b-none">
-            <Empty
-              desc={t(
-                'page.dashboard.recentConnection.noRecentlyConnectedDapps'
-              )}
-              className="pt-[68px] pb-[181px]"
-            ></Empty>
-          </div>
-        }
-      ></ConnectionList>
+      </div>
     </div>
   );
 };

diff --git a/src/ui/views/Dashboard/components/RecentConnections/style.less b/src/ui/views/Dashboard/components/RecentConnections/style.less
@@ -4,6 +4,12 @@
     font-size: 12px;
     margin: 0;
   }
+
+  .scroll-container {
+    max-height: var(100% - 48px);
+    overflow: auto;
+  }
+
   .list {
     &:not(:last-child) {
       margin-bottom: 16px;