- {openActionMenuId === product.id ? (
-
+ {renderActionMenu(product.id, <>
-
- ) : null}
+ )}
)
) : productState === "UNPUBLISHED" ? (
-
+
- {openActionMenuId === product.id ? (
-
+ {renderActionMenu(product.id, <>
-
- ) : null}
+ )}
) : productState === "DELETED_BY_SELLER" ? (
-
+
- {openActionMenuId === product.id ? (
-
+ {renderActionMenu(product.id, <>
-
- ) : null}
+ )}
) : (
-
+
- {openActionMenuId === product.id ? (
-
+ {renderActionMenu(product.id, <>
{!isInReviewTab ? (
!isDeletedTab ? (
delete
Delete
-
- ) : null}
+ )}
)}
diff --git a/src/app/(onboarding)/onboarding/store-detail/page.tsx b/src/app/(onboarding)/onboarding/store-detail/page.tsx
index a389935..19052b2 100644
--- a/src/app/(onboarding)/onboarding/store-detail/page.tsx
+++ b/src/app/(onboarding)/onboarding/store-detail/page.tsx
@@ -3,6 +3,7 @@
import { useEffect, useState } from "react";
import { useRouter } from "next/navigation";
import { UploadField } from "@/components/upload-field";
+import { COUNTRIES } from "@/lib/countries";
import { useLanguage } from "@/lib/i18n-context";
const ONBOARDING_BUSINESS_STORAGE_KEY = "onboardingBusinessDraft";
@@ -34,6 +35,14 @@ type WarehouseListRow = {
warehouseType?: string | null;
};
+type Province = { id: string; name: string };
+type City = { id: string; name: string };
+
+function normalizeToken(token: string) {
+ if (!token) return "";
+ return token.startsWith("Bearer ") ? token : `Bearer ${token}`;
+}
+
export default function StoreDetailPage() {
const router = useRouter();
const { t } = useLanguage();
@@ -54,11 +63,19 @@ export default function StoreDetailPage() {
warehouseType: "INA",
country: "Indonesia",
province: "",
+ provinceId: "",
city: "",
+ cityId: "",
postalCode: "",
latitude: "",
longitude: "",
});
+ const [provinces, setProvinces] = useState
([]);
+ const [cities, setCities] = useState([]);
+ const [loadingProvinces, setLoadingProvinces] = useState(false);
+ const [loadingCities, setLoadingCities] = useState(false);
+
+ const isIndonesia = warehouse.country === "Indonesia";
function getToken() {
return (
@@ -66,6 +83,10 @@ export default function StoreDetailPage() {
);
}
+ function updateWarehouse(patch: Partial) {
+ setWarehouse((prev) => ({ ...prev, ...patch }));
+ }
+
useEffect(() => {
const token = getToken();
const businessDraftRaw = sessionStorage.getItem(ONBOARDING_BUSINESS_STORAGE_KEY);
@@ -124,6 +145,63 @@ export default function StoreDetailPage() {
}
}, [router]);
+ useEffect(() => {
+ if (!isIndonesia) {
+ setProvinces([]);
+ setCities([]);
+ return;
+ }
+
+ setLoadingProvinces(true);
+ fetch("/api/locations/provinces", {
+ headers: { "x-auth-token": normalizeToken(getToken()) },
+ })
+ .then((res) => res.json())
+ .then((data) => {
+ const rows = Array.isArray(data?.rows) ? data.rows : [];
+ setProvinces(rows);
+
+ setWarehouse((prev) => {
+ if (prev.provinceId || !prev.province) return prev;
+ const matched = rows.find(
+ (item: Province) =>
+ item.name.trim().toLowerCase() === prev.province.trim().toLowerCase()
+ );
+ return matched ? { ...prev, provinceId: matched.id } : prev;
+ });
+ })
+ .catch(() => setProvinces([]))
+ .finally(() => setLoadingProvinces(false));
+ }, [isIndonesia]);
+
+ useEffect(() => {
+ if (!isIndonesia || !warehouse.provinceId) {
+ setCities([]);
+ return;
+ }
+
+ setLoadingCities(true);
+ fetch(`/api/locations/cities?provinceId=${warehouse.provinceId}`, {
+ headers: { "x-auth-token": normalizeToken(getToken()) },
+ })
+ .then((res) => res.json())
+ .then((data) => {
+ const rows = Array.isArray(data?.rows) ? data.rows : [];
+ setCities(rows);
+
+ setWarehouse((prev) => {
+ if (prev.cityId || !prev.city) return prev;
+ const matched = rows.find(
+ (item: City) =>
+ item.name.trim().toLowerCase() === prev.city.trim().toLowerCase()
+ );
+ return matched ? { ...prev, cityId: matched.id } : prev;
+ });
+ })
+ .catch(() => setCities([]))
+ .finally(() => setLoadingCities(false));
+ }, [isIndonesia, warehouse.provinceId]);
+
async function handleSubmit(e: React.FormEvent) {
e.preventDefault();
setError("");
@@ -163,7 +241,7 @@ export default function StoreDetailPage() {
postalCode: warehouse.postalCode.trim(),
latitude: toNumber(warehouse.latitude),
longitude: toNumber(warehouse.longitude),
- warehouseType: warehouse.warehouseType,
+ warehouseType: "INA",
},
};
@@ -394,9 +472,7 @@ export default function StoreDetailPage() {
- setWarehouse((prev) => ({ ...prev, name: e.target.value }))
- }
+ onChange={(e) => updateWarehouse({ name: e.target.value })}
placeholder={sd.warehouseNamePlaceholder}
className={headlineFieldClass}
/>
@@ -408,9 +484,7 @@ export default function StoreDetailPage() {
- setWarehouse((prev) => ({ ...prev, address: e.target.value }))
- }
+ onChange={(e) => updateWarehouse({ address: e.target.value })}
placeholder={sd.fullAddressPlaceholder}
className={fieldClass}
/>
@@ -420,39 +494,104 @@ export default function StoreDetailPage() {
-
- setWarehouse((prev) => ({ ...prev, country: e.target.value }))
+ updateWarehouse({
+ country: e.target.value,
+ province: "",
+ provinceId: "",
+ city: "",
+ cityId: "",
+ })
}
className={fieldClass}
- />
+ >
+
+ {COUNTRIES.map((country) => (
+
+ ))}
+
-
- setWarehouse((prev) => ({ ...prev, province: e.target.value }))
- }
- className={fieldClass}
- />
+ {isIndonesia ? (
+
+ ) : (
+ updateWarehouse({ province: e.target.value })}
+ placeholder="Nama provinsi / state..."
+ className={fieldClass}
+ />
+ )}
-
- setWarehouse((prev) => ({ ...prev, city: e.target.value }))
- }
- className={fieldClass}
- />
+ {isIndonesia ? (
+
+ ) : (
+ updateWarehouse({ city: e.target.value })}
+ placeholder="Nama kota..."
+ className={fieldClass}
+ />
+ )}
@@ -461,12 +600,7 @@ export default function StoreDetailPage() {
- setWarehouse((prev) => ({
- ...prev,
- postalCode: e.target.value,
- }))
- }
+ onChange={(e) => updateWarehouse({ postalCode: e.target.value })}
className={fieldClass}
/>
@@ -479,12 +613,7 @@ export default function StoreDetailPage() {
type="number"
step="any"
value={warehouse.latitude}
- onChange={(e) =>
- setWarehouse((prev) => ({
- ...prev,
- latitude: e.target.value,
- }))
- }
+ onChange={(e) => updateWarehouse({ latitude: e.target.value })}
placeholder="5.548290"
className={fieldClass}
/>
@@ -498,12 +627,7 @@ export default function StoreDetailPage() {
type="number"
step="any"
value={warehouse.longitude}
- onChange={(e) =>
- setWarehouse((prev) => ({
- ...prev,
- longitude: e.target.value,
- }))
- }
+ onChange={(e) => updateWarehouse({ longitude: e.target.value })}
placeholder="95.323753"
className={fieldClass}
/>