Initial commit

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>

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;

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;