hey-pharmacist-ecommerce 1.1.7 → 1.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +676 -606
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +481 -411
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/AddressFormModal.tsx +2 -2
- package/src/screens/CartScreen.tsx +120 -11
- package/src/screens/LoginScreen.tsx +2 -2
- package/src/screens/RegisterScreen.tsx +3 -3
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var React21 = require('react');
|
|
5
5
|
var globalAxios4 = require('axios');
|
|
6
6
|
var sonner = require('sonner');
|
|
7
7
|
var reactQuery = require('@tanstack/react-query');
|
|
@@ -17,7 +17,7 @@ var zod = require('zod');
|
|
|
17
17
|
|
|
18
18
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var React21__default = /*#__PURE__*/_interopDefault(React21);
|
|
21
21
|
var globalAxios4__default = /*#__PURE__*/_interopDefault(globalAxios4);
|
|
22
22
|
var Image3__default = /*#__PURE__*/_interopDefault(Image3);
|
|
23
23
|
var dynamic__default = /*#__PURE__*/_interopDefault(dynamic);
|
|
@@ -172,16 +172,16 @@ function darken(r, g, b, amount) {
|
|
|
172
172
|
}
|
|
173
173
|
|
|
174
174
|
// src/providers/ThemeProvider.tsx
|
|
175
|
-
var ThemeContext =
|
|
175
|
+
var ThemeContext = React21.createContext(void 0);
|
|
176
176
|
function useTheme() {
|
|
177
|
-
const context =
|
|
177
|
+
const context = React21.useContext(ThemeContext);
|
|
178
178
|
if (!context) {
|
|
179
179
|
throw new Error("useTheme must be used within ThemeProvider");
|
|
180
180
|
}
|
|
181
181
|
return context;
|
|
182
182
|
}
|
|
183
183
|
function ThemeProvider({ config, children }) {
|
|
184
|
-
|
|
184
|
+
React21.useEffect(() => {
|
|
185
185
|
const primaryShades = generateColorShades(config.colors.primary);
|
|
186
186
|
const secondaryShades = generateColorShades(config.colors.secondary);
|
|
187
187
|
const accentShades = generateColorShades(config.colors.accent);
|
|
@@ -208,7 +208,7 @@ function ThemeProvider({ config, children }) {
|
|
|
208
208
|
root.style.setProperty(`--header-to`, secondaryShades[600]);
|
|
209
209
|
}
|
|
210
210
|
}, [config]);
|
|
211
|
-
return /* @__PURE__ */
|
|
211
|
+
return /* @__PURE__ */ React21__default.default.createElement(ThemeContext.Provider, { value: { config } }, children);
|
|
212
212
|
}
|
|
213
213
|
|
|
214
214
|
// src/providers/AuthProvider.tsx
|
|
@@ -1940,17 +1940,17 @@ var AuthApi = class extends BaseAPI {
|
|
|
1940
1940
|
};
|
|
1941
1941
|
|
|
1942
1942
|
// src/providers/AuthProvider.tsx
|
|
1943
|
-
var AuthContext =
|
|
1943
|
+
var AuthContext = React21.createContext(void 0);
|
|
1944
1944
|
function useAuth() {
|
|
1945
|
-
const context =
|
|
1945
|
+
const context = React21.useContext(AuthContext);
|
|
1946
1946
|
if (!context) {
|
|
1947
1947
|
throw new Error("useAuth must be used within AuthProvider");
|
|
1948
1948
|
}
|
|
1949
1949
|
return context;
|
|
1950
1950
|
}
|
|
1951
1951
|
function AuthProvider({ children }) {
|
|
1952
|
-
const [user, setUser] =
|
|
1953
|
-
const [isLoading, setIsLoading] =
|
|
1952
|
+
const [user, setUser] = React21.useState(null);
|
|
1953
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
1954
1954
|
const getUserKey = () => {
|
|
1955
1955
|
if (typeof window === "undefined") return "ecommerce_user";
|
|
1956
1956
|
const token = getAuthToken();
|
|
@@ -1962,7 +1962,7 @@ function AuthProvider({ children }) {
|
|
|
1962
1962
|
return "ecommerce_user";
|
|
1963
1963
|
}
|
|
1964
1964
|
};
|
|
1965
|
-
const refreshUser =
|
|
1965
|
+
const refreshUser = React21.useCallback(async () => {
|
|
1966
1966
|
try {
|
|
1967
1967
|
const token = getAuthToken();
|
|
1968
1968
|
if (token) {
|
|
@@ -1976,7 +1976,7 @@ function AuthProvider({ children }) {
|
|
|
1976
1976
|
setIsLoading(false);
|
|
1977
1977
|
}
|
|
1978
1978
|
}, []);
|
|
1979
|
-
|
|
1979
|
+
React21.useEffect(() => {
|
|
1980
1980
|
if (typeof window !== "undefined") {
|
|
1981
1981
|
try {
|
|
1982
1982
|
const userKey = getUserKey();
|
|
@@ -2058,7 +2058,7 @@ function AuthProvider({ children }) {
|
|
|
2058
2058
|
updateUser,
|
|
2059
2059
|
refreshUser
|
|
2060
2060
|
};
|
|
2061
|
-
return /* @__PURE__ */
|
|
2061
|
+
return /* @__PURE__ */ React21__default.default.createElement(AuthContext.Provider, { value }, children);
|
|
2062
2062
|
}
|
|
2063
2063
|
var AddressesApiAxiosParamCreator = function(configuration) {
|
|
2064
2064
|
return {
|
|
@@ -6769,19 +6769,19 @@ var PaymentPaymentStatusEnum = /* @__PURE__ */ ((PaymentPaymentStatusEnum2) => {
|
|
|
6769
6769
|
init_config();
|
|
6770
6770
|
|
|
6771
6771
|
// src/providers/CartProvider.tsx
|
|
6772
|
-
var CartContext =
|
|
6772
|
+
var CartContext = React21.createContext(void 0);
|
|
6773
6773
|
function useCart() {
|
|
6774
|
-
const context =
|
|
6774
|
+
const context = React21.useContext(CartContext);
|
|
6775
6775
|
if (!context) {
|
|
6776
6776
|
throw new Error("useCart must be used within CartProvider");
|
|
6777
6777
|
}
|
|
6778
6778
|
return context;
|
|
6779
6779
|
}
|
|
6780
6780
|
function CartProvider({ children }) {
|
|
6781
|
-
const [cart, setCart] =
|
|
6782
|
-
const [isLoading, setIsLoading] =
|
|
6781
|
+
const [cart, setCart] = React21.useState(null);
|
|
6782
|
+
const [isLoading, setIsLoading] = React21.useState(false);
|
|
6783
6783
|
const { isAuthenticated } = useAuth();
|
|
6784
|
-
const refreshCart =
|
|
6784
|
+
const refreshCart = React21.useCallback(async () => {
|
|
6785
6785
|
if (!isAuthenticated) {
|
|
6786
6786
|
setCart(null);
|
|
6787
6787
|
return;
|
|
@@ -6793,7 +6793,7 @@ function CartProvider({ children }) {
|
|
|
6793
6793
|
console.error("Failed to fetch cart:", error);
|
|
6794
6794
|
}
|
|
6795
6795
|
}, [isAuthenticated]);
|
|
6796
|
-
|
|
6796
|
+
React21.useEffect(() => {
|
|
6797
6797
|
refreshCart();
|
|
6798
6798
|
}, [refreshCart]);
|
|
6799
6799
|
const addToCart = async (productId, quantity = 1, variantId) => {
|
|
@@ -6854,7 +6854,7 @@ function CartProvider({ children }) {
|
|
|
6854
6854
|
clearCart,
|
|
6855
6855
|
refreshCart
|
|
6856
6856
|
};
|
|
6857
|
-
return /* @__PURE__ */
|
|
6857
|
+
return /* @__PURE__ */ React21__default.default.createElement(CartContext.Provider, { value }, children);
|
|
6858
6858
|
}
|
|
6859
6859
|
|
|
6860
6860
|
// src/lib/Apis/wrapper.ts
|
|
@@ -6895,9 +6895,9 @@ var AXIOS_CONFIG = new Configuration({
|
|
|
6895
6895
|
timeout: 2e4
|
|
6896
6896
|
}
|
|
6897
6897
|
});
|
|
6898
|
-
var WishlistContext =
|
|
6898
|
+
var WishlistContext = React21.createContext(void 0);
|
|
6899
6899
|
function WishlistProvider({ children }) {
|
|
6900
|
-
const [state, setState] =
|
|
6900
|
+
const [state, setState] = React21.useState({
|
|
6901
6901
|
_id: "",
|
|
6902
6902
|
createdAt: /* @__PURE__ */ new Date(),
|
|
6903
6903
|
updatedAt: /* @__PURE__ */ new Date(),
|
|
@@ -6905,8 +6905,8 @@ function WishlistProvider({ children }) {
|
|
|
6905
6905
|
products: []
|
|
6906
6906
|
});
|
|
6907
6907
|
const { isAuthenticated } = useAuth() || {};
|
|
6908
|
-
const wishlistApi =
|
|
6909
|
-
const fetchWishlist =
|
|
6908
|
+
const wishlistApi = React21.useMemo(() => new WishlistApi(AXIOS_CONFIG), []);
|
|
6909
|
+
const fetchWishlist = React21.useCallback(async () => {
|
|
6910
6910
|
if (!isAuthenticated) {
|
|
6911
6911
|
setState((prev) => ({
|
|
6912
6912
|
...prev,
|
|
@@ -6935,7 +6935,7 @@ function WishlistProvider({ children }) {
|
|
|
6935
6935
|
}));
|
|
6936
6936
|
}
|
|
6937
6937
|
}, [isAuthenticated]);
|
|
6938
|
-
|
|
6938
|
+
React21.useEffect(() => {
|
|
6939
6939
|
fetchWishlist();
|
|
6940
6940
|
}, [fetchWishlist]);
|
|
6941
6941
|
const addToWishlist = async (product) => {
|
|
@@ -6997,7 +6997,7 @@ function WishlistProvider({ children }) {
|
|
|
6997
6997
|
const refreshWishlist = async () => {
|
|
6998
6998
|
await fetchWishlist();
|
|
6999
6999
|
};
|
|
7000
|
-
return /* @__PURE__ */
|
|
7000
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7001
7001
|
WishlistContext.Provider,
|
|
7002
7002
|
{
|
|
7003
7003
|
value: {
|
|
@@ -7014,13 +7014,13 @@ function WishlistProvider({ children }) {
|
|
|
7014
7014
|
);
|
|
7015
7015
|
}
|
|
7016
7016
|
var useWishlist = () => {
|
|
7017
|
-
const context =
|
|
7017
|
+
const context = React21.useContext(WishlistContext);
|
|
7018
7018
|
if (context === void 0) {
|
|
7019
7019
|
throw new Error("useWishlist must be used within a WishlistProvider");
|
|
7020
7020
|
}
|
|
7021
7021
|
return context;
|
|
7022
7022
|
};
|
|
7023
|
-
var BasePathContext =
|
|
7023
|
+
var BasePathContext = React21.createContext(void 0);
|
|
7024
7024
|
function BasePathProvider({ basePath = "", children }) {
|
|
7025
7025
|
const normalized = basePath ? basePath.startsWith("/") ? basePath : `/${basePath}` : "";
|
|
7026
7026
|
const buildPath = (path) => {
|
|
@@ -7030,21 +7030,21 @@ function BasePathProvider({ basePath = "", children }) {
|
|
|
7030
7030
|
if (path.startsWith("/")) return `${normalized}${path}`;
|
|
7031
7031
|
return `${normalized}/${path}`;
|
|
7032
7032
|
};
|
|
7033
|
-
return /* @__PURE__ */
|
|
7033
|
+
return /* @__PURE__ */ React21__default.default.createElement(BasePathContext.Provider, { value: { basePath: normalized, buildPath } }, children);
|
|
7034
7034
|
}
|
|
7035
7035
|
function useBasePath() {
|
|
7036
|
-
const ctx =
|
|
7036
|
+
const ctx = React21.useContext(BasePathContext);
|
|
7037
7037
|
if (!ctx) throw new Error("useBasePath must be used within BasePathProvider");
|
|
7038
7038
|
return ctx;
|
|
7039
7039
|
}
|
|
7040
7040
|
function EcommerceProvider({ config, children, withToaster = true, basePath = "" }) {
|
|
7041
|
-
|
|
7041
|
+
React21.useEffect(() => {
|
|
7042
7042
|
initializeApiAdapter(config);
|
|
7043
7043
|
}, [config]);
|
|
7044
|
-
const [client] =
|
|
7044
|
+
const [client] = React21__default.default.useState(
|
|
7045
7045
|
new reactQuery.QueryClient({ defaultOptions: { queries: { staleTime: 5e3 } } })
|
|
7046
7046
|
);
|
|
7047
|
-
return /* @__PURE__ */
|
|
7047
|
+
return /* @__PURE__ */ React21__default.default.createElement(reactQuery.QueryClientProvider, { client }, /* @__PURE__ */ React21__default.default.createElement(ThemeProvider, { config }, /* @__PURE__ */ React21__default.default.createElement(BasePathProvider, { basePath }, /* @__PURE__ */ React21__default.default.createElement(AuthProvider, null, /* @__PURE__ */ React21__default.default.createElement(CartProvider, null, /* @__PURE__ */ React21__default.default.createElement(WishlistProvider, null, children, withToaster && /* @__PURE__ */ React21__default.default.createElement(sonner.Toaster, { position: "top-right", richColors: true })))))));
|
|
7048
7048
|
}
|
|
7049
7049
|
|
|
7050
7050
|
// src/lib/utils/format.ts
|
|
@@ -7088,14 +7088,14 @@ function ProductCard({
|
|
|
7088
7088
|
}) {
|
|
7089
7089
|
const router = navigation.useRouter();
|
|
7090
7090
|
const { buildPath } = useBasePath();
|
|
7091
|
-
const [isFavorite, setIsFavorite] =
|
|
7091
|
+
const [isFavorite, setIsFavorite] = React21.useState(isFavorited);
|
|
7092
7092
|
const { addToWishlist, removeFromWishlist, isInWishlist } = useWishlist();
|
|
7093
|
-
const [isHovered, setIsHovered] =
|
|
7094
|
-
const [isImageLoaded, setIsImageLoaded] =
|
|
7095
|
-
const handleImageLoad =
|
|
7093
|
+
const [isHovered, setIsHovered] = React21.useState(false);
|
|
7094
|
+
const [isImageLoaded, setIsImageLoaded] = React21.useState(false);
|
|
7095
|
+
const handleImageLoad = React21.useCallback(() => {
|
|
7096
7096
|
setIsImageLoaded(true);
|
|
7097
7097
|
}, []);
|
|
7098
|
-
const handleCardClick =
|
|
7098
|
+
const handleCardClick = React21.useCallback((e) => {
|
|
7099
7099
|
if (onClickProduct) {
|
|
7100
7100
|
e.preventDefault();
|
|
7101
7101
|
onClickProduct(product);
|
|
@@ -7119,7 +7119,7 @@ function ProductCard({
|
|
|
7119
7119
|
sonner.toast.error("Failed to update wishlist");
|
|
7120
7120
|
}
|
|
7121
7121
|
};
|
|
7122
|
-
|
|
7122
|
+
React21.useEffect(() => {
|
|
7123
7123
|
setIsFavorite(isInWishlist(product?._id || "") || isFavorited);
|
|
7124
7124
|
}, [isFavorited, isInWishlist, product?._id]);
|
|
7125
7125
|
const handleKeyDown = (e) => {
|
|
@@ -7128,13 +7128,13 @@ function ProductCard({
|
|
|
7128
7128
|
handleCardClick(e);
|
|
7129
7129
|
}
|
|
7130
7130
|
};
|
|
7131
|
-
|
|
7131
|
+
React21.useMemo(() => {
|
|
7132
7132
|
return {
|
|
7133
7133
|
src: product.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
7134
7134
|
alt: product.name || "Product image"
|
|
7135
7135
|
};
|
|
7136
7136
|
}, [product.productMedia, product.name]);
|
|
7137
|
-
return /* @__PURE__ */
|
|
7137
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7138
7138
|
framerMotion.motion.article,
|
|
7139
7139
|
{
|
|
7140
7140
|
className: "relative group bg-white rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-all duration-300 border border-gray-100 hover:border-gray-200 flex h-[420px] flex-col",
|
|
@@ -7147,7 +7147,7 @@ function ProductCard({
|
|
|
7147
7147
|
onClick: handleCardClick,
|
|
7148
7148
|
onKeyDown: handleKeyDown
|
|
7149
7149
|
},
|
|
7150
|
-
/* @__PURE__ */
|
|
7150
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative h-48 w-full overflow-hidden bg-gray-50" }, /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, !isImageLoaded && /* @__PURE__ */ React21__default.default.createElement(
|
|
7151
7151
|
framerMotion.motion.div,
|
|
7152
7152
|
{
|
|
7153
7153
|
className: "absolute inset-0 bg-gray-200 animate-pulse",
|
|
@@ -7155,7 +7155,7 @@ function ProductCard({
|
|
|
7155
7155
|
exit: { opacity: 0 },
|
|
7156
7156
|
transition: { duration: 0.2 }
|
|
7157
7157
|
}
|
|
7158
|
-
)), product.productMedia?.[0]?.file && /* @__PURE__ */
|
|
7158
|
+
)), product.productMedia?.[0]?.file && /* @__PURE__ */ React21__default.default.createElement(
|
|
7159
7159
|
Image3__default.default,
|
|
7160
7160
|
{
|
|
7161
7161
|
src: product.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
@@ -7166,7 +7166,7 @@ function ProductCard({
|
|
|
7166
7166
|
priority: false,
|
|
7167
7167
|
onLoad: handleImageLoad
|
|
7168
7168
|
}
|
|
7169
|
-
), /* @__PURE__ */
|
|
7169
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute top-3 left-3 flex flex-col gap-2 z-10" }, product.isDiscounted && /* @__PURE__ */ React21__default.default.createElement(
|
|
7170
7170
|
framerMotion.motion.span,
|
|
7171
7171
|
{
|
|
7172
7172
|
initial: { scale: 0.9, opacity: 0 },
|
|
@@ -7176,7 +7176,7 @@ function ProductCard({
|
|
|
7176
7176
|
"-",
|
|
7177
7177
|
product.discountAmount,
|
|
7178
7178
|
"%"
|
|
7179
|
-
), product.inventoryCount === 0 && /* @__PURE__ */
|
|
7179
|
+
), product.inventoryCount === 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
7180
7180
|
framerMotion.motion.span,
|
|
7181
7181
|
{
|
|
7182
7182
|
initial: { scale: 0.9, opacity: 0 },
|
|
@@ -7184,7 +7184,7 @@ function ProductCard({
|
|
|
7184
7184
|
className: "inline-flex items-center justify-center px-2.5 py-1 rounded-full text-xs font-bold text-white bg-red-600"
|
|
7185
7185
|
},
|
|
7186
7186
|
"Out of Stock"
|
|
7187
|
-
)), showFavoriteButton && /* @__PURE__ */
|
|
7187
|
+
)), showFavoriteButton && /* @__PURE__ */ React21__default.default.createElement(
|
|
7188
7188
|
framerMotion.motion.button,
|
|
7189
7189
|
{
|
|
7190
7190
|
type: "button",
|
|
@@ -7194,10 +7194,10 @@ function ProductCard({
|
|
|
7194
7194
|
whileTap: { scale: 0.95 },
|
|
7195
7195
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7196
7196
|
},
|
|
7197
|
-
/* @__PURE__ */
|
|
7197
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: `w-5 h-5 ${isFavorite ? "fill-current" : ""}` })
|
|
7198
7198
|
)),
|
|
7199
|
-
/* @__PURE__ */
|
|
7200
|
-
showFavoriteButton && /* @__PURE__ */
|
|
7199
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute top-4 left-4 flex flex-col gap-2" }, product.inventoryCount === 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "px-3 py-1 rounded-full text-sm font-bold bg-red-100 text-red-800" }, "Out of Stock")),
|
|
7200
|
+
showFavoriteButton && /* @__PURE__ */ React21__default.default.createElement(
|
|
7201
7201
|
"button",
|
|
7202
7202
|
{
|
|
7203
7203
|
type: "button",
|
|
@@ -7205,10 +7205,10 @@ function ProductCard({
|
|
|
7205
7205
|
className: `absolute top-2 right-2 p-2 rounded-full transition-colors ${isFavorite ? "text-red-500" : "text-gray-400 hover:text-red-500"}`,
|
|
7206
7206
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7207
7207
|
},
|
|
7208
|
-
/* @__PURE__ */
|
|
7208
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: `w-5 h-5 ${isFavorite ? "fill-current" : ""}` })
|
|
7209
7209
|
),
|
|
7210
|
-
/* @__PURE__ */
|
|
7211
|
-
/* @__PURE__ */
|
|
7210
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "p-4" }, product.parentCategories && product.parentCategories?.length > 0 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-gray-500 uppercase tracking-wider mb-2" }, product.parentCategories?.map((category) => category?.name).join(", ") || "No categories"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mb-2" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900 line-clamp-1 group-hover:text-primary-600 transition-colors" }, product.name), product?.sku && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-gray-400 mt-1" }, "SKU: ", product.sku)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-baseline gap-2" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-2xl font-bold text-gray-900" }, formatPrice(product.finalPrice)), product.inventoryCount > 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-xs text-gray-500" }, product.inventoryCount > 0 ? "In Stock" : "Out of Stock")), product.priceBeforeDiscount && product.priceBeforeDiscount > product.finalPrice && /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm text-gray-500 line-through" }, formatPrice(product.priceBeforeDiscount)))),
|
|
7211
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-auto p-4 pt-0" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7212
7212
|
"button",
|
|
7213
7213
|
{
|
|
7214
7214
|
type: "button",
|
|
@@ -7219,7 +7219,7 @@ function ProductCard({
|
|
|
7219
7219
|
className: `w-full flex items-center justify-center rounded-md px-3 py-2 text-sm font-medium bg-primary-600 hover:bg-primary-700 text-white`
|
|
7220
7220
|
},
|
|
7221
7221
|
"View Product"
|
|
7222
|
-
), showFavoriteButton && /* @__PURE__ */
|
|
7222
|
+
), showFavoriteButton && /* @__PURE__ */ React21__default.default.createElement(
|
|
7223
7223
|
"button",
|
|
7224
7224
|
{
|
|
7225
7225
|
type: "button",
|
|
@@ -7227,7 +7227,7 @@ function ProductCard({
|
|
|
7227
7227
|
className: "mt-2 w-full flex items-center justify-center rounded-md border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-primary-600 hover:bg-gray-50",
|
|
7228
7228
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7229
7229
|
},
|
|
7230
|
-
/* @__PURE__ */
|
|
7230
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
7231
7231
|
lucideReact.Heart,
|
|
7232
7232
|
{
|
|
7233
7233
|
className: `mr-2 h-4 w-4 ${isFavorite ? "fill-red-500 text-red-500" : "text-primary-600"}`
|
|
@@ -7238,13 +7238,13 @@ function ProductCard({
|
|
|
7238
7238
|
);
|
|
7239
7239
|
}
|
|
7240
7240
|
function Skeleton({ className = "" }) {
|
|
7241
|
-
return /* @__PURE__ */
|
|
7241
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: `animate-pulse bg-gradient-to-r from-gray-200 via-gray-300 to-gray-200 bg-[length:200%_100%] rounded ${className}` });
|
|
7242
7242
|
}
|
|
7243
7243
|
function ProductCardSkeleton() {
|
|
7244
|
-
return /* @__PURE__ */
|
|
7244
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "bg-white rounded-2xl overflow-hidden shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-64 w-full" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "p-4 space-y-3" }, /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-6 w-3/4" }), /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-4 w-1/2" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-between items-center pt-2" }, /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-8 w-24" }), /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-10 w-10 rounded-full" }))));
|
|
7245
7245
|
}
|
|
7246
7246
|
function OrderCardSkeleton() {
|
|
7247
|
-
return /* @__PURE__ */
|
|
7247
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "bg-white rounded-2xl p-6 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-between items-start mb-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-2 flex-1" }, /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-6 w-32" }), /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-4 w-48" })), /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-6 w-20 rounded-full" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-4 w-full" }), /* @__PURE__ */ React21__default.default.createElement(Skeleton, { className: "h-4 w-2/3" })));
|
|
7248
7248
|
}
|
|
7249
7249
|
var MotionDiv = dynamic__default.default(() => import('framer-motion').then((mod) => mod.motion.div), {
|
|
7250
7250
|
ssr: false
|
|
@@ -7270,14 +7270,14 @@ function Button({
|
|
|
7270
7270
|
md: "px-6 py-3 text-base",
|
|
7271
7271
|
lg: "px-8 py-4 text-lg"
|
|
7272
7272
|
};
|
|
7273
|
-
return /* @__PURE__ */
|
|
7273
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7274
7274
|
MotionDiv,
|
|
7275
7275
|
{
|
|
7276
7276
|
whileHover: { scale: 1.02 },
|
|
7277
7277
|
whileTap: { scale: 0.98 },
|
|
7278
7278
|
className: "inline-block"
|
|
7279
7279
|
},
|
|
7280
|
-
/* @__PURE__ */
|
|
7280
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
7281
7281
|
"button",
|
|
7282
7282
|
{
|
|
7283
7283
|
className: `${baseStyles} ${variants[variant]} ${sizes[size]} ${className}`,
|
|
@@ -7286,18 +7286,18 @@ function Button({
|
|
|
7286
7286
|
"aria-busy": isLoading,
|
|
7287
7287
|
...props
|
|
7288
7288
|
},
|
|
7289
|
-
isLoading ? /* @__PURE__ */
|
|
7289
|
+
isLoading ? /* @__PURE__ */ React21__default.default.createElement(React21__default.default.Fragment, null, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "animate-spin h-5 w-5", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ React21__default.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React21__default.default.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })), "Loading...") : children
|
|
7290
7290
|
)
|
|
7291
7291
|
);
|
|
7292
7292
|
}
|
|
7293
7293
|
|
|
7294
7294
|
// src/components/EmptyState.tsx
|
|
7295
7295
|
function EmptyState({ icon: Icon, title, description, actionLabel, onAction }) {
|
|
7296
|
-
return /* @__PURE__ */
|
|
7296
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col items-center justify-center py-16 px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-24 h-24 bg-gray-100 rounded-full flex items-center justify-center mb-6" }, /* @__PURE__ */ React21__default.default.createElement(Icon, { className: "w-12 h-12 text-gray-400" })), /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-2xl font-bold text-gray-900 mb-2" }, title), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-600 text-center max-w-md mb-8" }, description), actionLabel && onAction && /* @__PURE__ */ React21__default.default.createElement(Button, { onClick: onAction }, actionLabel));
|
|
7297
7297
|
}
|
|
7298
|
-
var Input =
|
|
7298
|
+
var Input = React21.forwardRef(
|
|
7299
7299
|
({ label, error, helperText, className = "", ...props }, ref) => {
|
|
7300
|
-
return /* @__PURE__ */
|
|
7300
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-full" }, label && /* @__PURE__ */ React21__default.default.createElement("label", { className: "block text-sm font-medium text-gray-700 mb-2" }, label), /* @__PURE__ */ React21__default.default.createElement(
|
|
7301
7301
|
"input",
|
|
7302
7302
|
{
|
|
7303
7303
|
ref,
|
|
@@ -7311,21 +7311,21 @@ var Input = React20.forwardRef(
|
|
|
7311
7311
|
`,
|
|
7312
7312
|
...props
|
|
7313
7313
|
}
|
|
7314
|
-
), error && /* @__PURE__ */
|
|
7314
|
+
), error && /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-sm text-red-600" }, error), helperText && !error && /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-sm text-gray-500" }, helperText));
|
|
7315
7315
|
}
|
|
7316
7316
|
);
|
|
7317
7317
|
Input.displayName = "Input";
|
|
7318
7318
|
function useProducts(filters, page = 1, limit = 20) {
|
|
7319
|
-
const [products, setProducts] =
|
|
7320
|
-
const [isLoading, setIsLoading] =
|
|
7321
|
-
const [error, setError] =
|
|
7322
|
-
const [pagination, setPagination] =
|
|
7319
|
+
const [products, setProducts] = React21.useState([]);
|
|
7320
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
7321
|
+
const [error, setError] = React21.useState(null);
|
|
7322
|
+
const [pagination, setPagination] = React21.useState({
|
|
7323
7323
|
page: 1,
|
|
7324
7324
|
limit: 20,
|
|
7325
7325
|
total: 0,
|
|
7326
7326
|
totalPages: 0
|
|
7327
7327
|
});
|
|
7328
|
-
const fetchProducts =
|
|
7328
|
+
const fetchProducts = React21.useCallback(async () => {
|
|
7329
7329
|
setIsLoading(true);
|
|
7330
7330
|
setError(null);
|
|
7331
7331
|
try {
|
|
@@ -7381,16 +7381,16 @@ function useProducts(filters, page = 1, limit = 20) {
|
|
|
7381
7381
|
}
|
|
7382
7382
|
setIsLoading(false);
|
|
7383
7383
|
}, [filters, page, limit]);
|
|
7384
|
-
|
|
7384
|
+
React21.useEffect(() => {
|
|
7385
7385
|
fetchProducts();
|
|
7386
7386
|
}, [fetchProducts]);
|
|
7387
7387
|
return { products, isLoading, error, pagination };
|
|
7388
7388
|
}
|
|
7389
7389
|
function useProduct(id) {
|
|
7390
|
-
const [product, setProduct] =
|
|
7391
|
-
const [isLoading, setIsLoading] =
|
|
7392
|
-
const [error, setError] =
|
|
7393
|
-
|
|
7390
|
+
const [product, setProduct] = React21.useState(null);
|
|
7391
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
7392
|
+
const [error, setError] = React21.useState(null);
|
|
7393
|
+
React21.useEffect(() => {
|
|
7394
7394
|
const fetchProduct = async () => {
|
|
7395
7395
|
setIsLoading(true);
|
|
7396
7396
|
setError(null);
|
|
@@ -7407,10 +7407,10 @@ function useProduct(id) {
|
|
|
7407
7407
|
return { product, isLoading, error };
|
|
7408
7408
|
}
|
|
7409
7409
|
function useCategories() {
|
|
7410
|
-
const [categories, setCategories] =
|
|
7411
|
-
const [isLoading, setIsLoading] =
|
|
7412
|
-
const [error, setError] =
|
|
7413
|
-
|
|
7410
|
+
const [categories, setCategories] = React21.useState([]);
|
|
7411
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
7412
|
+
const [error, setError] = React21.useState(null);
|
|
7413
|
+
React21.useEffect(() => {
|
|
7414
7414
|
const fetchCategories = async () => {
|
|
7415
7415
|
try {
|
|
7416
7416
|
setIsLoading(true);
|
|
@@ -7432,19 +7432,19 @@ function useCategories() {
|
|
|
7432
7432
|
function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
7433
7433
|
const router = navigation.useRouter();
|
|
7434
7434
|
const { buildPath } = useBasePath();
|
|
7435
|
-
const [filters, setFilters] =
|
|
7436
|
-
const [page, setPage] =
|
|
7437
|
-
const [showFilters, setShowFilters] =
|
|
7438
|
-
const [searchQuery, setSearchQuery] =
|
|
7439
|
-
const [isSearching, setIsSearching] =
|
|
7440
|
-
const [sortOption, setSortOption] =
|
|
7441
|
-
const [viewMode, setViewMode] =
|
|
7442
|
-
const [selectedPriceRange, setSelectedPriceRange] =
|
|
7443
|
-
const [customPrice, setCustomPrice] =
|
|
7435
|
+
const [filters, setFilters] = React21.useState(initialFilters);
|
|
7436
|
+
const [page, setPage] = React21.useState(1);
|
|
7437
|
+
const [showFilters, setShowFilters] = React21.useState(false);
|
|
7438
|
+
const [searchQuery, setSearchQuery] = React21.useState("");
|
|
7439
|
+
const [isSearching, setIsSearching] = React21.useState(false);
|
|
7440
|
+
const [sortOption, setSortOption] = React21.useState("featured");
|
|
7441
|
+
const [viewMode, setViewMode] = React21.useState("grid");
|
|
7442
|
+
const [selectedPriceRange, setSelectedPriceRange] = React21.useState(null);
|
|
7443
|
+
const [customPrice, setCustomPrice] = React21.useState({
|
|
7444
7444
|
min: "",
|
|
7445
7445
|
max: ""
|
|
7446
7446
|
});
|
|
7447
|
-
const [expandedCategories, setExpandedCategories] =
|
|
7447
|
+
const [expandedCategories, setExpandedCategories] = React21.useState({});
|
|
7448
7448
|
const { products, isLoading, pagination } = useProducts(filters, page, 20);
|
|
7449
7449
|
const { categories } = useCategories();
|
|
7450
7450
|
const handleSearch = (e) => {
|
|
@@ -7464,7 +7464,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7464
7464
|
router.push(buildPath(`/search?q=${encodeURIComponent(searchQuery.trim())}`));
|
|
7465
7465
|
}
|
|
7466
7466
|
};
|
|
7467
|
-
const priceRanges =
|
|
7467
|
+
const priceRanges = React21.useMemo(
|
|
7468
7468
|
() => [
|
|
7469
7469
|
{ label: `Under ${formatPrice(25)}`, value: "under-25", min: void 0, max: 25 },
|
|
7470
7470
|
{ label: `${formatPrice(25)} - ${formatPrice(50)}`, value: "25-50", min: 25, max: 50 },
|
|
@@ -7473,13 +7473,13 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7473
7473
|
],
|
|
7474
7474
|
[]
|
|
7475
7475
|
);
|
|
7476
|
-
|
|
7476
|
+
React21.useEffect(() => {
|
|
7477
7477
|
setCustomPrice({
|
|
7478
7478
|
min: filters.minPrice !== void 0 ? String(filters.minPrice) : "",
|
|
7479
7479
|
max: filters.maxPrice !== void 0 ? String(filters.maxPrice) : ""
|
|
7480
7480
|
});
|
|
7481
7481
|
}, [filters.minPrice, filters.maxPrice]);
|
|
7482
|
-
|
|
7482
|
+
React21.useEffect(() => {
|
|
7483
7483
|
const updates = {};
|
|
7484
7484
|
if (filters.category) updates[filters.category] = true;
|
|
7485
7485
|
if (filters.subCategory) {
|
|
@@ -7492,18 +7492,18 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7492
7492
|
setExpandedCategories((prev) => ({ ...prev, ...updates }));
|
|
7493
7493
|
}
|
|
7494
7494
|
}, [filters.category, filters.subCategory, categories]);
|
|
7495
|
-
const toggleCategoryExpand =
|
|
7495
|
+
const toggleCategoryExpand = React21.useCallback((id) => {
|
|
7496
7496
|
setExpandedCategories((prev) => ({ ...prev, [id]: !prev[id] }));
|
|
7497
7497
|
}, []);
|
|
7498
|
-
const sortedCategories =
|
|
7498
|
+
const sortedCategories = React21.useMemo(
|
|
7499
7499
|
() => [...categories].sort((a, b) => a.name?.localeCompare(b.name ?? "") ?? 0),
|
|
7500
7500
|
[categories]
|
|
7501
7501
|
);
|
|
7502
|
-
const topCategories =
|
|
7502
|
+
const topCategories = React21.useMemo(
|
|
7503
7503
|
() => [...categories].sort((a, b) => (b.productCount ?? 0) - (a.productCount ?? 0)).slice(0, 6),
|
|
7504
7504
|
[categories]
|
|
7505
7505
|
);
|
|
7506
|
-
const productInsights =
|
|
7506
|
+
const productInsights = React21.useMemo(() => {
|
|
7507
7507
|
if (!products.length) {
|
|
7508
7508
|
return { newArrivals: 0, inStockCount: 0 };
|
|
7509
7509
|
}
|
|
@@ -7516,7 +7516,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7516
7516
|
});
|
|
7517
7517
|
return { newArrivals: newArrivals2, inStockCount };
|
|
7518
7518
|
}, [products]);
|
|
7519
|
-
const insightCards =
|
|
7519
|
+
const insightCards = React21.useMemo(
|
|
7520
7520
|
() => [
|
|
7521
7521
|
{
|
|
7522
7522
|
id: "new",
|
|
@@ -7549,7 +7549,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7549
7549
|
filters.newArrivals
|
|
7550
7550
|
]
|
|
7551
7551
|
);
|
|
7552
|
-
const filteredProducts =
|
|
7552
|
+
const filteredProducts = React21.useMemo(() => {
|
|
7553
7553
|
if (isLoading) return products;
|
|
7554
7554
|
let items = [...products];
|
|
7555
7555
|
if (filters.tags?.length) {
|
|
@@ -7561,7 +7561,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7561
7561
|
}
|
|
7562
7562
|
return items;
|
|
7563
7563
|
}, [isLoading, products, filters.tags, filters.newArrivals]);
|
|
7564
|
-
const sortedProducts =
|
|
7564
|
+
const sortedProducts = React21.useMemo(() => {
|
|
7565
7565
|
if (isLoading) {
|
|
7566
7566
|
return filteredProducts;
|
|
7567
7567
|
}
|
|
@@ -7580,14 +7580,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7580
7580
|
}
|
|
7581
7581
|
}, [isLoading, filteredProducts, sortOption]);
|
|
7582
7582
|
const displayedProducts = sortedProducts;
|
|
7583
|
-
const quickSearches =
|
|
7583
|
+
const quickSearches = React21.useMemo(() => {
|
|
7584
7584
|
const counts = /* @__PURE__ */ new Map();
|
|
7585
7585
|
products.forEach((p) => {
|
|
7586
7586
|
(p.tags || []).forEach((t) => counts.set(t, (counts.get(t) || 0) + 1));
|
|
7587
7587
|
});
|
|
7588
7588
|
return Array.from(counts.entries()).sort((a, b) => b[1] - a[1]).slice(0, 4).map(([tag]) => tag);
|
|
7589
7589
|
}, [products]);
|
|
7590
|
-
const handleQuickSearch =
|
|
7590
|
+
const handleQuickSearch = React21.useCallback((term) => {
|
|
7591
7591
|
setSearchQuery("");
|
|
7592
7592
|
setFilters((current) => ({
|
|
7593
7593
|
...current,
|
|
@@ -7596,7 +7596,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7596
7596
|
}));
|
|
7597
7597
|
setPage(1);
|
|
7598
7598
|
}, []);
|
|
7599
|
-
const handleCategoryChange =
|
|
7599
|
+
const handleCategoryChange = React21.useCallback(
|
|
7600
7600
|
(categorySlug) => {
|
|
7601
7601
|
setFilters((current) => {
|
|
7602
7602
|
if (current.category === categorySlug) {
|
|
@@ -7613,7 +7613,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7613
7613
|
},
|
|
7614
7614
|
[]
|
|
7615
7615
|
);
|
|
7616
|
-
const handleSubCategoryChange =
|
|
7616
|
+
const handleSubCategoryChange = React21.useCallback((parentCategoryId, subCategoryId) => {
|
|
7617
7617
|
setFilters((current) => {
|
|
7618
7618
|
if (current.subCategory === subCategoryId) {
|
|
7619
7619
|
const { subCategory, ...rest } = current;
|
|
@@ -7623,7 +7623,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7623
7623
|
});
|
|
7624
7624
|
setPage(1);
|
|
7625
7625
|
}, []);
|
|
7626
|
-
const handleToggleStock =
|
|
7626
|
+
const handleToggleStock = React21.useCallback(() => {
|
|
7627
7627
|
setFilters((current) => {
|
|
7628
7628
|
if (current.inStock) {
|
|
7629
7629
|
const { inStock, ...rest } = current;
|
|
@@ -7633,7 +7633,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7633
7633
|
});
|
|
7634
7634
|
setPage(1);
|
|
7635
7635
|
}, []);
|
|
7636
|
-
const handleToggleNewArrivals =
|
|
7636
|
+
const handleToggleNewArrivals = React21.useCallback(() => {
|
|
7637
7637
|
setFilters((current) => {
|
|
7638
7638
|
if (current.newArrivals) {
|
|
7639
7639
|
const { newArrivals: newArrivals2, ...rest } = current;
|
|
@@ -7643,21 +7643,21 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7643
7643
|
});
|
|
7644
7644
|
setPage(1);
|
|
7645
7645
|
}, []);
|
|
7646
|
-
const handleClearFilters =
|
|
7646
|
+
const handleClearFilters = React21.useCallback(() => {
|
|
7647
7647
|
setFilters({});
|
|
7648
7648
|
setSearchQuery("");
|
|
7649
7649
|
setSelectedPriceRange(null);
|
|
7650
7650
|
setCustomPrice({ min: "", max: "" });
|
|
7651
7651
|
setPage(1);
|
|
7652
7652
|
}, []);
|
|
7653
|
-
const handleRemoveCategory =
|
|
7653
|
+
const handleRemoveCategory = React21.useCallback(() => {
|
|
7654
7654
|
setFilters((current) => {
|
|
7655
7655
|
const { category, subCategory, ...rest } = current;
|
|
7656
7656
|
return rest;
|
|
7657
7657
|
});
|
|
7658
7658
|
setPage(1);
|
|
7659
7659
|
}, []);
|
|
7660
|
-
const handleRemoveSubCategory =
|
|
7660
|
+
const handleRemoveSubCategory = React21.useCallback(() => {
|
|
7661
7661
|
setFilters((current) => {
|
|
7662
7662
|
const next = { ...current };
|
|
7663
7663
|
delete next.subCategory;
|
|
@@ -7665,7 +7665,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7665
7665
|
});
|
|
7666
7666
|
setPage(1);
|
|
7667
7667
|
}, []);
|
|
7668
|
-
const handleRemoveSearch =
|
|
7668
|
+
const handleRemoveSearch = React21.useCallback(() => {
|
|
7669
7669
|
setFilters((current) => {
|
|
7670
7670
|
const { search, ...rest } = current;
|
|
7671
7671
|
return rest;
|
|
@@ -7673,14 +7673,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7673
7673
|
setSearchQuery("");
|
|
7674
7674
|
setPage(1);
|
|
7675
7675
|
}, []);
|
|
7676
|
-
const handleRemoveInStock =
|
|
7676
|
+
const handleRemoveInStock = React21.useCallback(() => {
|
|
7677
7677
|
setFilters((current) => {
|
|
7678
7678
|
const { inStock, ...rest } = current;
|
|
7679
7679
|
return rest;
|
|
7680
7680
|
});
|
|
7681
7681
|
setPage(1);
|
|
7682
7682
|
}, []);
|
|
7683
|
-
const handleRemovePrice =
|
|
7683
|
+
const handleRemovePrice = React21.useCallback(() => {
|
|
7684
7684
|
setFilters((current) => {
|
|
7685
7685
|
const next = { ...current };
|
|
7686
7686
|
delete next.minPrice;
|
|
@@ -7691,7 +7691,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7691
7691
|
setCustomPrice({ min: "", max: "" });
|
|
7692
7692
|
setPage(1);
|
|
7693
7693
|
}, []);
|
|
7694
|
-
const handleRemoveTag =
|
|
7694
|
+
const handleRemoveTag = React21.useCallback((tag) => {
|
|
7695
7695
|
setFilters((current) => {
|
|
7696
7696
|
if (!current.tags) return current;
|
|
7697
7697
|
const updated = current.tags.filter((item) => item !== tag);
|
|
@@ -7705,7 +7705,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7705
7705
|
});
|
|
7706
7706
|
setPage(1);
|
|
7707
7707
|
}, []);
|
|
7708
|
-
const handlePriceRangeSelect =
|
|
7708
|
+
const handlePriceRangeSelect = React21.useCallback(
|
|
7709
7709
|
(value) => {
|
|
7710
7710
|
const range = priceRanges.find((item) => item.value === value);
|
|
7711
7711
|
if (selectedPriceRange === value) {
|
|
@@ -7744,7 +7744,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7744
7744
|
},
|
|
7745
7745
|
[priceRanges, selectedPriceRange]
|
|
7746
7746
|
);
|
|
7747
|
-
const applyCustomPrice =
|
|
7747
|
+
const applyCustomPrice = React21.useCallback(() => {
|
|
7748
7748
|
const rawMin = customPrice.min.trim();
|
|
7749
7749
|
const rawMax = customPrice.max.trim();
|
|
7750
7750
|
const minValue = rawMin !== "" ? Number(rawMin) : void 0;
|
|
@@ -7781,7 +7781,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7781
7781
|
tags,
|
|
7782
7782
|
newArrivals
|
|
7783
7783
|
} = filters;
|
|
7784
|
-
const activeFilterChips =
|
|
7784
|
+
const activeFilterChips = React21.useMemo(() => {
|
|
7785
7785
|
const chips = [];
|
|
7786
7786
|
if (searchFilter) {
|
|
7787
7787
|
chips.push({
|
|
@@ -7873,7 +7873,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7873
7873
|
]);
|
|
7874
7874
|
const hasActiveFilters = activeFilterChips.length > 0;
|
|
7875
7875
|
const isCustomPriceDirty = customPrice.min.trim() !== "" || customPrice.max.trim() !== "";
|
|
7876
|
-
const renderFiltersPanel = () => /* @__PURE__ */
|
|
7876
|
+
const renderFiltersPanel = () => /* @__PURE__ */ React21__default.default.createElement(React21__default.default.Fragment, null, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start justify-between gap-3" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, "Refine results"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-sm text-gray-500" }, "Filter by category, price, and availability to find the perfect fit faster.")), hasActiveFilters && /* @__PURE__ */ React21__default.default.createElement(
|
|
7877
7877
|
"button",
|
|
7878
7878
|
{
|
|
7879
7879
|
type: "button",
|
|
@@ -7881,10 +7881,10 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7881
7881
|
className: "text-sm font-semibold text-primary-600 hover:text-primary-700"
|
|
7882
7882
|
},
|
|
7883
7883
|
"Clear all"
|
|
7884
|
-
)), /* @__PURE__ */
|
|
7884
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-xs font-semibold uppercase tracking-[0.2em] text-gray-500" }, "Categories"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-2" }, sortedCategories.length === 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm text-gray-500" }, "No categories available yet."), sortedCategories.map((category) => {
|
|
7885
7885
|
const isCategoryActive = categoryFilter === category.id;
|
|
7886
7886
|
const isExpanded = !!expandedCategories[category.id];
|
|
7887
|
-
return /* @__PURE__ */
|
|
7887
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { key: category.id, className: "rounded-xl border-gray-100 bg-white/50" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7888
7888
|
"div",
|
|
7889
7889
|
{
|
|
7890
7890
|
role: "button",
|
|
@@ -7895,8 +7895,8 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7895
7895
|
},
|
|
7896
7896
|
className: `flex w-full items-center justify-between rounded-xl px-3 py-2 text-sm font-medium transition ${isCategoryActive ? "text-primary-700 bg-primary-50" : "text-gray-700 hover:text-primary-700 hover:bg-primary-50/50"}`
|
|
7897
7897
|
},
|
|
7898
|
-
/* @__PURE__ */
|
|
7899
|
-
/* @__PURE__ */
|
|
7898
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium" }, category.name), category.productCount > 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: `ml-1 rounded-full bg-gray-100 px-2 py-0.5 text-xs ${isCategoryActive ? "text-primary-700" : "text-gray-500"}` }, category.productCount)),
|
|
7899
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
7900
7900
|
"button",
|
|
7901
7901
|
{
|
|
7902
7902
|
type: "button",
|
|
@@ -7908,11 +7908,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7908
7908
|
className: "rounded-md p-1 hover:bg-gray-100",
|
|
7909
7909
|
"aria-label": isExpanded ? "Collapse" : "Expand"
|
|
7910
7910
|
},
|
|
7911
|
-
/* @__PURE__ */
|
|
7911
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronDown, { className: `h-4 w-4 transition-transform ${isExpanded ? "rotate-180 text-primary-600" : "rotate-0 text-gray-400"}` })
|
|
7912
7912
|
)
|
|
7913
|
-
), isExpanded && Array.isArray(category.categorySubCategories) && category.categorySubCategories.length > 0 && /* @__PURE__ */
|
|
7913
|
+
), isExpanded && Array.isArray(category.categorySubCategories) && category.categorySubCategories.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-1 border-gray-100 px-2 pb-2 pl-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "divide-y divide-gray-100" }, category.categorySubCategories.map((sub) => {
|
|
7914
7914
|
const isSubActive = subCategoryFilter === sub.id;
|
|
7915
|
-
return /* @__PURE__ */
|
|
7915
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7916
7916
|
"button",
|
|
7917
7917
|
{
|
|
7918
7918
|
key: sub.id,
|
|
@@ -7923,9 +7923,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7923
7923
|
sub.name
|
|
7924
7924
|
);
|
|
7925
7925
|
}))));
|
|
7926
|
-
}))))), /* @__PURE__ */
|
|
7926
|
+
}))))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-xs font-semibold uppercase tracking-[0.2em] text-gray-500" }, "Price"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2" }, priceRanges.map((range) => {
|
|
7927
7927
|
const isActive = selectedPriceRange === range.value;
|
|
7928
|
-
return /* @__PURE__ */
|
|
7928
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7929
7929
|
"button",
|
|
7930
7930
|
{
|
|
7931
7931
|
type: "button",
|
|
@@ -7935,7 +7935,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7935
7935
|
},
|
|
7936
7936
|
range.label
|
|
7937
7937
|
);
|
|
7938
|
-
})), /* @__PURE__ */
|
|
7938
|
+
})), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-2 gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7939
7939
|
Input,
|
|
7940
7940
|
{
|
|
7941
7941
|
type: "number",
|
|
@@ -7944,7 +7944,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7944
7944
|
value: customPrice.min,
|
|
7945
7945
|
onChange: (event) => setCustomPrice((current) => ({ ...current, min: event.target.value }))
|
|
7946
7946
|
}
|
|
7947
|
-
), /* @__PURE__ */
|
|
7947
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
7948
7948
|
Input,
|
|
7949
7949
|
{
|
|
7950
7950
|
type: "number",
|
|
@@ -7953,7 +7953,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7953
7953
|
value: customPrice.max,
|
|
7954
7954
|
onChange: (event) => setCustomPrice((current) => ({ ...current, max: event.target.value }))
|
|
7955
7955
|
}
|
|
7956
|
-
)), /* @__PURE__ */
|
|
7956
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
7957
7957
|
"button",
|
|
7958
7958
|
{
|
|
7959
7959
|
type: "button",
|
|
@@ -7962,48 +7962,48 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7962
7962
|
className: "w-full rounded-xl border border-primary-500 bg-primary-500/10 px-4 py-2.5 text-sm font-semibold text-primary-700 transition hover:bg-primary-500/20 disabled:cursor-not-allowed disabled:border-gray-200 disabled:text-gray-400"
|
|
7963
7963
|
},
|
|
7964
7964
|
"Apply price range"
|
|
7965
|
-
)), /* @__PURE__ */
|
|
7965
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-xs font-semibold uppercase tracking-[0.2em] text-gray-500" }, "Availability"), /* @__PURE__ */ React21__default.default.createElement(
|
|
7966
7966
|
"button",
|
|
7967
7967
|
{
|
|
7968
7968
|
type: "button",
|
|
7969
7969
|
onClick: handleToggleStock,
|
|
7970
7970
|
className: `flex w-full items-center justify-between rounded-xl border px-4 py-3 text-sm font-medium transition ${inStockOnly ? "border-primary-500 bg-primary-50 text-primary-700" : "border-gray-200 bg-white text-gray-600 hover:border-primary-300 hover:text-primary-600"}`
|
|
7971
7971
|
},
|
|
7972
|
-
/* @__PURE__ */
|
|
7973
|
-
/* @__PURE__ */
|
|
7974
|
-
), /* @__PURE__ */
|
|
7972
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, "In stock only"),
|
|
7973
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4 text-primary-500" })
|
|
7974
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
7975
7975
|
"button",
|
|
7976
7976
|
{
|
|
7977
7977
|
type: "button",
|
|
7978
7978
|
onClick: handleToggleNewArrivals,
|
|
7979
7979
|
className: `mt-2 flex w-full items-center justify-between rounded-xl border px-4 py-3 text-sm font-medium transition ${newArrivals ? "border-secondary-500 bg-secondary-50 text-secondary-700" : "border-gray-200 bg-white text-gray-600 hover:border-secondary-300 hover:text-secondary-600"}`
|
|
7980
7980
|
},
|
|
7981
|
-
/* @__PURE__ */
|
|
7982
|
-
/* @__PURE__ */
|
|
7981
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, "New arrivals (last 30 days)"),
|
|
7982
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4 text-secondary-500" })
|
|
7983
7983
|
))));
|
|
7984
|
-
return /* @__PURE__ */
|
|
7984
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7985
7985
|
"div",
|
|
7986
7986
|
{
|
|
7987
7987
|
className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]",
|
|
7988
7988
|
"aria-hidden": "true"
|
|
7989
7989
|
}
|
|
7990
|
-
), /* @__PURE__ */
|
|
7990
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_bottom_right,_rgba(94,234,212,0.35),_transparent_55%)] opacity-60" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-24" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7991
7991
|
framerMotion.motion.div,
|
|
7992
7992
|
{
|
|
7993
7993
|
initial: { opacity: 0, y: 24 },
|
|
7994
7994
|
animate: { opacity: 1, y: 0 },
|
|
7995
7995
|
className: "max-w-3xl space-y-8 text-center md:mx-auto md:text-left"
|
|
7996
7996
|
},
|
|
7997
|
-
/* @__PURE__ */
|
|
7998
|
-
/* @__PURE__ */
|
|
7999
|
-
/* @__PURE__ */
|
|
8000
|
-
/* @__PURE__ */
|
|
7997
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/10 px-4 py-2 text-sm font-semibold tracking-wide text-white/80 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4" }), "Wellness products, curated for you"),
|
|
7998
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold leading-tight md:text-6xl" }, "Find pharmacy favorites crafted to keep your family thriving"),
|
|
7999
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-lg text-white/80 md:text-xl" }, "Explore a modern storefront with real-time inventory, smart filters, and rich product details designed to make healthier choices easier."),
|
|
8000
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8001
8001
|
"form",
|
|
8002
8002
|
{
|
|
8003
8003
|
onSubmit: handleSearch,
|
|
8004
8004
|
className: "mx-auto max-w-2xl md:mx-0"
|
|
8005
8005
|
},
|
|
8006
|
-
/* @__PURE__ */
|
|
8006
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8007
8007
|
"input",
|
|
8008
8008
|
{
|
|
8009
8009
|
type: "search",
|
|
@@ -8014,17 +8014,17 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8014
8014
|
className: "flex h-12 w-full rounded-xl border border-white/20 bg-white/10 px-4 py-2 pr-14 text-lg text-white placeholder-white/60 shadow-2xl shadow-primary-900/20 backdrop-blur focus:border-white/30 focus:outline-none focus:ring-2 focus:ring-white/20 disabled:opacity-50",
|
|
8015
8015
|
disabled: isSearching
|
|
8016
8016
|
}
|
|
8017
|
-
), /* @__PURE__ */
|
|
8017
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8018
8018
|
"button",
|
|
8019
8019
|
{
|
|
8020
8020
|
type: "submit",
|
|
8021
8021
|
className: "absolute right-2 top-1/2 -translate-y-1/2 rounded-xl bg-white/20 p-3 text-white transition hover:bg-white/30 disabled:opacity-50",
|
|
8022
8022
|
disabled: !searchQuery.trim() || isSearching
|
|
8023
8023
|
},
|
|
8024
|
-
isSearching ? /* @__PURE__ */
|
|
8024
|
+
isSearching ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-5 w-5 animate-spin rounded-full border-2 border-white border-t-transparent" }) : /* @__PURE__ */ React21__default.default.createElement(lucideReact.Search, { className: "h-5 w-5" })
|
|
8025
8025
|
))
|
|
8026
8026
|
)
|
|
8027
|
-
), /* @__PURE__ */
|
|
8027
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8028
8028
|
framerMotion.motion.div,
|
|
8029
8029
|
{
|
|
8030
8030
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8032,7 +8032,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8032
8032
|
transition: { delay: 0.15 },
|
|
8033
8033
|
className: "mt-12 flex flex-col gap-6 rounded-3xl border border-white/20 bg-white/10 p-6 backdrop-blur md:flex-row md:items-center md:justify-between"
|
|
8034
8034
|
},
|
|
8035
|
-
/* @__PURE__ */
|
|
8035
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.3em] text-white/60" }, "Explore popular searches"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2" }, quickSearches.map((term) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8036
8036
|
"button",
|
|
8037
8037
|
{
|
|
8038
8038
|
key: term,
|
|
@@ -8042,7 +8042,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8042
8042
|
},
|
|
8043
8043
|
term
|
|
8044
8044
|
)))),
|
|
8045
|
-
topCategories.length > 0 && /* @__PURE__ */
|
|
8045
|
+
topCategories.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3 md:text-right" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.3em] text-white/60" }, "Trending categories"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap justify-start gap-2 md:justify-end" }, topCategories.map((category) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8046
8046
|
"button",
|
|
8047
8047
|
{
|
|
8048
8048
|
key: category.id,
|
|
@@ -8052,9 +8052,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8052
8052
|
},
|
|
8053
8053
|
category.name
|
|
8054
8054
|
))))
|
|
8055
|
-
), /* @__PURE__ */
|
|
8055
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-10 grid gap-4 md:grid-cols-3" }, insightCards.map((card, index) => {
|
|
8056
8056
|
const Icon = card.icon;
|
|
8057
|
-
return /* @__PURE__ */
|
|
8057
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8058
8058
|
framerMotion.motion.div,
|
|
8059
8059
|
{
|
|
8060
8060
|
key: card.id,
|
|
@@ -8067,10 +8067,10 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8067
8067
|
"aria-pressed": card.id === "new" ? newArrivals ? "true" : "false" : void 0,
|
|
8068
8068
|
title: card.id === "new" ? newArrivals ? "Filter active: showing products from the last 30 days" : "Click to filter products from the last 30 days" : void 0
|
|
8069
8069
|
},
|
|
8070
|
-
/* @__PURE__ */
|
|
8071
|
-
/* @__PURE__ */
|
|
8070
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.3em] text-white/60" }, card.label), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-3xl font-semibold text-white" }, card.value)), /* @__PURE__ */ React21__default.default.createElement("span", { className: "rounded-full bg-white/20 p-3 text-white" }, /* @__PURE__ */ React21__default.default.createElement(Icon, { className: "h-5 w-5" }))),
|
|
8071
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm text-white/70" }, card.helper)
|
|
8072
8072
|
);
|
|
8073
|
-
})))), /* @__PURE__ */
|
|
8073
|
+
})))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative z-10 -mt-12 pb-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-8 lg:flex-row" }, /* @__PURE__ */ React21__default.default.createElement("aside", { className: "hidden w-72 flex-shrink-0 lg:block" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "sticky top-24 rounded-3xl border border-gray-100 bg-white p-6 shadow-xl shadow-gray-200/40" }, renderFiltersPanel())), /* @__PURE__ */ React21__default.default.createElement("main", { className: "flex-1 space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-gray-100 bg-white p-6 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-2xl font-bold text-gray-900" }, "All products"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-sm text-gray-500" }, "Browse a pharmacy-grade catalogue with smart merchandising and modern UI.")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-3 md:flex-row md:items-center" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowUpDown, { className: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" }), /* @__PURE__ */ React21__default.default.createElement(
|
|
8074
8074
|
"select",
|
|
8075
8075
|
{
|
|
8076
8076
|
value: sortOption,
|
|
@@ -8079,11 +8079,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8079
8079
|
},
|
|
8080
8080
|
className: "appearance-none rounded-xl border border-gray-200 bg-white py-2.5 pl-10 pr-9 text-sm font-medium text-gray-700 shadow-sm transition focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-500/30"
|
|
8081
8081
|
},
|
|
8082
|
-
/* @__PURE__ */
|
|
8083
|
-
/* @__PURE__ */
|
|
8084
|
-
/* @__PURE__ */
|
|
8085
|
-
/* @__PURE__ */
|
|
8086
|
-
), /* @__PURE__ */
|
|
8082
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "featured" }, "Featured products"),
|
|
8083
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "price-low-high" }, "Price: low to high"),
|
|
8084
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "price-high-low" }, "Price: high to low"),
|
|
8085
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "newest" }, "Newest arrivals")
|
|
8086
|
+
), /* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronDown, { className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center rounded-xl border border-gray-200 bg-white shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8087
8087
|
"button",
|
|
8088
8088
|
{
|
|
8089
8089
|
type: "button",
|
|
@@ -8091,9 +8091,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8091
8091
|
className: `flex items-center gap-2 rounded-l-xl px-4 py-2 text-sm font-medium transition ${viewMode === "grid" ? "bg-primary-50 text-primary-600" : "text-gray-500 hover:text-gray-700"}`,
|
|
8092
8092
|
"aria-pressed": viewMode === "grid"
|
|
8093
8093
|
},
|
|
8094
|
-
/* @__PURE__ */
|
|
8094
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LayoutGrid, { className: "h-4 w-4" }),
|
|
8095
8095
|
"Grid"
|
|
8096
|
-
), /* @__PURE__ */
|
|
8096
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8097
8097
|
"button",
|
|
8098
8098
|
{
|
|
8099
8099
|
type: "button",
|
|
@@ -8101,19 +8101,19 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8101
8101
|
className: `flex items-center gap-2 rounded-r-xl px-4 py-2 text-sm font-medium transition ${viewMode === "list" ? "bg-primary-50 text-primary-600" : "text-gray-500 hover:text-gray-700"}`,
|
|
8102
8102
|
"aria-pressed": viewMode === "list"
|
|
8103
8103
|
},
|
|
8104
|
-
/* @__PURE__ */
|
|
8104
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LayoutList, { className: "h-4 w-4" }),
|
|
8105
8105
|
"List"
|
|
8106
|
-
)))), /* @__PURE__ */
|
|
8106
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 md:hidden" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8107
8107
|
Button,
|
|
8108
8108
|
{
|
|
8109
8109
|
variant: "outline",
|
|
8110
8110
|
className: "w-full",
|
|
8111
8111
|
onClick: () => setShowFilters(true)
|
|
8112
8112
|
},
|
|
8113
|
-
/* @__PURE__ */
|
|
8113
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.SlidersHorizontal, { className: "h-5 w-5" }),
|
|
8114
8114
|
"Filters",
|
|
8115
|
-
hasActiveFilters && /* @__PURE__ */
|
|
8116
|
-
)), hasActiveFilters && /* @__PURE__ */
|
|
8115
|
+
hasActiveFilters && /* @__PURE__ */ React21__default.default.createElement("span", { className: "ml-2 rounded-full bg-primary-600 px-2 py-0.5 text-xs font-semibold text-white" }, activeFilterChips.length)
|
|
8116
|
+
)), hasActiveFilters && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 flex flex-wrap items-center gap-2 border-t border-gray-100 pt-4" }, activeFilterChips.map((chip) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8117
8117
|
"button",
|
|
8118
8118
|
{
|
|
8119
8119
|
key: chip.key,
|
|
@@ -8122,8 +8122,8 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8122
8122
|
className: "group flex items-center gap-2 rounded-full bg-primary-50 px-3 py-1.5 text-sm font-medium text-primary-700 transition hover:bg-primary-100"
|
|
8123
8123
|
},
|
|
8124
8124
|
chip.label,
|
|
8125
|
-
/* @__PURE__ */
|
|
8126
|
-
)), /* @__PURE__ */
|
|
8125
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "h-4 w-4 text-primary-500 group-hover:text-primary-700" })
|
|
8126
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
8127
8127
|
"button",
|
|
8128
8128
|
{
|
|
8129
8129
|
type: "button",
|
|
@@ -8131,7 +8131,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8131
8131
|
className: "text-sm font-semibold text-gray-500 hover:text-gray-700"
|
|
8132
8132
|
},
|
|
8133
8133
|
"Reset all"
|
|
8134
|
-
))), /* @__PURE__ */
|
|
8134
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-gray-100 bg-white p-6 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-3 text-sm text-gray-600 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, isLoading ? "Loading products..." : `Showing ${displayedProducts.length} of ${pagination.total || displayedProducts.length} products`), /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 text-gray-400" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Clock, { className: "h-4 w-4" }), "Updated a moment ago")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6" }, isLoading ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 gap-6 sm:grid-cols-2 xl:grid-cols-3" }, Array.from({ length: 6 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(ProductCardSkeleton, { key: index }))) : displayedProducts.length > 0 ? viewMode === "grid" ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 gap-6 sm:grid-cols-2 xl:grid-cols-3" }, displayedProducts.map((product) => /* @__PURE__ */ React21__default.default.createElement("div", { key: product.id, className: "h-full" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8135
8135
|
ProductCard,
|
|
8136
8136
|
{
|
|
8137
8137
|
product,
|
|
@@ -8140,11 +8140,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8140
8140
|
router.push(buildPath(`/products/${item.id}?product=${productData}`));
|
|
8141
8141
|
}
|
|
8142
8142
|
}
|
|
8143
|
-
)))) : /* @__PURE__ */
|
|
8143
|
+
)))) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, displayedProducts.map((product) => {
|
|
8144
8144
|
product.priceBeforeDiscount && product.priceBeforeDiscount > product.finalPrice ? Math.round(
|
|
8145
8145
|
(product.priceBeforeDiscount - product.finalPrice) / product.priceBeforeDiscount * 100
|
|
8146
8146
|
) : 0;
|
|
8147
|
-
return /* @__PURE__ */
|
|
8147
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8148
8148
|
framerMotion.motion.div,
|
|
8149
8149
|
{
|
|
8150
8150
|
key: product.id,
|
|
@@ -8152,7 +8152,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8152
8152
|
className: "group flex cursor-pointer flex-col gap-6 rounded-2xl border border-gray-100 bg-white p-5 shadow-sm transition hover:shadow-xl md:flex-row md:items-start",
|
|
8153
8153
|
onClick: () => router.push(buildPath(`/products/${product.id}`))
|
|
8154
8154
|
},
|
|
8155
|
-
/* @__PURE__ */
|
|
8155
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative h-48 w-full overflow-hidden rounded-2xl bg-gray-100 md:h-40 md:w-40" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8156
8156
|
Image3__default.default,
|
|
8157
8157
|
{
|
|
8158
8158
|
src: product.productMedia[0]?.file || "/placeholder-product.jpg",
|
|
@@ -8161,15 +8161,15 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8161
8161
|
className: "object-cover transition duration-500 group-hover:scale-105"
|
|
8162
8162
|
}
|
|
8163
8163
|
)),
|
|
8164
|
-
/* @__PURE__ */
|
|
8164
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-2 text-xs font-semibold uppercase tracking-wide text-primary-600" }, product.parentCategories.length > 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "rounded-full bg-primary-50 px-3 py-1 text-primary-700" }, product.parentCategories.map((category) => category?.name).join(", ")), product.tags?.slice(0, 3).map((tag) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8165
8165
|
"span",
|
|
8166
8166
|
{
|
|
8167
8167
|
key: tag,
|
|
8168
8168
|
className: "rounded-full bg-slate-100 px-3 py-1 text-gray-600"
|
|
8169
8169
|
},
|
|
8170
8170
|
tag
|
|
8171
|
-
))), /* @__PURE__ */
|
|
8172
|
-
/* @__PURE__ */
|
|
8171
|
+
))), /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-xl font-semibold text-gray-900" }, product.name), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-4 text-sm text-gray-500" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 font-medium text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-4 w-4" }), product.inventoryCount > 0 ? "In stock & ready to ship" : "Restocking soon"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Clock, { className: "h-4 w-4 text-primary-500" }), "Added ", new Date(product.createdAt).toLocaleDateString()))),
|
|
8172
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex w-full flex-col items-end gap-3 md:w-auto" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-right" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-3xl font-semibold text-gray-900" }, formatPrice(product.finalPrice)), product.priceBeforeDiscount && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-gray-400 line-through" }, formatPrice(product.priceBeforeDiscount))), /* @__PURE__ */ React21__default.default.createElement(
|
|
8173
8173
|
Button,
|
|
8174
8174
|
{
|
|
8175
8175
|
size: "sm",
|
|
@@ -8181,7 +8181,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8181
8181
|
"View product"
|
|
8182
8182
|
))
|
|
8183
8183
|
);
|
|
8184
|
-
})) : /* @__PURE__ */
|
|
8184
|
+
})) : /* @__PURE__ */ React21__default.default.createElement(
|
|
8185
8185
|
EmptyState,
|
|
8186
8186
|
{
|
|
8187
8187
|
icon: lucideReact.Package,
|
|
@@ -8190,7 +8190,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8190
8190
|
actionLabel: hasActiveFilters ? "Clear filters" : void 0,
|
|
8191
8191
|
onAction: hasActiveFilters ? handleClearFilters : void 0
|
|
8192
8192
|
}
|
|
8193
|
-
)), pagination.totalPages > 1 && /* @__PURE__ */
|
|
8193
|
+
)), pagination.totalPages > 1 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-10 flex flex-wrap items-center justify-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8194
8194
|
Button,
|
|
8195
8195
|
{
|
|
8196
8196
|
variant: "outline",
|
|
@@ -8198,7 +8198,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8198
8198
|
disabled: page === 1
|
|
8199
8199
|
},
|
|
8200
8200
|
"Previous"
|
|
8201
|
-
), /* @__PURE__ */
|
|
8201
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-semibold text-gray-600" }, "Page ", page, " of ", pagination.totalPages), /* @__PURE__ */ React21__default.default.createElement(
|
|
8202
8202
|
Button,
|
|
8203
8203
|
{
|
|
8204
8204
|
variant: "outline",
|
|
@@ -8206,7 +8206,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8206
8206
|
disabled: page === pagination.totalPages
|
|
8207
8207
|
},
|
|
8208
8208
|
"Next"
|
|
8209
|
-
))))))), /* @__PURE__ */
|
|
8209
|
+
))))))), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, showFilters && /* @__PURE__ */ React21__default.default.createElement(
|
|
8210
8210
|
framerMotion.motion.div,
|
|
8211
8211
|
{
|
|
8212
8212
|
initial: { opacity: 0 },
|
|
@@ -8214,7 +8214,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8214
8214
|
exit: { opacity: 0 },
|
|
8215
8215
|
className: "fixed inset-0 z-50 bg-black/40 backdrop-blur-sm lg:hidden"
|
|
8216
8216
|
},
|
|
8217
|
-
/* @__PURE__ */
|
|
8217
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8218
8218
|
framerMotion.motion.div,
|
|
8219
8219
|
{
|
|
8220
8220
|
initial: { y: "100%" },
|
|
@@ -8223,14 +8223,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8223
8223
|
transition: { type: "spring", stiffness: 260, damping: 26 },
|
|
8224
8224
|
className: "absolute inset-x-0 bottom-0 max-h-[85vh] overflow-y-auto rounded-t-3xl bg-white p-6 shadow-2xl"
|
|
8225
8225
|
},
|
|
8226
|
-
/* @__PURE__ */
|
|
8226
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mb-6 flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, "Filters"), /* @__PURE__ */ React21__default.default.createElement(
|
|
8227
8227
|
"button",
|
|
8228
8228
|
{
|
|
8229
8229
|
type: "button",
|
|
8230
8230
|
onClick: () => setShowFilters(false),
|
|
8231
8231
|
className: "rounded-full border border-gray-200 p-2 text-gray-500 hover:text-gray-700"
|
|
8232
8232
|
},
|
|
8233
|
-
/* @__PURE__ */
|
|
8233
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "h-4 w-4" })
|
|
8234
8234
|
)),
|
|
8235
8235
|
renderFiltersPanel()
|
|
8236
8236
|
)
|
|
@@ -8249,7 +8249,7 @@ function Badge({ children, variant = "primary", size = "md", className = "" }) {
|
|
|
8249
8249
|
sm: "px-2 py-1 text-xs",
|
|
8250
8250
|
md: "px-3 py-1 text-sm"
|
|
8251
8251
|
};
|
|
8252
|
-
return /* @__PURE__ */
|
|
8252
|
+
return /* @__PURE__ */ React21__default.default.createElement("span", { className: `inline-flex items-center font-medium rounded-full border ${variants[variant]} ${sizes[size]} ${className}` }, children);
|
|
8253
8253
|
}
|
|
8254
8254
|
var safeFormatDate = (date, format = "long") => {
|
|
8255
8255
|
if (!date) return "N/A";
|
|
@@ -8266,17 +8266,17 @@ function ProductDetailScreen({ productId }) {
|
|
|
8266
8266
|
const { buildPath } = useBasePath();
|
|
8267
8267
|
const { product: productData, isLoading } = useProduct(productId);
|
|
8268
8268
|
const { addToCart } = useCart();
|
|
8269
|
-
const [selectedVariant, setSelectedVariant] =
|
|
8270
|
-
const [quantity, setQuantity] =
|
|
8271
|
-
const [isAddingToCart, setIsAddingToCart] =
|
|
8272
|
-
const [isFavorited, setIsFavorited] =
|
|
8273
|
-
const [relatedProducts, setRelatedProducts] =
|
|
8274
|
-
const [initialProductData, setInitialProductData] =
|
|
8275
|
-
const [activeImageIndex, setActiveImageIndex] =
|
|
8276
|
-
|
|
8269
|
+
const [selectedVariant, setSelectedVariant] = React21.useState(null);
|
|
8270
|
+
const [quantity, setQuantity] = React21.useState(1);
|
|
8271
|
+
const [isAddingToCart, setIsAddingToCart] = React21.useState(false);
|
|
8272
|
+
const [isFavorited, setIsFavorited] = React21.useState(false);
|
|
8273
|
+
const [relatedProducts, setRelatedProducts] = React21.useState([]);
|
|
8274
|
+
const [initialProductData, setInitialProductData] = React21.useState(null);
|
|
8275
|
+
const [activeImageIndex, setActiveImageIndex] = React21.useState(0);
|
|
8276
|
+
React21.useEffect(() => {
|
|
8277
8277
|
setActiveImageIndex(0);
|
|
8278
8278
|
}, [selectedVariant]);
|
|
8279
|
-
const product =
|
|
8279
|
+
const product = React21.useMemo(() => {
|
|
8280
8280
|
if (initialProductData && !productData) {
|
|
8281
8281
|
return initialProductData;
|
|
8282
8282
|
}
|
|
@@ -8327,7 +8327,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8327
8327
|
);
|
|
8328
8328
|
const variantSku = currentVariant?.sku || product?.sku || "N/A";
|
|
8329
8329
|
const variantInStock = currentVariant?.inventoryCount > 0;
|
|
8330
|
-
|
|
8330
|
+
React21.useEffect(() => {
|
|
8331
8331
|
if (typeof window === "undefined") return;
|
|
8332
8332
|
const searchParams = new URLSearchParams(window.location.search);
|
|
8333
8333
|
const productParam = searchParams.get("product");
|
|
@@ -8340,13 +8340,13 @@ function ProductDetailScreen({ productId }) {
|
|
|
8340
8340
|
}
|
|
8341
8341
|
}
|
|
8342
8342
|
}, []);
|
|
8343
|
-
|
|
8343
|
+
React21.useEffect(() => {
|
|
8344
8344
|
if (product?.productVariants?.length > 0) {
|
|
8345
8345
|
const newVariant = product?.productVariants?.[0];
|
|
8346
8346
|
setSelectedVariant(newVariant);
|
|
8347
8347
|
}
|
|
8348
8348
|
}, [product?.productVariants]);
|
|
8349
|
-
|
|
8349
|
+
React21.useEffect(() => {
|
|
8350
8350
|
if (!product?.id) return;
|
|
8351
8351
|
const fetchRelated = async () => {
|
|
8352
8352
|
try {
|
|
@@ -8387,7 +8387,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8387
8387
|
}
|
|
8388
8388
|
};
|
|
8389
8389
|
const { addToWishlist, removeFromWishlist, isInWishlist } = useWishlist();
|
|
8390
|
-
|
|
8390
|
+
React21.useEffect(() => {
|
|
8391
8391
|
if (product) {
|
|
8392
8392
|
setIsFavorited(isInWishlist(product.id));
|
|
8393
8393
|
}
|
|
@@ -8409,10 +8409,10 @@ function ProductDetailScreen({ productId }) {
|
|
|
8409
8409
|
}
|
|
8410
8410
|
};
|
|
8411
8411
|
if (isLoading) {
|
|
8412
|
-
return /* @__PURE__ */
|
|
8412
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-10 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-[520px] animate-pulse rounded-3xl bg-slate-200" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-3 gap-4" }, Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement("div", { key: index, className: "h-32 animate-pulse rounded-2xl bg-slate-200" })))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4 rounded-3xl bg-white p-6 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-8 w-32 animate-pulse rounded-full bg-slate-200" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-10 w-48 animate-pulse rounded-full bg-slate-200" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-6 w-full animate-pulse rounded-full bg-slate-200" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-12 w-full animate-pulse rounded-2xl bg-slate-200" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-12 w-full animate-pulse rounded-2xl bg-slate-200" })))));
|
|
8413
8413
|
}
|
|
8414
8414
|
if (!product) {
|
|
8415
|
-
return /* @__PURE__ */
|
|
8415
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl bg-white p-10 text-center shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "mx-auto h-10 w-10 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "mt-6 text-2xl font-semibold text-gray-900" }, "Product not found"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-gray-600" }, "It may have been removed or is temporarily unavailable. Discover other pharmacy essentials in our catalogue."), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6" }, /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: "/shop", className: "inline-block" }, /* @__PURE__ */ React21__default.default.createElement(Button, null, "Browse products"))))));
|
|
8416
8416
|
}
|
|
8417
8417
|
product.tags && product.tags.length > 0 ? product.tags.slice(0, 6) : ["Pharmacist approved", "Gentle on daily routines", "Backed by real customers"];
|
|
8418
8418
|
const highlightCards = [
|
|
@@ -8432,29 +8432,29 @@ function ProductDetailScreen({ productId }) {
|
|
|
8432
8432
|
description: "Average rating 4.8/5 with over 120 verified customer experiences."
|
|
8433
8433
|
}
|
|
8434
8434
|
];
|
|
8435
|
-
return /* @__PURE__ */
|
|
8435
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white mb-8" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8436
8436
|
"div",
|
|
8437
8437
|
{
|
|
8438
8438
|
className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]",
|
|
8439
8439
|
"aria-hidden": "true"
|
|
8440
8440
|
}
|
|
8441
|
-
), /* @__PURE__ */
|
|
8441
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_bottom_right,_rgba(255,255,255,0.25),_transparent_55%)] opacity-70" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8442
8442
|
Button,
|
|
8443
8443
|
{
|
|
8444
8444
|
variant: "ghost",
|
|
8445
8445
|
className: "text-white hover:bg-white/10",
|
|
8446
8446
|
onClick: () => router.push(buildPath("/shop"))
|
|
8447
8447
|
},
|
|
8448
|
-
/* @__PURE__ */
|
|
8448
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowLeft, { className: "h-5 w-5" }),
|
|
8449
8449
|
"Continue shopping"
|
|
8450
|
-
), /* @__PURE__ */
|
|
8450
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "hidden items-center gap-3 text-sm text-white/80 md:flex" }, /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/"), className: "transition hover:text-white" }, "Home"), /* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronRight, { className: "h-4 w-4" }), /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/shop"), className: "transition hover:text-white" }, "Shop"), /* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronRight, { className: "h-4 w-4" }), /* @__PURE__ */ React21__default.default.createElement("span", { className: "truncate font-medium text-white" }, product.name))), /* @__PURE__ */ React21__default.default.createElement(
|
|
8451
8451
|
framerMotion.motion.div,
|
|
8452
8452
|
{
|
|
8453
8453
|
initial: { opacity: 0, y: 24 },
|
|
8454
8454
|
animate: { opacity: 1, y: 0 },
|
|
8455
8455
|
className: "max-w-3xl space-y-4"
|
|
8456
8456
|
},
|
|
8457
|
-
product.category && /* @__PURE__ */
|
|
8457
|
+
product.category && /* @__PURE__ */ React21__default.default.createElement(
|
|
8458
8458
|
Badge,
|
|
8459
8459
|
{
|
|
8460
8460
|
variant: "secondary",
|
|
@@ -8462,9 +8462,9 @@ function ProductDetailScreen({ productId }) {
|
|
|
8462
8462
|
},
|
|
8463
8463
|
product.category
|
|
8464
8464
|
),
|
|
8465
|
-
/* @__PURE__ */
|
|
8466
|
-
/* @__PURE__ */
|
|
8467
|
-
)))), /* @__PURE__ */
|
|
8465
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold leading-tight md:text-5xl" }, product.name),
|
|
8466
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-3 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/10 px-3 py-1 font-medium text-white" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4" }), "Ready to ship today"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/10 px-3 py-1 font-medium text-white" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Shield, { className: "h-4 w-4" }), "30-day happiness guarantee"))
|
|
8467
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-10 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-10" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "rounded-3xl border border-white bg-white/70 p-6 shadow-xl shadow-primary-100/40 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-6 lg:grid-cols-[minmax(0,1fr)_220px]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8468
8468
|
framerMotion.motion.div,
|
|
8469
8469
|
{
|
|
8470
8470
|
key: variantImages[activeImageIndex],
|
|
@@ -8473,7 +8473,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8473
8473
|
transition: { duration: 0.35 },
|
|
8474
8474
|
className: "relative overflow-hidden rounded-3xl bg-slate-100 h-[420px] md:h-[560px]"
|
|
8475
8475
|
},
|
|
8476
|
-
/* @__PURE__ */
|
|
8476
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8477
8477
|
Image3__default.default,
|
|
8478
8478
|
{
|
|
8479
8479
|
src: variantImages[activeImageIndex],
|
|
@@ -8484,7 +8484,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8484
8484
|
className: "object-contain"
|
|
8485
8485
|
}
|
|
8486
8486
|
),
|
|
8487
|
-
discount > 0 && /* @__PURE__ */
|
|
8487
|
+
discount > 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
8488
8488
|
Badge,
|
|
8489
8489
|
{
|
|
8490
8490
|
variant: "danger",
|
|
@@ -8494,7 +8494,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8494
8494
|
discount,
|
|
8495
8495
|
"%"
|
|
8496
8496
|
),
|
|
8497
|
-
!variantInStock && /* @__PURE__ */
|
|
8497
|
+
!variantInStock && /* @__PURE__ */ React21__default.default.createElement(
|
|
8498
8498
|
Badge,
|
|
8499
8499
|
{
|
|
8500
8500
|
variant: "secondary",
|
|
@@ -8502,7 +8502,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8502
8502
|
},
|
|
8503
8503
|
"Out of Stock"
|
|
8504
8504
|
)
|
|
8505
|
-
), /* @__PURE__ */
|
|
8505
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4" }, product?.productVariants?.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "mb-2 text-sm font-semibold uppercase tracking-[0.25em] text-slate-400" }, "Variant"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2" }, product?.productVariants?.map((variant, index) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8506
8506
|
"button",
|
|
8507
8507
|
{
|
|
8508
8508
|
key: variant.id,
|
|
@@ -8511,7 +8511,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8511
8511
|
className: `rounded-full px-4 py-2 text-sm font-medium transition ${selectedVariant?.id === variant.id ? "bg-primary-600 text-white" : "bg-slate-100 text-slate-700 hover:bg-slate-200"}`
|
|
8512
8512
|
},
|
|
8513
8513
|
variant.name
|
|
8514
|
-
)))), /* @__PURE__ */
|
|
8514
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-3 gap-3" }, variantImages.map((image, index) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8515
8515
|
"button",
|
|
8516
8516
|
{
|
|
8517
8517
|
key: image.src + index,
|
|
@@ -8519,7 +8519,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8519
8519
|
onClick: () => setActiveImageIndex(index),
|
|
8520
8520
|
className: `relative aspect-square overflow-hidden rounded-2xl border transition ${activeImageIndex === index ? "border-primary-500 shadow-lg shadow-primary-200/60" : "border-transparent hover:border-primary-200"}`
|
|
8521
8521
|
},
|
|
8522
|
-
/* @__PURE__ */
|
|
8522
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8523
8523
|
Image3__default.default,
|
|
8524
8524
|
{
|
|
8525
8525
|
src: image.src,
|
|
@@ -8530,18 +8530,18 @@ function ProductDetailScreen({ productId }) {
|
|
|
8530
8530
|
unoptimized: true
|
|
8531
8531
|
}
|
|
8532
8532
|
)
|
|
8533
|
-
)))))), /* @__PURE__ */
|
|
8533
|
+
)))))), /* @__PURE__ */ React21__default.default.createElement("section", { className: "grid gap-6 lg:grid-cols-3" }, highlightCards.map((card) => {
|
|
8534
8534
|
const Icon = card.icon;
|
|
8535
|
-
return /* @__PURE__ */
|
|
8535
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8536
8536
|
"div",
|
|
8537
8537
|
{
|
|
8538
8538
|
key: card.title,
|
|
8539
8539
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-sm transition hover:-translate-y-1 hover:shadow-lg"
|
|
8540
8540
|
},
|
|
8541
|
-
/* @__PURE__ */
|
|
8542
|
-
/* @__PURE__ */
|
|
8541
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "rounded-2xl bg-primary-50 p-3 text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(Icon, { className: "h-5 w-5" })), /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-base font-semibold text-slate-900" }, card.title)),
|
|
8542
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm leading-relaxed text-slate-600" }, card.description)
|
|
8543
8543
|
);
|
|
8544
|
-
})), /* @__PURE__ */
|
|
8544
|
+
})), /* @__PURE__ */ React21__default.default.createElement("section", { className: "grid gap-6 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-8 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-4 pb-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-1 text-amber-500" }, Array.from({ length: 5 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(lucideReact.Star, { key: index, className: "h-4 w-4 fill-current" }))), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-medium text-slate-500" }, "Rated 4.8 \u2022 Patients love the results")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-8" }, product.description && /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-slate-900" }, "Description"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-base leading-relaxed text-slate-600", dangerouslySetInnerHTML: { __html: product.description } })))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-full rounded-3xl border border-slate-100 bg-gradient-to-br from-primary-50 via-white to-secondary-50 p-8 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-sm font-semibold uppercase tracking-[0.3em] text-primary-500" }, "Care tips"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 space-y-4 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "leading-relaxed" }, "Store in a cool, dry place away from direct sunlight. Check packaging for allergen statements."), /* @__PURE__ */ React21__default.default.createElement("p", { className: "leading-relaxed" }, "Consult with your local pharmacist if you are combining with other treatments or have chronic conditions."), /* @__PURE__ */ React21__default.default.createElement("p", { className: "rounded-2xl bg-white/60 p-4 leading-relaxed text-primary-700" }, "Questions? Our care team is on standby \u2014 reach us via chat for tailored support before you checkout.")))), /* @__PURE__ */ React21__default.default.createElement("section", { className: "rounded-3xl border border-slate-100 bg-white p-8 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-xl font-semibold text-slate-900" }, "Product insights"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 grid gap-6 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-2xl border border-slate-200 bg-slate-50/60 p-5" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs font-semibold uppercase tracking-[0.3em] text-slate-500" }, "Availability"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-3 flex items-center gap-2 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "h-4 w-4 text-primary-500" }), product.inStock ? "Available for dispatch today" : "Currently restocking"), product.stock !== void 0 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-xs text-slate-500" }, product.stock > 0 ? `${product.stock} units remaining in inventory` : "Join the waitlist to be notified first")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-2xl border border-slate-200 bg-slate-50/60 p-5" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs font-semibold uppercase tracking-[0.3em] text-slate-500" }, "Product details"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-3 space-y-2 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("p", null, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium text-slate-700" }, "Variant:"), " ", currentVariant.name), /* @__PURE__ */ React21__default.default.createElement("p", null, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium text-slate-700" }, "SKU:"), " ", variantSku), /* @__PURE__ */ React21__default.default.createElement("p", null, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium text-slate-700" }, "Status:"), " ", /* @__PURE__ */ React21__default.default.createElement("span", { className: variantInStock ? "text-green-600" : "text-amber-600" }, variantInStock ? "In Stock" : "Out of Stock")), /* @__PURE__ */ React21__default.default.createElement("p", null, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium text-slate-700" }, "Last updated:"), " ", lastUpdatedLabel), /* @__PURE__ */ React21__default.default.createElement("p", null, /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-medium text-slate-700" }, "Ships from:"), " Local pharmacy distribution center")))))), /* @__PURE__ */ React21__default.default.createElement("aside", { className: "space-y-6 lg:sticky lg:top-24" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-8 shadow-lg shadow-primary-100/40" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-baseline gap-3" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-3xl font-bold text-slate-900" }, selectedVariant ? formatPrice(selectedVariant.finalPrice) : formatPrice(product.price)), variantComparePrice && variantComparePrice > variantPrice && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-base text-slate-400 line-through" }, formatPrice(variantComparePrice)), discount > 0 && /* @__PURE__ */ React21__default.default.createElement(Badge, { variant: "danger", size: "sm" }, "-", discount, "%")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3 rounded-2xl bg-primary-50/80 px-4 py-3 text-sm font-medium text-primary-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-4 w-4" }), "Pharmacist verified product"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between rounded-2xl border border-slate-200 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-medium text-slate-600" }, "Qty"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center rounded-full border border-slate-200 bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8545
8545
|
"button",
|
|
8546
8546
|
{
|
|
8547
8547
|
type: "button",
|
|
@@ -8549,8 +8549,8 @@ function ProductDetailScreen({ productId }) {
|
|
|
8549
8549
|
className: "rounded-l-full p-2 hover:bg-primary-100/60",
|
|
8550
8550
|
"aria-label": "Decrease quantity"
|
|
8551
8551
|
},
|
|
8552
|
-
/* @__PURE__ */
|
|
8553
|
-
), /* @__PURE__ */
|
|
8552
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Minus, { className: "h-4 w-4" })
|
|
8553
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "w-12 text-center text-sm font-semibold text-slate-700" }, quantity), /* @__PURE__ */ React21__default.default.createElement(
|
|
8554
8554
|
"button",
|
|
8555
8555
|
{
|
|
8556
8556
|
type: "button",
|
|
@@ -8558,8 +8558,8 @@ function ProductDetailScreen({ productId }) {
|
|
|
8558
8558
|
className: "rounded-r-full p-2 hover:bg-primary-100/60",
|
|
8559
8559
|
"aria-label": "Increase quantity"
|
|
8560
8560
|
},
|
|
8561
|
-
/* @__PURE__ */
|
|
8562
|
-
)))), selectedVariant && /* @__PURE__ */
|
|
8561
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "h-4 w-4" })
|
|
8562
|
+
)))), selectedVariant && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 text-sm" }, selectedVariant.inventoryStatus === "OUT_OF_STOCK" /* OUTOFSTOCK */ || selectedVariant.inventoryStatus === "LOW_STOCK" /* LOWSTOCK */ ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-red-600 font-medium" }, "Out of Stock") : /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-green-600 font-medium" }, "In Stock")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 space-x-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8563
8563
|
Button,
|
|
8564
8564
|
{
|
|
8565
8565
|
size: "lg",
|
|
@@ -8568,9 +8568,9 @@ function ProductDetailScreen({ productId }) {
|
|
|
8568
8568
|
isLoading: isAddingToCart,
|
|
8569
8569
|
disabled: !selectedVariant || selectedVariant.inventoryStatus === "OUT_OF_STOCK" /* OUTOFSTOCK */
|
|
8570
8570
|
},
|
|
8571
|
-
/* @__PURE__ */
|
|
8571
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ShoppingCart, { className: "h-5 w-5" }),
|
|
8572
8572
|
!selectedVariant ? "Select a variant" : selectedVariant.inventoryStatus === "OUT_OF_STOCK" /* OUTOFSTOCK */ ? "Out of Stock" : `Add to Cart`
|
|
8573
|
-
), /* @__PURE__ */
|
|
8573
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8574
8574
|
Button,
|
|
8575
8575
|
{
|
|
8576
8576
|
size: "lg",
|
|
@@ -8578,18 +8578,18 @@ function ProductDetailScreen({ productId }) {
|
|
|
8578
8578
|
className: "w-full",
|
|
8579
8579
|
onClick: handleToggleFavorite
|
|
8580
8580
|
},
|
|
8581
|
-
/* @__PURE__ */
|
|
8581
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8582
8582
|
lucideReact.Heart,
|
|
8583
8583
|
{
|
|
8584
8584
|
className: `h-5 w-5 ${isFavorited ? "fill-red-500 text-red-500" : "text-slate-500"}`
|
|
8585
8585
|
}
|
|
8586
8586
|
),
|
|
8587
8587
|
isFavorited ? "Saved" : "Save for later"
|
|
8588
|
-
))), /* @__PURE__ */
|
|
8588
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-primary-100 bg-primary-50/70 p-6 text-sm text-primary-700 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold uppercase tracking-[0.25em]" }, "Need advice?"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 leading-relaxed" }, "Chat with a pharmacist in real time before completing your purchase. We will help you choose supporting supplements and answer dosing questions.")))), relatedProducts.length > 0 && /* @__PURE__ */ React21__default.default.createElement("section", { className: "mt-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-2xl font-semibold text-slate-900" }, "You may also like"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-sm text-slate-500" }, "Hand-picked recommendations that pair nicely with this product.")), /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: "/shop", className: "hidden md:inline-flex" }, /* @__PURE__ */ React21__default.default.createElement(Button, { variant: "ghost", className: "text-primary-600" }, "View all products"))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 grid gap-6 sm:grid-cols-2 lg:grid-cols-4" }, relatedProducts?.map((relatedProduct) => /* @__PURE__ */ React21__default.default.createElement(ProductCard, { key: relatedProduct.id, product: relatedProduct })))))));
|
|
8589
8589
|
}
|
|
8590
8590
|
function CartItem({ item }) {
|
|
8591
8591
|
const { updateQuantity, removeFromCart } = useCart();
|
|
8592
|
-
const [isUpdating, setIsUpdating] =
|
|
8592
|
+
const [isUpdating, setIsUpdating] = React21.useState(false);
|
|
8593
8593
|
const handleUpdateQuantity = async (newQuantity) => {
|
|
8594
8594
|
if (newQuantity < 1) return;
|
|
8595
8595
|
setIsUpdating(true);
|
|
@@ -8603,7 +8603,7 @@ function CartItem({ item }) {
|
|
|
8603
8603
|
await removeFromCart(item.productVariantId);
|
|
8604
8604
|
};
|
|
8605
8605
|
const itemTotal = item.productVariantData.finalPrice * item.quantity;
|
|
8606
|
-
return /* @__PURE__ */
|
|
8606
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8607
8607
|
framerMotion.motion.div,
|
|
8608
8608
|
{
|
|
8609
8609
|
layout: true,
|
|
@@ -8612,7 +8612,7 @@ function CartItem({ item }) {
|
|
|
8612
8612
|
exit: { opacity: 0, x: -100 },
|
|
8613
8613
|
className: "flex gap-4 bg-white p-4 rounded-xl border border-gray-200 hover:border-primary-300 transition-colors"
|
|
8614
8614
|
},
|
|
8615
|
-
/* @__PURE__ */
|
|
8615
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative w-24 h-24 rounded-lg overflow-hidden flex-shrink-0 bg-gray-100" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8616
8616
|
Image3__default.default,
|
|
8617
8617
|
{
|
|
8618
8618
|
src: item.productVariantData.productMedia[0]?.file || "/placeholder-product.jpg",
|
|
@@ -8621,32 +8621,32 @@ function CartItem({ item }) {
|
|
|
8621
8621
|
className: "object-cover"
|
|
8622
8622
|
}
|
|
8623
8623
|
)),
|
|
8624
|
-
/* @__PURE__ */
|
|
8624
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900 truncate" }, item.productVariantData.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-gray-500 mt-1" }, formatPrice(item.productVariantData.finalPrice), " each"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3 mt-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center border-2 border-gray-200 rounded-lg" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8625
8625
|
"button",
|
|
8626
8626
|
{
|
|
8627
8627
|
onClick: () => handleUpdateQuantity(item.quantity - 1),
|
|
8628
8628
|
disabled: isUpdating || item.quantity <= 0,
|
|
8629
8629
|
className: "p-2 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
|
|
8630
8630
|
},
|
|
8631
|
-
/* @__PURE__ */
|
|
8632
|
-
), /* @__PURE__ */
|
|
8631
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Minus, { className: "w-4 h-4" })
|
|
8632
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "px-4 font-medium min-w-[3rem] text-center" }, isUpdating ? /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-block h-4 w-4 align-middle animate-spin rounded-full border-2 border-gray-300 border-t-gray-600" }) : item.quantity), /* @__PURE__ */ React21__default.default.createElement(
|
|
8633
8633
|
"button",
|
|
8634
8634
|
{
|
|
8635
8635
|
onClick: () => handleUpdateQuantity(item.quantity + 1),
|
|
8636
8636
|
disabled: isUpdating || item.quantity >= item.productVariantData.inventoryCount,
|
|
8637
8637
|
className: "p-2 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
|
|
8638
8638
|
},
|
|
8639
|
-
/* @__PURE__ */
|
|
8640
|
-
)), /* @__PURE__ */
|
|
8639
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "w-4 h-4" })
|
|
8640
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
8641
8641
|
"button",
|
|
8642
8642
|
{
|
|
8643
8643
|
onClick: handleRemove,
|
|
8644
8644
|
className: "p-2 text-red-600 hover:bg-red-50 rounded-lg transition-colors",
|
|
8645
8645
|
"aria-label": "Remove item"
|
|
8646
8646
|
},
|
|
8647
|
-
/* @__PURE__ */
|
|
8647
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "w-5 h-5" })
|
|
8648
8648
|
))),
|
|
8649
|
-
/* @__PURE__ */
|
|
8649
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "text-right" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xl font-bold text-gray-900" }, formatPrice(itemTotal)))
|
|
8650
8650
|
);
|
|
8651
8651
|
}
|
|
8652
8652
|
function CartScreen() {
|
|
@@ -8654,31 +8654,101 @@ function CartScreen() {
|
|
|
8654
8654
|
const { cart, isLoading } = useCart();
|
|
8655
8655
|
const { buildPath } = useBasePath();
|
|
8656
8656
|
if (!cart || cart.cartBody.items.length === 0) {
|
|
8657
|
-
|
|
8658
|
-
EmptyState,
|
|
8657
|
+
const highlights = [
|
|
8659
8658
|
{
|
|
8660
|
-
icon: lucideReact.
|
|
8661
|
-
title: "
|
|
8662
|
-
description: "
|
|
8663
|
-
|
|
8664
|
-
|
|
8659
|
+
icon: lucideReact.ShieldCheck,
|
|
8660
|
+
title: "Pharmacist approved",
|
|
8661
|
+
description: "Every product passes pharmacist review and cold-chain handling standards."
|
|
8662
|
+
},
|
|
8663
|
+
{
|
|
8664
|
+
icon: lucideReact.BadgePercent,
|
|
8665
|
+
title: "Bundle savings",
|
|
8666
|
+
description: "Unlock tiered discounts when you combine vitamins, OTC, and wellness kits."
|
|
8667
|
+
},
|
|
8668
|
+
{
|
|
8669
|
+
icon: lucideReact.HeartPulse,
|
|
8670
|
+
title: "Personalized guidance",
|
|
8671
|
+
description: "Follow curated collections tailored to your health goals and routines."
|
|
8665
8672
|
}
|
|
8666
|
-
|
|
8673
|
+
];
|
|
8674
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative min-h-screen overflow-hidden bg-slate-950" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "pointer-events-none absolute -top-24 -left-20 h-96 w-96 rounded-full bg-white/20 blur-3xl opacity-60" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "pointer-events-none absolute bottom-0 right-0 h-[28rem] w-[28rem] rounded-full bg-secondary-500/40 blur-[220px] opacity-70" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative z-10 flex min-h-screen items-center px-6 py-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "mx-auto grid w-full max-w-6xl gap-12 lg:grid-cols-[minmax(0,1.25fr)_minmax(0,1fr)] lg:items-center" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8675
|
+
framerMotion.motion.div,
|
|
8676
|
+
{
|
|
8677
|
+
initial: { opacity: 0, y: 24 },
|
|
8678
|
+
animate: { opacity: 1, y: 0 },
|
|
8679
|
+
transition: { duration: 0.4 },
|
|
8680
|
+
className: "space-y-8 text-white"
|
|
8681
|
+
},
|
|
8682
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-1 text-sm font-semibold uppercase tracking-[0.3em] text-white/80 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShoppingBag, { className: "h-4 w-4" }), "Cart status"),
|
|
8683
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Your wellness cart is waiting for a refill"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-xl text-lg text-white/75" }, "Build a pharmacist-curated bundle with fast shipping, personalized recommendations, and exclusive member perks designed to keep you feeling your best.")),
|
|
8684
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8685
|
+
Button,
|
|
8686
|
+
{
|
|
8687
|
+
size: "lg",
|
|
8688
|
+
className: "bg-white text-primary-700 shadow-xl shadow-white/30 hover:bg-white/90 hover:text-primary-700",
|
|
8689
|
+
onClick: () => router.push(buildPath("/shop"))
|
|
8690
|
+
},
|
|
8691
|
+
"Discover products",
|
|
8692
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-5 w-5" })
|
|
8693
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8694
|
+
"button",
|
|
8695
|
+
{
|
|
8696
|
+
type: "button",
|
|
8697
|
+
onClick: () => router.push(buildPath("/categories")),
|
|
8698
|
+
className: "inline-flex items-center gap-2 rounded-full border border-white/40 px-5 py-3 text-sm font-semibold text-white/80 transition hover:border-white hover:bg-white/10"
|
|
8699
|
+
},
|
|
8700
|
+
"Browse categories",
|
|
8701
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-4 w-4" })
|
|
8702
|
+
)),
|
|
8703
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 sm:grid-cols-2" }, highlights.map(({ icon: Icon, title, description }) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8704
|
+
"div",
|
|
8705
|
+
{
|
|
8706
|
+
key: title,
|
|
8707
|
+
className: "rounded-2xl border border-white/15 bg-white/10 p-5 backdrop-blur transition hover:border-white/25 hover:bg-white/15"
|
|
8708
|
+
},
|
|
8709
|
+
/* @__PURE__ */ React21__default.default.createElement(Icon, { className: "h-6 w-6 text-white/90" }),
|
|
8710
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm font-semibold text-white" }, title),
|
|
8711
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-xs text-white/70" }, description)
|
|
8712
|
+
)))
|
|
8713
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8714
|
+
framerMotion.motion.div,
|
|
8715
|
+
{
|
|
8716
|
+
initial: { opacity: 0, y: 24 },
|
|
8717
|
+
animate: { opacity: 1, y: 0 },
|
|
8718
|
+
transition: { delay: 0.1, duration: 0.4 },
|
|
8719
|
+
className: "rounded-[32px] border border-white/10 bg-white/10 p-10 backdrop-blur-2xl shadow-[0_40px_120px_-45px_rgba(12,5,40,0.6)]"
|
|
8720
|
+
},
|
|
8721
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex h-16 w-16 items-center justify-center rounded-2xl bg-white/20" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShoppingBag, { className: "h-8 w-8 text-white" })),
|
|
8722
|
+
/* @__PURE__ */ React21__default.default.createElement("h2", { className: "mt-6 text-3xl font-semibold text-white" }, "Still building your bag?"),
|
|
8723
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm text-white/80" }, "Add supplements, wellness tools, and everyday pharmacy favorites to personalize your routine. We'll keep them chilled, curated, and ready for doorstep delivery."),
|
|
8724
|
+
/* @__PURE__ */ React21__default.default.createElement("ul", { className: "mt-6 space-y-3 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-center gap-2 rounded-xl bg-white/10 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-5 w-5 text-white" }), "Pharmacist oversight on every order"), /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-center gap-2 rounded-xl bg-white/10 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.BadgePercent, { className: "h-5 w-5 text-white" }), "Member-only savings unlock at checkout"), /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-center gap-2 rounded-xl bg-white/10 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.HeartPulse, { className: "h-5 w-5 text-white" }), "Personalized care plans for each purchase")),
|
|
8725
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8726
|
+
Button,
|
|
8727
|
+
{
|
|
8728
|
+
size: "lg",
|
|
8729
|
+
variant: "outline",
|
|
8730
|
+
className: "mt-8 w-full border-white/40 text-white hover:border-white hover:bg-white/10",
|
|
8731
|
+
onClick: () => router.push(buildPath("/shop"))
|
|
8732
|
+
},
|
|
8733
|
+
"Start building my cart",
|
|
8734
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-5 w-5" })
|
|
8735
|
+
)
|
|
8736
|
+
))));
|
|
8667
8737
|
}
|
|
8668
8738
|
const subtotal = cart.total;
|
|
8669
8739
|
const shipping = 0;
|
|
8670
8740
|
const tax = 0;
|
|
8671
8741
|
const total = subtotal + shipping + tax;
|
|
8672
|
-
return /* @__PURE__ */
|
|
8742
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16 mb-8" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8673
8743
|
framerMotion.motion.div,
|
|
8674
8744
|
{
|
|
8675
8745
|
initial: { opacity: 0, y: 24 },
|
|
8676
8746
|
animate: { opacity: 1, y: 0 },
|
|
8677
8747
|
className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between"
|
|
8678
8748
|
},
|
|
8679
|
-
/* @__PURE__ */
|
|
8680
|
-
/* @__PURE__ */
|
|
8681
|
-
))), /* @__PURE__ */
|
|
8749
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "max-w-2xl space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold tracking-wide text-white/80 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.HeartPulse, { className: "h-4 w-4" }), "Wellness essentials, ready when you are"), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Your curated cart"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-white/75 md:text-lg" }, "Review your selections, unlock exclusive perks, and check out with pharmacist-backed confidence.")),
|
|
8750
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl bg-white/15 p-6 backdrop-blur-md" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.35em] text-white/70" }, "Cart summary"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-4 text-4xl font-semibold" }, formatPrice(total)), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-white/70" }, "Taxes and shipping calculated below"))
|
|
8751
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-10 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8682
8752
|
framerMotion.motion.section,
|
|
8683
8753
|
{
|
|
8684
8754
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8686,10 +8756,10 @@ function CartScreen() {
|
|
|
8686
8756
|
transition: { delay: 0.05 },
|
|
8687
8757
|
className: "space-y-6 rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
8688
8758
|
},
|
|
8689
|
-
/* @__PURE__ */
|
|
8690
|
-
isLoading && /* @__PURE__ */
|
|
8691
|
-
/* @__PURE__ */
|
|
8692
|
-
), /* @__PURE__ */
|
|
8759
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center justify-between gap-4" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-xl font-semibold text-slate-900" }, "Items (", cart.cartBody.items.length, ")"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "inline-flex items-center gap-2 rounded-full bg-primary-50 px-3 py-1 text-xs font-semibold uppercase tracking-wide text-primary-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-4 w-4" }), "Guaranteed cold-chain handling")),
|
|
8760
|
+
isLoading && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2 rounded-xl border border-slate-200 bg-slate-50 px-3 py-2 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-block h-3 w-3 animate-spin rounded-full border-2 border-slate-300 border-t-slate-600" }), "Updating cart\u2026"),
|
|
8761
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-5" }, cart.cartBody.items.map((item) => /* @__PURE__ */ React21__default.default.createElement(CartItem, { key: item.productVariantId, item })))
|
|
8762
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8693
8763
|
framerMotion.motion.aside,
|
|
8694
8764
|
{
|
|
8695
8765
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8697,7 +8767,7 @@ function CartScreen() {
|
|
|
8697
8767
|
transition: { delay: 0.1 },
|
|
8698
8768
|
className: "space-y-6 lg:sticky lg:top-28"
|
|
8699
8769
|
},
|
|
8700
|
-
/* @__PURE__ */
|
|
8770
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-xl font-semibold text-slate-900" }, "Checkout summary"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-1 rounded-full bg-primary-50 px-3 py-1 text-xs font-semibold text-primary-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.BadgePercent, { className: "h-4 w-4" }), "Savings applied")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 space-y-4 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Subtotal"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold text-slate-900" }, formatPrice(subtotal))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Shipping"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold" }, "Will be calculated at checkout")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-2xl bg-slate-50 p-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between text-base font-semibold text-slate-900" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Order total"), /* @__PURE__ */ React21__default.default.createElement("span", null, formatPrice(total))), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-xs text-slate-500" }, "Prices include pharmacy-grade quality control and packaging."))), /* @__PURE__ */ React21__default.default.createElement(
|
|
8701
8771
|
Button,
|
|
8702
8772
|
{
|
|
8703
8773
|
size: "lg",
|
|
@@ -8705,8 +8775,8 @@ function CartScreen() {
|
|
|
8705
8775
|
onClick: () => router.push(buildPath("/checkout"))
|
|
8706
8776
|
},
|
|
8707
8777
|
"Secure checkout",
|
|
8708
|
-
/* @__PURE__ */
|
|
8709
|
-
), /* @__PURE__ */
|
|
8778
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-5 w-5" })
|
|
8779
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8710
8780
|
"button",
|
|
8711
8781
|
{
|
|
8712
8782
|
type: "button",
|
|
@@ -8715,24 +8785,24 @@ function CartScreen() {
|
|
|
8715
8785
|
},
|
|
8716
8786
|
"Continue shopping"
|
|
8717
8787
|
)),
|
|
8718
|
-
/* @__PURE__ */
|
|
8788
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-primary-100 bg-primary-50/70 p-6 text-sm text-primary-700 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold uppercase tracking-[0.3em]" }, "Need help?"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 leading-relaxed" }, "Chat with a pharmacist to optimize your regimen or discuss substitutions before you check out."))
|
|
8719
8789
|
)))));
|
|
8720
8790
|
}
|
|
8721
8791
|
function useAddresses() {
|
|
8722
|
-
const [addresses, setAddresses] =
|
|
8723
|
-
const [isLoading, setIsLoading] =
|
|
8724
|
-
const [error, setError] =
|
|
8725
|
-
const refresh =
|
|
8792
|
+
const [addresses, setAddresses] = React21.useState([]);
|
|
8793
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
8794
|
+
const [error, setError] = React21.useState(null);
|
|
8795
|
+
const refresh = React21.useCallback(async () => {
|
|
8726
8796
|
setIsLoading(true);
|
|
8727
8797
|
setError(null);
|
|
8728
8798
|
const response = await new AddressesApi(AXIOS_CONFIG).getMyAddresses();
|
|
8729
8799
|
setAddresses(response.data || []);
|
|
8730
8800
|
setIsLoading(false);
|
|
8731
8801
|
}, []);
|
|
8732
|
-
|
|
8802
|
+
React21.useEffect(() => {
|
|
8733
8803
|
refresh();
|
|
8734
8804
|
}, [refresh]);
|
|
8735
|
-
const sortedAddresses =
|
|
8805
|
+
const sortedAddresses = React21.useMemo(() => {
|
|
8736
8806
|
return [...addresses].sort((a, b) => {
|
|
8737
8807
|
if (a.isDefault === b.isDefault) {
|
|
8738
8808
|
return (b.updatedAt.toISOString() || "").localeCompare(a.updatedAt.toISOString() || "");
|
|
@@ -8740,26 +8810,26 @@ function useAddresses() {
|
|
|
8740
8810
|
return a.isDefault ? -1 : 1;
|
|
8741
8811
|
});
|
|
8742
8812
|
}, [addresses]);
|
|
8743
|
-
const defaultAddress =
|
|
8813
|
+
const defaultAddress = React21.useMemo(
|
|
8744
8814
|
() => sortedAddresses.find((address) => address.isDefault) || null,
|
|
8745
8815
|
[sortedAddresses]
|
|
8746
8816
|
);
|
|
8747
|
-
const addAddress =
|
|
8817
|
+
const addAddress = React21.useCallback(async (payload) => {
|
|
8748
8818
|
const response = await new AddressesApi(AXIOS_CONFIG).createAddressForUser(payload);
|
|
8749
8819
|
setAddresses((prev) => [...prev, response.data]);
|
|
8750
8820
|
return response.data;
|
|
8751
8821
|
}, []);
|
|
8752
|
-
const updateAddress =
|
|
8822
|
+
const updateAddress = React21.useCallback(async (id, payload) => {
|
|
8753
8823
|
const response = await new AddressesApi(AXIOS_CONFIG).updateUserAddress(payload, id);
|
|
8754
8824
|
setAddresses((prev) => prev.map((address) => address.id === id ? response.data : address));
|
|
8755
8825
|
return response.data;
|
|
8756
8826
|
}, []);
|
|
8757
|
-
const removeAddress =
|
|
8827
|
+
const removeAddress = React21.useCallback(async (id) => {
|
|
8758
8828
|
await new AddressesApi(AXIOS_CONFIG).deleteUserAddress(id);
|
|
8759
8829
|
setAddresses((prev) => prev.filter((address) => address.id !== id));
|
|
8760
8830
|
return;
|
|
8761
8831
|
}, []);
|
|
8762
|
-
const markAsDefault =
|
|
8832
|
+
const markAsDefault = React21.useCallback(async (id) => {
|
|
8763
8833
|
const response = await new AddressesApi(AXIOS_CONFIG).updateDefaultAddress(id);
|
|
8764
8834
|
setAddresses((prev) => prev.map((address) => address.id === id ? response.data : address));
|
|
8765
8835
|
return response.data;
|
|
@@ -8777,7 +8847,7 @@ function useAddresses() {
|
|
|
8777
8847
|
};
|
|
8778
8848
|
}
|
|
8779
8849
|
function Card({ className = "", ...props }) {
|
|
8780
|
-
return /* @__PURE__ */
|
|
8850
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8781
8851
|
"div",
|
|
8782
8852
|
{
|
|
8783
8853
|
className: `rounded-lg border bg-white shadow-sm ${className}`,
|
|
@@ -8786,7 +8856,7 @@ function Card({ className = "", ...props }) {
|
|
|
8786
8856
|
);
|
|
8787
8857
|
}
|
|
8788
8858
|
function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
8789
|
-
|
|
8859
|
+
React21.useEffect(() => {
|
|
8790
8860
|
if (typeof window === "undefined") return;
|
|
8791
8861
|
if (isOpen) {
|
|
8792
8862
|
document.body.style.overflow = "hidden";
|
|
@@ -8803,7 +8873,7 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8803
8873
|
lg: "max-w-2xl",
|
|
8804
8874
|
xl: "max-w-4xl"
|
|
8805
8875
|
};
|
|
8806
|
-
return /* @__PURE__ */
|
|
8876
|
+
return /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isOpen && /* @__PURE__ */ React21__default.default.createElement(React21__default.default.Fragment, null, /* @__PURE__ */ React21__default.default.createElement(
|
|
8807
8877
|
framerMotion.motion.div,
|
|
8808
8878
|
{
|
|
8809
8879
|
initial: { opacity: 0 },
|
|
@@ -8812,7 +8882,7 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8812
8882
|
onClick: onClose,
|
|
8813
8883
|
className: "fixed inset-0 bg-black/50 backdrop-blur-sm z-50"
|
|
8814
8884
|
}
|
|
8815
|
-
), /* @__PURE__ */
|
|
8885
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8816
8886
|
framerMotion.motion.div,
|
|
8817
8887
|
{
|
|
8818
8888
|
initial: { opacity: 0, scale: 0.95, y: 20 },
|
|
@@ -8820,15 +8890,15 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8820
8890
|
exit: { opacity: 0, scale: 0.95, y: 20 },
|
|
8821
8891
|
className: `bg-white rounded-2xl shadow-2xl w-full ${sizes[size]} max-h-[90vh] overflow-hidden flex flex-col`
|
|
8822
8892
|
},
|
|
8823
|
-
title && /* @__PURE__ */
|
|
8893
|
+
title && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between p-6 border-b border-gray-200" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-2xl font-bold text-gray-900" }, title), /* @__PURE__ */ React21__default.default.createElement(
|
|
8824
8894
|
"button",
|
|
8825
8895
|
{
|
|
8826
8896
|
onClick: onClose,
|
|
8827
8897
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors"
|
|
8828
8898
|
},
|
|
8829
|
-
/* @__PURE__ */
|
|
8899
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "w-5 h-5" })
|
|
8830
8900
|
)),
|
|
8831
|
-
/* @__PURE__ */
|
|
8901
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 overflow-y-auto p-6" }, children)
|
|
8832
8902
|
))));
|
|
8833
8903
|
}
|
|
8834
8904
|
var addressSchema = zod.z.object({
|
|
@@ -8842,7 +8912,7 @@ var addressSchema = zod.z.object({
|
|
|
8842
8912
|
phone: zod.z.string().min(10, "Phone number is required")
|
|
8843
8913
|
});
|
|
8844
8914
|
function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, initialAddress }) {
|
|
8845
|
-
const [isSubmitting, setIsSubmitting] =
|
|
8915
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
8846
8916
|
const {
|
|
8847
8917
|
register,
|
|
8848
8918
|
handleSubmit,
|
|
@@ -8861,7 +8931,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8861
8931
|
country: initialAddress?.country || "United States"
|
|
8862
8932
|
}
|
|
8863
8933
|
});
|
|
8864
|
-
|
|
8934
|
+
React21.useEffect(() => {
|
|
8865
8935
|
reset({
|
|
8866
8936
|
name: initialAddress?.name || "",
|
|
8867
8937
|
phone: initialAddress?.phone || "",
|
|
@@ -8918,7 +8988,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8918
8988
|
setIsSubmitting(false);
|
|
8919
8989
|
}
|
|
8920
8990
|
};
|
|
8921
|
-
return /* @__PURE__ */
|
|
8991
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8922
8992
|
Modal,
|
|
8923
8993
|
{
|
|
8924
8994
|
isOpen,
|
|
@@ -8926,7 +8996,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8926
8996
|
title: initialAddress ? "Edit Address" : "Add New Address",
|
|
8927
8997
|
size: "lg"
|
|
8928
8998
|
},
|
|
8929
|
-
/* @__PURE__ */
|
|
8999
|
+
/* @__PURE__ */ React21__default.default.createElement("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8930
9000
|
Input,
|
|
8931
9001
|
{
|
|
8932
9002
|
label: "Full name",
|
|
@@ -8934,7 +9004,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8934
9004
|
...register("name"),
|
|
8935
9005
|
error: errors.name?.message
|
|
8936
9006
|
}
|
|
8937
|
-
), /* @__PURE__ */
|
|
9007
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8938
9008
|
Input,
|
|
8939
9009
|
{
|
|
8940
9010
|
label: "Phone number",
|
|
@@ -8942,7 +9012,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8942
9012
|
...register("phone"),
|
|
8943
9013
|
error: errors.phone?.message
|
|
8944
9014
|
}
|
|
8945
|
-
), /* @__PURE__ */
|
|
9015
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8946
9016
|
Input,
|
|
8947
9017
|
{
|
|
8948
9018
|
label: "Address line 1",
|
|
@@ -8950,14 +9020,14 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8950
9020
|
...register("street1"),
|
|
8951
9021
|
error: errors.street1?.message
|
|
8952
9022
|
}
|
|
8953
|
-
)), /* @__PURE__ */
|
|
9023
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8954
9024
|
Input,
|
|
8955
9025
|
{
|
|
8956
9026
|
label: "Address line 2 (optional)",
|
|
8957
9027
|
placeholder: "Apt 4B",
|
|
8958
9028
|
...register("street2")
|
|
8959
9029
|
}
|
|
8960
|
-
)), /* @__PURE__ */
|
|
9030
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
8961
9031
|
Input,
|
|
8962
9032
|
{
|
|
8963
9033
|
label: "City",
|
|
@@ -8965,7 +9035,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8965
9035
|
...register("city"),
|
|
8966
9036
|
error: errors.city?.message
|
|
8967
9037
|
}
|
|
8968
|
-
), /* @__PURE__ */
|
|
9038
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8969
9039
|
Input,
|
|
8970
9040
|
{
|
|
8971
9041
|
label: "State",
|
|
@@ -8973,7 +9043,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8973
9043
|
...register("state"),
|
|
8974
9044
|
error: errors.state?.message
|
|
8975
9045
|
}
|
|
8976
|
-
), /* @__PURE__ */
|
|
9046
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8977
9047
|
Input,
|
|
8978
9048
|
{
|
|
8979
9049
|
label: "ZIP code",
|
|
@@ -8981,7 +9051,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8981
9051
|
...register("zip"),
|
|
8982
9052
|
error: errors.zip?.message
|
|
8983
9053
|
}
|
|
8984
|
-
), /* @__PURE__ */
|
|
9054
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8985
9055
|
Input,
|
|
8986
9056
|
{
|
|
8987
9057
|
label: "Country",
|
|
@@ -8989,7 +9059,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8989
9059
|
...register("country"),
|
|
8990
9060
|
error: errors.country?.message
|
|
8991
9061
|
}
|
|
8992
|
-
)), /* @__PURE__ */
|
|
9062
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-end gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8993
9063
|
Button,
|
|
8994
9064
|
{
|
|
8995
9065
|
type: "button",
|
|
@@ -8997,7 +9067,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8997
9067
|
onClick: onClose
|
|
8998
9068
|
},
|
|
8999
9069
|
"Cancel"
|
|
9000
|
-
), /* @__PURE__ */
|
|
9070
|
+
), /* @__PURE__ */ React21__default.default.createElement(Button, { type: "submit", disabled: isSubmitting }, isSubmitting ? "Adding Address..." : "Add Address")))
|
|
9001
9071
|
);
|
|
9002
9072
|
}
|
|
9003
9073
|
var checkoutSchema = zod.z.object({
|
|
@@ -9009,7 +9079,7 @@ var PAYMENT_METHODS = [
|
|
|
9009
9079
|
{
|
|
9010
9080
|
label: "Card",
|
|
9011
9081
|
value: "Card",
|
|
9012
|
-
icon: /* @__PURE__ */
|
|
9082
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "w-5 h-5" }),
|
|
9013
9083
|
description: "Pay securely with your credit or debit card",
|
|
9014
9084
|
className: "border-blue-500 hover:bg-blue-50",
|
|
9015
9085
|
activeClass: "bg-blue-50 border-blue-500 text-blue-700"
|
|
@@ -9017,7 +9087,7 @@ var PAYMENT_METHODS = [
|
|
|
9017
9087
|
{
|
|
9018
9088
|
label: "Cash",
|
|
9019
9089
|
value: "Cash",
|
|
9020
|
-
icon: /* @__PURE__ */
|
|
9090
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.PackageCheck, { className: "w-5 h-5" }),
|
|
9021
9091
|
description: "Pay with cash on delivery or at pickup",
|
|
9022
9092
|
className: "border-amber-500 hover:bg-amber-50",
|
|
9023
9093
|
activeClass: "bg-amber-50 border-amber-500 text-amber-700"
|
|
@@ -9025,7 +9095,7 @@ var PAYMENT_METHODS = [
|
|
|
9025
9095
|
{
|
|
9026
9096
|
label: "Credit",
|
|
9027
9097
|
value: "Credit",
|
|
9028
|
-
icon: /* @__PURE__ */
|
|
9098
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "w-5 h-5" }),
|
|
9029
9099
|
description: "Use your account credit",
|
|
9030
9100
|
className: "border-emerald-500 hover:bg-emerald-50",
|
|
9031
9101
|
activeClass: "bg-emerald-50 border-emerald-500 text-emerald-700"
|
|
@@ -9036,25 +9106,25 @@ function CheckoutScreen() {
|
|
|
9036
9106
|
const { cart, clearCart } = useCart();
|
|
9037
9107
|
const { isAuthenticated, user } = useAuth();
|
|
9038
9108
|
const { buildPath } = useBasePath();
|
|
9039
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9040
|
-
const [isDelivery, setIsDelivery] =
|
|
9041
|
-
const [paymentMethod, setPaymentMethod] =
|
|
9042
|
-
const [error, setError] =
|
|
9043
|
-
const [selectedAddressId, setSelectedAddressId] =
|
|
9044
|
-
const [selectedStoreAddressId, setSelectedStoreAddressId] =
|
|
9045
|
-
const [storeAddresses, setStoreAddresses] =
|
|
9046
|
-
const [isAddressModalOpen, setIsAddressModalOpen] =
|
|
9047
|
-
const [editingAddress, setEditingAddress] =
|
|
9048
|
-
const [shippingPrice, setShippingPrice] =
|
|
9109
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9110
|
+
const [isDelivery, setIsDelivery] = React21.useState(true);
|
|
9111
|
+
const [paymentMethod, setPaymentMethod] = React21.useState("Card");
|
|
9112
|
+
const [error, setError] = React21.useState(null);
|
|
9113
|
+
const [selectedAddressId, setSelectedAddressId] = React21.useState(null);
|
|
9114
|
+
const [selectedStoreAddressId, setSelectedStoreAddressId] = React21.useState(null);
|
|
9115
|
+
const [storeAddresses, setStoreAddresses] = React21.useState([]);
|
|
9116
|
+
const [isAddressModalOpen, setIsAddressModalOpen] = React21.useState(false);
|
|
9117
|
+
const [editingAddress, setEditingAddress] = React21.useState(null);
|
|
9118
|
+
const [shippingPrice, setShippingPrice] = React21.useState(0);
|
|
9049
9119
|
const {
|
|
9050
9120
|
addresses: userAddresses,
|
|
9051
9121
|
defaultAddress
|
|
9052
9122
|
} = useAddresses();
|
|
9053
|
-
const [selectedShippingRateId, setSelectedShippingRateId] =
|
|
9054
|
-
const [shippingRates, setShippingRates] =
|
|
9055
|
-
const [shippingRatesLoading, setShippingRatesLoading] =
|
|
9056
|
-
const [shippingRatesError, setShippingRatesError] =
|
|
9057
|
-
const [storeData, setStoreData] =
|
|
9123
|
+
const [selectedShippingRateId, setSelectedShippingRateId] = React21.useState(null);
|
|
9124
|
+
const [shippingRates, setShippingRates] = React21.useState([]);
|
|
9125
|
+
const [shippingRatesLoading, setShippingRatesLoading] = React21.useState(false);
|
|
9126
|
+
const [shippingRatesError, setShippingRatesError] = React21.useState(null);
|
|
9127
|
+
const [storeData, setStoreData] = React21.useState(null);
|
|
9058
9128
|
const { addresses, isLoading, refresh, removeAddress } = useAddresses();
|
|
9059
9129
|
const {
|
|
9060
9130
|
register,
|
|
@@ -9079,7 +9149,7 @@ function CheckoutScreen() {
|
|
|
9079
9149
|
}
|
|
9080
9150
|
});
|
|
9081
9151
|
const sameAsShipping = watch("sameAsShipping", true);
|
|
9082
|
-
|
|
9152
|
+
React21.useEffect(() => {
|
|
9083
9153
|
if (sameAsShipping) {
|
|
9084
9154
|
setValue("billing.name", watch("shipping.name"));
|
|
9085
9155
|
setValue("billing.phone", watch("shipping.phone"));
|
|
@@ -9091,7 +9161,7 @@ function CheckoutScreen() {
|
|
|
9091
9161
|
setValue("billing.country", watch("shipping.country"));
|
|
9092
9162
|
}
|
|
9093
9163
|
}, [sameAsShipping, watch("shipping.name"), watch("shipping.phone"), watch("shipping.street1"), watch("shipping.street2"), watch("shipping.city"), watch("shipping.state"), watch("shipping.zip"), watch("shipping.country")]);
|
|
9094
|
-
|
|
9164
|
+
React21.useEffect(() => {
|
|
9095
9165
|
if (defaultAddress && !selectedAddressId) {
|
|
9096
9166
|
setSelectedAddressId(defaultAddress.id);
|
|
9097
9167
|
setValue("shipping.name", defaultAddress.name);
|
|
@@ -9126,7 +9196,7 @@ function CheckoutScreen() {
|
|
|
9126
9196
|
setShippingRates([]);
|
|
9127
9197
|
setSelectedShippingRateId(null);
|
|
9128
9198
|
};
|
|
9129
|
-
|
|
9199
|
+
React21.useEffect(() => {
|
|
9130
9200
|
if (!isDelivery || !selectedAddressId || !cart || cart?.cartBody?.items?.length === 0 || !cart?.cartBody?.items) {
|
|
9131
9201
|
setShippingRates([]);
|
|
9132
9202
|
setSelectedShippingRateId(null);
|
|
@@ -9155,7 +9225,7 @@ function CheckoutScreen() {
|
|
|
9155
9225
|
}
|
|
9156
9226
|
})();
|
|
9157
9227
|
}, [isDelivery, selectedAddressId, cart]);
|
|
9158
|
-
|
|
9228
|
+
React21.useEffect(() => {
|
|
9159
9229
|
if (!isDelivery) {
|
|
9160
9230
|
const stores = [
|
|
9161
9231
|
{ id: "store1", name: "Main Pharmacy", street1: "123 Main St", city: "Seattle" },
|
|
@@ -9229,7 +9299,7 @@ function CheckoutScreen() {
|
|
|
9229
9299
|
}
|
|
9230
9300
|
}
|
|
9231
9301
|
setIsSubmitting(true);
|
|
9232
|
-
sonner.toast("Submitting order...", { icon: /* @__PURE__ */
|
|
9302
|
+
sonner.toast("Submitting order...", { icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "h-4 w-4" }) });
|
|
9233
9303
|
try {
|
|
9234
9304
|
const items = (cart?.cartBody?.items || []).map((item) => ({
|
|
9235
9305
|
productVariantId: String(item.productVariantId),
|
|
@@ -9294,33 +9364,33 @@ function CheckoutScreen() {
|
|
|
9294
9364
|
const subtotal = cart.total;
|
|
9295
9365
|
const tax = 0;
|
|
9296
9366
|
const total = subtotal + shippingPrice + tax;
|
|
9297
|
-
return /* @__PURE__ */
|
|
9367
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-10 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9298
9368
|
framerMotion.motion.div,
|
|
9299
9369
|
{
|
|
9300
9370
|
initial: { opacity: 0, y: 24 },
|
|
9301
9371
|
animate: { opacity: 1, y: 0 },
|
|
9302
9372
|
className: "space-y-6"
|
|
9303
9373
|
},
|
|
9304
|
-
/* @__PURE__ */
|
|
9305
|
-
/* @__PURE__ */
|
|
9306
|
-
/* @__PURE__ */
|
|
9307
|
-
/* @__PURE__ */
|
|
9374
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-4 w-4" }), "Secure checkout"),
|
|
9375
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Provide delivery details"),
|
|
9376
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-white/75 md:text-lg" }, "Our pharmacists handle every package with care. Share your shipping and billing information so we can dispatch your order within the next 12 hours."),
|
|
9377
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-3" }, checkoutSteps.map((step) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9308
9378
|
"div",
|
|
9309
9379
|
{
|
|
9310
9380
|
key: step.id,
|
|
9311
9381
|
className: `flex items-center gap-3 rounded-2xl px-4 py-2 text-sm font-semibold ${step.status === "complete" ? "bg-white/20 text-white" : step.status === "current" ? "bg-white text-primary-700" : "bg-white/10 text-white/60"}`
|
|
9312
9382
|
},
|
|
9313
|
-
/* @__PURE__ */
|
|
9383
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "flex h-7 w-7 items-center justify-center rounded-full bg-white/20 text-xs font-bold" }, step.id),
|
|
9314
9384
|
step.label
|
|
9315
9385
|
)))
|
|
9316
|
-
)))), /* @__PURE__ */
|
|
9386
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("form", { onSubmit: handleSubmit(onSubmit) }, error && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mb-4 text-red-600 font-semibold" }, error), /* @__PURE__ */ React21__default.default.createElement("div", { className: "pt-12 container mx-auto grid gap-10 px-4 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9317
9387
|
framerMotion.motion.div,
|
|
9318
9388
|
{
|
|
9319
9389
|
initial: { opacity: 0, y: 24 },
|
|
9320
9390
|
animate: { opacity: 1, y: 0 },
|
|
9321
9391
|
className: "space-y-8"
|
|
9322
9392
|
},
|
|
9323
|
-
/* @__PURE__ */
|
|
9393
|
+
/* @__PURE__ */ React21__default.default.createElement("section", { className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center justify-between gap-4" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-xl font-semibold text-slate-900" }, "Shipping information"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, "We use temperature-aware packaging and real-time tracking on every shipment.")), /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-primary-50 px-3 py-1 text-xs font-semibold uppercase tracking-wide text-primary-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "h-4 w-4" }), "Dispatch in 12h")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 grid grid-cols-1 gap-4 md:grid-cols-2" }, isDelivery && /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2 space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("label", { className: "block font-semibold" }, "Select Address"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9324
9394
|
Button,
|
|
9325
9395
|
{
|
|
9326
9396
|
type: "button",
|
|
@@ -9331,15 +9401,15 @@ function CheckoutScreen() {
|
|
|
9331
9401
|
setIsAddressModalOpen(true);
|
|
9332
9402
|
}
|
|
9333
9403
|
},
|
|
9334
|
-
/* @__PURE__ */
|
|
9404
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
|
|
9335
9405
|
"Add New Address"
|
|
9336
|
-
)), userAddresses.length > 0 ? /* @__PURE__ */
|
|
9406
|
+
)), userAddresses.length > 0 ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4" }, userAddresses.map((addr) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9337
9407
|
"label",
|
|
9338
9408
|
{
|
|
9339
9409
|
key: addr.id,
|
|
9340
9410
|
className: `group relative flex items-start gap-3 p-4 rounded-2xl border ${selectedAddressId === addr.id ? "border-primary-500 bg-primary-50 shadow-sm" : "border-slate-200 bg-white"} cursor-pointer hover:border-primary-300 transition-colors`
|
|
9341
9411
|
},
|
|
9342
|
-
/* @__PURE__ */
|
|
9412
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9343
9413
|
"input",
|
|
9344
9414
|
{
|
|
9345
9415
|
type: "radio",
|
|
@@ -9360,7 +9430,7 @@ function CheckoutScreen() {
|
|
|
9360
9430
|
className: "mt-1"
|
|
9361
9431
|
}
|
|
9362
9432
|
),
|
|
9363
|
-
/* @__PURE__ */
|
|
9433
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-900" }, addr.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-600" }, addr.street1), addr.street2 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-600" }, addr.street2), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-600" }, addr.city, ", ", addr.state, " ", addr.zip), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-600" }, addr.country), addr.phone && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-600 mt-1" }, addr.phone), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-3 flex items-center gap-2" }, addr.isDefault && /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-1 rounded-full bg-primary-100 px-2.5 py-0.5 text-xs font-semibold text-primary-700" }, "Default"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9364
9434
|
"button",
|
|
9365
9435
|
{
|
|
9366
9436
|
type: "button",
|
|
@@ -9371,9 +9441,9 @@ function CheckoutScreen() {
|
|
|
9371
9441
|
},
|
|
9372
9442
|
className: "inline-flex items-center gap-1 rounded-full border border-slate-200 px-2.5 py-0.5 text-xs font-medium text-slate-600 hover:border-primary-300 hover:text-primary-600"
|
|
9373
9443
|
},
|
|
9374
|
-
/* @__PURE__ */
|
|
9444
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Edit3, { className: "h-3.5 w-3.5" }),
|
|
9375
9445
|
" Edit"
|
|
9376
|
-
), /* @__PURE__ */
|
|
9446
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9377
9447
|
"button",
|
|
9378
9448
|
{
|
|
9379
9449
|
type: "button",
|
|
@@ -9391,23 +9461,23 @@ function CheckoutScreen() {
|
|
|
9391
9461
|
},
|
|
9392
9462
|
className: "inline-flex items-center gap-1 rounded-full border border-red-200 px-2.5 py-0.5 text-xs font-semibold text-red-600 hover:border-red-300 hover:text-red-700"
|
|
9393
9463
|
},
|
|
9394
|
-
/* @__PURE__ */
|
|
9464
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-3.5 w-3.5" }),
|
|
9395
9465
|
" Delete"
|
|
9396
9466
|
)))
|
|
9397
|
-
))) : /* @__PURE__ */
|
|
9467
|
+
))) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-center py-8 bg-slate-50 rounded-lg" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "h-12 w-12 mx-auto text-slate-400" }), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 text-slate-600" }, "No addresses found"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, "Add a new address to continue"))), !isDelivery && storeAddresses.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement("label", { className: "block mb-2 font-semibold" }, "Select Pickup Location"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9398
9468
|
"select",
|
|
9399
9469
|
{
|
|
9400
9470
|
className: "w-full border rounded p-2",
|
|
9401
9471
|
value: selectedStoreAddressId || "",
|
|
9402
9472
|
onChange: (e) => setSelectedStoreAddressId(e.target.value)
|
|
9403
9473
|
},
|
|
9404
|
-
storeAddresses.map((addr) => /* @__PURE__ */
|
|
9474
|
+
storeAddresses.map((addr) => /* @__PURE__ */ React21__default.default.createElement("option", { key: addr.id, value: addr.id }, addr.name, " - ", addr.street1, ", ", addr.city))
|
|
9405
9475
|
)))),
|
|
9406
|
-
isDelivery && selectedAddressId && /* @__PURE__ */
|
|
9476
|
+
isDelivery && selectedAddressId && /* @__PURE__ */ React21__default.default.createElement(Card, { className: "p-6 border border-gray-200 rounded-xl shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3 text-xl font-semibold text-gray-900 pb-4 mb-6 border-b" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "text-accent w-6 h-6" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Shipping Options")), shippingRatesLoading ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-center py-12" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-accent" }), /* @__PURE__ */ React21__default.default.createElement("span", { className: "ml-3 text-gray-600" }, "Loading shipping options...")) : shippingRatesError ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-center py-12" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-16 h-16 mx-auto mb-4 bg-red-100 rounded-full flex items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "w-8 h-8 text-red-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React21__default.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }))), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-red-500 text-lg font-medium" }, "Error loading shipping options"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-red-400 text-sm mt-1" }, shippingRatesError)) : shippingRates && shippingRates.length > 0 ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, shippingRates.map((rate) => {
|
|
9407
9477
|
const isSelected = !!selectedShippingRateId && selectedShippingRateId === rate.objectId;
|
|
9408
9478
|
const isTest = rate.test;
|
|
9409
9479
|
const hasAttributes = rate.attributes && rate.attributes.length > 0;
|
|
9410
|
-
return /* @__PURE__ */
|
|
9480
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9411
9481
|
"div",
|
|
9412
9482
|
{
|
|
9413
9483
|
key: rate.objectId,
|
|
@@ -9416,7 +9486,7 @@ function CheckoutScreen() {
|
|
|
9416
9486
|
onMouseLeave: () => setShippingPrice(parseFloat(rate.amountLocal)),
|
|
9417
9487
|
className: `relative p-5 border-2 rounded-xl cursor-pointer transition-all duration-200 hover:shadow-md ${isSelected ? "border-primary-500 bg-primary-50 ring-2 ring-primary-200" : "border-gray-200 hover:border-gray-300"}`
|
|
9418
9488
|
},
|
|
9419
|
-
/* @__PURE__ */
|
|
9489
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-4 flex-1" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-shrink-0" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9420
9490
|
Image3__default.default,
|
|
9421
9491
|
{
|
|
9422
9492
|
src: rate.providerImage75 || "/placeholder-product.jpg",
|
|
@@ -9429,18 +9499,18 @@ function CheckoutScreen() {
|
|
|
9429
9499
|
width: 48,
|
|
9430
9500
|
height: 48
|
|
9431
9501
|
}
|
|
9432
|
-
)), /* @__PURE__ */
|
|
9502
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900" }, rate.provider, " ", rate.servicelevel?.name), isTest && /* @__PURE__ */ React21__default.default.createElement("span", { className: "px-2 py-1 text-xs font-medium bg-orange-100 text-orange-800 rounded-full" }, "TEST")), hasAttributes && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2 mb-3" }, rate.attributes.map((attr) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9433
9503
|
"span",
|
|
9434
9504
|
{
|
|
9435
9505
|
key: attr,
|
|
9436
9506
|
className: `px-2 py-1 text-xs font-medium rounded-full ${attr === "FASTEST" ? "bg-green-100 text-green-800" : attr === "BESTVALUE" ? "bg-blue-100 text-blue-800" : attr === "CHEAPEST" ? "bg-purple-100 text-purple-800" : "bg-gray-100 text-gray-800"}`
|
|
9437
9507
|
},
|
|
9438
9508
|
attr
|
|
9439
|
-
))), /* @__PURE__ */
|
|
9440
|
-
isSelected && /* @__PURE__ */
|
|
9509
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-1 text-sm text-gray-600" }, rate.durationTerms && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "w-4 h-4 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React21__default.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" })), /* @__PURE__ */ React21__default.default.createElement("span", null, rate.durationTerms)), rate.estimatedDays && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "w-4 h-4 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React21__default.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" })), /* @__PURE__ */ React21__default.default.createElement("span", null, "Estimated ", rate.estimatedDays, " day", rate.estimatedDays !== 1 ? "s" : "")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "w-4 h-4 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React21__default.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M9 5H7a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" })), /* @__PURE__ */ React21__default.default.createElement("span", null, "Carrier: ", rate.provider)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement("svg", { className: "w-4 h-4 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React21__default.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1" })), /* @__PURE__ */ React21__default.default.createElement("span", null, "Currency: ", rate.currency))))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col items-end" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-2xl font-bold text-gray-900" }, formatPrice(parseFloat(rate.amount))), rate.amount !== rate.amountLocal && /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-sm text-gray-500" }, rate.amountLocal, " ", rate.currencyLocal))),
|
|
9510
|
+
isSelected && /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute top-3 right-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-6 h-6 bg-primary-500 rounded-full flex items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "w-4 h-4 text-white" })))
|
|
9441
9511
|
);
|
|
9442
|
-
})) : /* @__PURE__ */
|
|
9443
|
-
), /* @__PURE__ */
|
|
9512
|
+
})) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-center py-12" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-16 h-16 mx-auto mb-4 bg-gray-100 rounded-full flex items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "w-8 h-8 text-gray-400" })), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-500 text-lg font-medium" }, "No shipping options available"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-400 text-sm mt-1" }, "Please check the shipping address or try a different location.")))
|
|
9513
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9444
9514
|
framerMotion.motion.aside,
|
|
9445
9515
|
{
|
|
9446
9516
|
initial: { opacity: 0, y: 32 },
|
|
@@ -9448,22 +9518,22 @@ function CheckoutScreen() {
|
|
|
9448
9518
|
transition: { duration: 0.5, ease: "easeOut", delay: 0.1 },
|
|
9449
9519
|
className: "space-y-10 lg:sticky lg:top-24"
|
|
9450
9520
|
},
|
|
9451
|
-
/* @__PURE__ */
|
|
9521
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-xl shadow-primary-50/50 transition hover:shadow-primary-100/60" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-2xl font-semibold text-slate-900" }, "Order Summary"), /* @__PURE__ */ React21__default.default.createElement("section", { className: "mt-6 space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-xs font-semibold text-slate-700 uppercase tracking-wider" }, "Delivery Method"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 gap-3" }, [
|
|
9452
9522
|
{
|
|
9453
9523
|
label: "Delivery",
|
|
9454
|
-
icon: /* @__PURE__ */
|
|
9524
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "w-5 h-5" }),
|
|
9455
9525
|
value: true,
|
|
9456
9526
|
desc: "Shipped to your address"
|
|
9457
9527
|
},
|
|
9458
9528
|
{
|
|
9459
9529
|
label: "Pickup",
|
|
9460
|
-
icon: /* @__PURE__ */
|
|
9530
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "w-5 h-5" }),
|
|
9461
9531
|
value: false,
|
|
9462
9532
|
desc: "Collect from pharmacy"
|
|
9463
9533
|
}
|
|
9464
9534
|
].map((option) => {
|
|
9465
9535
|
const active = isDelivery === option.value;
|
|
9466
|
-
return /* @__PURE__ */
|
|
9536
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9467
9537
|
"button",
|
|
9468
9538
|
{
|
|
9469
9539
|
key: option.label,
|
|
@@ -9472,18 +9542,18 @@ function CheckoutScreen() {
|
|
|
9472
9542
|
"aria-pressed": active,
|
|
9473
9543
|
className: `relative flex w-full items-center justify-between rounded-xl border-2 p-3 transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-400 focus-visible:ring-offset-2 ${active ? "border-primary-500 bg-primary-50 shadow-sm" : "border-slate-200 bg-white hover:border-primary-200 hover:bg-primary-50/40"}`
|
|
9474
9544
|
},
|
|
9475
|
-
/* @__PURE__ */
|
|
9545
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9476
9546
|
"div",
|
|
9477
9547
|
{
|
|
9478
9548
|
className: `p-2 rounded-lg ${active ? "bg-primary-100 text-primary-600" : "bg-slate-100 text-slate-600 group-hover:bg-slate-50"}`
|
|
9479
9549
|
},
|
|
9480
9550
|
option.icon
|
|
9481
|
-
), /* @__PURE__ */
|
|
9482
|
-
active && /* @__PURE__ */
|
|
9551
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-left" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "font-medium text-slate-900" }, option.label), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-slate-500" }, option.desc))),
|
|
9552
|
+
active && /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-5 h-5 rounded-full bg-primary-500 flex items-center justify-center text-white shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "w-3 h-3" }))
|
|
9483
9553
|
);
|
|
9484
|
-
}))), /* @__PURE__ */
|
|
9554
|
+
}))), /* @__PURE__ */ React21__default.default.createElement("section", { className: "mt-8 space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-xs font-semibold text-slate-700 uppercase tracking-wider" }, "Payment Method"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, PAYMENT_METHODS.map((pm) => {
|
|
9485
9555
|
const active = paymentMethod === pm.value;
|
|
9486
|
-
return /* @__PURE__ */
|
|
9556
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9487
9557
|
"button",
|
|
9488
9558
|
{
|
|
9489
9559
|
key: pm.value,
|
|
@@ -9491,22 +9561,22 @@ function CheckoutScreen() {
|
|
|
9491
9561
|
onClick: () => setPaymentMethod(pm.value),
|
|
9492
9562
|
className: `w-full flex items-center justify-between rounded-xl border-2 p-3 transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 ${active ? `${pm.activeClass} border-current shadow-sm` : `${pm.className} border-slate-200 hover:border-primary-200 hover:shadow-sm`}`
|
|
9493
9563
|
},
|
|
9494
|
-
/* @__PURE__ */
|
|
9564
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9495
9565
|
"div",
|
|
9496
9566
|
{
|
|
9497
9567
|
className: `p-1.5 rounded-md ${pm.value === "Card" ? "bg-blue-100 text-blue-600" : pm.value === "Cash" ? "bg-amber-100 text-amber-600" : "bg-emerald-100 text-emerald-600"} ${active ? "bg-opacity-30" : "bg-opacity-100"}`
|
|
9498
9568
|
},
|
|
9499
9569
|
pm.icon
|
|
9500
|
-
), /* @__PURE__ */
|
|
9501
|
-
active && /* @__PURE__ */
|
|
9570
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-medium text-slate-900" }, pm.label)),
|
|
9571
|
+
active && /* @__PURE__ */ React21__default.default.createElement("div", { className: "w-4 h-4 rounded-full bg-primary-500 flex items-center justify-center text-white shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "w-2.5 h-2.5" }))
|
|
9502
9572
|
);
|
|
9503
|
-
})), /* @__PURE__ */
|
|
9573
|
+
})), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-slate-500 mt-2 pl-1 leading-relaxed" }, paymentMethod === "Card" && "You will be redirected to a secure payment page.", paymentMethod === "Cash" && "Pay with cash at the time of delivery or pickup.", paymentMethod === "Credit" && "Use your available account credit for this order.")), /* @__PURE__ */ React21__default.default.createElement("section", { className: "mt-8 pt-6 border-t border-slate-100" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "max-h-60 space-y-4 overflow-y-auto pr-2 scrollbar-thin scrollbar-thumb-slate-200 hover:scrollbar-thumb-slate-300" }, cart?.cartBody?.items?.map((item) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9504
9574
|
"div",
|
|
9505
9575
|
{
|
|
9506
9576
|
key: item.productId,
|
|
9507
9577
|
className: "flex gap-4 rounded-2xl border border-slate-100 p-4 hover:bg-slate-50/50 transition"
|
|
9508
9578
|
},
|
|
9509
|
-
/* @__PURE__ */
|
|
9579
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex h-16 w-16 items-center justify-center rounded-xl bg-slate-100 text-slate-400" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9510
9580
|
Image3__default.default,
|
|
9511
9581
|
{
|
|
9512
9582
|
src: item.productVariantData.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
@@ -9516,9 +9586,9 @@ function CheckoutScreen() {
|
|
|
9516
9586
|
className: "object-contain"
|
|
9517
9587
|
}
|
|
9518
9588
|
)),
|
|
9519
|
-
/* @__PURE__ */
|
|
9520
|
-
/* @__PURE__ */
|
|
9521
|
-
))), /* @__PURE__ */
|
|
9589
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold text-slate-900" }, item?.productVariantData?.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-slate-500" }, "Qty ", item.quantity)),
|
|
9590
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold text-slate-900" }, formatPrice(item.productVariantData.finalPrice * item.quantity))
|
|
9591
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 space-y-3 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Subtotal"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold text-slate-900" }, formatPrice(subtotal))), isDelivery && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Shipping"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold" }, formatPrice(shippingPrice))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Estimated tax"), /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold" }, formatPrice(tax))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-2xl bg-slate-50 p-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between text-base font-semibold text-slate-900" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Total Due"), /* @__PURE__ */ React21__default.default.createElement("span", null, formatPrice(total))), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-xs text-slate-500" }, "Tax is estimated. Final amount confirmed after payment.")))), /* @__PURE__ */ React21__default.default.createElement(
|
|
9522
9592
|
Button,
|
|
9523
9593
|
{
|
|
9524
9594
|
type: "submit",
|
|
@@ -9526,11 +9596,11 @@ function CheckoutScreen() {
|
|
|
9526
9596
|
isLoading: isSubmitting,
|
|
9527
9597
|
className: "mt-6 w-full transition-transform hover:scale-[1.02] active:scale-[0.99]"
|
|
9528
9598
|
},
|
|
9529
|
-
/* @__PURE__ */
|
|
9599
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "h-5 w-5" }),
|
|
9530
9600
|
isSubmitting ? "Placing order..." : "Place Secure Order"
|
|
9531
|
-
), /* @__PURE__ */
|
|
9532
|
-
/* @__PURE__ */
|
|
9533
|
-
))), /* @__PURE__ */
|
|
9601
|
+
), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-4 flex items-center justify-center gap-2 text-xs text-slate-500" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Lock, { className: "h-4 w-4" }), "Fully encrypted checkout \u2014 cancel anytime before shipment.")),
|
|
9602
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-primary-100 bg-primary-50/80 p-6 text-sm text-primary-700 shadow-sm hover:shadow-md transition-shadow" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold uppercase tracking-[0.3em] text-primary-800" }, "Why Patients Choose Us"), /* @__PURE__ */ React21__default.default.createElement("ul", { className: "mt-4 space-y-3 text-primary-700 leading-relaxed" }, /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-start gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.PackageCheck, { className: "mt-0.5 h-4 w-4 shrink-0" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Pharmacy-grade verification on every order.")), /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-start gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "mt-0.5 h-4 w-4 shrink-0" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Cold-chain logistics for sensitive medications.")), /* @__PURE__ */ React21__default.default.createElement("li", { className: "flex items-start gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "mt-0.5 h-4 w-4 shrink-0" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Real-time tracking and SMS updates from prep to delivery."))))
|
|
9603
|
+
))), /* @__PURE__ */ React21__default.default.createElement(
|
|
9534
9604
|
AddressFormModal,
|
|
9535
9605
|
{
|
|
9536
9606
|
isOpen: isAddressModalOpen,
|
|
@@ -9565,8 +9635,8 @@ function LoginScreen() {
|
|
|
9565
9635
|
const searchParams = navigation.useSearchParams();
|
|
9566
9636
|
const redirectUrl = searchParams?.get("redirect") || buildPath("/");
|
|
9567
9637
|
const { login } = useAuth();
|
|
9568
|
-
const [showPassword, setShowPassword] =
|
|
9569
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9638
|
+
const [showPassword, setShowPassword] = React21.useState(false);
|
|
9639
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9570
9640
|
const {
|
|
9571
9641
|
register,
|
|
9572
9642
|
handleSubmit,
|
|
@@ -9586,7 +9656,7 @@ function LoginScreen() {
|
|
|
9586
9656
|
setIsSubmitting(false);
|
|
9587
9657
|
}
|
|
9588
9658
|
};
|
|
9589
|
-
return /* @__PURE__ */
|
|
9659
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid min-h-screen overflow-hidden bg-white lg:grid-cols-[1.1fr_0.9fr]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9590
9660
|
framerMotion.motion.section,
|
|
9591
9661
|
{
|
|
9592
9662
|
initial: { opacity: 0, x: -24 },
|
|
@@ -9594,18 +9664,18 @@ function LoginScreen() {
|
|
|
9594
9664
|
transition: { duration: 0.4 },
|
|
9595
9665
|
className: "relative flex flex-col justify-between bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] px-10 py-14 text-white"
|
|
9596
9666
|
},
|
|
9597
|
-
/* @__PURE__ */
|
|
9598
|
-
/* @__PURE__ */
|
|
9599
|
-
/* @__PURE__ */
|
|
9667
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.HeartPulse, { className: "h-4 w-4" }), "Hey Pharmacist"), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold leading-tight lg:text-5xl" }, "Pharmacy-grade care for your household"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-xl text-white/80" }, "Log in to unlock personalized regimens, pharmacist support, and fast delivery on wellness essentials curated just for you.")),
|
|
9668
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 rounded-3xl bg-white/10 p-6 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-5 w-5 text-white" }), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-white/80" }, "HIPAA-compliant security keeps your health information protected.")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-5 w-5 text-white" }), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-white/80" }, "Pharmacists ready to chat in under 10 minutes for medication support."))),
|
|
9669
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-6 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Need an account?"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9600
9670
|
Link8__default.default,
|
|
9601
9671
|
{
|
|
9602
|
-
href: "/register",
|
|
9672
|
+
href: buildPath("/register"),
|
|
9603
9673
|
className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-2 font-semibold transition hover:bg-white/25"
|
|
9604
9674
|
},
|
|
9605
9675
|
"Create one now",
|
|
9606
|
-
/* @__PURE__ */
|
|
9676
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-4 w-4" })
|
|
9607
9677
|
))
|
|
9608
|
-
), /* @__PURE__ */
|
|
9678
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9609
9679
|
framerMotion.motion.section,
|
|
9610
9680
|
{
|
|
9611
9681
|
initial: { opacity: 0, x: 24 },
|
|
@@ -9613,7 +9683,7 @@ function LoginScreen() {
|
|
|
9613
9683
|
transition: { duration: 0.4 },
|
|
9614
9684
|
className: "flex items-center justify-center px-6 py-12 lg:px-16"
|
|
9615
9685
|
},
|
|
9616
|
-
/* @__PURE__ */
|
|
9686
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "w-full max-w-md space-y-10" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-3xl font-bold text-slate-900" }, "Sign in"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, "Welcome back! Enter your details to continue your personalized care plan.")), /* @__PURE__ */ React21__default.default.createElement("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-6 rounded-3xl border border-slate-100 bg-white p-8 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement(
|
|
9617
9687
|
Input,
|
|
9618
9688
|
{
|
|
9619
9689
|
type: "email",
|
|
@@ -9622,7 +9692,7 @@ function LoginScreen() {
|
|
|
9622
9692
|
...register("email"),
|
|
9623
9693
|
error: errors.email?.message
|
|
9624
9694
|
}
|
|
9625
|
-
)), /* @__PURE__ */
|
|
9695
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9626
9696
|
Input,
|
|
9627
9697
|
{
|
|
9628
9698
|
type: showPassword ? "text" : "password",
|
|
@@ -9631,28 +9701,28 @@ function LoginScreen() {
|
|
|
9631
9701
|
...register("password"),
|
|
9632
9702
|
error: errors.password?.message
|
|
9633
9703
|
}
|
|
9634
|
-
), /* @__PURE__ */
|
|
9704
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9635
9705
|
"button",
|
|
9636
9706
|
{
|
|
9637
9707
|
type: "button",
|
|
9638
9708
|
onClick: () => setShowPassword((prev) => !prev),
|
|
9639
9709
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9640
9710
|
},
|
|
9641
|
-
showPassword ? /* @__PURE__ */
|
|
9642
|
-
)), /* @__PURE__ */
|
|
9711
|
+
showPassword ? /* @__PURE__ */ React21__default.default.createElement(lucideReact.EyeOff, { className: "h-5 w-5" }) : /* @__PURE__ */ React21__default.default.createElement(lucideReact.Eye, { className: "h-5 w-5" })
|
|
9712
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between text-sm" }, /* @__PURE__ */ React21__default.default.createElement("label", { className: "flex items-center gap-2 text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9643
9713
|
"input",
|
|
9644
9714
|
{
|
|
9645
9715
|
type: "checkbox",
|
|
9646
9716
|
className: "h-4 w-4 rounded border-slate-300 text-primary-600 focus:ring-primary-500"
|
|
9647
9717
|
}
|
|
9648
|
-
), "Remember me"), /* @__PURE__ */
|
|
9718
|
+
), "Remember me"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9649
9719
|
Link8__default.default,
|
|
9650
9720
|
{
|
|
9651
|
-
href: "/forgot-password",
|
|
9721
|
+
href: buildPath("/forgot-password"),
|
|
9652
9722
|
className: "font-medium text-primary-600 transition hover:text-primary-700"
|
|
9653
9723
|
},
|
|
9654
9724
|
"Forgot password?"
|
|
9655
|
-
)), /* @__PURE__ */
|
|
9725
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
9656
9726
|
Button,
|
|
9657
9727
|
{
|
|
9658
9728
|
type: "submit",
|
|
@@ -9661,7 +9731,7 @@ function LoginScreen() {
|
|
|
9661
9731
|
className: "w-full"
|
|
9662
9732
|
},
|
|
9663
9733
|
"Sign in securely"
|
|
9664
|
-
)), /* @__PURE__ */
|
|
9734
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-slate-50 p-6 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Lock, { className: "mt-0.5 h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-800" }, "Secure by design"), /* @__PURE__ */ React21__default.default.createElement("p", null, "Encrypted sessions, multi-factor ready, and privacy-first policies keep your personal data safe.")))))
|
|
9665
9735
|
)));
|
|
9666
9736
|
}
|
|
9667
9737
|
var registerSchema = zod.z.object({
|
|
@@ -9684,9 +9754,9 @@ function RegisterScreen() {
|
|
|
9684
9754
|
const router = navigation.useRouter();
|
|
9685
9755
|
const { register: registerUser } = useAuth();
|
|
9686
9756
|
const { buildPath } = useBasePath();
|
|
9687
|
-
const [showPassword, setShowPassword] =
|
|
9688
|
-
const [showConfirmPassword, setShowConfirmPassword] =
|
|
9689
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9757
|
+
const [showPassword, setShowPassword] = React21.useState(false);
|
|
9758
|
+
const [showConfirmPassword, setShowConfirmPassword] = React21.useState(false);
|
|
9759
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9690
9760
|
const {
|
|
9691
9761
|
register,
|
|
9692
9762
|
handleSubmit,
|
|
@@ -9712,7 +9782,7 @@ function RegisterScreen() {
|
|
|
9712
9782
|
setIsSubmitting(false);
|
|
9713
9783
|
}
|
|
9714
9784
|
};
|
|
9715
|
-
return /* @__PURE__ */
|
|
9785
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid min-h-screen overflow-hidden bg-white lg:grid-cols-[0.95fr_1.05fr]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9716
9786
|
framerMotion.motion.section,
|
|
9717
9787
|
{
|
|
9718
9788
|
initial: { opacity: 0, x: -24 },
|
|
@@ -9720,17 +9790,17 @@ function RegisterScreen() {
|
|
|
9720
9790
|
transition: { duration: 0.4 },
|
|
9721
9791
|
className: "flex flex-col justify-between bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] px-10 py-14 text-white"
|
|
9722
9792
|
},
|
|
9723
|
-
/* @__PURE__ */
|
|
9724
|
-
/* @__PURE__ */
|
|
9725
|
-
/* @__PURE__ */
|
|
9793
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.HeartPulse, { className: "h-4 w-4" }), "Join Hey Pharmacist"), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold leading-tight lg:text-5xl" }, "Create your wellness account"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-xl text-white/80" }, "Unlock concierge-level pharmacy support, curated product recommendations, and smarter refills designed for busy families.")),
|
|
9794
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4 rounded-3xl bg-white/10 p-6 backdrop-blur" }, BENEFITS.map((benefit) => /* @__PURE__ */ React21__default.default.createElement("div", { key: benefit, className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.CheckCircle2, { className: "h-5 w-5 text-white" }), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-white/85" }, benefit)))),
|
|
9795
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-6 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Already part of the community?"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9726
9796
|
Link8__default.default,
|
|
9727
9797
|
{
|
|
9728
|
-
href: "/login",
|
|
9798
|
+
href: buildPath("/login"),
|
|
9729
9799
|
className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-2 font-semibold transition hover:bg-white/25"
|
|
9730
9800
|
},
|
|
9731
9801
|
"Sign in"
|
|
9732
9802
|
))
|
|
9733
|
-
), /* @__PURE__ */
|
|
9803
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9734
9804
|
framerMotion.motion.section,
|
|
9735
9805
|
{
|
|
9736
9806
|
initial: { opacity: 0, x: 24 },
|
|
@@ -9738,13 +9808,13 @@ function RegisterScreen() {
|
|
|
9738
9808
|
transition: { duration: 0.4 },
|
|
9739
9809
|
className: "flex items-center justify-center px-6 py-12 lg:px-16"
|
|
9740
9810
|
},
|
|
9741
|
-
/* @__PURE__ */
|
|
9811
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "w-full max-w-lg space-y-10" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-3xl font-bold text-slate-900" }, "Create an account"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, "Start your personalized care journey with pharmacist-backed guidance.")), /* @__PURE__ */ React21__default.default.createElement(
|
|
9742
9812
|
"form",
|
|
9743
9813
|
{
|
|
9744
9814
|
onSubmit: handleSubmit(onSubmit),
|
|
9745
9815
|
className: "space-y-6 rounded-3xl border border-slate-100 bg-white p-8 shadow-lg shadow-primary-50"
|
|
9746
9816
|
},
|
|
9747
|
-
/* @__PURE__ */
|
|
9817
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9748
9818
|
Input,
|
|
9749
9819
|
{
|
|
9750
9820
|
label: "First name",
|
|
@@ -9752,7 +9822,7 @@ function RegisterScreen() {
|
|
|
9752
9822
|
...register("firstName"),
|
|
9753
9823
|
error: errors.firstName?.message
|
|
9754
9824
|
}
|
|
9755
|
-
), /* @__PURE__ */
|
|
9825
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9756
9826
|
Input,
|
|
9757
9827
|
{
|
|
9758
9828
|
label: "Last name",
|
|
@@ -9761,7 +9831,7 @@ function RegisterScreen() {
|
|
|
9761
9831
|
error: errors.lastName?.message
|
|
9762
9832
|
}
|
|
9763
9833
|
)),
|
|
9764
|
-
/* @__PURE__ */
|
|
9834
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9765
9835
|
Input,
|
|
9766
9836
|
{
|
|
9767
9837
|
type: "email",
|
|
@@ -9771,7 +9841,7 @@ function RegisterScreen() {
|
|
|
9771
9841
|
error: errors.email?.message
|
|
9772
9842
|
}
|
|
9773
9843
|
),
|
|
9774
|
-
/* @__PURE__ */
|
|
9844
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9775
9845
|
Input,
|
|
9776
9846
|
{
|
|
9777
9847
|
type: "tel",
|
|
@@ -9781,7 +9851,7 @@ function RegisterScreen() {
|
|
|
9781
9851
|
error: errors.phone?.message
|
|
9782
9852
|
}
|
|
9783
9853
|
),
|
|
9784
|
-
/* @__PURE__ */
|
|
9854
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9785
9855
|
Input,
|
|
9786
9856
|
{
|
|
9787
9857
|
type: showPassword ? "text" : "password",
|
|
@@ -9790,16 +9860,16 @@ function RegisterScreen() {
|
|
|
9790
9860
|
...register("password"),
|
|
9791
9861
|
error: errors.password?.message
|
|
9792
9862
|
}
|
|
9793
|
-
), /* @__PURE__ */
|
|
9863
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9794
9864
|
"button",
|
|
9795
9865
|
{
|
|
9796
9866
|
type: "button",
|
|
9797
9867
|
onClick: () => setShowPassword((prev) => !prev),
|
|
9798
9868
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9799
9869
|
},
|
|
9800
|
-
showPassword ? /* @__PURE__ */
|
|
9870
|
+
showPassword ? /* @__PURE__ */ React21__default.default.createElement(lucideReact.EyeOff, { className: "h-5 w-5" }) : /* @__PURE__ */ React21__default.default.createElement(lucideReact.Eye, { className: "h-5 w-5" })
|
|
9801
9871
|
)),
|
|
9802
|
-
/* @__PURE__ */
|
|
9872
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9803
9873
|
Input,
|
|
9804
9874
|
{
|
|
9805
9875
|
type: showConfirmPassword ? "text" : "password",
|
|
@@ -9808,24 +9878,24 @@ function RegisterScreen() {
|
|
|
9808
9878
|
...register("confirmPassword"),
|
|
9809
9879
|
error: errors.confirmPassword?.message
|
|
9810
9880
|
}
|
|
9811
|
-
), /* @__PURE__ */
|
|
9881
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9812
9882
|
"button",
|
|
9813
9883
|
{
|
|
9814
9884
|
type: "button",
|
|
9815
9885
|
onClick: () => setShowConfirmPassword((prev) => !prev),
|
|
9816
9886
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9817
9887
|
},
|
|
9818
|
-
showConfirmPassword ? /* @__PURE__ */
|
|
9888
|
+
showConfirmPassword ? /* @__PURE__ */ React21__default.default.createElement(lucideReact.EyeOff, { className: "h-5 w-5" }) : /* @__PURE__ */ React21__default.default.createElement(lucideReact.Eye, { className: "h-5 w-5" })
|
|
9819
9889
|
)),
|
|
9820
|
-
/* @__PURE__ */
|
|
9890
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3 rounded-2xl bg-slate-50 p-4 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Shield, { className: "mt-0.5 h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "By creating an account, you agree to our", " ", /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/terms"), className: "font-semibold text-primary-600 hover:text-primary-700" }, "Terms of Service"), " ", "and", " ", /* @__PURE__ */ React21__default.default.createElement(
|
|
9821
9891
|
Link8__default.default,
|
|
9822
9892
|
{
|
|
9823
|
-
href: "/privacy",
|
|
9893
|
+
href: buildPath("/privacy"),
|
|
9824
9894
|
className: "font-semibold text-primary-600 hover:text-primary-700"
|
|
9825
9895
|
},
|
|
9826
9896
|
"Privacy Policy"
|
|
9827
9897
|
), ". We protect your information with bank-level encryption.")),
|
|
9828
|
-
/* @__PURE__ */
|
|
9898
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9829
9899
|
Button,
|
|
9830
9900
|
{
|
|
9831
9901
|
type: "submit",
|
|
@@ -9833,10 +9903,10 @@ function RegisterScreen() {
|
|
|
9833
9903
|
isLoading: isSubmitting,
|
|
9834
9904
|
className: "w-full"
|
|
9835
9905
|
},
|
|
9836
|
-
/* @__PURE__ */
|
|
9906
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.UserPlus, { className: "h-5 w-5" }),
|
|
9837
9907
|
"Create my account"
|
|
9838
9908
|
)
|
|
9839
|
-
), /* @__PURE__ */
|
|
9909
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-slate-50 p-6 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: "mt-0.5 h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-800" }, "Members love us"), /* @__PURE__ */ React21__default.default.createElement("p", null, "92% of patients report improved adherence after receiving pharmacist touchpoints through their Hey Pharmacist account.")))))
|
|
9840
9910
|
)));
|
|
9841
9911
|
}
|
|
9842
9912
|
var profileSchema = zod.z.object({
|
|
@@ -9849,7 +9919,7 @@ function ProfileScreen() {
|
|
|
9849
9919
|
const router = navigation.useRouter();
|
|
9850
9920
|
const { user, updateUser, logout } = useAuth();
|
|
9851
9921
|
const { buildPath } = useBasePath();
|
|
9852
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9922
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9853
9923
|
const {
|
|
9854
9924
|
register,
|
|
9855
9925
|
handleSubmit,
|
|
@@ -9903,15 +9973,15 @@ function ProfileScreen() {
|
|
|
9903
9973
|
href: buildPath("/account/addresses")
|
|
9904
9974
|
}
|
|
9905
9975
|
];
|
|
9906
|
-
return /* @__PURE__ */
|
|
9976
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white mb-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9907
9977
|
framerMotion.motion.div,
|
|
9908
9978
|
{
|
|
9909
9979
|
initial: { opacity: 0, y: 24 },
|
|
9910
9980
|
animate: { opacity: 1, y: 0 },
|
|
9911
9981
|
className: "flex flex-col gap-8 md:flex-row md:items-center md:justify-between"
|
|
9912
9982
|
},
|
|
9913
|
-
/* @__PURE__ */
|
|
9914
|
-
/* @__PURE__ */
|
|
9983
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-5" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.HeartPulse, { className: "h-4 w-4" }), "My account"), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Hello, ", user.firstname, " ", user.lastname), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "Manage profile details, shipping preferences, and personalized recommendations. Our pharmacists keep your care plan up to date."), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-4 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-2" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "h-4 w-4" }), "Account secured with multi-factor ready login"))),
|
|
9984
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col items-center gap-4 rounded-3xl bg-white/15 p-6 text-center backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex h-24 w-24 items-center justify-center rounded-full bg-white/20 text-3xl font-bold text-white" }, getInitials(user?.firstname || "", user?.lastname || "") || ""), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-white/80" }, user.email), /* @__PURE__ */ React21__default.default.createElement(
|
|
9915
9985
|
Button,
|
|
9916
9986
|
{
|
|
9917
9987
|
variant: "ghost",
|
|
@@ -9920,14 +9990,14 @@ function ProfileScreen() {
|
|
|
9920
9990
|
},
|
|
9921
9991
|
"Change password"
|
|
9922
9992
|
))
|
|
9923
|
-
))), /* @__PURE__ */
|
|
9993
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-10 lg:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9924
9994
|
framerMotion.motion.div,
|
|
9925
9995
|
{
|
|
9926
9996
|
initial: { opacity: 0, y: 24 },
|
|
9927
9997
|
animate: { opacity: 1, y: 0 },
|
|
9928
9998
|
className: "space-y-6"
|
|
9929
9999
|
},
|
|
9930
|
-
/* @__PURE__ */
|
|
10000
|
+
/* @__PURE__ */ React21__default.default.createElement("section", { className: "rounded-3xl border border-slate-100 bg-white p-8 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-xl font-semibold text-slate-900" }, "Personal information"), /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-5 w-5 text-primary-500" })), /* @__PURE__ */ React21__default.default.createElement("form", { onSubmit: handleSubmit(onSubmit), className: "mt-6 space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9931
10001
|
Input,
|
|
9932
10002
|
{
|
|
9933
10003
|
label: "First name",
|
|
@@ -9935,7 +10005,7 @@ function ProfileScreen() {
|
|
|
9935
10005
|
...register("firstName"),
|
|
9936
10006
|
error: errors.firstName?.message
|
|
9937
10007
|
}
|
|
9938
|
-
), /* @__PURE__ */
|
|
10008
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9939
10009
|
Input,
|
|
9940
10010
|
{
|
|
9941
10011
|
label: "Last name",
|
|
@@ -9943,7 +10013,7 @@ function ProfileScreen() {
|
|
|
9943
10013
|
...register("lastName"),
|
|
9944
10014
|
error: errors.lastName?.message
|
|
9945
10015
|
}
|
|
9946
|
-
)), /* @__PURE__ */
|
|
10016
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9947
10017
|
Input,
|
|
9948
10018
|
{
|
|
9949
10019
|
type: "email",
|
|
@@ -9953,7 +10023,7 @@ function ProfileScreen() {
|
|
|
9953
10023
|
...register("email"),
|
|
9954
10024
|
error: errors.email?.message
|
|
9955
10025
|
}
|
|
9956
|
-
), /* @__PURE__ */
|
|
10026
|
+
), /* @__PURE__ */ React21__default.default.createElement(lucideReact.Mail, { className: "absolute left-3 top-[38px] h-4 w-4 text-slate-400" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9957
10027
|
Input,
|
|
9958
10028
|
{
|
|
9959
10029
|
type: "tel",
|
|
@@ -9963,7 +10033,7 @@ function ProfileScreen() {
|
|
|
9963
10033
|
...register("phone"),
|
|
9964
10034
|
error: errors.phone?.message
|
|
9965
10035
|
}
|
|
9966
|
-
), /* @__PURE__ */
|
|
10036
|
+
), /* @__PURE__ */ React21__default.default.createElement(lucideReact.Phone, { className: "absolute left-3 top-[38px] h-4 w-4 text-slate-400" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9967
10037
|
Button,
|
|
9968
10038
|
{
|
|
9969
10039
|
type: "submit",
|
|
@@ -9971,7 +10041,7 @@ function ProfileScreen() {
|
|
|
9971
10041
|
isLoading: isSubmitting
|
|
9972
10042
|
},
|
|
9973
10043
|
"Save changes"
|
|
9974
|
-
), /* @__PURE__ */
|
|
10044
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9975
10045
|
Button,
|
|
9976
10046
|
{
|
|
9977
10047
|
type: "button",
|
|
@@ -9981,16 +10051,16 @@ function ProfileScreen() {
|
|
|
9981
10051
|
},
|
|
9982
10052
|
"View recent orders"
|
|
9983
10053
|
)))),
|
|
9984
|
-
/* @__PURE__ */
|
|
10054
|
+
/* @__PURE__ */ React21__default.default.createElement("section", { className: "grid gap-4 md:grid-cols-2" }, quickLinks.map((item) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9985
10055
|
Link8__default.default,
|
|
9986
10056
|
{
|
|
9987
10057
|
key: item.href,
|
|
9988
10058
|
href: item.href,
|
|
9989
10059
|
className: "group rounded-3xl border border-slate-100 bg-white p-6 shadow-sm transition hover:-translate-y-1 hover:shadow-lg"
|
|
9990
10060
|
},
|
|
9991
|
-
/* @__PURE__ */
|
|
10061
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "rounded-2xl bg-primary-50 p-3 text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(item.icon, { className: "h-5 w-5" })), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-base font-semibold text-slate-900 group-hover:text-primary-600" }, item.label), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, item.description)))
|
|
9992
10062
|
)))
|
|
9993
|
-
), /* @__PURE__ */
|
|
10063
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9994
10064
|
framerMotion.motion.aside,
|
|
9995
10065
|
{
|
|
9996
10066
|
initial: { opacity: 0, y: 24 },
|
|
@@ -9998,7 +10068,7 @@ function ProfileScreen() {
|
|
|
9998
10068
|
transition: { delay: 0.1 },
|
|
9999
10069
|
className: "space-y-6"
|
|
10000
10070
|
},
|
|
10001
|
-
/* @__PURE__ */
|
|
10071
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-slate-900" }, "Care preferences"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm text-slate-600" }, "Customize how we support you. Set refill reminders or manage communication preferences to stay aligned with your wellness goals."), /* @__PURE__ */ React21__default.default.createElement(
|
|
10002
10072
|
Button,
|
|
10003
10073
|
{
|
|
10004
10074
|
variant: "outline",
|
|
@@ -10007,14 +10077,14 @@ function ProfileScreen() {
|
|
|
10007
10077
|
},
|
|
10008
10078
|
"Manage preferences"
|
|
10009
10079
|
)),
|
|
10010
|
-
/* @__PURE__ */
|
|
10011
|
-
/* @__PURE__ */
|
|
10080
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-primary-100 bg-primary-50/70 p-6 text-sm text-primary-700 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold uppercase tracking-[0.3em]" }, "Pharmacist tip"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 leading-relaxed" }, "Keep your phone number current so pharmacists can reach you quickly with dosage advice or time-sensitive updates about your order.")),
|
|
10081
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
10012
10082
|
"button",
|
|
10013
10083
|
{
|
|
10014
10084
|
onClick: handleLogout,
|
|
10015
10085
|
className: "flex w-full items-center justify-center gap-2 rounded-3xl border border-red-200 bg-red-50 px-4 py-3 text-sm font-semibold text-red-600 transition hover:bg-red-100"
|
|
10016
10086
|
},
|
|
10017
|
-
/* @__PURE__ */
|
|
10087
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LogOut, { className: "h-4 w-4" }),
|
|
10018
10088
|
"Log out"
|
|
10019
10089
|
)
|
|
10020
10090
|
)))));
|
|
@@ -10022,7 +10092,7 @@ function ProfileScreen() {
|
|
|
10022
10092
|
function OrderCard({ order }) {
|
|
10023
10093
|
const { buildPath } = useBasePath();
|
|
10024
10094
|
const config = order.orderStatus;
|
|
10025
|
-
return /* @__PURE__ */
|
|
10095
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
10026
10096
|
framerMotion.motion.div,
|
|
10027
10097
|
{
|
|
10028
10098
|
initial: { opacity: 0, y: 20 },
|
|
@@ -10030,9 +10100,9 @@ function OrderCard({ order }) {
|
|
|
10030
10100
|
whileHover: { y: -4 },
|
|
10031
10101
|
className: "bg-white rounded-2xl p-6 shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100"
|
|
10032
10102
|
},
|
|
10033
|
-
/* @__PURE__ */
|
|
10034
|
-
/* @__PURE__ */
|
|
10035
|
-
/* @__PURE__ */
|
|
10103
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-between items-start mb-4" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-bold text-gray-900 flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Package, { className: "w-5 h-5 text-primary-600" }), "Order #", order?._id?.slice(0, 6) || ""), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-gray-500 mt-1 flex items-center gap-2" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Calendar, { className: "w-4 h-4" }), formatDate(order.createdAt || /* @__PURE__ */ new Date(), "long"))), /* @__PURE__ */ React21__default.default.createElement(Badge, { variant: config }, config)),
|
|
10104
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-2 mb-4" }, order.items?.slice(0, 2).map((item) => /* @__PURE__ */ React21__default.default.createElement("div", { key: item.productVariantId, className: "flex items-center gap-3 text-sm" }, /* @__PURE__ */ React21__default.default.createElement(Image3__default.default, { src: item?.productVariantData?.productMedia?.[0]?.file || "/placeholder-product.jpg", alt: item?.productVariantData?.name || "Product image", width: 48, height: 48, className: "w-12 h-12 rounded-lg bg-gray-100 flex-shrink-0" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-medium text-gray-900 truncate" }, item.productVariantData.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-500" }, "Qty: ", item.quantity)), /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-gray-900" }, formatPrice(item.productVariantData.finalPrice)))), order.items?.length && order.items?.length > 2 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-gray-500 pl-15" }, "+", order.items.length - 2, " more item", order.items.length - 2 > 1 ? "s" : "")),
|
|
10105
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-between items-center pt-4 border-t border-gray-200" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-gray-500" }, "Total Amount"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-2xl font-bold text-gray-900" }, formatPrice(order.grandTotal || 0))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex gap-2" }, order.payment.paymentStatus !== "Paid" /* Paid */ && order.payment.paymentMethod === "Card" /* Card */ && /* @__PURE__ */ React21__default.default.createElement(
|
|
10036
10106
|
"a",
|
|
10037
10107
|
{
|
|
10038
10108
|
href: order?.payment?.paymentIntent?.hostedInvoiceUrl || "",
|
|
@@ -10040,16 +10110,16 @@ function OrderCard({ order }) {
|
|
|
10040
10110
|
rel: "noopener noreferrer",
|
|
10041
10111
|
className: "inline-flex items-center gap-2 px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors"
|
|
10042
10112
|
},
|
|
10043
|
-
/* @__PURE__ */
|
|
10113
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "w-4 h-4" }),
|
|
10044
10114
|
"Pay Now"
|
|
10045
10115
|
)))
|
|
10046
10116
|
);
|
|
10047
10117
|
}
|
|
10048
10118
|
function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
10049
|
-
const [orders, setOrders] =
|
|
10050
|
-
const [isLoading, setIsLoading] =
|
|
10051
|
-
const [error, setError] =
|
|
10052
|
-
const [pagination, setPagination] =
|
|
10119
|
+
const [orders, setOrders] = React21.useState([]);
|
|
10120
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10121
|
+
const [error, setError] = React21.useState(null);
|
|
10122
|
+
const [pagination, setPagination] = React21.useState({
|
|
10053
10123
|
page: 1,
|
|
10054
10124
|
limit: 10,
|
|
10055
10125
|
total: 0,
|
|
@@ -10057,7 +10127,7 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10057
10127
|
});
|
|
10058
10128
|
const { user } = useAuth();
|
|
10059
10129
|
const resolvedUserId = user?._id || user?.id;
|
|
10060
|
-
const fetchOrders =
|
|
10130
|
+
const fetchOrders = React21.useCallback(async () => {
|
|
10061
10131
|
setIsLoading(true);
|
|
10062
10132
|
setError(null);
|
|
10063
10133
|
try {
|
|
@@ -10084,7 +10154,7 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10084
10154
|
setIsLoading(false);
|
|
10085
10155
|
}
|
|
10086
10156
|
}, [page, limit, resolvedUserId, orderStatus, paymentStatus]);
|
|
10087
|
-
|
|
10157
|
+
React21.useEffect(() => {
|
|
10088
10158
|
fetchOrders();
|
|
10089
10159
|
}, [fetchOrders]);
|
|
10090
10160
|
return {
|
|
@@ -10096,10 +10166,10 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10096
10166
|
};
|
|
10097
10167
|
}
|
|
10098
10168
|
function useOrder(id) {
|
|
10099
|
-
const [order, setOrder] =
|
|
10100
|
-
const [isLoading, setIsLoading] =
|
|
10101
|
-
const [error, setError] =
|
|
10102
|
-
const fetchOrder =
|
|
10169
|
+
const [order, setOrder] = React21.useState(null);
|
|
10170
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10171
|
+
const [error, setError] = React21.useState(null);
|
|
10172
|
+
const fetchOrder = React21.useCallback(async () => {
|
|
10103
10173
|
setIsLoading(true);
|
|
10104
10174
|
setError(null);
|
|
10105
10175
|
try {
|
|
@@ -10111,7 +10181,7 @@ function useOrder(id) {
|
|
|
10111
10181
|
setIsLoading(false);
|
|
10112
10182
|
}
|
|
10113
10183
|
}, [id]);
|
|
10114
|
-
|
|
10184
|
+
React21.useEffect(() => {
|
|
10115
10185
|
if (id) {
|
|
10116
10186
|
fetchOrder();
|
|
10117
10187
|
}
|
|
@@ -10119,10 +10189,10 @@ function useOrder(id) {
|
|
|
10119
10189
|
return { order, isLoading, error, refetch: fetchOrder };
|
|
10120
10190
|
}
|
|
10121
10191
|
function useCurrentOrders() {
|
|
10122
|
-
const [orders, setOrders] =
|
|
10123
|
-
const [isLoading, setIsLoading] =
|
|
10124
|
-
const [error, setError] =
|
|
10125
|
-
const fetchCurrentOrders =
|
|
10192
|
+
const [orders, setOrders] = React21.useState([]);
|
|
10193
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10194
|
+
const [error, setError] = React21.useState(null);
|
|
10195
|
+
const fetchCurrentOrders = React21.useCallback(async () => {
|
|
10126
10196
|
setIsLoading(true);
|
|
10127
10197
|
setError(null);
|
|
10128
10198
|
try {
|
|
@@ -10134,7 +10204,7 @@ function useCurrentOrders() {
|
|
|
10134
10204
|
setIsLoading(false);
|
|
10135
10205
|
}
|
|
10136
10206
|
}, []);
|
|
10137
|
-
|
|
10207
|
+
React21.useEffect(() => {
|
|
10138
10208
|
fetchCurrentOrders();
|
|
10139
10209
|
}, [fetchCurrentOrders]);
|
|
10140
10210
|
return { orders, isLoading, error, refetch: fetchCurrentOrders };
|
|
@@ -10148,11 +10218,11 @@ function FilterChips({
|
|
|
10148
10218
|
maxVisible = 4,
|
|
10149
10219
|
variant = "primary"
|
|
10150
10220
|
}) {
|
|
10151
|
-
const [isOverflowOpen, setIsOverflowOpen] =
|
|
10152
|
-
const [filterSearchTerm, setFilterSearchTerm] =
|
|
10153
|
-
const overflowMenuRef =
|
|
10221
|
+
const [isOverflowOpen, setIsOverflowOpen] = React21.useState(false);
|
|
10222
|
+
const [filterSearchTerm, setFilterSearchTerm] = React21.useState("");
|
|
10223
|
+
const overflowMenuRef = React21.useRef(null);
|
|
10154
10224
|
const color = variant === "primary" ? "primary" : "secondary";
|
|
10155
|
-
const { visibleFilters, overflowFilters } =
|
|
10225
|
+
const { visibleFilters, overflowFilters } = React21.useMemo(() => {
|
|
10156
10226
|
const basePrimary = filters.slice(0, maxVisible);
|
|
10157
10227
|
if (basePrimary.includes(selected)) {
|
|
10158
10228
|
return {
|
|
@@ -10172,18 +10242,18 @@ function FilterChips({
|
|
|
10172
10242
|
overflowFilters: filters.filter((filter) => !uniquePrimary.includes(filter))
|
|
10173
10243
|
};
|
|
10174
10244
|
}, [filters, maxVisible, selected]);
|
|
10175
|
-
const filteredOverflowFilters =
|
|
10245
|
+
const filteredOverflowFilters = React21.useMemo(() => {
|
|
10176
10246
|
if (!filterSearchTerm.trim()) return overflowFilters;
|
|
10177
10247
|
return overflowFilters.filter(
|
|
10178
10248
|
(filter) => filter.toLowerCase().includes(filterSearchTerm.toLowerCase())
|
|
10179
10249
|
);
|
|
10180
10250
|
}, [filterSearchTerm, overflowFilters]);
|
|
10181
|
-
|
|
10251
|
+
React21.useEffect(() => {
|
|
10182
10252
|
if (!isOverflowOpen) {
|
|
10183
10253
|
setFilterSearchTerm("");
|
|
10184
10254
|
}
|
|
10185
10255
|
}, [isOverflowOpen]);
|
|
10186
|
-
|
|
10256
|
+
React21.useEffect(() => {
|
|
10187
10257
|
function handleClickOutside(event) {
|
|
10188
10258
|
if (overflowMenuRef.current && !overflowMenuRef.current.contains(event.target)) {
|
|
10189
10259
|
setIsOverflowOpen(false);
|
|
@@ -10196,7 +10266,7 @@ function FilterChips({
|
|
|
10196
10266
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
10197
10267
|
};
|
|
10198
10268
|
}, [isOverflowOpen]);
|
|
10199
|
-
return /* @__PURE__ */
|
|
10269
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-3 md:flex-row md:items-center md:gap-4" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full border border-slate-200 bg-slate-50 px-3 py-1 text-xs font-semibold uppercase tracking-wide text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement(Icon, { className: "h-4 w-4" }), label), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-2 md:flex-row md:items-center md:gap-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2" }, visibleFilters.map((filter) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10200
10270
|
"button",
|
|
10201
10271
|
{
|
|
10202
10272
|
key: filter,
|
|
@@ -10205,16 +10275,16 @@ function FilterChips({
|
|
|
10205
10275
|
className: `rounded-full border px-3 py-1 text-sm font-medium transition ${selected === filter ? `border-${color}-600 bg-${color}-600 text-white shadow-lg shadow-${color}-500/30` : `border-slate-200 bg-slate-50 text-slate-600 hover:border-${color}-300 hover:text-${color}-600`}`
|
|
10206
10276
|
},
|
|
10207
10277
|
filter
|
|
10208
|
-
))), overflowFilters.length > 0 && /* @__PURE__ */
|
|
10278
|
+
))), overflowFilters.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative", ref: overflowMenuRef }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10209
10279
|
"button",
|
|
10210
10280
|
{
|
|
10211
10281
|
type: "button",
|
|
10212
10282
|
onClick: () => setIsOverflowOpen((prev) => !prev),
|
|
10213
10283
|
className: `flex items-center gap-2 rounded-full border px-3 py-1 text-sm font-medium transition ${overflowFilters.includes(selected) ? `border-${color}-600 bg-${color}-50 text-${color}-700 shadow-lg shadow-${color}-500/20` : "border-slate-200 bg-white text-slate-600 hover:border-slate-300"}`
|
|
10214
10284
|
},
|
|
10215
|
-
/* @__PURE__ */
|
|
10216
|
-
/* @__PURE__ */
|
|
10217
|
-
), /* @__PURE__ */
|
|
10285
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, overflowFilters.includes(selected) ? selected : "More"),
|
|
10286
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: `inline-flex h-5 min-w-[1.5rem] items-center justify-center rounded-full bg-${color}-100 px-1 text-xs font-semibold text-${color}-600` }, overflowFilters.length)
|
|
10287
|
+
), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isOverflowOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
10218
10288
|
framerMotion.motion.div,
|
|
10219
10289
|
{
|
|
10220
10290
|
initial: { opacity: 0, y: 8 },
|
|
@@ -10223,7 +10293,7 @@ function FilterChips({
|
|
|
10223
10293
|
transition: { duration: 0.15 },
|
|
10224
10294
|
className: "absolute right-0 z-50 mt-2 w-64 rounded-2xl border border-slate-100 bg-white shadow-xl shadow-primary-50"
|
|
10225
10295
|
},
|
|
10226
|
-
/* @__PURE__ */
|
|
10296
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "border-b border-slate-100 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Search, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-400" }), /* @__PURE__ */ React21__default.default.createElement(
|
|
10227
10297
|
"input",
|
|
10228
10298
|
{
|
|
10229
10299
|
type: "text",
|
|
@@ -10233,7 +10303,7 @@ function FilterChips({
|
|
|
10233
10303
|
className: "w-full rounded-full border border-slate-200 bg-slate-50 py-2 pl-9 pr-3 text-sm text-slate-600 outline-none transition focus:border-primary-300 focus:bg-white focus:ring-2 focus:ring-primary-200"
|
|
10234
10304
|
}
|
|
10235
10305
|
))),
|
|
10236
|
-
/* @__PURE__ */
|
|
10306
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "max-h-60 overflow-y-auto px-2 py-2" }, filteredOverflowFilters.length > 0 ? filteredOverflowFilters.map((filter) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10237
10307
|
"button",
|
|
10238
10308
|
{
|
|
10239
10309
|
key: filter,
|
|
@@ -10244,10 +10314,10 @@ function FilterChips({
|
|
|
10244
10314
|
},
|
|
10245
10315
|
className: `flex w-full items-center justify-between rounded-xl px-3 py-2 text-sm font-medium transition ${selected === filter ? `bg-${color}-600 text-white shadow-lg shadow-${color}-500/30` : "text-slate-600 hover:bg-slate-100"}`
|
|
10246
10316
|
},
|
|
10247
|
-
/* @__PURE__ */
|
|
10248
|
-
selected === filter && /* @__PURE__ */
|
|
10249
|
-
)) : /* @__PURE__ */
|
|
10250
|
-
/* @__PURE__ */
|
|
10317
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, filter),
|
|
10318
|
+
selected === filter && /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "h-4 w-4" })
|
|
10319
|
+
)) : /* @__PURE__ */ React21__default.default.createElement("p", { className: "px-3 py-4 text-sm text-slate-500" }, "No items found.")),
|
|
10320
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between gap-2 border-t border-slate-100 px-4 py-3" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-xs font-semibold uppercase tracking-wide text-slate-400" }, "Quick actions"), /* @__PURE__ */ React21__default.default.createElement(
|
|
10251
10321
|
"button",
|
|
10252
10322
|
{
|
|
10253
10323
|
type: "button",
|
|
@@ -10266,19 +10336,19 @@ var PAYMENT_FILTERS = ["All", ...Object.values(PaymentPaymentStatusEnum)];
|
|
|
10266
10336
|
function OrdersScreen() {
|
|
10267
10337
|
const router = navigation.useRouter();
|
|
10268
10338
|
const { buildPath } = useBasePath();
|
|
10269
|
-
const [page, setPage] =
|
|
10270
|
-
const [selectedFilter, setSelectedFilter] =
|
|
10271
|
-
const [selectedPaymentFilter, setSelectedPaymentFilter] =
|
|
10339
|
+
const [page, setPage] = React21.useState(1);
|
|
10340
|
+
const [selectedFilter, setSelectedFilter] = React21.useState("All");
|
|
10341
|
+
const [selectedPaymentFilter, setSelectedPaymentFilter] = React21.useState("All");
|
|
10272
10342
|
const { orders, isLoading, pagination } = useOrders(
|
|
10273
10343
|
page,
|
|
10274
10344
|
10,
|
|
10275
10345
|
selectedFilter,
|
|
10276
10346
|
selectedPaymentFilter
|
|
10277
10347
|
);
|
|
10278
|
-
const [isOverflowOpen, setIsOverflowOpen] =
|
|
10279
|
-
const [filterSearchTerm, setFilterSearchTerm] =
|
|
10280
|
-
const overflowMenuRef =
|
|
10281
|
-
const filteredOrders =
|
|
10348
|
+
const [isOverflowOpen, setIsOverflowOpen] = React21.useState(false);
|
|
10349
|
+
const [filterSearchTerm, setFilterSearchTerm] = React21.useState("");
|
|
10350
|
+
const overflowMenuRef = React21.useRef(null);
|
|
10351
|
+
const filteredOrders = React21.useMemo(() => {
|
|
10282
10352
|
return orders.filter((order) => {
|
|
10283
10353
|
const matchesStatus = selectedFilter === "All" || order?.orderStatus?.toLowerCase() === selectedFilter.toLowerCase();
|
|
10284
10354
|
const matchesPayment = selectedPaymentFilter === "All" || order?.payment?.paymentStatus?.toLowerCase() === selectedPaymentFilter.toLowerCase();
|
|
@@ -10287,12 +10357,12 @@ function OrdersScreen() {
|
|
|
10287
10357
|
}, [orders, selectedFilter, selectedPaymentFilter]);
|
|
10288
10358
|
const hasOrders = filteredOrders.length > 0;
|
|
10289
10359
|
const MAX_VISIBLE_FILTERS = 4;
|
|
10290
|
-
|
|
10360
|
+
React21.useEffect(() => {
|
|
10291
10361
|
if (!isOverflowOpen) {
|
|
10292
10362
|
setFilterSearchTerm("");
|
|
10293
10363
|
}
|
|
10294
10364
|
}, [isOverflowOpen]);
|
|
10295
|
-
|
|
10365
|
+
React21.useEffect(() => {
|
|
10296
10366
|
function handleClickOutside(event) {
|
|
10297
10367
|
if (overflowMenuRef.current && !overflowMenuRef.current.contains(event.target)) {
|
|
10298
10368
|
setIsOverflowOpen(false);
|
|
@@ -10305,23 +10375,23 @@ function OrdersScreen() {
|
|
|
10305
10375
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
10306
10376
|
};
|
|
10307
10377
|
}, [isOverflowOpen]);
|
|
10308
|
-
return /* @__PURE__ */
|
|
10378
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white mb-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10309
10379
|
framerMotion.motion.div,
|
|
10310
10380
|
{
|
|
10311
10381
|
initial: { opacity: 0, y: 24 },
|
|
10312
10382
|
animate: { opacity: 1, y: 0 },
|
|
10313
10383
|
className: "space-y-6"
|
|
10314
10384
|
},
|
|
10315
|
-
/* @__PURE__ */
|
|
10316
|
-
/* @__PURE__ */
|
|
10317
|
-
))), /* @__PURE__ */
|
|
10385
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.CalendarDays, { className: "h-4 w-4" }), "Order history"),
|
|
10386
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "All of your pharmacy orders"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "Access receipts, shipping statuses, and reorder suggestions in one organized timeline curated by our pharmacists.")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl bg-white/15 p-6 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.35em] text-white/70" }, "Quick tip"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm text-white/80" }, "Use filters to review previous prescriptions, reorder favorites, or download invoices for insurance claims.")))
|
|
10387
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-16 container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10318
10388
|
framerMotion.motion.div,
|
|
10319
10389
|
{
|
|
10320
10390
|
initial: { opacity: 0, y: 24 },
|
|
10321
10391
|
animate: { opacity: 1, y: 0 },
|
|
10322
10392
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
10323
10393
|
},
|
|
10324
|
-
/* @__PURE__ */
|
|
10394
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3 text-sm text-slate-500" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Explore your complete order archive with pharmacist notes.")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4 md:items-end" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10325
10395
|
FilterChips,
|
|
10326
10396
|
{
|
|
10327
10397
|
label: "Status filters",
|
|
@@ -10335,7 +10405,7 @@ function OrdersScreen() {
|
|
|
10335
10405
|
maxVisible: MAX_VISIBLE_FILTERS,
|
|
10336
10406
|
variant: "primary"
|
|
10337
10407
|
}
|
|
10338
|
-
), /* @__PURE__ */
|
|
10408
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10339
10409
|
FilterChips,
|
|
10340
10410
|
{
|
|
10341
10411
|
label: "Payment status",
|
|
@@ -10350,7 +10420,7 @@ function OrdersScreen() {
|
|
|
10350
10420
|
variant: "primary"
|
|
10351
10421
|
}
|
|
10352
10422
|
))),
|
|
10353
|
-
/* @__PURE__ */
|
|
10423
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 space-y-4" }, isLoading ? Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(OrderCardSkeleton, { key: index })) : hasOrders ? filteredOrders.map((order) => /* @__PURE__ */ React21__default.default.createElement(OrderCard, { key: order.id, order })) : /* @__PURE__ */ React21__default.default.createElement(
|
|
10354
10424
|
EmptyState,
|
|
10355
10425
|
{
|
|
10356
10426
|
icon: lucideReact.Package,
|
|
@@ -10360,16 +10430,16 @@ function OrdersScreen() {
|
|
|
10360
10430
|
onAction: () => router.push(buildPath("/shop"))
|
|
10361
10431
|
}
|
|
10362
10432
|
)),
|
|
10363
|
-
!isLoading && pagination.totalPages > 1 && hasOrders && /* @__PURE__ */
|
|
10433
|
+
!isLoading && pagination.totalPages > 1 && hasOrders && /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-10 flex flex-wrap items-center justify-center gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10364
10434
|
Button,
|
|
10365
10435
|
{
|
|
10366
10436
|
variant: "outline",
|
|
10367
10437
|
onClick: () => setPage((current) => Math.max(1, current - 1)),
|
|
10368
10438
|
disabled: page === 1
|
|
10369
10439
|
},
|
|
10370
|
-
/* @__PURE__ */
|
|
10440
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronLeft, { className: "h-5 w-5" }),
|
|
10371
10441
|
"Previous"
|
|
10372
|
-
), /* @__PURE__ */
|
|
10442
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-semibold text-slate-600" }, "Page ", page, " of ", pagination.totalPages), /* @__PURE__ */ React21__default.default.createElement(
|
|
10373
10443
|
Button,
|
|
10374
10444
|
{
|
|
10375
10445
|
variant: "outline",
|
|
@@ -10377,7 +10447,7 @@ function OrdersScreen() {
|
|
|
10377
10447
|
disabled: page === pagination.totalPages
|
|
10378
10448
|
},
|
|
10379
10449
|
"Next",
|
|
10380
|
-
/* @__PURE__ */
|
|
10450
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronRight, { className: "h-5 w-5" })
|
|
10381
10451
|
))
|
|
10382
10452
|
))));
|
|
10383
10453
|
}
|
|
@@ -10386,17 +10456,17 @@ function CurrentOrdersScreen() {
|
|
|
10386
10456
|
const { orders, isLoading } = useCurrentOrders();
|
|
10387
10457
|
const { buildPath } = useBasePath();
|
|
10388
10458
|
const hasOrders = orders.length > 0;
|
|
10389
|
-
return /* @__PURE__ */
|
|
10459
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10390
10460
|
framerMotion.motion.div,
|
|
10391
10461
|
{
|
|
10392
10462
|
initial: { opacity: 0, y: 24 },
|
|
10393
10463
|
animate: { opacity: 1, y: 0 },
|
|
10394
10464
|
className: "space-y-4"
|
|
10395
10465
|
},
|
|
10396
|
-
/* @__PURE__ */
|
|
10397
|
-
/* @__PURE__ */
|
|
10398
|
-
/* @__PURE__ */
|
|
10399
|
-
), /* @__PURE__ */
|
|
10466
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "h-4 w-4" }), "Live order tracking"),
|
|
10467
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Current orders"),
|
|
10468
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "Follow your pharmacy orders from preparation to delivery. Real-time updates, SMS alerts, and pharmacist oversight come standard.")
|
|
10469
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10400
10470
|
framerMotion.motion.div,
|
|
10401
10471
|
{
|
|
10402
10472
|
initial: { opacity: 0, y: 24 },
|
|
@@ -10404,24 +10474,24 @@ function CurrentOrdersScreen() {
|
|
|
10404
10474
|
transition: { delay: 0.1 },
|
|
10405
10475
|
className: "rounded-3xl bg-white/15 p-6 backdrop-blur"
|
|
10406
10476
|
},
|
|
10407
|
-
/* @__PURE__ */
|
|
10408
|
-
/* @__PURE__ */
|
|
10477
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.35em] text-white/70" }, "Quick actions"),
|
|
10478
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 space-y-3 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10409
10479
|
Link8__default.default,
|
|
10410
10480
|
{
|
|
10411
10481
|
href: buildPath("/orders"),
|
|
10412
10482
|
className: "flex items-center justify-between rounded-2xl bg-white/10 px-4 py-3 transition hover:bg-white/20"
|
|
10413
10483
|
},
|
|
10414
|
-
/* @__PURE__ */
|
|
10415
|
-
/* @__PURE__ */
|
|
10416
|
-
), /* @__PURE__ */
|
|
10417
|
-
)))), /* @__PURE__ */
|
|
10484
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold text-white" }, "View order history"),
|
|
10485
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowUpRight, { className: "h-4 w-4" })
|
|
10486
|
+
), /* @__PURE__ */ React21__default.default.createElement("p", null, "Need help fast? Chat with a pharmacist and we will triage your request in under 10 minutes."))
|
|
10487
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10418
10488
|
framerMotion.motion.section,
|
|
10419
10489
|
{
|
|
10420
10490
|
initial: { opacity: 0, y: 24 },
|
|
10421
10491
|
animate: { opacity: 1, y: 0 },
|
|
10422
10492
|
className: "grid gap-6 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]"
|
|
10423
10493
|
},
|
|
10424
|
-
/* @__PURE__ */
|
|
10494
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-6" }, isLoading ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(OrderCardSkeleton, { key: index }))) : hasOrders ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, orders.map((order) => /* @__PURE__ */ React21__default.default.createElement(OrderCard, { key: order.id, order }))) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-10 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10425
10495
|
EmptyState,
|
|
10426
10496
|
{
|
|
10427
10497
|
icon: lucideReact.PackageCheck,
|
|
@@ -10431,7 +10501,7 @@ function CurrentOrdersScreen() {
|
|
|
10431
10501
|
onAction: () => router.push(buildPath("/shop"))
|
|
10432
10502
|
}
|
|
10433
10503
|
))),
|
|
10434
|
-
/* @__PURE__ */
|
|
10504
|
+
/* @__PURE__ */ React21__default.default.createElement("aside", { className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-lg font-semibold text-slate-900" }, "Real-time milestones"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 space-y-4 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3 rounded-2xl bg-slate-50 p-4" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Warehouse, { className: "h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-800" }, "Preparation"), /* @__PURE__ */ React21__default.default.createElement("p", null, "Our pharmacists verify ingredients and pack thermo-sensitive items."))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3 rounded-2xl bg-slate-50 p-4" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-800" }, "In transit"), /* @__PURE__ */ React21__default.default.createElement("p", null, "Track live courier location with ETA updates tailored to your delivery window."))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-start gap-3 rounded-2xl bg-slate-50 p-4" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.BellRing, { className: "h-5 w-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold text-slate-800" }, "Arrival alerts"), /* @__PURE__ */ React21__default.default.createElement("p", null, "Receive SMS and email notifications when parcels are out for delivery."))))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-primary-100 bg-primary-50/70 p-6 text-sm text-primary-700 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "font-semibold uppercase tracking-[0.3em]" }, "Need support?"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 leading-relaxed" }, "Our fulfillment team is online 7 days a week. Message us if you need to adjust delivery instructions or review dosage guidance.")))
|
|
10435
10505
|
))));
|
|
10436
10506
|
}
|
|
10437
10507
|
var addressFormSchema = zod.z.object({
|
|
@@ -10464,12 +10534,12 @@ function formatAddressSnippet(address) {
|
|
|
10464
10534
|
function getAddressTypeCopy(type) {
|
|
10465
10535
|
switch (type) {
|
|
10466
10536
|
case "Billing":
|
|
10467
|
-
return { label: "Billing", icon: /* @__PURE__ */
|
|
10537
|
+
return { label: "Billing", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Home, { className: "h-4 w-4" }) };
|
|
10468
10538
|
case "Both":
|
|
10469
|
-
return { label: "Billing & Shipping", icon: /* @__PURE__ */
|
|
10539
|
+
return { label: "Billing & Shipping", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Globe, { className: "h-4 w-4" }) };
|
|
10470
10540
|
case "Shipping":
|
|
10471
10541
|
default:
|
|
10472
|
-
return { label: "Shipping", icon: /* @__PURE__ */
|
|
10542
|
+
return { label: "Shipping", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "h-4 w-4" }) };
|
|
10473
10543
|
}
|
|
10474
10544
|
}
|
|
10475
10545
|
function AddressesScreen() {
|
|
@@ -10483,8 +10553,8 @@ function AddressesScreen() {
|
|
|
10483
10553
|
removeAddress,
|
|
10484
10554
|
markAsDefault
|
|
10485
10555
|
} = useAddresses();
|
|
10486
|
-
const [isModalOpen, setIsModalOpen] =
|
|
10487
|
-
const [editingAddress, setEditingAddress] =
|
|
10556
|
+
const [isModalOpen, setIsModalOpen] = React21.useState(false);
|
|
10557
|
+
const [editingAddress, setEditingAddress] = React21.useState(null);
|
|
10488
10558
|
const {
|
|
10489
10559
|
register,
|
|
10490
10560
|
handleSubmit,
|
|
@@ -10494,7 +10564,7 @@ function AddressesScreen() {
|
|
|
10494
10564
|
resolver: zod$1.zodResolver(addressFormSchema),
|
|
10495
10565
|
defaultValues: FORM_DEFAULTS
|
|
10496
10566
|
});
|
|
10497
|
-
|
|
10567
|
+
React21.useEffect(() => {
|
|
10498
10568
|
if (editingAddress) {
|
|
10499
10569
|
reset({
|
|
10500
10570
|
fullName: editingAddress.name,
|
|
@@ -10589,7 +10659,7 @@ You can add it back at any time.`
|
|
|
10589
10659
|
});
|
|
10590
10660
|
}
|
|
10591
10661
|
};
|
|
10592
|
-
const stats =
|
|
10662
|
+
const stats = React21.useMemo(() => {
|
|
10593
10663
|
const shippingCount = addresses.filter((address) => address.addressType !== "Billing").length;
|
|
10594
10664
|
const billingCount = addresses.filter((address) => address.addressType !== "Shipping").length;
|
|
10595
10665
|
return [
|
|
@@ -10613,18 +10683,18 @@ You can add it back at any time.`
|
|
|
10613
10683
|
}
|
|
10614
10684
|
];
|
|
10615
10685
|
}, [addresses]);
|
|
10616
|
-
return /* @__PURE__ */
|
|
10686
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white mb-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.3),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10617
10687
|
framerMotion.motion.div,
|
|
10618
10688
|
{
|
|
10619
10689
|
initial: { opacity: 0, y: 24 },
|
|
10620
10690
|
animate: { opacity: 1, y: 0 },
|
|
10621
10691
|
className: "space-y-5"
|
|
10622
10692
|
},
|
|
10623
|
-
/* @__PURE__ */
|
|
10624
|
-
/* @__PURE__ */
|
|
10625
|
-
/* @__PURE__ */
|
|
10626
|
-
/* @__PURE__ */
|
|
10627
|
-
), /* @__PURE__ */
|
|
10693
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "h-4 w-4" }), "Address book"),
|
|
10694
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Manage where your care arrives"),
|
|
10695
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "Add home, office, or loved ones' addresses and toggle a default for lightning-fast checkout and delivery."),
|
|
10696
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-3 text-sm text-white/75" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/10 px-3 py-1" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4 text-white" }), "Default address: ", defaultAddress ? defaultAddress.name : "Not set"), /* @__PURE__ */ React21__default.default.createElement(Button, { variant: "ghost", className: "text-white hover:bg-white/10", onClick: openCreateModal }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "h-5 w-5" }), "Add address"))
|
|
10697
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10628
10698
|
framerMotion.motion.div,
|
|
10629
10699
|
{
|
|
10630
10700
|
initial: { opacity: 0, y: 24 },
|
|
@@ -10632,14 +10702,14 @@ You can add it back at any time.`
|
|
|
10632
10702
|
transition: { delay: 0.1 },
|
|
10633
10703
|
className: "grid gap-4 rounded-3xl bg-white/15 p-6 text-sm text-white/80 backdrop-blur"
|
|
10634
10704
|
},
|
|
10635
|
-
stats.map((stat) => /* @__PURE__ */
|
|
10636
|
-
)))), /* @__PURE__ */
|
|
10705
|
+
stats.map((stat) => /* @__PURE__ */ React21__default.default.createElement("div", { key: stat.id, className: "flex items-center justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs font-semibold uppercase tracking-[0.3em] text-white/70" }, stat.label), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-white" }, stat.helper)), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-3xl font-semibold text-white" }, stat.value)))
|
|
10706
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, isLoading ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-3" }, Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10637
10707
|
"div",
|
|
10638
10708
|
{
|
|
10639
10709
|
key: index,
|
|
10640
10710
|
className: "h-56 animate-pulse rounded-3xl border border-slate-100 bg-white"
|
|
10641
10711
|
}
|
|
10642
|
-
))) : error ? /* @__PURE__ */
|
|
10712
|
+
))) : error ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-red-100 bg-red-50 p-6 text-sm text-red-700" }, error.message) : addresses.length === 0 ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl border border-slate-100 bg-white p-12 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10643
10713
|
EmptyState,
|
|
10644
10714
|
{
|
|
10645
10715
|
icon: lucideReact.MapPin,
|
|
@@ -10648,9 +10718,9 @@ You can add it back at any time.`
|
|
|
10648
10718
|
actionLabel: "Add your first address",
|
|
10649
10719
|
onAction: openCreateModal
|
|
10650
10720
|
}
|
|
10651
|
-
)) : /* @__PURE__ */
|
|
10721
|
+
)) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-3" }, addresses.map((address) => {
|
|
10652
10722
|
const typeCopy = getAddressTypeCopy(address.addressType);
|
|
10653
|
-
return /* @__PURE__ */
|
|
10723
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
10654
10724
|
framerMotion.motion.div,
|
|
10655
10725
|
{
|
|
10656
10726
|
key: address.id,
|
|
@@ -10658,39 +10728,39 @@ You can add it back at any time.`
|
|
|
10658
10728
|
animate: { opacity: 1, y: 0 },
|
|
10659
10729
|
className: "group relative flex h-full flex-col rounded-3xl border border-slate-100 bg-white p-6 shadow-sm transition hover:-translate-y-1 hover:shadow-xl"
|
|
10660
10730
|
},
|
|
10661
|
-
address.isDefault && /* @__PURE__ */
|
|
10662
|
-
/* @__PURE__ */
|
|
10663
|
-
/* @__PURE__ */
|
|
10664
|
-
/* @__PURE__ */
|
|
10731
|
+
address.isDefault && /* @__PURE__ */ React21__default.default.createElement("span", { className: "absolute right-6 top-6 inline-flex items-center gap-2 rounded-full bg-amber-100 px-3 py-1 text-xs font-semibold text-amber-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Crown, { className: "h-4 w-4" }), "Default"),
|
|
10732
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "rounded-full bg-primary-50 p-3 text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.User, { className: "h-5 w-5" })), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-base font-semibold text-slate-900" }, address.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs uppercase tracking-[0.3em] text-slate-400" }, typeCopy.label))),
|
|
10733
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 flex flex-1 flex-col gap-3 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("p", null, formatAddressSnippet(address)), /* @__PURE__ */ React21__default.default.createElement("p", { className: "inline-flex items-center gap-2 text-slate-500" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Phone, { className: "h-4 w-4 text-slate-400" }), address.phone || "Not provided")),
|
|
10734
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 flex items-center justify-between gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10665
10735
|
"button",
|
|
10666
10736
|
{
|
|
10667
10737
|
type: "button",
|
|
10668
10738
|
onClick: () => openEditModal(address),
|
|
10669
10739
|
className: "inline-flex items-center gap-2 rounded-full border border-slate-200 px-3 py-1 text-sm font-medium text-slate-600 transition hover:border-primary-300 hover:text-primary-600"
|
|
10670
10740
|
},
|
|
10671
|
-
/* @__PURE__ */
|
|
10741
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Edit3, { className: "h-4 w-4" }),
|
|
10672
10742
|
"Edit"
|
|
10673
|
-
), /* @__PURE__ */
|
|
10743
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, !address.isDefault && /* @__PURE__ */ React21__default.default.createElement(
|
|
10674
10744
|
"button",
|
|
10675
10745
|
{
|
|
10676
10746
|
type: "button",
|
|
10677
10747
|
onClick: () => handleSetDefault(address),
|
|
10678
10748
|
className: "inline-flex items-center gap-2 rounded-full border border-amber-200 px-3 py-1 text-sm font-semibold text-amber-600 transition hover:border-amber-300 hover:text-amber-700"
|
|
10679
10749
|
},
|
|
10680
|
-
/* @__PURE__ */
|
|
10750
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Star, { className: "h-4 w-4" }),
|
|
10681
10751
|
"Make default"
|
|
10682
|
-
), /* @__PURE__ */
|
|
10752
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10683
10753
|
"button",
|
|
10684
10754
|
{
|
|
10685
10755
|
type: "button",
|
|
10686
10756
|
onClick: () => handleDelete(address),
|
|
10687
10757
|
className: "inline-flex items-center gap-2 rounded-full border border-red-200 px-3 py-1 text-sm font-semibold text-red-600 transition hover:border-red-300 hover:text-red-700"
|
|
10688
10758
|
},
|
|
10689
|
-
/* @__PURE__ */
|
|
10759
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-4 w-4" }),
|
|
10690
10760
|
"Delete"
|
|
10691
10761
|
)))
|
|
10692
10762
|
);
|
|
10693
|
-
})))), /* @__PURE__ */
|
|
10763
|
+
})))), /* @__PURE__ */ React21__default.default.createElement(
|
|
10694
10764
|
Modal,
|
|
10695
10765
|
{
|
|
10696
10766
|
isOpen: isModalOpen,
|
|
@@ -10698,7 +10768,7 @@ You can add it back at any time.`
|
|
|
10698
10768
|
title: editingAddress ? "Edit address" : "Add new address",
|
|
10699
10769
|
size: "lg"
|
|
10700
10770
|
},
|
|
10701
|
-
/* @__PURE__ */
|
|
10771
|
+
/* @__PURE__ */ React21__default.default.createElement("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10702
10772
|
Input,
|
|
10703
10773
|
{
|
|
10704
10774
|
label: "Full name",
|
|
@@ -10706,7 +10776,7 @@ You can add it back at any time.`
|
|
|
10706
10776
|
...register("fullName"),
|
|
10707
10777
|
error: errors.fullName?.message
|
|
10708
10778
|
}
|
|
10709
|
-
), /* @__PURE__ */
|
|
10779
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10710
10780
|
Input,
|
|
10711
10781
|
{
|
|
10712
10782
|
label: "Phone number",
|
|
@@ -10714,7 +10784,7 @@ You can add it back at any time.`
|
|
|
10714
10784
|
...register("phone"),
|
|
10715
10785
|
error: errors.phone?.message
|
|
10716
10786
|
}
|
|
10717
|
-
)), /* @__PURE__ */
|
|
10787
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
10718
10788
|
Input,
|
|
10719
10789
|
{
|
|
10720
10790
|
label: "Address line 1",
|
|
@@ -10722,7 +10792,7 @@ You can add it back at any time.`
|
|
|
10722
10792
|
...register("addressLine1"),
|
|
10723
10793
|
error: errors.addressLine1?.message
|
|
10724
10794
|
}
|
|
10725
|
-
), /* @__PURE__ */
|
|
10795
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10726
10796
|
Input,
|
|
10727
10797
|
{
|
|
10728
10798
|
label: "Address line 2 (optional)",
|
|
@@ -10730,7 +10800,7 @@ You can add it back at any time.`
|
|
|
10730
10800
|
...register("addressLine2"),
|
|
10731
10801
|
error: errors.addressLine2?.message
|
|
10732
10802
|
}
|
|
10733
|
-
), /* @__PURE__ */
|
|
10803
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10734
10804
|
Input,
|
|
10735
10805
|
{
|
|
10736
10806
|
label: "City",
|
|
@@ -10738,7 +10808,7 @@ You can add it back at any time.`
|
|
|
10738
10808
|
...register("city"),
|
|
10739
10809
|
error: errors.city?.message
|
|
10740
10810
|
}
|
|
10741
|
-
), /* @__PURE__ */
|
|
10811
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10742
10812
|
Input,
|
|
10743
10813
|
{
|
|
10744
10814
|
label: "State / Region",
|
|
@@ -10746,7 +10816,7 @@ You can add it back at any time.`
|
|
|
10746
10816
|
...register("state"),
|
|
10747
10817
|
error: errors.state?.message
|
|
10748
10818
|
}
|
|
10749
|
-
)), /* @__PURE__ */
|
|
10819
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10750
10820
|
Input,
|
|
10751
10821
|
{
|
|
10752
10822
|
label: "Postal code",
|
|
@@ -10754,7 +10824,7 @@ You can add it back at any time.`
|
|
|
10754
10824
|
...register("zipCode"),
|
|
10755
10825
|
error: errors.zipCode?.message
|
|
10756
10826
|
}
|
|
10757
|
-
), /* @__PURE__ */
|
|
10827
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10758
10828
|
Input,
|
|
10759
10829
|
{
|
|
10760
10830
|
label: "Country",
|
|
@@ -10762,35 +10832,35 @@ You can add it back at any time.`
|
|
|
10762
10832
|
...register("country"),
|
|
10763
10833
|
error: errors.country?.message
|
|
10764
10834
|
}
|
|
10765
|
-
)), /* @__PURE__ */
|
|
10835
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement("label", { className: "flex flex-col gap-2 rounded-2xl border border-slate-200 p-4" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-semibold text-slate-700" }, "Address type"), /* @__PURE__ */ React21__default.default.createElement(
|
|
10766
10836
|
"select",
|
|
10767
10837
|
{
|
|
10768
10838
|
...register("addressType"),
|
|
10769
10839
|
className: "rounded-xl border border-slate-200 px-3 py-2 text-sm text-slate-700 focus:border-primary-400 focus:outline-none focus:ring-2 focus:ring-primary-500/20"
|
|
10770
10840
|
},
|
|
10771
|
-
/* @__PURE__ */
|
|
10772
|
-
/* @__PURE__ */
|
|
10773
|
-
/* @__PURE__ */
|
|
10774
|
-
)), /* @__PURE__ */
|
|
10841
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Shipping" }, "Shipping"),
|
|
10842
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Billing" }, "Billing"),
|
|
10843
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Both" }, "Billing & Shipping")
|
|
10844
|
+
)), /* @__PURE__ */ React21__default.default.createElement("label", { className: "flex items-center justify-between gap-4 rounded-2xl border border-slate-200 bg-slate-50 px-4 py-3 text-sm font-medium text-slate-700" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Set as default address"), /* @__PURE__ */ React21__default.default.createElement(
|
|
10775
10845
|
"input",
|
|
10776
10846
|
{
|
|
10777
10847
|
type: "checkbox",
|
|
10778
10848
|
...register("isDefault"),
|
|
10779
10849
|
className: "h-4 w-4 rounded border-primary-300 text-primary-600 focus:ring-primary-500"
|
|
10780
10850
|
}
|
|
10781
|
-
))), /* @__PURE__ */
|
|
10851
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-end gap-3" }, /* @__PURE__ */ React21__default.default.createElement(Button, { type: "button", variant: "outline", onClick: closeModal }, "Cancel"), /* @__PURE__ */ React21__default.default.createElement(Button, { type: "submit", isLoading: isSubmitting }, editingAddress ? "Save changes" : "Save address")))
|
|
10782
10852
|
));
|
|
10783
10853
|
}
|
|
10784
10854
|
function useWishlistProducts(productIds = []) {
|
|
10785
|
-
const [products, setProducts] =
|
|
10786
|
-
const [isLoading, setIsLoading] =
|
|
10787
|
-
const [error, setError] =
|
|
10788
|
-
const [cache] =
|
|
10789
|
-
const uniqueIds =
|
|
10855
|
+
const [products, setProducts] = React21.useState([]);
|
|
10856
|
+
const [isLoading, setIsLoading] = React21.useState(false);
|
|
10857
|
+
const [error, setError] = React21.useState(null);
|
|
10858
|
+
const [cache] = React21.useState(() => /* @__PURE__ */ new Map());
|
|
10859
|
+
const uniqueIds = React21.useMemo(
|
|
10790
10860
|
() => Array.from(new Set((productIds || []).filter(Boolean))),
|
|
10791
10861
|
[productIds]
|
|
10792
10862
|
);
|
|
10793
|
-
const fetchProducts =
|
|
10863
|
+
const fetchProducts = React21.useCallback(async () => {
|
|
10794
10864
|
if (uniqueIds.length === 0) {
|
|
10795
10865
|
setProducts([]);
|
|
10796
10866
|
setIsLoading(false);
|
|
@@ -10818,7 +10888,7 @@ function useWishlistProducts(productIds = []) {
|
|
|
10818
10888
|
setIsLoading(false);
|
|
10819
10889
|
}
|
|
10820
10890
|
}, [cache, uniqueIds]);
|
|
10821
|
-
|
|
10891
|
+
React21.useEffect(() => {
|
|
10822
10892
|
fetchProducts();
|
|
10823
10893
|
}, [fetchProducts]);
|
|
10824
10894
|
return {
|
|
@@ -10850,10 +10920,10 @@ function WishlistScreen() {
|
|
|
10850
10920
|
const { products: wishlistProducts, isLoading, error } = useWishlistProducts(
|
|
10851
10921
|
wishlistItems
|
|
10852
10922
|
);
|
|
10853
|
-
const [onlyInStock, setOnlyInStock] =
|
|
10854
|
-
const [viewMode, setViewMode] =
|
|
10855
|
-
const [sortOption, setSortOption] =
|
|
10856
|
-
|
|
10923
|
+
const [onlyInStock, setOnlyInStock] = React21.useState(false);
|
|
10924
|
+
const [viewMode, setViewMode] = React21.useState("list");
|
|
10925
|
+
const [sortOption, setSortOption] = React21.useState("featured");
|
|
10926
|
+
React21.useEffect(() => {
|
|
10857
10927
|
if (error) {
|
|
10858
10928
|
sonner.toast.error("We had trouble loading your saved products. Please try again.");
|
|
10859
10929
|
}
|
|
@@ -10875,11 +10945,11 @@ function WishlistScreen() {
|
|
|
10875
10945
|
console.error("Error clearing wishlist:", err);
|
|
10876
10946
|
}
|
|
10877
10947
|
};
|
|
10878
|
-
const totalValue =
|
|
10948
|
+
const totalValue = React21.useMemo(
|
|
10879
10949
|
() => wishlistProducts.reduce((sum, product) => sum + (product.finalPrice ?? 0), 0),
|
|
10880
10950
|
[wishlistProducts]
|
|
10881
10951
|
);
|
|
10882
|
-
|
|
10952
|
+
React21.useMemo(
|
|
10883
10953
|
() => wishlistProducts.reduce((sum, product) => {
|
|
10884
10954
|
const before = product.priceBeforeDiscount ?? product.finalPrice ?? 0;
|
|
10885
10955
|
const after = product.finalPrice ?? 0;
|
|
@@ -10888,11 +10958,11 @@ function WishlistScreen() {
|
|
|
10888
10958
|
}, 0),
|
|
10889
10959
|
[wishlistProducts]
|
|
10890
10960
|
);
|
|
10891
|
-
|
|
10961
|
+
React21.useMemo(
|
|
10892
10962
|
() => wishlistProducts.filter((product) => (product.inventoryCount ?? 0) > 0).length,
|
|
10893
10963
|
[wishlistProducts]
|
|
10894
10964
|
);
|
|
10895
|
-
const processedProducts =
|
|
10965
|
+
const processedProducts = React21.useMemo(() => {
|
|
10896
10966
|
let list = [...wishlistProducts];
|
|
10897
10967
|
if (onlyInStock) {
|
|
10898
10968
|
list = list.filter((product) => (product.inventoryCount ?? 0) > 0);
|
|
@@ -10918,14 +10988,14 @@ function WishlistScreen() {
|
|
|
10918
10988
|
return list;
|
|
10919
10989
|
}, [wishlistProducts, onlyInStock, sortOption]);
|
|
10920
10990
|
const emptyAfterFiltering = !isLoading && wishlistProducts.length > 0 && processedProducts.length === 0;
|
|
10921
|
-
return /* @__PURE__ */
|
|
10991
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50 pb-16" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] pb-32 pt-16 text-white" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 opacity-40 mix-blend-soft-light", "aria-hidden": "true" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute -top-1/2 right-1/2 h-[40rem] w-[40rem] rounded-full bg-white/10 blur-3xl" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute left-1/4 top-1/4 h-48 w-48 rounded-full bg-white/20 blur-2xl" })), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "max-w-3xl space-y-6" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: "h-4 w-4" }), "Wishlist"), /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold leading-tight md:text-5xl" }, "Curate your pharmacy must-haves in one calming space"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "We keep your favourite products ready for reorder, refill reminders, and quick checkout\u2014exactly when you need them.")))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-20" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10922
10992
|
framerMotion.motion.div,
|
|
10923
10993
|
{
|
|
10924
10994
|
initial: { opacity: 0, y: 24 },
|
|
10925
10995
|
animate: { opacity: 1, y: 0 },
|
|
10926
10996
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-xl shadow-primary-50"
|
|
10927
10997
|
},
|
|
10928
|
-
/* @__PURE__ */
|
|
10998
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-6" }, !isAuthenticated && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex min-h-[40vh] items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "max-w-lg rounded-3xl border border-slate-100 bg-white p-10 text-center shadow-lg shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-primary-50 text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: "h-8 w-8" })), /* @__PURE__ */ React21__default.default.createElement("h2", { className: "mt-6 text-3xl font-bold text-slate-900" }, "Sign in to see your favourites"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-slate-500" }, "Create your curated shelf of products and we'll keep them ready whenever you return."), /* @__PURE__ */ React21__default.default.createElement(Button, { className: "mt-6", onClick: () => router.push(buildPath("/login")) }, "Sign In"))), isAuthenticated && /* @__PURE__ */ React21__default.default.createElement(React21__default.default.Fragment, null, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React21__default.default.createElement("h2", { className: "text-2xl font-semibold text-slate-900" }, "Your saved collection"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, "Total value: ", /* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold text-primary-600" }, formatPrice(totalValue)), onlyInStock && " \u2022 Showing items ready to ship")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement("label", { className: "inline-flex cursor-pointer items-center gap-2 rounded-full border border-slate-200 bg-slate-50 px-3 py-1.5 text-sm font-medium text-slate-600 transition hover:border-primary-200 hover:text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10929
10999
|
"input",
|
|
10930
11000
|
{
|
|
10931
11001
|
type: "checkbox",
|
|
@@ -10933,54 +11003,54 @@ function WishlistScreen() {
|
|
|
10933
11003
|
onChange: (event) => setOnlyInStock(event.target.checked),
|
|
10934
11004
|
className: "h-4 w-4 rounded border-slate-300 text-primary-600 focus:ring-primary-500"
|
|
10935
11005
|
}
|
|
10936
|
-
), "Only show in-stock"), /* @__PURE__ */
|
|
11006
|
+
), "Only show in-stock"), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2 rounded-full border border-slate-200 bg-slate-50 px-3 py-1.5 text-sm text-slate-600" }, /* @__PURE__ */ React21__default.default.createElement("span", null, "Sort"), /* @__PURE__ */ React21__default.default.createElement(
|
|
10937
11007
|
"select",
|
|
10938
11008
|
{
|
|
10939
11009
|
value: sortOption,
|
|
10940
11010
|
onChange: (event) => setSortOption(event.target.value),
|
|
10941
11011
|
className: "bg-transparent text-sm font-medium text-slate-700 outline-none"
|
|
10942
11012
|
},
|
|
10943
|
-
SORT_OPTIONS.map((option) => /* @__PURE__ */
|
|
10944
|
-
)), /* @__PURE__ */
|
|
11013
|
+
SORT_OPTIONS.map((option) => /* @__PURE__ */ React21__default.default.createElement("option", { key: option.value, value: option.value }, option.label))
|
|
11014
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex overflow-hidden rounded-full border border-slate-200 bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10945
11015
|
"button",
|
|
10946
11016
|
{
|
|
10947
11017
|
type: "button",
|
|
10948
11018
|
onClick: () => setViewMode("grid"),
|
|
10949
11019
|
className: `flex items-center gap-1 px-3 py-1.5 text-sm font-medium transition ${viewMode === "grid" ? "bg-primary-600 text-white shadow-lg shadow-primary-500/30" : "text-slate-600 hover:bg-white"}`
|
|
10950
11020
|
},
|
|
10951
|
-
/* @__PURE__ */
|
|
11021
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Grid, { className: "h-4 w-4" }),
|
|
10952
11022
|
"Grid"
|
|
10953
|
-
), /* @__PURE__ */
|
|
11023
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10954
11024
|
"button",
|
|
10955
11025
|
{
|
|
10956
11026
|
type: "button",
|
|
10957
11027
|
onClick: () => setViewMode("list"),
|
|
10958
11028
|
className: `flex items-center gap-1 px-3 py-1.5 text-sm font-medium transition ${viewMode === "list" ? "bg-primary-600 text-white shadow-lg shadow-primary-500/30" : "text-slate-600 hover:bg-white"}`
|
|
10959
11029
|
},
|
|
10960
|
-
/* @__PURE__ */
|
|
11030
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.List, { className: "h-4 w-4" }),
|
|
10961
11031
|
"List"
|
|
10962
|
-
)), wishlistCount > 0 && /* @__PURE__ */
|
|
11032
|
+
)), wishlistCount > 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
10963
11033
|
Button,
|
|
10964
11034
|
{
|
|
10965
11035
|
variant: "ghost",
|
|
10966
11036
|
className: "text-sm font-semibold text-slate-500 hover:text-red-500",
|
|
10967
11037
|
onClick: handleClearWishlist
|
|
10968
11038
|
},
|
|
10969
|
-
/* @__PURE__ */
|
|
11039
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-4 w-4" }),
|
|
10970
11040
|
"Clear all"
|
|
10971
|
-
))), isLoading && /* @__PURE__ */
|
|
11041
|
+
))), isLoading && /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3" }, Array.from({ length: Math.min(wishlistCount || 3, 6) }).map((_, index) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10972
11042
|
"div",
|
|
10973
11043
|
{
|
|
10974
11044
|
key: index,
|
|
10975
11045
|
className: "h-72 animate-pulse rounded-2xl border border-slate-200 bg-slate-100"
|
|
10976
11046
|
}
|
|
10977
|
-
))), !isLoading && wishlistCount === 0 && /* @__PURE__ */
|
|
11047
|
+
))), !isLoading && wishlistCount === 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex min-h-[30vh] items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "max-w-2xl rounded-3xl border border-slate-100 bg-white p-12 text-center shadow-xl shadow-primary-50" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "mx-auto flex h-20 w-20 items-center justify-center rounded-full bg-primary-100 text-primary-600" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-10 w-10" })), /* @__PURE__ */ React21__default.default.createElement("h2", { className: "mt-6 text-4xl font-bold text-slate-900" }, "Start your wellness wishlist"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-4 text-lg text-slate-500" }, "Bookmark pharmacy essentials, supplements, or skincare picks and we'll keep them safe until you're ready to checkout."), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-8 flex flex-wrap justify-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(Button, { onClick: () => router.push(buildPath("/shop")) }, "Discover products"), /* @__PURE__ */ React21__default.default.createElement(Button, { variant: "outline", onClick: () => router.push(buildPath("/categories")) }, "Browse categories")))), !isLoading && processedProducts.length > 0 && /* @__PURE__ */ React21__default.default.createElement(React21__default.default.Fragment, null, viewMode === "grid" ? /* @__PURE__ */ React21__default.default.createElement(
|
|
10978
11048
|
framerMotion.motion.div,
|
|
10979
11049
|
{
|
|
10980
11050
|
layout: true,
|
|
10981
11051
|
className: "grid grid-cols-1 gap-5 sm:grid-cols-2 xl:grid-cols-3"
|
|
10982
11052
|
},
|
|
10983
|
-
/* @__PURE__ */
|
|
11053
|
+
/* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, processedProducts.map((product) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10984
11054
|
framerMotion.motion.div,
|
|
10985
11055
|
{
|
|
10986
11056
|
key: product.id,
|
|
@@ -10990,7 +11060,7 @@ function WishlistScreen() {
|
|
|
10990
11060
|
exit: { opacity: 0, y: -20 },
|
|
10991
11061
|
transition: { duration: 0.2 }
|
|
10992
11062
|
},
|
|
10993
|
-
/* @__PURE__ */
|
|
11063
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
10994
11064
|
ProductCard,
|
|
10995
11065
|
{
|
|
10996
11066
|
product,
|
|
@@ -11000,7 +11070,7 @@ function WishlistScreen() {
|
|
|
11000
11070
|
}
|
|
11001
11071
|
)
|
|
11002
11072
|
)))
|
|
11003
|
-
) : /* @__PURE__ */
|
|
11073
|
+
) : /* @__PURE__ */ React21__default.default.createElement(framerMotion.motion.div, { layout: true, className: "space-y-4" }, /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, processedProducts.map((product) => /* @__PURE__ */ React21__default.default.createElement(
|
|
11004
11074
|
framerMotion.motion.div,
|
|
11005
11075
|
{
|
|
11006
11076
|
key: product.id,
|
|
@@ -11011,7 +11081,7 @@ function WishlistScreen() {
|
|
|
11011
11081
|
transition: { duration: 0.2 },
|
|
11012
11082
|
className: "flex flex-col gap-4 rounded-2xl border border-slate-100 bg-slate-50 p-4 shadow-sm shadow-primary-50 sm:flex-row sm:items-center"
|
|
11013
11083
|
},
|
|
11014
|
-
/* @__PURE__ */
|
|
11084
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative h-28 w-full overflow-hidden rounded-2xl bg-white sm:w-40" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11015
11085
|
Image3__default.default,
|
|
11016
11086
|
{
|
|
11017
11087
|
fill: true,
|
|
@@ -11020,14 +11090,14 @@ function WishlistScreen() {
|
|
|
11020
11090
|
className: "h-full w-full object-cover"
|
|
11021
11091
|
}
|
|
11022
11092
|
)),
|
|
11023
|
-
/* @__PURE__ */
|
|
11093
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-1 flex-col gap-2" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center justify-between gap-3" }, /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-slate-900" }, product.name), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm text-slate-500" }, product.parentCategories?.map((category) => category?.name).join(", ") || "General wellness")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "text-right" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-lg font-bold text-primary-600" }, formatPrice(product.finalPrice ?? 0)), product.isDiscounted && /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-xs text-emerald-500" }, "You save ", formatPrice(Math.max((product.priceBeforeDiscount ?? 0) - (product.finalPrice ?? 0), 0))))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap items-center gap-3 text-xs text-slate-500" }, /* @__PURE__ */ React21__default.default.createElement("span", { className: `inline-flex items-center gap-1 rounded-full px-2.5 py-1 font-medium ${product.inventoryCount > 0 ? "bg-emerald-100 text-emerald-700" : "bg-rose-100 text-rose-700"}` }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Package, { className: "h-3.5 w-3.5" }), product.inventoryCount > 0 ? "In stock" : "Backordered"), product.totalSold > 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-1 rounded-full bg-slate-200 px-2.5 py-1 font-medium text-slate-700" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-3.5 w-3.5" }), product.totalSold, "+ purchased")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11024
11094
|
Button,
|
|
11025
11095
|
{
|
|
11026
11096
|
size: "sm",
|
|
11027
11097
|
onClick: () => router.push(buildPath(`/products/${product.id}`))
|
|
11028
11098
|
},
|
|
11029
11099
|
"View details"
|
|
11030
|
-
), /* @__PURE__ */
|
|
11100
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11031
11101
|
Button,
|
|
11032
11102
|
{
|
|
11033
11103
|
size: "sm",
|
|
@@ -11037,7 +11107,7 @@ function WishlistScreen() {
|
|
|
11037
11107
|
},
|
|
11038
11108
|
"Remove"
|
|
11039
11109
|
)))
|
|
11040
|
-
))))), isAuthenticated && emptyAfterFiltering && /* @__PURE__ */
|
|
11110
|
+
))))), isAuthenticated && emptyAfterFiltering && /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col items-center justify-center rounded-2xl border border-dashed border-slate-200 bg-slate-50 p-12 text-center" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex h-16 w-16 items-center justify-center rounded-full bg-slate-200 text-slate-500" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Package, { className: "h-8 w-8" })), /* @__PURE__ */ React21__default.default.createElement("h3", { className: "mt-6 text-2xl font-semibold text-slate-900" }, "Nothing matches those filters"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-2 max-w-md text-sm text-slate-500" }, "Try showing out-of-stock items or adjust your sort order to revisit everything you\u2019ve saved."), /* @__PURE__ */ React21__default.default.createElement(Button, { className: "mt-6", variant: "outline", onClick: () => setOnlyInStock(false) }, "Show all saved products"))))
|
|
11041
11111
|
))));
|
|
11042
11112
|
}
|
|
11043
11113
|
function SearchPage() {
|
|
@@ -11045,12 +11115,12 @@ function SearchPage() {
|
|
|
11045
11115
|
const { buildPath } = useBasePath();
|
|
11046
11116
|
const searchParams = navigation.useSearchParams();
|
|
11047
11117
|
const searchQuery = searchParams.get("q") || "";
|
|
11048
|
-
const [products, setProducts] =
|
|
11049
|
-
const [isLoading, setIsLoading] =
|
|
11050
|
-
const [searchInput, setSearchInput] =
|
|
11051
|
-
const [hasSearched, setHasSearched] =
|
|
11118
|
+
const [products, setProducts] = React21.useState([]);
|
|
11119
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
11120
|
+
const [searchInput, setSearchInput] = React21.useState(searchQuery);
|
|
11121
|
+
const [hasSearched, setHasSearched] = React21.useState(false);
|
|
11052
11122
|
const { isInWishlist } = useWishlist();
|
|
11053
|
-
|
|
11123
|
+
React21.useEffect(() => {
|
|
11054
11124
|
const fetchSearchResults = async () => {
|
|
11055
11125
|
if (!searchQuery.trim()) {
|
|
11056
11126
|
setProducts([]);
|
|
@@ -11151,31 +11221,31 @@ function CategoriesScreen() {
|
|
|
11151
11221
|
const { categories, isLoading } = useCategories();
|
|
11152
11222
|
const router = navigation.useRouter();
|
|
11153
11223
|
const { buildPath } = useBasePath();
|
|
11154
|
-
return /* @__PURE__ */
|
|
11224
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement("section", { className: "relative overflow-hidden bg-gradient-to-br from-[rgb(var(--header-from))] via-[rgb(var(--header-via))] to-[rgb(var(--header-to))] text-white mb-8" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11155
11225
|
framerMotion.motion.div,
|
|
11156
11226
|
{
|
|
11157
11227
|
initial: { opacity: 0, y: 24 },
|
|
11158
11228
|
animate: { opacity: 1, y: 0 },
|
|
11159
11229
|
className: "space-y-6"
|
|
11160
11230
|
},
|
|
11161
|
-
/* @__PURE__ */
|
|
11162
|
-
/* @__PURE__ */
|
|
11163
|
-
))), /* @__PURE__ */
|
|
11231
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-3 py-1 text-sm font-semibold uppercase tracking-[0.35em] text-white/70 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Package, { className: "h-4 w-4" }), "Product Categories"),
|
|
11232
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Browse Our Product Range"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "max-w-2xl text-white/80 md:text-lg" }, "Explore our comprehensive selection of healthcare products, carefully curated by our pharmacists to meet all your wellness needs.")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "rounded-3xl bg-white/15 p-6 backdrop-blur" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.35em] text-white/70" }, "Quick tip"), /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-3 text-sm text-white/80" }, "Use the categories below to quickly find the products you're looking for, or use the search function for specific items.")))
|
|
11233
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative -mt-16 pb-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11164
11234
|
framerMotion.motion.div,
|
|
11165
11235
|
{
|
|
11166
11236
|
initial: { opacity: 0, y: 24 },
|
|
11167
11237
|
animate: { opacity: 1, y: 0 },
|
|
11168
11238
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
11169
11239
|
},
|
|
11170
|
-
/* @__PURE__ */
|
|
11171
|
-
isLoading ? /* @__PURE__ */
|
|
11240
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3 text-sm text-slate-500 mb-6" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Sparkles, { className: "h-4 w-4 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "Browse our complete product catalog organized by categories.")),
|
|
11241
|
+
isLoading ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6" }, [...Array(8)].map((_, i) => /* @__PURE__ */ React21__default.default.createElement("div", { key: i, className: "animate-pulse" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "bg-gray-200 rounded-lg aspect-square mb-2" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-4 bg-gray-200 rounded w-3/4 mb-1" }), /* @__PURE__ */ React21__default.default.createElement("div", { className: "h-3 bg-gray-200 rounded w-1/2" })))) : categories.length > 0 ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6" }, categories.map((category) => /* @__PURE__ */ React21__default.default.createElement(
|
|
11172
11242
|
Link8__default.default,
|
|
11173
11243
|
{
|
|
11174
11244
|
key: category.id,
|
|
11175
11245
|
href: buildPath(`/shop?category=${category.name}`),
|
|
11176
11246
|
className: "group block overflow-hidden rounded-xl border border-gray-100 bg-white p-4 text-center transition hover:shadow-lg hover:border-primary-500"
|
|
11177
11247
|
},
|
|
11178
|
-
/* @__PURE__ */
|
|
11248
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative aspect-square w-full overflow-hidden rounded-lg bg-gray-50 mb-3" }, category.image ? /* @__PURE__ */ React21__default.default.createElement(
|
|
11179
11249
|
Image3__default.default,
|
|
11180
11250
|
{
|
|
11181
11251
|
src: category.image,
|
|
@@ -11184,10 +11254,10 @@ function CategoriesScreen() {
|
|
|
11184
11254
|
className: "object-cover transition-transform group-hover:scale-105",
|
|
11185
11255
|
sizes: "(max-width: 768px) 50vw, (max-width: 1200px) 33vw, 25vw"
|
|
11186
11256
|
}
|
|
11187
|
-
) : /* @__PURE__ */
|
|
11188
|
-
/* @__PURE__ */
|
|
11189
|
-
category.productCount > 0 && /* @__PURE__ */
|
|
11190
|
-
))) : /* @__PURE__ */
|
|
11257
|
+
) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex h-full w-full items-center justify-center bg-gray-100 text-gray-400" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Package, { className: "h-12 w-12" }))),
|
|
11258
|
+
/* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900 group-hover:text-primary-600 transition-colors" }, category.name),
|
|
11259
|
+
category.productCount > 0 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-sm text-gray-500" }, category.productCount, " ", category.productCount === 1 ? "product" : "products")
|
|
11260
|
+
))) : /* @__PURE__ */ React21__default.default.createElement(
|
|
11191
11261
|
EmptyState,
|
|
11192
11262
|
{
|
|
11193
11263
|
title: "No categories found",
|
|
@@ -11201,7 +11271,7 @@ function CategoriesScreen() {
|
|
|
11201
11271
|
}
|
|
11202
11272
|
function NewAddressPage() {
|
|
11203
11273
|
const router = navigation.useRouter();
|
|
11204
|
-
const [isSubmitting, setIsSubmitting] =
|
|
11274
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
11205
11275
|
const {
|
|
11206
11276
|
register,
|
|
11207
11277
|
handleSubmit,
|
|
@@ -11343,9 +11413,9 @@ function Header() {
|
|
|
11343
11413
|
const { cart } = useCart() || { cart: { } };
|
|
11344
11414
|
const { getWishlistCount } = useWishlist();
|
|
11345
11415
|
const wishlistCount = getWishlistCount?.() || 0;
|
|
11346
|
-
const [isMobileMenuOpen, setIsMobileMenuOpen] =
|
|
11347
|
-
const [isSearchOpen, setIsSearchOpen] =
|
|
11348
|
-
const [searchQuery, setSearchQuery] =
|
|
11416
|
+
const [isMobileMenuOpen, setIsMobileMenuOpen] = React21.useState(false);
|
|
11417
|
+
const [isSearchOpen, setIsSearchOpen] = React21.useState(false);
|
|
11418
|
+
const [searchQuery, setSearchQuery] = React21.useState("");
|
|
11349
11419
|
const { buildPath } = useBasePath();
|
|
11350
11420
|
const navLinks = [
|
|
11351
11421
|
{ href: buildPath("/shop"), label: "Shop" },
|
|
@@ -11354,7 +11424,7 @@ function Header() {
|
|
|
11354
11424
|
{ href: buildPath("/about"), label: "About" },
|
|
11355
11425
|
{ href: buildPath("/contact"), label: "Contact" }
|
|
11356
11426
|
];
|
|
11357
|
-
return /* @__PURE__ */
|
|
11427
|
+
return /* @__PURE__ */ React21__default.default.createElement("header", { className: "sticky top-0 z-40 bg-white/80 backdrop-blur-xl border-b border-gray-200 shadow-sm" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center justify-between h-20" }, /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/"), className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative w-12 h-12" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11358
11428
|
Image3__default.default,
|
|
11359
11429
|
{
|
|
11360
11430
|
src: config.logo,
|
|
@@ -11362,7 +11432,7 @@ function Header() {
|
|
|
11362
11432
|
fill: true,
|
|
11363
11433
|
className: "object-contain"
|
|
11364
11434
|
}
|
|
11365
|
-
)), /* @__PURE__ */
|
|
11435
|
+
)), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-2xl font-bold text-gray-900 hidden sm:block" }, config.storeName)), /* @__PURE__ */ React21__default.default.createElement("nav", { className: "hidden lg:flex items-center gap-8" }, navLinks.map((link) => /* @__PURE__ */ React21__default.default.createElement(
|
|
11366
11436
|
Link8__default.default,
|
|
11367
11437
|
{
|
|
11368
11438
|
key: link.href,
|
|
@@ -11370,16 +11440,16 @@ function Header() {
|
|
|
11370
11440
|
className: "text-gray-700 hover:text-primary-600 font-medium transition-colors relative group"
|
|
11371
11441
|
},
|
|
11372
11442
|
link.label,
|
|
11373
|
-
/* @__PURE__ */
|
|
11374
|
-
))), /* @__PURE__ */
|
|
11443
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "absolute bottom-0 left-0 w-0 h-0.5 bg-primary-600 group-hover:w-full transition-all duration-300" })
|
|
11444
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11375
11445
|
"button",
|
|
11376
11446
|
{
|
|
11377
11447
|
onClick: () => setIsSearchOpen(!isSearchOpen),
|
|
11378
11448
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
11379
11449
|
"aria-label": "Search"
|
|
11380
11450
|
},
|
|
11381
|
-
/* @__PURE__ */
|
|
11382
|
-
), /* @__PURE__ */
|
|
11451
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Search, { className: "w-5 h-5 text-gray-700" })
|
|
11452
|
+
), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isSearchOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
11383
11453
|
framerMotion.motion.div,
|
|
11384
11454
|
{
|
|
11385
11455
|
initial: { opacity: 0, width: 0 },
|
|
@@ -11387,7 +11457,7 @@ function Header() {
|
|
|
11387
11457
|
exit: { opacity: 0, width: 0 },
|
|
11388
11458
|
className: "absolute right-0 top-full mt-2 bg-white rounded-lg shadow-lg overflow-hidden"
|
|
11389
11459
|
},
|
|
11390
|
-
/* @__PURE__ */
|
|
11460
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center p-2 w-64" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Search, { className: "w-5 h-5 text-gray-400 mr-2" }), /* @__PURE__ */ React21__default.default.createElement(
|
|
11391
11461
|
"input",
|
|
11392
11462
|
{
|
|
11393
11463
|
type: "text",
|
|
@@ -11402,36 +11472,36 @@ function Header() {
|
|
|
11402
11472
|
className: "w-full outline-none text-gray-700",
|
|
11403
11473
|
autoFocus: true
|
|
11404
11474
|
}
|
|
11405
|
-
), searchQuery && /* @__PURE__ */
|
|
11475
|
+
), searchQuery && /* @__PURE__ */ React21__default.default.createElement(
|
|
11406
11476
|
"button",
|
|
11407
11477
|
{
|
|
11408
11478
|
onClick: () => setSearchQuery(""),
|
|
11409
11479
|
className: "text-gray-400 hover:text-gray-600"
|
|
11410
11480
|
},
|
|
11411
|
-
/* @__PURE__ */
|
|
11481
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "w-4 h-4" })
|
|
11412
11482
|
))
|
|
11413
|
-
))), /* @__PURE__ */
|
|
11483
|
+
))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/wishlist"), className: "relative p-2 text-gray-700 hover:text-red-500 transition-colors" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: "w-6 h-6" }), wishlistCount > 0 && /* @__PURE__ */ React21__default.default.createElement("span", { className: "absolute -top-1 -right-1 bg-red-500 text-white text-xs font-bold rounded-full w-5 h-5 flex items-center justify-center" }, wishlistCount)), /* @__PURE__ */ React21__default.default.createElement(Link8__default.default, { href: buildPath("/cart"), className: "relative p-2 text-gray-700 hover:text-primary-600 transition-colors" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShoppingCart, { className: "w-6 h-6" }), cart?.cartBody?.items?.length && cart.cartBody?.items?.length > 0 ? /* @__PURE__ */ React21__default.default.createElement("span", { className: "absolute -top-1 -right-1 bg-red-500 text-white text-xs font-bold rounded-full w-5 h-5 flex items-center justify-center" }, cart.cartBody?.items?.length) : null), isAuthenticated ? /* @__PURE__ */ React21__default.default.createElement(
|
|
11414
11484
|
Link8__default.default,
|
|
11415
11485
|
{
|
|
11416
11486
|
href: buildPath("/account"),
|
|
11417
11487
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors"
|
|
11418
11488
|
},
|
|
11419
|
-
/* @__PURE__ */
|
|
11420
|
-
) : /* @__PURE__ */
|
|
11489
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.User, { className: "w-6 h-6 text-gray-700" })
|
|
11490
|
+
) : /* @__PURE__ */ React21__default.default.createElement(
|
|
11421
11491
|
Link8__default.default,
|
|
11422
11492
|
{
|
|
11423
11493
|
href: buildPath("/login"),
|
|
11424
11494
|
className: "hidden sm:block px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors font-medium"
|
|
11425
11495
|
},
|
|
11426
11496
|
"Sign In"
|
|
11427
|
-
)), /* @__PURE__ */
|
|
11497
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
11428
11498
|
"button",
|
|
11429
11499
|
{
|
|
11430
11500
|
className: "lg:hidden p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
11431
11501
|
onClick: () => setIsMobileMenuOpen(!isMobileMenuOpen)
|
|
11432
11502
|
},
|
|
11433
|
-
isMobileMenuOpen ? /* @__PURE__ */
|
|
11434
|
-
)), /* @__PURE__ */
|
|
11503
|
+
isMobileMenuOpen ? /* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "w-6 h-6" }) : /* @__PURE__ */ React21__default.default.createElement(lucideReact.Menu, { className: "w-6 h-6" })
|
|
11504
|
+
)), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isMobileMenuOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
11435
11505
|
framerMotion.motion.div,
|
|
11436
11506
|
{
|
|
11437
11507
|
initial: { opacity: 0, height: 0 },
|
|
@@ -11439,7 +11509,7 @@ function Header() {
|
|
|
11439
11509
|
exit: { opacity: 0, height: 0 },
|
|
11440
11510
|
className: "lg:hidden overflow-hidden border-t border-gray-200"
|
|
11441
11511
|
},
|
|
11442
|
-
/* @__PURE__ */
|
|
11512
|
+
/* @__PURE__ */ React21__default.default.createElement("nav", { className: "flex flex-col gap-1 py-2" }, navLinks.map((link) => /* @__PURE__ */ React21__default.default.createElement(
|
|
11443
11513
|
Link8__default.default,
|
|
11444
11514
|
{
|
|
11445
11515
|
key: link.href,
|
|
@@ -11448,7 +11518,7 @@ function Header() {
|
|
|
11448
11518
|
onClick: () => setIsMobileMenuOpen(false)
|
|
11449
11519
|
},
|
|
11450
11520
|
link.label
|
|
11451
|
-
)), !isAuthenticated && /* @__PURE__ */
|
|
11521
|
+
)), !isAuthenticated && /* @__PURE__ */ React21__default.default.createElement(
|
|
11452
11522
|
Link8__default.default,
|
|
11453
11523
|
{
|
|
11454
11524
|
href: buildPath("/login"),
|
|
@@ -11487,48 +11557,48 @@ function Footer() {
|
|
|
11487
11557
|
{ label: "Cookie Policy", href: buildPath("/cookies") }
|
|
11488
11558
|
]
|
|
11489
11559
|
};
|
|
11490
|
-
return /* @__PURE__ */
|
|
11560
|
+
return /* @__PURE__ */ React21__default.default.createElement("footer", { className: "bg-gray-900 text-gray-300" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "container mx-auto px-4 py-16" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-12" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "lg:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-2xl font-bold text-white mb-4" }, config.storeName), /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-400 mb-6 max-w-md" }, "Your trusted online store for quality products. We deliver excellence with every order."), /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Mail, { className: "w-5 h-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "support@", config.storeName.toLowerCase().replace(/\s+/g, ""), ".com")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.Phone, { className: "w-5 h-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "+1 (555) 123-4567")), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "w-5 h-5 text-primary-500" }), /* @__PURE__ */ React21__default.default.createElement("span", null, "123 Store Street, City, Country")))), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-lg font-semibold text-white mb-4" }, "Shop"), /* @__PURE__ */ React21__default.default.createElement("ul", { className: "space-y-2" }, footerLinks.shop.map((link) => /* @__PURE__ */ React21__default.default.createElement("li", { key: link.href }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11491
11561
|
Link8__default.default,
|
|
11492
11562
|
{
|
|
11493
11563
|
href: link.href,
|
|
11494
11564
|
className: "hover:text-primary-500 transition-colors"
|
|
11495
11565
|
},
|
|
11496
11566
|
link.label
|
|
11497
|
-
))))), /* @__PURE__ */
|
|
11567
|
+
))))), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-lg font-semibold text-white mb-4" }, "Account"), /* @__PURE__ */ React21__default.default.createElement("ul", { className: "space-y-2" }, footerLinks.account.map((link) => /* @__PURE__ */ React21__default.default.createElement("li", { key: link.href }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11498
11568
|
Link8__default.default,
|
|
11499
11569
|
{
|
|
11500
11570
|
href: link.href,
|
|
11501
11571
|
className: "hover:text-primary-500 transition-colors"
|
|
11502
11572
|
},
|
|
11503
11573
|
link.label
|
|
11504
|
-
))))), /* @__PURE__ */
|
|
11574
|
+
))))), /* @__PURE__ */ React21__default.default.createElement("div", null, /* @__PURE__ */ React21__default.default.createElement("h4", { className: "text-lg font-semibold text-white mb-4" }, "Support"), /* @__PURE__ */ React21__default.default.createElement("ul", { className: "space-y-2" }, footerLinks.support.map((link) => /* @__PURE__ */ React21__default.default.createElement("li", { key: link.href }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11505
11575
|
Link8__default.default,
|
|
11506
11576
|
{
|
|
11507
11577
|
href: link.href,
|
|
11508
11578
|
className: "hover:text-primary-500 transition-colors"
|
|
11509
11579
|
},
|
|
11510
11580
|
link.label
|
|
11511
|
-
)))))), /* @__PURE__ */
|
|
11581
|
+
)))))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center gap-4" }, /* @__PURE__ */ React21__default.default.createElement("p", { className: "text-gray-400 text-sm" }, "\xA9 ", (/* @__PURE__ */ new Date()).getFullYear(), " ", config.storeName, ". All rights reserved."), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
11512
11582
|
"a",
|
|
11513
11583
|
{
|
|
11514
11584
|
href: "#",
|
|
11515
11585
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11516
11586
|
},
|
|
11517
|
-
/* @__PURE__ */
|
|
11518
|
-
), /* @__PURE__ */
|
|
11587
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Facebook, { className: "w-5 h-5" })
|
|
11588
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11519
11589
|
"a",
|
|
11520
11590
|
{
|
|
11521
11591
|
href: "#",
|
|
11522
11592
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11523
11593
|
},
|
|
11524
|
-
/* @__PURE__ */
|
|
11525
|
-
), /* @__PURE__ */
|
|
11594
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Twitter, { className: "w-5 h-5" })
|
|
11595
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11526
11596
|
"a",
|
|
11527
11597
|
{
|
|
11528
11598
|
href: "#",
|
|
11529
11599
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11530
11600
|
},
|
|
11531
|
-
/* @__PURE__ */
|
|
11601
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Instagram, { className: "w-5 h-5" })
|
|
11532
11602
|
)))));
|
|
11533
11603
|
}
|
|
11534
11604
|
|