From 9b1d2d1922d267904113ed5f9f8b35ae0433320c Mon Sep 17 00:00:00 2001
From: Irtiza-h30 <ihasa074@uottawa.ca>
Date: Wed, 27 May 2020 12:27:48 -0400
Subject: [PATCH] Initial commit

---
 app/containers/App/index.js            |  3 ++
 app/containers/ProfileDetails/index.js |  8 ++++
 app/containers/Profiles/index.js       | 53 +++++++++++++++++++++++++-
 3 files changed, 62 insertions(+), 2 deletions(-)
 create mode 100644 app/containers/ProfileDetails/index.js

diff --git a/app/containers/App/index.js b/app/containers/App/index.js
index 399628a..c0dd78f 100644
--- a/app/containers/App/index.js
+++ b/app/containers/App/index.js
@@ -11,6 +11,8 @@ import { AUTH_TOKEN, COMPANY } from 'constants/index';
 import Login from 'containers/Login';
 import ClientDevices from 'containers/ClientDevices';
 import Profiles from 'containers/Profiles';
+import ProfileDetails from 'containers/ProfileDetails';
+
 import Alarms from 'containers/Alarms';
 import EditAccount from 'containers/EditAccount';
 import UserProvider from 'contexts/UserProvider';
@@ -68,6 +70,7 @@ const App = () => {
           <ProtectedRouteWithLayout exact path="/dashboard" component={Dashboard} />
           <ProtectedRouteWithLayout path="/network" component={ClientDevices} />
           <ProtectedRouteWithLayout exact path="/profiles" component={Profiles} />
+          <ProtectedRouteWithLayout exact path="/profiledetails" component={ProfileDetails} />
           <ProtectedRouteWithLayout exact path="/alarms" component={Alarms} />
           <ProtectedRouteWithLayout exact path="/account/edit" component={EditAccount} />
         </Switch>
diff --git a/app/containers/ProfileDetails/index.js b/app/containers/ProfileDetails/index.js
new file mode 100644
index 0000000..bfcf400
--- /dev/null
+++ b/app/containers/ProfileDetails/index.js
@@ -0,0 +1,8 @@
+import React from 'react';
+import { ProfileDetails as ProfileDetailsPage } from '@tip-wlan/wlan-cloud-ui-library';
+
+const ProfileDetails = () => {
+  return <ProfileDetailsPage />;
+};
+
+export default ProfileDetails;
diff --git a/app/containers/Profiles/index.js b/app/containers/Profiles/index.js
index 5e81e1f..f89fbd3 100644
--- a/app/containers/Profiles/index.js
+++ b/app/containers/Profiles/index.js
@@ -1,5 +1,54 @@
-import React from 'react';
+import React, { useContext } from 'react';
+import gql from 'graphql-tag';
+import { useQuery } from '@apollo/react-hooks';
 
-const Profiles = () => <h1>Profiles</h1>;
+import { Alert, Spin, notification } from 'antd';
+
+import { Profile as ProfilePage } from '@tip-wlan/wlan-cloud-ui-library';
+import UserContext from 'contexts/UserContext';
+
+const GET_ALL_PROFILES = gql`
+  query GetAllProfiles($customerId: Int!) {
+    getAllProfiles(customerId: $customerId) {
+      items {
+        id
+        name
+        profileType
+      }
+    }
+  }
+`;
+
+const Profiles = () => {
+  const { customerId } = useContext(UserContext);
+  const { loading, error, data, refetch } = useQuery(GET_ALL_PROFILES, {
+    variables: { customerId },
+  });
+
+  const reloadTable = () => {
+    refetch()
+      .then(() => {
+        notification.success({
+          message: 'Success',
+          description: 'Profiles reloaded.',
+        });
+      })
+      .catch(() =>
+        notification.error({
+          message: 'Error',
+          description: 'Profiles could not be reloaded.',
+        })
+      );
+  };
+
+  if (loading) {
+    return <Spin size="large" />;
+  }
+
+  if (error) {
+    return <Alert message="Error" description="Failed to load profiles." type="error" showIcon />;
+  }
+  return <ProfilePage data={data.getAllProfiles.items} onReload={reloadTable} />;
+};
 
 export default Profiles;