Cypress/protected externally

e2e/cypress/fixtures/apiowner.json

@@ -279,6 +279,38 @@
       }
     }
   },
+  "protectedExternally": {
+    "protectedExternally_initial": {
+      "product": {
+        "name": "New-Auto Test Product",
+        "orgName": "Ministry of Health",
+        "orgUnitName": "Planning and Innovation Division",
+        "environment": {
+          "name": "test",
+          "config": {
+            "terms": "Terms of Use for API Gateway",
+            "authorization": "Public",
+            "optionalInstructions": "This is a automation test"
+          }
+        }
+      }
+    },
+    "protectedExternally_external": {
+      "product": {
+        "name": "New-Auto Test Product",
+        "orgName": "Ministry of Health",
+        "orgUnitName": "Planning and Innovation Division",
+        "environment": {
+          "name": "test",
+          "config": {
+            "terms": "Terms of Use for API Gateway",
+            "authorization": "Protected Externally",
+            "optionalInstructions": "This is a automation test"
+          }
+        }
+      }
+    }
+  },
   "namespacePreview": {
     "namespace": "gw-07034",
     "serviceAccount": {

e2e/cypress/pageObjects/apiDirectory.ts

@@ -106,6 +106,12 @@ class ApiDirectoryPage {
     })
   }
 
+  checkProductIcon(productName: string, expectedIcon: string) {
+    const pname: string = productName.toLowerCase().replaceAll(' ', '-')
+    var ele: string = `[data-testid=product-icon-${pname}-${expectedIcon}]`
+    cy.get(ele).should('exist')
+  }
+
   addOrganizationAndOrgUnit(product: any) {
     cy.contains('button', 'Add Organization').click({ force: true })
     cy.get(this.orgDropDown).select(product.orgName)

e2e/cypress/tests/09-update-product-env/07-kong-public-auth.ts

@@ -60,7 +60,7 @@ describe('Verify for Kong Public Auth', () => {
     })
   })
 
-  it('Update the authorization scope from Kong ACL-API to Client Credential', () => {
+  it('Update the authorization scope from Kong ACL-API to Public', () => {
     cy.visit(pd.path)
     cy.get('@apiowner').then(({ clientCredentials }: any) => {
       let product = clientCredentials.clientIdSecret_publicProfile.product

e2e/cypress/tests/09-update-product-env/08-protected-externally.ts

@@ -0,0 +1,95 @@
+import ApiDirectoryPage from '../../pageObjects/apiDirectory'
+import HomePage from '../../pageObjects/home'
+import LoginPage from '../../pageObjects/login'
+import Products from '../../pageObjects/products'
+
+describe('Verify Protected Externally Auth', () => {
+  const login = new LoginPage()
+  const apiDir = new ApiDirectoryPage()
+  var nameSpace: string
+  let userSession: string
+  const home = new HomePage()
+  const pd = new Products()
+
+  before(() => {
+    cy.visit('/')
+    cy.deleteAllCookies()
+    cy.reload()
+  })
+
+  beforeEach(() => {
+    cy.preserveCookies()
+    cy.fixture('apiowner').as('apiowner')
+    cy.fixture('state/regen').as('regen')
+    cy.fixture('common-testdata').as('common-testdata')
+    cy.visit(login.path)
+  })
+
+  it('Authenticates api owner', () => {
+    cy.get('@apiowner').then(({ user }: any) => {
+      cy.login(user.credentials.username, user.credentials.password)
+    })
+  })
+  it('Activates the namespace', () => {
+    cy.getUserSession().then(() => {
+      cy.get('@common-testdata').then(({ clientCredentials }: any) => {
+        nameSpace = clientCredentials.namespace
+        home.useNamespace(clientCredentials.namespace)
+        cy.get('@login').then(function (xhr: any) {
+          userSession = xhr.response.headers['x-auth-request-access-token']
+        })
+      })
+    })
+  })
+
+  it('Creates a new product in the directory', () => {
+    cy.visit(pd.path)
+    cy.get('@apiowner').then(({ protectedExternally }: any) => {
+      pd.createNewProduct(
+        protectedExternally.protectedExternally_initial.product.name,
+        protectedExternally.protectedExternally_initial.product.environment.name
+      )
+    })
+  })
+
+  it('Assign a dataset to the product', () => {
+    cy.visit(pd.path)
+    cy.get('@apiowner').then(({ protectedExternally }: any) => {
+      let product = protectedExternally.protectedExternally_initial.product
+      pd.updateDatasetNameToCatelogue(product.name, product.environment.name)
+    })
+  })
+
+  it('Update the authorization scope from Public to Protected Externally', () => {
+    cy.visit(pd.path)
+    cy.get('@apiowner').then(({ protectedExternally }: any) => {
+      let product = protectedExternally.protectedExternally_external.product
+      pd.editProductEnvironment(product.name, product.environment.name)
+      pd.editProductEnvironmentConfig(product.environment.config)
+    })
+  })
+
+  it('Verify that product is w/o a request button in API Directory', () => {
+    cy.visit(apiDir.path)
+    cy.get('@apiowner').then(({ protectedExternally }: any) => {
+      let product = protectedExternally.protectedExternally_external.product
+      apiDir.selectProduct(product.name)
+      cy.get(apiDir.rqstAccessBtn).should('not.exist')
+      apiDir.checkProductIcon(product.name, 'FaLock')
+    })
+  })
+
+  it('Delete the Product', () => {
+    cy.visit(pd.path)
+    cy.get('@apiowner').then(({ protectedExternally }: any) => {
+      pd.deleteProduct(protectedExternally.protectedExternally_external.product.name)
+    })
+  })
+
+  after(() => {
+    cy.logout()
+    cy.clearLocalStorage({ log: true })
+    cy.deleteAllCookies()
+  })
+
+})

src/nextapp/components/api-product-item/api-product-item.tsx

@@ -10,6 +10,7 @@ import {
   Icon,
   Text,
 } from '@chakra-ui/react';
+import kebabCase from 'lodash/kebabCase';
 import { FaLock } from 'react-icons/fa';
 import { HiChartBar } from 'react-icons/hi';
 import { RiEarthFill } from 'react-icons/ri';
@@ -55,6 +56,7 @@ const ApiProductItem: React.FC<ApiProductItemProps> = ({
                   as={isPublic || isTiered ? RiEarthFill : FaLock}
                   color="bc-blue"
                   boxSize="5"
+                  data-testid={`product-icon-${kebabCase(data.name)}-${isPublic || isTiered ? 'RiEarthFill' : 'FaLock'}`}
                 />
               </Flex>
               <Heading size="xs">{data.name}</Heading>