From 154a653c822d7c45dc0200553bd6981374c129d9 Mon Sep 17 00:00:00 2001
From: Brett Wright <wright.brett@gmail.com>
Date: Wed, 20 Apr 2022 14:36:29 +0200
Subject: [PATCH 1/2] Now pulls the baseUrl from the app-config.yml

---
 src/components/HarborRepository/HarborRepository.tsx | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/components/HarborRepository/HarborRepository.tsx b/src/components/HarborRepository/HarborRepository.tsx
index 45be7d5..eba2d8b 100644
--- a/src/components/HarborRepository/HarborRepository.tsx
+++ b/src/components/HarborRepository/HarborRepository.tsx
@@ -1,19 +1,19 @@
 import { Progress, Table } from '@backstage/core-components'
+import { configApiRef, useApi } from '@backstage/core-plugin-api'
 import React, { useState } from 'react'
 import ReactSpeedometer from 'react-d3-speedometer'
 import { useAsync } from 'react-use'
 import { columns } from './tableHeadings'
 
-function HarborRepository(props: RepositoryProps) {
+export function HarborRepository(props: RepositoryProps) {
   const [error, setError] = useState(false)
   const [errorMsg, setErrorMsg] = useState('')
   const [repository, setRepository] = useState<Repository[]>([])
 
+  const config = useApi(configApiRef)
+  const backendUrl = config.getString('backend.baseUrl')
+
   const { loading } = useAsync(async () => {
-    let backendUrl = window.location.origin
-    if (backendUrl.includes('3000')) {
-      backendUrl = backendUrl.replace('3000', '7000')
-    }
     const response = await fetch(
       `${backendUrl}/api/harbor/artifacts?project=${props.project}&repository=${props.repository}`
     )
@@ -139,5 +139,3 @@ interface Vulnerabilities {
   count: number
   severity: string
 }
-
-export { HarborRepository }

From d639ccae4bd75108b6b82872fcb8245e5bc46486 Mon Sep 17 00:00:00 2001
From: Brett Wright <wright.brett@gmail.com>
Date: Tue, 26 Apr 2022 15:56:37 +0200
Subject: [PATCH 2/2] fixed test

---
 ...tory.test.js => HarborRepository.test.jsx} | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)
 rename src/components/HarborRepository/{HarborRepository.test.js => HarborRepository.test.jsx} (77%)

diff --git a/src/components/HarborRepository/HarborRepository.test.js b/src/components/HarborRepository/HarborRepository.test.jsx
similarity index 77%
rename from src/components/HarborRepository/HarborRepository.test.js
rename to src/components/HarborRepository/HarborRepository.test.jsx
index 15afeeb..b5c49ef 100644
--- a/src/components/HarborRepository/HarborRepository.test.js
+++ b/src/components/HarborRepository/HarborRepository.test.jsx
@@ -1,7 +1,14 @@
+import { ConfigReader } from '@backstage/core-app-api'
+import { configApiRef } from '@backstage/core-plugin-api'
+import { TestApiProvider } from '@backstage/test-utils'
 import { act, render, screen } from '@testing-library/react'
 import React from 'react'
 import { HarborRepository } from './HarborRepository'
 
+const configApi = new ConfigReader({
+  backend: { baseUrl: 'http://localhost:7000' },
+})
+
 global.fetch = jest.fn(() =>
   Promise.resolve({
     json: () =>
@@ -40,11 +47,13 @@ describe('Harbor Repository', () => {
   it('loads repo info', async () => {
     await act(async () =>
       render(
-        <HarborRepository
-          project="project"
-          repository="component"
-          widget={false}
-        />
+        <TestApiProvider apis={[[configApiRef, configApi]]}>
+          <HarborRepository
+            project="project"
+            repository="component"
+            widget={false}
+          />
+        </TestApiProvider>
       )
     )