From bc6d66423cc885eb823866c39dbe20e7cfc3d6c7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Afra=20=E2=80=8C?= <afra@Afras-MacBook-Air.local>
Date: Wed, 19 Aug 2026 10:12:09 +0330
Subject: [PATCH] feat: allow deselecting the current neighborhood on the
 location search screen

Shows a clear/deselect row (only when a location is actually set) that
wipes the location cookie and returns to the unfiltered all-stores view.
Also highlights the currently selected neighborhood in the suggested/
results list with a checkmark, since it's now shown there too.
---
 src/app/(customer)/location/search/page.tsx   |  6 ++--
 .../location/neighborhood-search.tsx          | 35 ++++++++++++++++---
 2 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/app/(customer)/location/search/page.tsx b/src/app/(customer)/location/search/page.tsx
index c339b5c..2008af2 100644
--- a/src/app/(customer)/location/search/page.tsx
+++ b/src/app/(customer)/location/search/page.tsx
@@ -1,4 +1,5 @@
 import { winofyFetch, type PaginatedResponse } from "@/lib/api/winofy";
+import { getLocationServer } from "@/lib/location/server";
 import type { Neighborhood } from "@/types/api";
 import { NeighborhoodSearch } from "@/components/location/neighborhood-search";
 
@@ -11,6 +12,7 @@ async function getNeighborhoods() {
 }
 
 export default async function NeighborhoodSearchPage() {
-  const neighborhoods = await getNeighborhoods();
-  return <NeighborhoodSearch neighborhoods={neighborhoods} />;
+  const [neighborhoods, location] = await Promise.all([getNeighborhoods(), getLocationServer()]);
+  const selectedNeighborhoodUuid = location?.mode === "manual" ? location.neighborhoodUuid : null;
+  return <NeighborhoodSearch neighborhoods={neighborhoods} selectedNeighborhoodUuid={selectedNeighborhoodUuid} />;
 }
diff --git a/src/components/location/neighborhood-search.tsx b/src/components/location/neighborhood-search.tsx
index 6bb2dc4..9e293d3 100644
--- a/src/components/location/neighborhood-search.tsx
+++ b/src/components/location/neighborhood-search.tsx
@@ -2,13 +2,19 @@
 
 import { useMemo, useState } from "react";
 import { useRouter, useSearchParams } from "next/navigation";
-import { ArrowRight, MapPin, Search, SearchX } from "lucide-react";
-import { setLocation } from "@/lib/location/client";
+import { ArrowRight, Check, MapPin, Search, SearchX, X } from "lucide-react";
+import { setLocation, clearLocation } from "@/lib/location/client";
 import type { Neighborhood } from "@/types/api";
 
 // L06 (+ neighborhood-search-results) unified — winofyfrontenddoc (1).md §4.3.
 // idle / results / empty share ~90% of layout, per the doc's own recommendation.
-export function NeighborhoodSearch({ neighborhoods }: { neighborhoods: Neighborhood[] }) {
+export function NeighborhoodSearch({
+  neighborhoods,
+  selectedNeighborhoodUuid,
+}: {
+  neighborhoods: Neighborhood[];
+  selectedNeighborhoodUuid: string | null;
+}) {
   const router = useRouter();
   const searchParams = useSearchParams();
   const next = searchParams.get("next") ?? "/";
@@ -37,17 +43,25 @@ export function NeighborhoodSearch({ neighborhoods }: { neighborhoods: Neighborh
     router.refresh();
   }
 
+  function deselectNeighborhood() {
+    clearLocation();
+    router.push(next);
+    router.refresh();
+  }
+
   function NeighborhoodRow({ n }: { n: Neighborhood }) {
+    const isSelected = n.uuid === selectedNeighborhoodUuid;
     return (
       <button
         type="button"
         onClick={() => selectNeighborhood(n)}
         className="flex w-full items-center gap-3 border-b border-gray-300 py-4 text-right"
       >
-        <MapPin className="h-5 w-5 shrink-0 text-gray-500" />
-        <span className="text-body-large text-foreground">
+        <MapPin className={isSelected ? "h-5 w-5 shrink-0 text-primary-action" : "h-5 w-5 shrink-0 text-gray-500"} />
+        <span className={isSelected ? "flex-1 text-body-large font-semibold text-primary-action" : "flex-1 text-body-large text-foreground"}>
           {n.city.name}، {n.name}
         </span>
+        {isSelected && <Check className="h-5 w-5 shrink-0 text-primary-action" />}
       </button>
     );
   }
@@ -81,6 +95,17 @@ export function NeighborhoodSearch({ neighborhoods }: { neighborhoods: Neighborh
         />
       </div>
 
+      {selectedNeighborhoodUuid && (
+        <button
+          type="button"
+          onClick={deselectNeighborhood}
+          className="mt-4 flex w-full items-center gap-3 rounded-xl border border-gray-300 bg-white py-3 px-3 text-right"
+        >
+          <X className="h-5 w-5 shrink-0 text-gray-500" />
+          <span className="flex-1 text-body-large text-foreground">حذف محله انتخاب‌شده و نمایش همه فروشگاه‌ها</span>
+        </button>
+      )}
+
       {state === "empty" && (
         <div className="flex flex-col items-center gap-2 py-8 text-center">
           <SearchX className="h-12 w-12 text-gray-400" />