From bc92abd93dd98cb53651cd824aa2b426709cc38c Mon Sep 17 00:00:00 2001
From: Vesa Luusua <vesa.luusua@gmail.com>
Date: Fri, 20 Oct 2017 18:22:36 +0300
Subject: [PATCH] Footer to ProfileSettingsPage

---
 .../ProfileSettingsPage.css                   |  2 +-
 .../ProfileSettingsPage.js                    | 36 ++++++++++----
 .../ProfileSettingsPage.test.js.snap          | 47 ++++++++++++++-----
 3 files changed, 61 insertions(+), 24 deletions(-)

diff --git a/src/containers/ProfileSettingsPage/ProfileSettingsPage.css b/src/containers/ProfileSettingsPage/ProfileSettingsPage.css
index 561c5c5d..a0e04717 100644
--- a/src/containers/ProfileSettingsPage/ProfileSettingsPage.css
+++ b/src/containers/ProfileSettingsPage/ProfileSettingsPage.css
@@ -5,7 +5,7 @@
 }
 .content {
   width: calc(100% - 48px);
-  margin: 12px 24px;
+  margin: 12px 24px 24px 24px;
 
   @media (--viewportMedium) {
     max-width: 565px;
diff --git a/src/containers/ProfileSettingsPage/ProfileSettingsPage.js b/src/containers/ProfileSettingsPage/ProfileSettingsPage.js
index 43291b97..29d10fc4 100644
--- a/src/containers/ProfileSettingsPage/ProfileSettingsPage.js
+++ b/src/containers/ProfileSettingsPage/ProfileSettingsPage.js
@@ -6,7 +6,15 @@ import { FormattedMessage } from 'react-intl';
 import * as propTypes from '../../util/propTypes';
 import { ensureCurrentUser } from '../../util/data';
 import { isScrollingDisabled } from '../../ducks/UI.duck';
-import { Page, UserNav } from '../../components';
+import {
+  Page,
+  UserNav,
+  LayoutSingleColumn,
+  LayoutWrapperTopbar,
+  LayoutWrapperMain,
+  LayoutWrapperFooter,
+  Footer,
+} from '../../components';
 import { ProfileSettingsForm, TopbarContainer } from '../../containers';
 
 import { clearUpdatedForm, updateProfile, uploadImage } from './ProfileSettingsPage.duck';
@@ -91,15 +99,23 @@ export class ProfileSettingsPageComponent extends Component {
         title="Profile settings"
         scrollingDisabled={scrollingDisabled}
       >
-        <TopbarContainer currentPage="ProfileSettingsPage" />
-        <UserNav selectedPageName="ProfileSettingsPage" />
-
-        <div className={css.content}>
-          <h1>
-            <FormattedMessage id="ProfileSettingsPage.title" />
-          </h1>
-          {profileSettingsForm}
-        </div>
+        <LayoutSingleColumn>
+          <LayoutWrapperTopbar>
+            <TopbarContainer currentPage="ProfileSettingsPage" />
+            <UserNav selectedPageName="ProfileSettingsPage" />
+          </LayoutWrapperTopbar>
+          <LayoutWrapperMain>
+            <div className={css.content}>
+              <h1>
+                <FormattedMessage id="ProfileSettingsPage.title" />
+              </h1>
+              {profileSettingsForm}
+            </div>
+          </LayoutWrapperMain>
+          <LayoutWrapperFooter>
+            <Footer />
+          </LayoutWrapperFooter>
+        </LayoutSingleColumn>
       </Page>
     );
   }
diff --git a/src/containers/ProfileSettingsPage/__snapshots__/ProfileSettingsPage.test.js.snap b/src/containers/ProfileSettingsPage/__snapshots__/ProfileSettingsPage.test.js.snap
index b2dd269e..e18e2abd 100644
--- a/src/containers/ProfileSettingsPage/__snapshots__/ProfileSettingsPage.test.js.snap
+++ b/src/containers/ProfileSettingsPage/__snapshots__/ProfileSettingsPage.test.js.snap
@@ -7,21 +7,42 @@ exports[`ContactDetailsPage matches snapshot 1`] = `
   scrollingDisabled={false}
   title="Profile settings"
 >
-  <withRouter(Connect(TopbarContainerComponent))
-    currentPage="ProfileSettingsPage"
-  />
-  <UserNav
+  <LayoutSingleColumn
     className={null}
     rootClassName={null}
-    selectedPageName="ProfileSettingsPage"
-  />
-  <div>
-    <h1>
-      <FormattedMessage
-        id="ProfileSettingsPage.title"
-        values={Object {}}
+  >
+    <LayoutWrapperTopbar
+      className={null}
+      rootClassName={null}
+    >
+      <withRouter(Connect(TopbarContainerComponent))
+        currentPage="ProfileSettingsPage"
       />
-    </h1>
-  </div>
+      <UserNav
+        className={null}
+        rootClassName={null}
+        selectedPageName="ProfileSettingsPage"
+      />
+    </LayoutWrapperTopbar>
+    <LayoutWrapperMain
+      className={null}
+      rootClassName={null}
+    >
+      <div>
+        <h1>
+          <FormattedMessage
+            id="ProfileSettingsPage.title"
+            values={Object {}}
+          />
+        </h1>
+      </div>
+    </LayoutWrapperMain>
+    <LayoutWrapperFooter
+      className={null}
+      rootClassName={null}
+    >
+      <InjectIntl(Footer) />
+    </LayoutWrapperFooter>
+  </LayoutSingleColumn>
 </Page>
 `;