diff --git a/app/containers/System/containers/Manufacturer/index.js b/app/containers/System/containers/Manufacturer/index.js index 7d97e60..9ee7191 100644 --- a/app/containers/System/containers/Manufacturer/index.js +++ b/app/containers/System/containers/Manufacturer/index.js @@ -1,8 +1,11 @@ -import React from 'react'; -import { useMutation, useLazyQuery, gql } from '@apollo/client'; +import React, { useState } from 'react'; +import { useQuery, useMutation, useLazyQuery, gql } from '@apollo/client'; import { notification } from 'antd'; import { Manufacturer as ManufacturerPage } from '@tip-wlan/wlan-cloud-ui-library'; -import { OUI_UPLOAD } from 'graphql/mutations'; + +import { AUTH_TOKEN } from 'constants/index'; +import { GET_API_URL } from 'graphql/queries'; +import { getItem } from 'utils/localStorage'; const GET_OUI = gql` query GetOui($oui: String!) { @@ -27,7 +30,13 @@ const UPDATE_OUI = gql` } } `; + +const token = getItem(AUTH_TOKEN); + const System = () => { + const [loadingFileUpload, setLoadingFileUpload] = useState(false); + + const { data: apiUrl } = useQuery(GET_API_URL); const [updateOUI] = useMutation(UPDATE_OUI); const [searchOUI, { data }] = useLazyQuery(GET_OUI, { onError: () => { @@ -46,7 +55,6 @@ const System = () => { }, fetchPolicy: 'no-cache', }); - const [fileUpload] = useMutation(OUI_UPLOAD); const handleUpdateOUI = (oui, manufacturerAlias, manufacturerName) => { updateOUI({ @@ -74,33 +82,54 @@ const System = () => { searchOUI({ variables: { oui } }); }; - const handleFileUpload = (fileName, file) => - fileUpload({ variables: { fileName, file } }) - .then(resp => { - if (resp?.ouiUpload?.success) { - notification.success({ - message: 'Success', - description: 'File successfully uploaded.', - }); - } else { + const handleFileUpload = (fileName, file) => { + if (apiUrl?.getApiUrl) { + setLoadingFileUpload(true); + + fetch(`${apiUrl?.getApiUrl}portal/manufacturer/oui/upload?fileName=${fileName}`, { + method: 'POST', + headers: { + Authorization: token ? `Bearer ${token.access_token}` : '', + 'Content-Type': 'application/octet-stream', + }, + body: file, + }) + .then(response => response.json()) + .then(resp => { + if (resp?.success) { + notification.success({ + message: 'Success', + description: 'File successfully uploaded.', + }); + } else { + notification.error({ + message: 'Error', + description: 'File could not be uploaded.', + }); + } + }) + .catch(() => { notification.error({ message: 'Error', description: 'File could not be uploaded.', }); - } - }) - .catch(() => - notification.error({ - message: 'Error', - description: 'File could not be uploaded.', }) - ); + .finally(() => setLoadingFileUpload(false)); + } else { + notification.error({ + message: 'Error', + description: 'File could not be uploaded.', + }); + } + }; + return ( ); }; diff --git a/app/graphql/queries.js b/app/graphql/queries.js index 42f6cf2..1b3764c 100644 --- a/app/graphql/queries.js +++ b/app/graphql/queries.js @@ -1,5 +1,11 @@ import { gql } from '@apollo/client'; +export const GET_API_URL = gql` + query GetApiUrl { + getApiUrl + } +`; + export const GET_ALL_LOCATIONS = gql` query GetAllLocations($customerId: ID!) { getAllLocations(customerId: $customerId) {