Merge pull request #34 from Telecominfraproject/feature/TW-929

Feature/TW: 929 - Auto Provision Page

app/containers/System/containers/AutoProvision/index.js

@@ -0,0 +1,87 @@
+import React, { useContext } from 'react';
+import { useQuery, useMutation } from '@apollo/react-hooks';
+import { Alert, notification } from 'antd';
+import { AutoProvision as AutoProvisionPage, Loading } from '@tip-wlan/wlan-cloud-ui-library';
+
+import UserContext from 'contexts/UserContext';
+import { GET_CUSTOMER, GET_ALL_LOCATIONS, GET_ALL_PROFILES } from 'graphql/queries';
+import { UPDATE_CUSTOMER } from 'graphql/mutations';
+
+const AutoProvision = () => {
+  const { customerId } = useContext(UserContext);
+  const { data, loading, error, refetch } = useQuery(GET_CUSTOMER, {
+    variables: { id: customerId },
+  });
+  const [updateCustomer] = useMutation(UPDATE_CUSTOMER);
+
+  const { data: dataLocation, loading: loadingLoaction, error: errorLocation } = useQuery(
+    GET_ALL_LOCATIONS,
+    {
+      variables: { customerId },
+    }
+  );
+  const { data: dataProfile, loading: loadingProfile, error: errorProfile } = useQuery(
+    GET_ALL_PROFILES,
+    {
+      variables: { customerId, type: 'equipment_ap' },
+    }
+  );
+
+  const handleUpdateCustomer = (
+    id,
+    email,
+    name,
+    details,
+    createdTimestamp,
+    lastModifiedTimestamp
+  ) => {
+    updateCustomer({
+      variables: {
+        id,
+        email,
+        name,
+        details,
+        createdTimestamp,
+        lastModifiedTimestamp,
+      },
+    })
+      .then(() => {
+        refetch();
+        notification.success({
+          message: 'Success',
+          description: 'Settings successfully updated.',
+        });
+      })
+      .catch(() =>
+        notification.error({
+          message: 'Error',
+          description: 'Settings could not be updated.',
+        })
+      );
+  };
+
+  if (loading) {
+    return <Loading />;
+  }
+
+  if (error) {
+    return (
+      <Alert message="Error" description="Failed to load Customer Data." type="error" showIcon />
+    );
+  }
+
+  return (
+    <AutoProvisionPage
+      data={data && data.getCustomer}
+      dataLocation={dataLocation && dataLocation.getAllLocations}
+      dataProfile={dataProfile && dataProfile.getAllProfiles.items}
+      loadingLoaction={loadingLoaction}
+      loadingProfile={loadingProfile}
+      errorLocation={errorLocation}
+      errorProfile={errorProfile}
+      onUpdateCustomer={handleUpdateCustomer}
+    />
+  );
+};
+
+export default AutoProvision;

app/containers/System/index.js

@@ -5,6 +5,7 @@ import { System as SystemPage } from '@tip-wlan/wlan-cloud-ui-library';
 
 import Manufacturer from 'containers/System/containers/Manufacturer';
 import Firmware from 'containers/System/containers/Firmware';
+import AutoProvision from 'containers/System/containers/AutoProvision';
 
 const System = () => {
   const { path } = useRouteMatch();
@@ -14,6 +15,7 @@ const System = () => {
       <Switch>
         <Route exact path={`${path}/manufacturer`} component={Manufacturer} />
         <Route exact path={`${path}/firmware`} component={Firmware} />
+        <Route exact path={`${path}/autoprovision`} component={AutoProvision} />
 
         <Redirect from={path} to={`${path}/manufacturer`} />
       </Switch>

app/graphql/mutations.js

@@ -238,3 +238,30 @@ export const CREATE_EQUIPMENT = gql`
     }
   }
 `;
+
+export const UPDATE_CUSTOMER = gql`
+  mutation UpdateCustomer(
+    $id: ID!
+    $email: String!
+    $name: String!
+    $details: JSONObject
+    $createdTimestamp: String
+    $lastModifiedTimestamp: String
+  ) {
+    updateCustomer(
+      id: $id
+      email: $email
+      name: $name
+      details: $details
+      createdTimestamp: $createdTimestamp
+      lastModifiedTimestamp: $lastModifiedTimestamp
+    ) {
+      id
+      email
+      name
+      details
+      createdTimestamp
+      lastModifiedTimestamp
+    }
+  }
+`;

app/graphql/queries.js

@@ -277,6 +277,19 @@ export const GET_ALARM_COUNT = gql`
   }
 `;
 
+export const GET_CUSTOMER = gql`
+  query GetCustomer($id: ID!) {
+    getCustomer(id: $id) {
+      id
+      name
+      email
+      createdTimestamp
+      lastModifiedTimestamp
+      details
+    }
+  }
+`;
+
 export const FILTER_SYSTEM_EVENTS = gql`
   query FilterSystemEvents(
     $customerId: ID!

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "wlan-cloud-ui",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1874,9 +1874,9 @@
       }
     },
     "@tip-wlan/wlan-cloud-ui-library": {
-      "version": "0.2.2",
-      "resolved": "https://tip.jfrog.io/artifactory/api/npm/tip-wlan-cloud-npm-repo/@tip-wlan/wlan-cloud-ui-library/-/@tip-wlan/wlan-cloud-ui-library-0.2.2.tgz",
-      "integrity": "sha1-86dCGDXjhQD+7BNFLBnoSpq3w5Q="
+      "version": "0.2.3",
+      "resolved": "https://tip.jfrog.io/artifactory/api/npm/tip-wlan-cloud-npm-repo/@tip-wlan/wlan-cloud-ui-library/-/@tip-wlan/wlan-cloud-ui-library-0.2.3.tgz",
+      "integrity": "sha1-m/aF8DLiaeGF8UDtECAabipk2P0="
     },
     "@types/anymatch": {
       "version": "1.3.1",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "wlan-cloud-ui",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "author": "ConnectUs",
   "description": "React Portal",
   "engines": {
@@ -20,7 +20,7 @@
     "@ant-design/icons": "^4.2.1",
     "@apollo/react-hoc": "^3.1.4",
     "@apollo/react-hooks": "^3.1.3",
-    "@tip-wlan/wlan-cloud-ui-library": "^0.2.2",
+    "@tip-wlan/wlan-cloud-ui-library": "^0.2.3",
     "antd": "^4.3.1",
     "apollo-cache-inmemory": "^1.6.6",
     "apollo-client": "^2.6.10",