Merge branch 'develop' into feature/ddw-480-tile-view-in-the-delegati…

…on-center
input-output-hk · Jan 14, 2021 · 1ed673d · 1ed673d
2 parents 8ca8a1c + 1214984
commit 1ed673d
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,6 +11,7 @@ Changelog
 
 ### Chores
 
+- Improved "Settings" screen scrolling actions ([PR 2302](https://github.com/input-output-hk/daedalus/pull/2302))
 - Improved scrollable dialogs ([PR 2285](https://github.com/input-output-hk/daedalus/pull/2285))
 - Disabled and hid copy and paste context menu items on some scenarios ([PR 2300](https://github.com/input-output-hk/daedalus/pull/2300))
 - Applied validation to spending password to be not longer than 255 characters ([PR 2287](https://github.com/input-output-hk/daedalus/pull/2287))

diff --git a/source/renderer/app/components/settings/SettingsLayout.js b/source/renderer/app/components/settings/SettingsLayout.js
@@ -7,10 +7,29 @@ import styles from './SettingsLayout.scss';
 type Props = {
   children: Node,
   menu: Node,
+  activePage: string,
 };
 
 @observer
 export default class SettingsLayout extends Component<Props> {
+  scrollableDomElement: ?HTMLElement = null;
+
+  componentDidMount() {
+    this.scrollableDomElement = document.querySelector(
+      '.SettingsLayout_settingsPaneWrapper'
+    );
+  }
+
+  componentDidUpdate(prevProps) {
+    const didActivePageChange = this.props.activePage !== prevProps.activePage;
+    if (
+      this.scrollableDomElement instanceof HTMLElement &&
+      didActivePageChange
+    ) {
+      this.scrollableDomElement.scrollTop = 0;
+    }
+  }
+
   render() {
     const { menu, children } = this.props;
     return (

diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactionsList.scss b/source/renderer/app/components/wallet/transactions/WalletTransactionsList.scss
@@ -67,5 +67,5 @@
 
 .showMoreTransactionsButton {
   display: block !important;
-  margin: 30px auto;
+  margin: 30px auto 20px;
 }
diff --git a/source/renderer/app/containers/settings/Settings.js b/source/renderer/app/containers/settings/Settings.js
@@ -27,7 +27,8 @@ export default class Settings extends Component<InjectedContainerProps> {
 
   render() {
     const { isFlight } = global;
-    const { actions, children } = this.props;
+    const { actions, children, stores } = this.props;
+    const { location } = stores.router;
     const menu = (
       <SettingsMenu
         isFlight={isFlight}
@@ -37,7 +38,9 @@ export default class Settings extends Component<InjectedContainerProps> {
     );
     return (
       <Layout>
-        <SettingsLayout menu={menu}>{children}</SettingsLayout>
+        <SettingsLayout menu={menu} activePage={location.pathname}>
+          {children}
+        </SettingsLayout>
       </Layout>
     );
   }

diff --git a/storybook/stories/settings/utils/SettingsWrapper.js b/storybook/stories/settings/utils/SettingsWrapper.js
@@ -38,7 +38,9 @@ export default (story: Object, context: Object) => {
     <StoryDecorator>
       <StoryProvider>
         <StoryLayout activeSidebarCategory="/settings" {...context}>
-          <SettingsLayout menu={menu}>{storyWithKnobs}</SettingsLayout>
+          <SettingsLayout menu={menu} activePage="/settings">
+            {storyWithKnobs}
+          </SettingsLayout>
         </StoryLayout>
       </StoryProvider>
     </StoryDecorator>