Address reviews

Signed-off-by: Swikriti Tripathi <swikriti808@gmail.com>

src/components/tab/SearchInput.vue

@@ -10,7 +10,7 @@
 			track-by="multiselectKey"
 			:internal-search="false"
 			open-direction="below"
-			:loading="loading"
+			:loading="state === 'loading'"
 			:preselect-first="true"
 			:preserve-search="true"
 			@search-change="makeSearchRequest">
@@ -80,7 +80,6 @@ export default {
 		search: null,
 		state: 'ok',
 		searchResults: [],
-		loading: false,
 	}),
 	computed: {
 		placeholder() {
@@ -91,8 +90,6 @@ export default {
 				return t('integration_openproject', 'No OpenProject account connected')
 			} else if (this.state === 'error') {
 				return t('integration_openproject', 'Error connecting to OpenProject')
-			} else if (this.state === 'loading') {
-				return t('integration_openproject', 'Wait while we fetch work packages')
 			}
 			return ''
 		},
@@ -117,15 +114,14 @@ export default {
 			}
 			const url = generateUrl('/apps/integration_openproject/work_packages')
 			if (this.search.length > 3) {
-				this.loading = true
+				this.state = 'loading'
 				const req = {}
 				req.params = {
 					searchQuery: this.search,
 				}
 				const response = await axios.get(url, req)
 				if (response.status === 200) {
 					this.state = 'ok'
-					this.loading = false
 					if (response.data.length === 0) {
 						this.searchResults = []
 
@@ -182,11 +178,10 @@ export default {
 		async getWorkPackageColorAttributes(path, id) {
 			const url = generateUrl(path + id)
 			const req = {}
-			this.loading = true
+			this.state = 'loading'
 			const response = await axios.get(url, req)
 			if (response.status === 200) {
 				this.state = 'ok'
-				this.loading = false
 				return response.data.color
 			}
 			this.checkStatusCode(response.status)

tests/jest/components/tab/SearchInput.spec.js

@@ -148,12 +148,9 @@ describe('SearchInput.vue tests', () => {
 		})
 
 		it('should display a loading button when the work package is being fetched', async () => {
-			jest.spyOn(SearchInput.methods, 'makeSearchRequest').mockImplementation()
 			const wrapper = mountSearchInput()
 			let loadingIcon = wrapper.find(loadingIconSelector)
 			expect(loadingIcon.exists()).toBeFalsy()
-			const textInput = wrapper.find(inputSelector)
-			await textInput.setValue('organ')
 			await wrapper.setData({
 				loading: true,
 			})