Not found SKUs message logic added

messages/context.json

@@ -179,5 +179,8 @@
   "store/affiliate.register.errorURLInUse": "Affiliate url is already in use",
   "store/affiliate.register.errorAffiliateExists": "Affiliate already exists, email is already in use",
   "store/affiliate.register.errorAffiliateNotFound": "Affiliate not found, there is no affiliate with this email",
-  "store/affiliate.register.errorEmailAlreadyInUse": "The email is already being used by some other affiliate"
+  "store/affiliate.register.errorEmailAlreadyInUse": "The email is already being used by some other affiliate",
+  "admin/affiliate.commissionWarning": "The last spreadsheet has SKUs not found in the store, this will not cancel the process, it will just not add the specific not found value",
+  "admin/affiliate.commissionSuccess": "All spreadsheet SKUs that have been verified so far have been found in the store",
+  "admin/affiliate.verifySKUs": "Verify SKUs"
 }

messages/en.json

@@ -178,5 +178,8 @@
   "store/affiliate.register.errorURLInUse": "Affiliate url is already in use",
   "store/affiliate.register.errorAffiliateExists": "Affiliate already exists, email is already in use",
   "store/affiliate.register.errorAffiliateNotFound": "Affiliate not found, there is no affiliate with this email",
-  "store/affiliate.register.errorEmailAlreadyInUse": "The email is already being used by some other affiliate"
+  "store/affiliate.register.errorEmailAlreadyInUse": "The email is already being used by some other affiliate",
+  "admin/affiliate.commissionWarning": "The last spreadsheet has SKUs not found in the store, this will not cancel the process, it will just not add the specific not found value",
+  "admin/affiliate.commissionSuccess": "All spreadsheet SKUs that have been verified so far have been found in the store",
+  "admin/affiliate.verifySKUs": "Verify SKUs"
 }

messages/pt.json

@@ -178,5 +178,8 @@
   "store/affiliate.register.errorURLInUse": "Essa URL de Afiliado já está em uso",
   "store/affiliate.register.errorAffiliateExists": "O Afiliado já existe, esse email já está em uso",
   "store/affiliate.register.errorAffiliateNotFound": "Afiliado não encontrado, esse email não está sendo usado por nenhum afiliado",
-  "store/affiliate.register.errorEmailAlreadyInUse": "Esse email já está em uso por outro afiliado"
+  "store/affiliate.register.errorEmailAlreadyInUse": "Esse email já está em uso por outro afiliado",
+  "admin/affiliate.commissionWarning": "A última planilha possui SKUs não encontrados na loja, isso não cancelará o processo, apenas não adicionará o valor específico não encontrado",
+  "admin/affiliate.commissionSuccess": "Todos os SKUs da planilha que foram verificados até agora foram encontrados na loja",
+  "admin/affiliate.verifySKUs": "Verificar SKUs"
 }

react/components/admin/commissions/CommissionsNotFound.tsx

@@ -0,0 +1,30 @@
+import React from 'react'
+import { Alert } from '@vtex/admin-ui'
+import { useIntl } from 'react-intl'
+
+import { messages } from '../../../utils/messages'
+
+interface CommissionsNotFoundProps {
+  notFound: boolean
+}
+
+function CommissionsNotFound(props: CommissionsNotFoundProps) {
+  const { notFound } = props
+  const intl = useIntl()
+
+  return (
+    <>
+      {notFound === true ? (
+        <Alert variant="warning">
+          {intl.formatMessage(messages.affiliateCommissionWarning)}
+        </Alert>
+      ) : (
+        <Alert variant="positive">
+          {intl.formatMessage(messages.affiliateCommissionSuccess)}
+        </Alert>
+      )}
+    </>
+  )
+}
+
+export default CommissionsNotFound

react/components/admin/commissions/ImportDropzone.tsx

@@ -3,17 +3,37 @@ import React, { useCallback, useState, useMemo } from 'react'
 import { useIntl } from 'react-intl'
 import { Dropzone } from 'vtex.styleguide'
 import { Text, Box, Button, Flex, useToast } from '@vtex/admin-ui'
-import { useMutation } from 'react-apollo'
+import { useMutation, useLazyQuery } from 'react-apollo'
 import * as XLSX from 'xlsx'
 
+import CommissionsNotFound from './CommissionsNotFound'
 import { messages } from '../../../utils/messages'
 import IMPORT_COMMISSIONS from '../../../graphql/importCommissionsBySKU.graphql'
 import GET_LAST_IMPORTED_COMMISSION_FILE_INFO from '../../../graphql/getLastImportInfo.graphql'
+import GET_NOT_FOUND_SKUS from '../../../graphql/getNotFoundSKUs.graphql'
+import DELETE_NOT_FOUND_SKUS from '../../../graphql/deleteNotFoundSKUs.graphql'
+
+interface NotFoundInterface {
+  getNotFoundCommissions: boolean | undefined
+}
 
 const ImportDropzone: FC = () => {
   const intl = useIntl()
   const showToast = useToast()
   const [file, setFile] = useState<File>()
+  const [verifyDisabled, setVerifyDisabled] = useState(true)
+
+  const [getNotFoundSKUs, { data: dataSKUs }] = useLazyQuery<NotFoundInterface>(
+    GET_NOT_FOUND_SKUS,
+    {
+      notifyOnNetworkStatusChange: true,
+      fetchPolicy: 'network-only',
+    }
+  )
+
+  const [deleteNotFoundSKUs] = useMutation(DELETE_NOT_FOUND_SKUS, {
+    notifyOnNetworkStatusChange: true,
+  })
 
   const [importData, { loading: importLoading }] = useMutation(
     IMPORT_COMMISSIONS,
@@ -25,6 +45,8 @@ const ImportDropzone: FC = () => {
       ],
       awaitRefetchQueries: true,
       onCompleted: () => {
+        setVerifyDisabled(false)
+        deleteNotFoundSKUs()
         showToast({
           variant: 'positive',
           message: intl.formatMessage(messages.importFileSuccessMessage),
@@ -108,14 +130,28 @@ const ImportDropzone: FC = () => {
         </div>
       </Dropzone>
       <Flex justify="flex-end" csx={{ marginY: '8px' }}>
-        <Button
-          disabled={isButtonDisabled}
-          loading={importLoading}
-          onClick={handleSubmit}
-        >
-          {intl.formatMessage(messages.sendFileLabel)}
-        </Button>
+        <div className="flex flex-column ">
+          <Button
+            className="mt2"
+            disabled={isButtonDisabled}
+            loading={importLoading}
+            onClick={handleSubmit}
+          >
+            {intl.formatMessage(messages.sendFileLabel)}
+          </Button>
+          <Button
+            variant="secondary"
+            className="mt2"
+            disabled={verifyDisabled}
+            onClick={() => getNotFoundSKUs()}
+          >
+            {intl.formatMessage(messages.affiliateVerifySKUs)}
+          </Button>
+        </div>
       </Flex>
+      {dataSKUs?.getNotFoundCommissions !== undefined ? (
+        <CommissionsNotFound notFound={dataSKUs.getNotFoundCommissions} />
+      ) : null}
     </>
   )
 }

react/graphql/deleteNotFoundSKUs.graphql

@@ -0,0 +1,3 @@
+mutation setNotFound {
+  deleteNotFounds
+}

react/graphql/getNotFoundSKUs.graphql

@@ -0,0 +1,3 @@
+query getNotFoundSKUs {
+  getNotFoundCommissions
+}

react/utils/messages.ts

@@ -158,6 +158,15 @@ export const messages = defineMessages({
   },
   noLastFileLabel: { id: 'admin/import.no.last.file.label' },
   editAffiliateApproveStatusTitle: { id: 'admin/edit.affiliate.approve.title' },
+  affiliateCommissionWarning: {
+    id: 'admin/affiliate.commissionWarning',
+  },
+  affiliateCommissionSuccess: {
+    id: 'admin/affiliate.commissionSuccess',
+  },
+  affiliateVerifySKUs: {
+    id: 'admin/affiliate.verifySKUs',
+  },
 })
 
 export const storeMessages = defineMessages({