address dialog and location review feedback

Author: dnywh

e2e/listings.spec.ts

@@ -111,7 +111,7 @@ test("listing edit saves and restores seeded business fields", async ({
   await expect(listingWriteForm.locator("#description").first()).toHaveValue(
     updatedDescription
   );
-  await expect(listingWriteForm.locator("#visibility")).toHaveValue(
+  await expect(listingWriteForm.locator("#visibility").first()).toHaveValue(
     updatedVisibility
   );
 
@@ -132,7 +132,7 @@ test("listing edit saves and restores seeded business fields", async ({
   await expect(listingWriteForm.locator("#description").first()).toHaveValue(
     originalDescription
   );
-  await expect(listingWriteForm.locator("#visibility")).toHaveValue(
+  await expect(listingWriteForm.locator("#visibility").first()).toHaveValue(
     originalVisibility
   );
 });

src/components/ButtonToDialog/ButtonToDialog.tsx

@@ -67,8 +67,10 @@ const DialogOverlay = styled(Dialog.Overlay)`
   z-index: 3;
 `;
 
+type DialogVariant = Extract<ButtonVariant, "primary" | "secondary" | "danger">;
+
 type ButtonToDialogProps = {
-  variant?: ButtonVariant;
+  variant?: DialogVariant;
   triggerVariant?: ButtonVariant;
   size?: "massive" | "large" | "normal" | "small";
   initialButtonText: ReactNode;

src/components/ListingWrite/ListingWrite.tsx

@@ -577,6 +577,7 @@ export default function ListingWrite({
               setCountryCode={setCountryCode}
               areaName={areaName}
               setAreaName={setAreaName}
+              autoDetectCountry={!initialListing}
               error={errors.location}
             />
 

src/components/ListingWrite/listingWriteController.ts

@@ -52,6 +52,7 @@ export type LocationSelectProps = {
   areaName: string;
   setAreaName: Dispatch<SetStateAction<string>>;
   initialPlaceholderText?: string;
+  autoDetectCountry?: boolean;
   error?: string;
 };
 

src/components/LocationSelect/LocationSelect.tsx

@@ -57,6 +57,7 @@ type LocationSelectProps = {
   areaName: string;
   setAreaName: Dispatch<SetStateAction<string>>;
   initialPlaceholderText?: string;
+  autoDetectCountry?: boolean;
   error?: string;
 };
 
@@ -148,6 +149,7 @@ export default function LocationSelect({
   areaName,
   setAreaName,
   initialPlaceholderText,
+  autoDetectCountry = true,
   error,
 }: LocationSelectProps) {
   const t = useTranslations();
@@ -160,7 +162,7 @@ export default function LocationSelect({
   );
 
   useEffect(() => {
-    if (!countryCode) {
+    if (autoDetectCountry && !countryCode) {
       let isMounted = true; // Track if component is mounted
 
       const initializeLocation = async () => {
@@ -185,7 +187,7 @@ export default function LocationSelect({
         isMounted = false;
       };
     }
-  }, [countryCode, setCountryCode]);
+  }, [autoDetectCountry, countryCode, setCountryCode]);
 
   const handleCountryChange = useCallback(
     (e: ChangeEvent<HTMLSelectElement>) => {