From cfe5b64b17ab230ab475ab0c9d7ca8dd8eba5cf6 Mon Sep 17 00:00:00 2001 From: Matt Cavanagh Date: Sat, 29 Jul 2023 21:14:42 +0100 Subject: [PATCH 01/36] #489: Created UI and functionality for searching players and displaying results --- api-request.ts | 6 +- components/Search.vue | 25 ------ components/search/SearchBar.vue | 136 +++++++++++++++++++++++++++++ components/search/SearchResult.vue | 64 ++++++++++++++ constants/Endpoints.ts | 3 + layouts/default.vue | 1 + ps2alerts-constants | 2 +- 7 files changed, 209 insertions(+), 28 deletions(-) delete mode 100644 components/Search.vue create mode 100644 components/search/SearchBar.vue create mode 100644 components/search/SearchResult.vue diff --git a/api-request.ts b/api-request.ts index c1baaf78..9c00754e 100644 --- a/api-request.ts +++ b/api-request.ts @@ -1,4 +1,4 @@ -import axios, { AxiosInstance } from 'axios' +import axios, { AxiosInstance, CancelTokenSource } from 'axios' import { CommonApiParamsInterface } from '~/interfaces/CommonApiParmsInterface' export default class ApiRequest { @@ -13,11 +13,13 @@ export default class ApiRequest { public async get( endpoint: string, - params?: CommonApiParamsInterface + params?: CommonApiParamsInterface, + cancelToken?: CancelTokenSource ): Promise { return await this.client .get(endpoint, { params, + cancelToken: cancelToken?.token, }) .then((response) => { // console.log('Api Client Request', { endpoint, params, response }) diff --git a/components/Search.vue b/components/Search.vue deleted file mode 100644 index 242f12ea..00000000 --- a/components/Search.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/components/search/SearchBar.vue b/components/search/SearchBar.vue new file mode 100644 index 00000000..a3c4e499 --- /dev/null +++ b/components/search/SearchBar.vue @@ -0,0 +1,136 @@ + + + + + diff --git a/components/search/SearchResult.vue b/components/search/SearchResult.vue new file mode 100644 index 00000000..5f5e1bdc --- /dev/null +++ b/components/search/SearchResult.vue @@ -0,0 +1,64 @@ + + + + + diff --git a/constants/Endpoints.ts b/constants/Endpoints.ts index 02833f34..76ade3ae 100644 --- a/constants/Endpoints.ts +++ b/constants/Endpoints.ts @@ -82,6 +82,9 @@ export const Endpoints = { // 3rd party OUTFIT_TRACKER_OUTFIT_LOGO: 'https://outfit-tracker.com/outfit-logo/{outfitId}.png', + + // Searches + SEARCH: '/search', } export const CensusEndpoints = { diff --git a/layouts/default.vue b/layouts/default.vue index 4b5271b0..0b7b5845 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -6,6 +6,7 @@
+