diff --git a/client/package.json b/client/package.json
index 7a664a7c2..6c96b6201 100644
--- a/client/package.json
+++ b/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@into-cps-association/dtaas-web",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "Web client for Digital Twin as a Service (DTaaS)",
   "main": "index.tsx",
   "author": "prasadtalasila <prasad.talasila@gmail.com> (http://prasad.talasila.in/)",
diff --git a/client/src/route/auth/Account.tsx b/client/src/route/auth/Account.tsx
index fc939e532..352897655 100644
--- a/client/src/route/auth/Account.tsx
+++ b/client/src/route/auth/Account.tsx
@@ -1,12 +1,23 @@
 import * as React from 'react';
 import Layout from 'page/Layout';
-import AccountTabs from './AccountTabs';
+import { Typography } from '@mui/material';
+import TabComponent from 'components/tab/TabComponent';
+import { TabData } from 'components/tab/subcomponents/TabRender';
+import tabs from './AccountTabData';
 
-const DTContent: React.FC = () => (
-  <Layout>
-    <AccountTabs />
-  </Layout>
-);
+function AccountContent() {
+  const AccountTab: TabData[] = tabs.map((tab) => ({
+    label: tab.label,
+    body: <Typography variant="body1">{tab.body}</Typography>,
+  }));
 
-const DigitalTwins: React.FC = () => <DTContent />; /* jshint ignore:line */
-export default DigitalTwins;
+  return (
+    <Layout>
+      <TabComponent assetType={AccountTab} scope={[]} />
+    </Layout>
+  );
+}
+
+export default function Account() {
+  return <AccountContent />;
+}
diff --git a/client/src/route/auth/AccountTabData.tsx b/client/src/route/auth/AccountTabData.tsx
new file mode 100644
index 000000000..e072642fa
--- /dev/null
+++ b/client/src/route/auth/AccountTabData.tsx
@@ -0,0 +1,14 @@
+import { ITabs } from 'route/IData';
+
+const tabs: ITabs[] = [
+  {
+    label: 'Profile',
+    body: `Profile - potentially visible to other users.`,
+  },
+  {
+    label: 'Settings',
+    body: `Account settings - private to a user.`,
+  },
+];
+
+export default tabs;
diff --git a/client/src/route/auth/AccountTabs.tsx b/client/src/route/auth/AccountTabs.tsx
deleted file mode 100644
index 753604027..000000000
--- a/client/src/route/auth/AccountTabs.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as React from 'react';
-import TabComponent from 'components/tab/TabComponent';
-import { TabData } from 'components/tab/subcomponents/TabRender';
-
-const accountTab: TabData[] = [
-  {
-    label: 'Profile',
-    body: <>Profile - potentially visible to other users.</>,
-  },
-  {
-    label: 'Settings',
-    body: <>Account settings - private to a user.</>,
-  },
-];
-
-const scope: TabData[][] = [];
-
-function AccountTabs() {
-  return <TabComponent assetType={accountTab} scope={scope} />;
-}
-
-export default AccountTabs;
diff --git a/client/test/unitTests/Routes/Account.test.tsx b/client/test/unitTests/Routes/Account.test.tsx
new file mode 100644
index 000000000..e8cf91b2c
--- /dev/null
+++ b/client/test/unitTests/Routes/Account.test.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import Account from 'route/auth/Account';
+import tabs from 'route/auth/AccountTabData';
+import { InitRouteTests, itDisplaysContentOfTabs } from '../testUtils';
+
+describe('Account Page', () => {
+  const tabLabels: string[] = [];
+  tabs.forEach((tab) => tabLabels.push(tab.label));
+  InitRouteTests(<Account />);
+
+  itDisplaysContentOfTabs(tabs);
+});