fix: update location logic per API changes

client/src/api/data-sources.js

@@ -1,7 +1,8 @@
 import axios from 'axios';
+import { isCachedResponseValid } from '@/api/util';
 import { useAuthStore } from '@/stores/auth';
 import { useDataSourceStore } from '@/stores/data-source';
-import { isCachedResponseValid } from '@/api/util';
+import { useSearchStore } from '@/stores/search';
 
 const DATA_SOURCES_BASE = `${import.meta.env.VITE_VUE_API_BASE_URL}/data-sources`;
 const HEADERS_BASE = {
@@ -14,13 +15,19 @@ const HEADERS_BASIC = {
 
 export async function createDataSource(data) {
 	const auth = useAuthStore();
+	const dataSourceStore = useDataSourceStore();
+	const searchStore = useSearchStore();
 
-	return await axios.post(DATA_SOURCES_BASE, data, {
+	const response = await axios.post(DATA_SOURCES_BASE, data, {
 		headers: {
 			...HEADERS_BASE,
 			authorization: `Bearer ${auth.$state.tokens.accessToken.value}`,
 		},
 	});
+
+	dataSourceStore.clearCache();
+	searchStore.clearCache();
+	return response;
 }
 
 export async function getDataSource(id) {

client/src/api/search.js

@@ -1,7 +1,6 @@
 import axios from 'axios';
 import { ENDPOINTS } from './constants';
 import { useAuthStore } from '@/stores/auth';
-import _isEqual from 'lodash/isEqual';
 import { useSearchStore } from '@/stores/search';
 import { isCachedResponseValid } from '@/api/util';
 
@@ -14,9 +13,9 @@ const HEADERS_BASIC = {
 	authorization: `Basic ${import.meta.env.VITE_ADMIN_API_KEY}`,
 };
 
-export async function search(params) {
+export async function search(location_id) {
 	const searchStore = useSearchStore();
-	const cached = searchStore.getSearchFromCache(JSON.stringify(params));
+	const cached = searchStore.getSearchFromCache(location_id);
 
 	if (
 		cached &&
@@ -32,21 +31,25 @@ export async function search(params) {
 	const response = await axios.get(
 		`${SEARCH_BASE}/${ENDPOINTS.SEARCH.RESULTS}`,
 		{
-			params,
+			params: {
+				location_id,
+			},
 			headers: HEADERS_BASIC,
 		},
 	);
 
-	searchStore.setSearchToCache(JSON.stringify(params), response);
+	searchStore.setSearchToCache(location_id, response);
 
 	return response;
 }
 
-export async function followSearch(params) {
+export async function followSearch(location_id) {
 	const auth = useAuthStore();
 
 	return await axios.post(`${SEARCH_BASE}/${ENDPOINTS.SEARCH.FOLLOW}`, null, {
-		params,
+		params: {
+			location_id,
+		},
 		headers: {
 			...HEADERS,
 			Authorization: `Bearer ${auth.$state.tokens.accessToken.value}`,
@@ -77,26 +80,28 @@ export async function getFollowedSearches() {
 
 	return response;
 }
-export async function getFollowedSearch(params) {
+export async function getFollowedSearch(location_id) {
 	const auth = useAuthStore();
 
 	if (!auth.isAuthenticated()) return false;
 
 	try {
 		const response = await getFollowedSearches();
 
-		return response.data.data.find((search) => {
-			return _isEqual(search, params);
-		});
+		return response.data.data.find(
+			({ location_id: followed_id }) => followed_id === Number(location_id),
+		);
 	} catch (error) {
 		return null;
 	}
 }
-export async function deleteFollowedSearch(params) {
+export async function deleteFollowedSearch(location_id) {
 	const auth = useAuthStore();
 
 	return await axios.delete(`${SEARCH_BASE}/${ENDPOINTS.SEARCH.FOLLOW}`, {
-		params,
+		params: {
+			location_id,
+		},
 		headers: {
 			...HEADERS,
 			Authorization: `Bearer ${auth.$state.tokens.accessToken.value}`,

client/src/components/SearchForm.vue

@@ -229,10 +229,16 @@ function buildParams(values) {
 	const obj = {};
 
 	/* Handle record from typeahead input */
-	const recordFilteredByParamsKeys = (({ state, county, locality }) => ({
+	const recordFilteredByParamsKeys = (({
 		state,
 		county,
 		locality,
+		location_id,
+	}) => ({
+		state,
+		county,
+		locality,
+		location_id,
 		// If no selected record, fall back to the initial search
 	}))(selectedRecord.value ?? initiallySearchedRecord.value);
 

client/src/pages/profile.vue

@@ -117,7 +117,7 @@ async function signOutWithRedirect() {
 async function unFollow(followed) {
 	const text = getLocationText(followed);
 	try {
-		await deleteFollowedSearch(followed);
+		await deleteFollowedSearch(followed.location_id);
 		toast.success(`Un-followed search for ${text}`);
 		reload();
 	} catch (error) {

client/src/pages/search/results.vue

@@ -36,19 +36,7 @@
 						to follow this search
 					</p>
 				</div>
-				<div v-else class="flex flex-col md:items-end md:max-w-60">
-					<Button
-						:disabled="!isAuthenticated()"
-						class="sm:block max-h-12"
-						intent="primary"
-						@click="
-							async () => {
-								await unFollow();
-							}
-						"
-					>
-						Un-follow
-					</Button>
+				<div v-else class="flex flex-col md:items-end md:max-w-80">
 					<p
 						v-if="isAuthenticated()"
 						class="text-med text-neutral-500 max-w-full md:text-right"
@@ -145,6 +133,7 @@ import getLocationText from '@/util/getLocationText';
 import _isEqual from 'lodash/isEqual';
 import { DataLoaderErrorPassThrough } from '@/util/errors';
 const searchStore = useSearchStore();
+import { search, getFollowedSearch, followSearch } from '@/api/search';
 import {
 	search,
 	getFollowedSearch,
@@ -157,6 +146,7 @@ const data = ref();
 const previousRoute = ref();
 const isPreviousRouteFollowed = ref(false);
 
+// TODO: split loaders out into separate files
 export const useSearchData = defineBasicLoader(
 	'/search/results',
 	async (route) => {
@@ -168,7 +158,7 @@ export const useSearchData = defineBasicLoader(
 				// Local caching to skip even the pinia method in case of only the hash changing while on the route.
 				_isEqual(params, query.value) && data.value
 					? data.value
-					: await search(route.query);
+					: await search(route.query.location_id);
 
 			// On initial fetch - get hash
 			const hash = normalizeLocaleForHash(searched, response.data);
@@ -194,14 +184,9 @@ export const useSearchData = defineBasicLoader(
 export const useFollowedData = defineBasicLoader(
 	'/search/results',
 	async (route) => {
-		if (isOnlyHashChanged(route, previousRoute.value)) {
-			previousRoute.value = route;
-			return isPreviousRouteFollowed.value;
-		}
-
 		try {
 			const params = route.query;
-			const isFollowed = await getFollowedSearch(params);
+			const isFollowed = await getFollowedSearch(params.location_id);
 			previousRoute.value = route;
 			isPreviousRouteFollowed.value = isFollowed;
 			return isFollowed;
@@ -215,18 +200,22 @@ function isOnlyHashChanged(currentRoute, previousRoute) {
 	// If we don't have a previous route to compare against, return false
 	if (!previousRoute) return false;
 
-	// Check if queries are equal
-	const areQueriesEqual = _isEqual(currentRoute.query, previousRoute.query);
+// function isOnlyHashChanged(currentRoute, previousRoute) {
+// 	// If we don't have a previous route to compare against, return false
+// 	if (!previousRoute) return false;
 
-	// Check if paths are equal
-	const arePathsEqual = currentRoute.path === previousRoute.path;
+// 	// Check if queries are equal
+// 	const areQueriesEqual = _isEqual(currentRoute.query, previousRoute.query);
 
-	// Check if only the hash is different
-	const hasHashChanged = currentRoute.hash !== previousRoute.hash;
+// 	// Check if paths are equal
+// 	const arePathsEqual = currentRoute.path === previousRoute.path;
 
-	// Return true if everything is the same except the hash
-	return areQueriesEqual && arePathsEqual && hasHashChanged;
-}
+// 	// Check if only the hash is different
+// 	const hasHashChanged = currentRoute.hash !== previousRoute.hash;
+
+// 	// Return true if everything is the same except the hash
+// 	return areQueriesEqual && arePathsEqual && hasHashChanged;
+// }
 </script>
 
 <script setup>
@@ -287,22 +276,13 @@ onUnmounted(() => {
 // Utilities and handlers
 async function follow() {
 	try {
-		await followSearch(route.query);
+		await followSearch(route.query.location_id);
 		toast.success(`Search followed for ${getLocationText(route.query)}.`);
 		await reloadFollowed();
 	} catch (error) {
 		toast.error(`Error following search. Please try again.`);
 	}
 }
-async function unFollow() {
-	try {
-		await deleteFollowedSearch(route.query);
-		toast.success(`Search un-followed for ${getLocationText(route.query)}.`);
-		await reloadFollowed();
-	} catch (error) {
-		toast.error(`Error un-following search. Please try again.`);
-	}
-}
 
 function onSignInMouseEnter() {
 	setRedirectTo({ ...route });