diff --git a/jaas-client/src/pages/accountSettings.jsx b/jaas-client/src/pages/accountSettings.jsx
new file mode 100644
index 0000000..d7f71cf
--- /dev/null
+++ b/jaas-client/src/pages/accountSettings.jsx
@@ -0,0 +1,45 @@
+import React from 'react';
+import Header from '../components/Header'
+import AccountPreferences from '../components/AccountPreferences'
+import Container from '@material-ui/core/Container';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import authManager from '../AuthManager'
+import Account from '../../../model/Account'
+
+class AccountSettings extends React.Component {
+
+  constructor(props) {
+    super(props)
+    this.accountId = props.accountId || props.match.params.accountId
+    this.state = { loaded: false, account: props.account }
+    this.req = undefined
+    this.controller = new AbortController()
+  }
+
+  componentDidMount() {
+    if (this.req === undefined) {
+      this.req = authManager.fetch(`/api/accounts/${this.accountId}`, {signal: this.controller.signal})
+        .then(res => res.json())
+        .then(result => {
+          console.log(result)
+          this.setState({loaded: true, account: Account.from(result)})
+        })
+    }
+  }
+
+  componentWillUnmount() {
+    this.controller.abort()
+    this.req = undefined
+  }
+
+  render() {
+    return (
+      <Container maxWidth="sm" className="app" >
+        <Header />
+        {this.state.loaded ? <AccountPreferences account={this.state.account} /> : <CircularProgress />}
+      </Container>
+    )
+  }
+}
+
+export default AccountSettings;
\ No newline at end of file