hey-pharmacist-ecommerce 1.1.6 → 1.1.8
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 +600 -597
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +404 -401
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/AddressFormModal.tsx +2 -2
- package/src/lib/Apis/wrapper.ts +6 -2
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
|
|
@@ -6884,17 +6884,20 @@ globalAxios4__default.default.interceptors.request.use(async (config) => {
|
|
|
6884
6884
|
}
|
|
6885
6885
|
return config;
|
|
6886
6886
|
});
|
|
6887
|
-
var
|
|
6887
|
+
var abortController;
|
|
6888
|
+
if (typeof window !== "undefined") {
|
|
6889
|
+
abortController = new AbortController();
|
|
6890
|
+
}
|
|
6888
6891
|
var AXIOS_CONFIG = new Configuration({
|
|
6889
6892
|
basePath: BaseUrl,
|
|
6890
6893
|
baseOptions: {
|
|
6891
|
-
signal:
|
|
6894
|
+
signal: abortController?.signal,
|
|
6892
6895
|
timeout: 2e4
|
|
6893
6896
|
}
|
|
6894
6897
|
});
|
|
6895
|
-
var WishlistContext =
|
|
6898
|
+
var WishlistContext = React21.createContext(void 0);
|
|
6896
6899
|
function WishlistProvider({ children }) {
|
|
6897
|
-
const [state, setState] =
|
|
6900
|
+
const [state, setState] = React21.useState({
|
|
6898
6901
|
_id: "",
|
|
6899
6902
|
createdAt: /* @__PURE__ */ new Date(),
|
|
6900
6903
|
updatedAt: /* @__PURE__ */ new Date(),
|
|
@@ -6902,8 +6905,8 @@ function WishlistProvider({ children }) {
|
|
|
6902
6905
|
products: []
|
|
6903
6906
|
});
|
|
6904
6907
|
const { isAuthenticated } = useAuth() || {};
|
|
6905
|
-
const wishlistApi =
|
|
6906
|
-
const fetchWishlist =
|
|
6908
|
+
const wishlistApi = React21.useMemo(() => new WishlistApi(AXIOS_CONFIG), []);
|
|
6909
|
+
const fetchWishlist = React21.useCallback(async () => {
|
|
6907
6910
|
if (!isAuthenticated) {
|
|
6908
6911
|
setState((prev) => ({
|
|
6909
6912
|
...prev,
|
|
@@ -6932,7 +6935,7 @@ function WishlistProvider({ children }) {
|
|
|
6932
6935
|
}));
|
|
6933
6936
|
}
|
|
6934
6937
|
}, [isAuthenticated]);
|
|
6935
|
-
|
|
6938
|
+
React21.useEffect(() => {
|
|
6936
6939
|
fetchWishlist();
|
|
6937
6940
|
}, [fetchWishlist]);
|
|
6938
6941
|
const addToWishlist = async (product) => {
|
|
@@ -6994,7 +6997,7 @@ function WishlistProvider({ children }) {
|
|
|
6994
6997
|
const refreshWishlist = async () => {
|
|
6995
6998
|
await fetchWishlist();
|
|
6996
6999
|
};
|
|
6997
|
-
return /* @__PURE__ */
|
|
7000
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
6998
7001
|
WishlistContext.Provider,
|
|
6999
7002
|
{
|
|
7000
7003
|
value: {
|
|
@@ -7011,13 +7014,13 @@ function WishlistProvider({ children }) {
|
|
|
7011
7014
|
);
|
|
7012
7015
|
}
|
|
7013
7016
|
var useWishlist = () => {
|
|
7014
|
-
const context =
|
|
7017
|
+
const context = React21.useContext(WishlistContext);
|
|
7015
7018
|
if (context === void 0) {
|
|
7016
7019
|
throw new Error("useWishlist must be used within a WishlistProvider");
|
|
7017
7020
|
}
|
|
7018
7021
|
return context;
|
|
7019
7022
|
};
|
|
7020
|
-
var BasePathContext =
|
|
7023
|
+
var BasePathContext = React21.createContext(void 0);
|
|
7021
7024
|
function BasePathProvider({ basePath = "", children }) {
|
|
7022
7025
|
const normalized = basePath ? basePath.startsWith("/") ? basePath : `/${basePath}` : "";
|
|
7023
7026
|
const buildPath = (path) => {
|
|
@@ -7027,21 +7030,21 @@ function BasePathProvider({ basePath = "", children }) {
|
|
|
7027
7030
|
if (path.startsWith("/")) return `${normalized}${path}`;
|
|
7028
7031
|
return `${normalized}/${path}`;
|
|
7029
7032
|
};
|
|
7030
|
-
return /* @__PURE__ */
|
|
7033
|
+
return /* @__PURE__ */ React21__default.default.createElement(BasePathContext.Provider, { value: { basePath: normalized, buildPath } }, children);
|
|
7031
7034
|
}
|
|
7032
7035
|
function useBasePath() {
|
|
7033
|
-
const ctx =
|
|
7036
|
+
const ctx = React21.useContext(BasePathContext);
|
|
7034
7037
|
if (!ctx) throw new Error("useBasePath must be used within BasePathProvider");
|
|
7035
7038
|
return ctx;
|
|
7036
7039
|
}
|
|
7037
7040
|
function EcommerceProvider({ config, children, withToaster = true, basePath = "" }) {
|
|
7038
|
-
|
|
7041
|
+
React21.useEffect(() => {
|
|
7039
7042
|
initializeApiAdapter(config);
|
|
7040
7043
|
}, [config]);
|
|
7041
|
-
const [client] =
|
|
7044
|
+
const [client] = React21__default.default.useState(
|
|
7042
7045
|
new reactQuery.QueryClient({ defaultOptions: { queries: { staleTime: 5e3 } } })
|
|
7043
7046
|
);
|
|
7044
|
-
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 })))))));
|
|
7045
7048
|
}
|
|
7046
7049
|
|
|
7047
7050
|
// src/lib/utils/format.ts
|
|
@@ -7085,14 +7088,14 @@ function ProductCard({
|
|
|
7085
7088
|
}) {
|
|
7086
7089
|
const router = navigation.useRouter();
|
|
7087
7090
|
const { buildPath } = useBasePath();
|
|
7088
|
-
const [isFavorite, setIsFavorite] =
|
|
7091
|
+
const [isFavorite, setIsFavorite] = React21.useState(isFavorited);
|
|
7089
7092
|
const { addToWishlist, removeFromWishlist, isInWishlist } = useWishlist();
|
|
7090
|
-
const [isHovered, setIsHovered] =
|
|
7091
|
-
const [isImageLoaded, setIsImageLoaded] =
|
|
7092
|
-
const handleImageLoad =
|
|
7093
|
+
const [isHovered, setIsHovered] = React21.useState(false);
|
|
7094
|
+
const [isImageLoaded, setIsImageLoaded] = React21.useState(false);
|
|
7095
|
+
const handleImageLoad = React21.useCallback(() => {
|
|
7093
7096
|
setIsImageLoaded(true);
|
|
7094
7097
|
}, []);
|
|
7095
|
-
const handleCardClick =
|
|
7098
|
+
const handleCardClick = React21.useCallback((e) => {
|
|
7096
7099
|
if (onClickProduct) {
|
|
7097
7100
|
e.preventDefault();
|
|
7098
7101
|
onClickProduct(product);
|
|
@@ -7116,7 +7119,7 @@ function ProductCard({
|
|
|
7116
7119
|
sonner.toast.error("Failed to update wishlist");
|
|
7117
7120
|
}
|
|
7118
7121
|
};
|
|
7119
|
-
|
|
7122
|
+
React21.useEffect(() => {
|
|
7120
7123
|
setIsFavorite(isInWishlist(product?._id || "") || isFavorited);
|
|
7121
7124
|
}, [isFavorited, isInWishlist, product?._id]);
|
|
7122
7125
|
const handleKeyDown = (e) => {
|
|
@@ -7125,13 +7128,13 @@ function ProductCard({
|
|
|
7125
7128
|
handleCardClick(e);
|
|
7126
7129
|
}
|
|
7127
7130
|
};
|
|
7128
|
-
|
|
7131
|
+
React21.useMemo(() => {
|
|
7129
7132
|
return {
|
|
7130
7133
|
src: product.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
7131
7134
|
alt: product.name || "Product image"
|
|
7132
7135
|
};
|
|
7133
7136
|
}, [product.productMedia, product.name]);
|
|
7134
|
-
return /* @__PURE__ */
|
|
7137
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7135
7138
|
framerMotion.motion.article,
|
|
7136
7139
|
{
|
|
7137
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",
|
|
@@ -7144,7 +7147,7 @@ function ProductCard({
|
|
|
7144
7147
|
onClick: handleCardClick,
|
|
7145
7148
|
onKeyDown: handleKeyDown
|
|
7146
7149
|
},
|
|
7147
|
-
/* @__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(
|
|
7148
7151
|
framerMotion.motion.div,
|
|
7149
7152
|
{
|
|
7150
7153
|
className: "absolute inset-0 bg-gray-200 animate-pulse",
|
|
@@ -7152,7 +7155,7 @@ function ProductCard({
|
|
|
7152
7155
|
exit: { opacity: 0 },
|
|
7153
7156
|
transition: { duration: 0.2 }
|
|
7154
7157
|
}
|
|
7155
|
-
)), product.productMedia?.[0]?.file && /* @__PURE__ */
|
|
7158
|
+
)), product.productMedia?.[0]?.file && /* @__PURE__ */ React21__default.default.createElement(
|
|
7156
7159
|
Image3__default.default,
|
|
7157
7160
|
{
|
|
7158
7161
|
src: product.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
@@ -7163,7 +7166,7 @@ function ProductCard({
|
|
|
7163
7166
|
priority: false,
|
|
7164
7167
|
onLoad: handleImageLoad
|
|
7165
7168
|
}
|
|
7166
|
-
), /* @__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(
|
|
7167
7170
|
framerMotion.motion.span,
|
|
7168
7171
|
{
|
|
7169
7172
|
initial: { scale: 0.9, opacity: 0 },
|
|
@@ -7173,7 +7176,7 @@ function ProductCard({
|
|
|
7173
7176
|
"-",
|
|
7174
7177
|
product.discountAmount,
|
|
7175
7178
|
"%"
|
|
7176
|
-
), product.inventoryCount === 0 && /* @__PURE__ */
|
|
7179
|
+
), product.inventoryCount === 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
7177
7180
|
framerMotion.motion.span,
|
|
7178
7181
|
{
|
|
7179
7182
|
initial: { scale: 0.9, opacity: 0 },
|
|
@@ -7181,7 +7184,7 @@ function ProductCard({
|
|
|
7181
7184
|
className: "inline-flex items-center justify-center px-2.5 py-1 rounded-full text-xs font-bold text-white bg-red-600"
|
|
7182
7185
|
},
|
|
7183
7186
|
"Out of Stock"
|
|
7184
|
-
)), showFavoriteButton && /* @__PURE__ */
|
|
7187
|
+
)), showFavoriteButton && /* @__PURE__ */ React21__default.default.createElement(
|
|
7185
7188
|
framerMotion.motion.button,
|
|
7186
7189
|
{
|
|
7187
7190
|
type: "button",
|
|
@@ -7191,10 +7194,10 @@ function ProductCard({
|
|
|
7191
7194
|
whileTap: { scale: 0.95 },
|
|
7192
7195
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7193
7196
|
},
|
|
7194
|
-
/* @__PURE__ */
|
|
7197
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: `w-5 h-5 ${isFavorite ? "fill-current" : ""}` })
|
|
7195
7198
|
)),
|
|
7196
|
-
/* @__PURE__ */
|
|
7197
|
-
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(
|
|
7198
7201
|
"button",
|
|
7199
7202
|
{
|
|
7200
7203
|
type: "button",
|
|
@@ -7202,10 +7205,10 @@ function ProductCard({
|
|
|
7202
7205
|
className: `absolute top-2 right-2 p-2 rounded-full transition-colors ${isFavorite ? "text-red-500" : "text-gray-400 hover:text-red-500"}`,
|
|
7203
7206
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7204
7207
|
},
|
|
7205
|
-
/* @__PURE__ */
|
|
7208
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Heart, { className: `w-5 h-5 ${isFavorite ? "fill-current" : ""}` })
|
|
7206
7209
|
),
|
|
7207
|
-
/* @__PURE__ */
|
|
7208
|
-
/* @__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(
|
|
7209
7212
|
"button",
|
|
7210
7213
|
{
|
|
7211
7214
|
type: "button",
|
|
@@ -7216,7 +7219,7 @@ function ProductCard({
|
|
|
7216
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`
|
|
7217
7220
|
},
|
|
7218
7221
|
"View Product"
|
|
7219
|
-
), showFavoriteButton && /* @__PURE__ */
|
|
7222
|
+
), showFavoriteButton && /* @__PURE__ */ React21__default.default.createElement(
|
|
7220
7223
|
"button",
|
|
7221
7224
|
{
|
|
7222
7225
|
type: "button",
|
|
@@ -7224,7 +7227,7 @@ function ProductCard({
|
|
|
7224
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",
|
|
7225
7228
|
"aria-label": isFavorite ? "Remove from wishlist" : "Add to wishlist"
|
|
7226
7229
|
},
|
|
7227
|
-
/* @__PURE__ */
|
|
7230
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
7228
7231
|
lucideReact.Heart,
|
|
7229
7232
|
{
|
|
7230
7233
|
className: `mr-2 h-4 w-4 ${isFavorite ? "fill-red-500 text-red-500" : "text-primary-600"}`
|
|
@@ -7235,13 +7238,13 @@ function ProductCard({
|
|
|
7235
7238
|
);
|
|
7236
7239
|
}
|
|
7237
7240
|
function Skeleton({ className = "" }) {
|
|
7238
|
-
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}` });
|
|
7239
7242
|
}
|
|
7240
7243
|
function ProductCardSkeleton() {
|
|
7241
|
-
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" }))));
|
|
7242
7245
|
}
|
|
7243
7246
|
function OrderCardSkeleton() {
|
|
7244
|
-
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" })));
|
|
7245
7248
|
}
|
|
7246
7249
|
var MotionDiv = dynamic__default.default(() => import('framer-motion').then((mod) => mod.motion.div), {
|
|
7247
7250
|
ssr: false
|
|
@@ -7267,14 +7270,14 @@ function Button({
|
|
|
7267
7270
|
md: "px-6 py-3 text-base",
|
|
7268
7271
|
lg: "px-8 py-4 text-lg"
|
|
7269
7272
|
};
|
|
7270
|
-
return /* @__PURE__ */
|
|
7273
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7271
7274
|
MotionDiv,
|
|
7272
7275
|
{
|
|
7273
7276
|
whileHover: { scale: 1.02 },
|
|
7274
7277
|
whileTap: { scale: 0.98 },
|
|
7275
7278
|
className: "inline-block"
|
|
7276
7279
|
},
|
|
7277
|
-
/* @__PURE__ */
|
|
7280
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
7278
7281
|
"button",
|
|
7279
7282
|
{
|
|
7280
7283
|
className: `${baseStyles} ${variants[variant]} ${sizes[size]} ${className}`,
|
|
@@ -7283,18 +7286,18 @@ function Button({
|
|
|
7283
7286
|
"aria-busy": isLoading,
|
|
7284
7287
|
...props
|
|
7285
7288
|
},
|
|
7286
|
-
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
|
|
7287
7290
|
)
|
|
7288
7291
|
);
|
|
7289
7292
|
}
|
|
7290
7293
|
|
|
7291
7294
|
// src/components/EmptyState.tsx
|
|
7292
7295
|
function EmptyState({ icon: Icon, title, description, actionLabel, onAction }) {
|
|
7293
|
-
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));
|
|
7294
7297
|
}
|
|
7295
|
-
var Input =
|
|
7298
|
+
var Input = React21.forwardRef(
|
|
7296
7299
|
({ label, error, helperText, className = "", ...props }, ref) => {
|
|
7297
|
-
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(
|
|
7298
7301
|
"input",
|
|
7299
7302
|
{
|
|
7300
7303
|
ref,
|
|
@@ -7308,21 +7311,21 @@ var Input = React20.forwardRef(
|
|
|
7308
7311
|
`,
|
|
7309
7312
|
...props
|
|
7310
7313
|
}
|
|
7311
|
-
), 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));
|
|
7312
7315
|
}
|
|
7313
7316
|
);
|
|
7314
7317
|
Input.displayName = "Input";
|
|
7315
7318
|
function useProducts(filters, page = 1, limit = 20) {
|
|
7316
|
-
const [products, setProducts] =
|
|
7317
|
-
const [isLoading, setIsLoading] =
|
|
7318
|
-
const [error, setError] =
|
|
7319
|
-
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({
|
|
7320
7323
|
page: 1,
|
|
7321
7324
|
limit: 20,
|
|
7322
7325
|
total: 0,
|
|
7323
7326
|
totalPages: 0
|
|
7324
7327
|
});
|
|
7325
|
-
const fetchProducts =
|
|
7328
|
+
const fetchProducts = React21.useCallback(async () => {
|
|
7326
7329
|
setIsLoading(true);
|
|
7327
7330
|
setError(null);
|
|
7328
7331
|
try {
|
|
@@ -7378,16 +7381,16 @@ function useProducts(filters, page = 1, limit = 20) {
|
|
|
7378
7381
|
}
|
|
7379
7382
|
setIsLoading(false);
|
|
7380
7383
|
}, [filters, page, limit]);
|
|
7381
|
-
|
|
7384
|
+
React21.useEffect(() => {
|
|
7382
7385
|
fetchProducts();
|
|
7383
7386
|
}, [fetchProducts]);
|
|
7384
7387
|
return { products, isLoading, error, pagination };
|
|
7385
7388
|
}
|
|
7386
7389
|
function useProduct(id) {
|
|
7387
|
-
const [product, setProduct] =
|
|
7388
|
-
const [isLoading, setIsLoading] =
|
|
7389
|
-
const [error, setError] =
|
|
7390
|
-
|
|
7390
|
+
const [product, setProduct] = React21.useState(null);
|
|
7391
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
7392
|
+
const [error, setError] = React21.useState(null);
|
|
7393
|
+
React21.useEffect(() => {
|
|
7391
7394
|
const fetchProduct = async () => {
|
|
7392
7395
|
setIsLoading(true);
|
|
7393
7396
|
setError(null);
|
|
@@ -7404,10 +7407,10 @@ function useProduct(id) {
|
|
|
7404
7407
|
return { product, isLoading, error };
|
|
7405
7408
|
}
|
|
7406
7409
|
function useCategories() {
|
|
7407
|
-
const [categories, setCategories] =
|
|
7408
|
-
const [isLoading, setIsLoading] =
|
|
7409
|
-
const [error, setError] =
|
|
7410
|
-
|
|
7410
|
+
const [categories, setCategories] = React21.useState([]);
|
|
7411
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
7412
|
+
const [error, setError] = React21.useState(null);
|
|
7413
|
+
React21.useEffect(() => {
|
|
7411
7414
|
const fetchCategories = async () => {
|
|
7412
7415
|
try {
|
|
7413
7416
|
setIsLoading(true);
|
|
@@ -7429,19 +7432,19 @@ function useCategories() {
|
|
|
7429
7432
|
function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
7430
7433
|
const router = navigation.useRouter();
|
|
7431
7434
|
const { buildPath } = useBasePath();
|
|
7432
|
-
const [filters, setFilters] =
|
|
7433
|
-
const [page, setPage] =
|
|
7434
|
-
const [showFilters, setShowFilters] =
|
|
7435
|
-
const [searchQuery, setSearchQuery] =
|
|
7436
|
-
const [isSearching, setIsSearching] =
|
|
7437
|
-
const [sortOption, setSortOption] =
|
|
7438
|
-
const [viewMode, setViewMode] =
|
|
7439
|
-
const [selectedPriceRange, setSelectedPriceRange] =
|
|
7440
|
-
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({
|
|
7441
7444
|
min: "",
|
|
7442
7445
|
max: ""
|
|
7443
7446
|
});
|
|
7444
|
-
const [expandedCategories, setExpandedCategories] =
|
|
7447
|
+
const [expandedCategories, setExpandedCategories] = React21.useState({});
|
|
7445
7448
|
const { products, isLoading, pagination } = useProducts(filters, page, 20);
|
|
7446
7449
|
const { categories } = useCategories();
|
|
7447
7450
|
const handleSearch = (e) => {
|
|
@@ -7461,7 +7464,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7461
7464
|
router.push(buildPath(`/search?q=${encodeURIComponent(searchQuery.trim())}`));
|
|
7462
7465
|
}
|
|
7463
7466
|
};
|
|
7464
|
-
const priceRanges =
|
|
7467
|
+
const priceRanges = React21.useMemo(
|
|
7465
7468
|
() => [
|
|
7466
7469
|
{ label: `Under ${formatPrice(25)}`, value: "under-25", min: void 0, max: 25 },
|
|
7467
7470
|
{ label: `${formatPrice(25)} - ${formatPrice(50)}`, value: "25-50", min: 25, max: 50 },
|
|
@@ -7470,13 +7473,13 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7470
7473
|
],
|
|
7471
7474
|
[]
|
|
7472
7475
|
);
|
|
7473
|
-
|
|
7476
|
+
React21.useEffect(() => {
|
|
7474
7477
|
setCustomPrice({
|
|
7475
7478
|
min: filters.minPrice !== void 0 ? String(filters.minPrice) : "",
|
|
7476
7479
|
max: filters.maxPrice !== void 0 ? String(filters.maxPrice) : ""
|
|
7477
7480
|
});
|
|
7478
7481
|
}, [filters.minPrice, filters.maxPrice]);
|
|
7479
|
-
|
|
7482
|
+
React21.useEffect(() => {
|
|
7480
7483
|
const updates = {};
|
|
7481
7484
|
if (filters.category) updates[filters.category] = true;
|
|
7482
7485
|
if (filters.subCategory) {
|
|
@@ -7489,18 +7492,18 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7489
7492
|
setExpandedCategories((prev) => ({ ...prev, ...updates }));
|
|
7490
7493
|
}
|
|
7491
7494
|
}, [filters.category, filters.subCategory, categories]);
|
|
7492
|
-
const toggleCategoryExpand =
|
|
7495
|
+
const toggleCategoryExpand = React21.useCallback((id) => {
|
|
7493
7496
|
setExpandedCategories((prev) => ({ ...prev, [id]: !prev[id] }));
|
|
7494
7497
|
}, []);
|
|
7495
|
-
const sortedCategories =
|
|
7498
|
+
const sortedCategories = React21.useMemo(
|
|
7496
7499
|
() => [...categories].sort((a, b) => a.name?.localeCompare(b.name ?? "") ?? 0),
|
|
7497
7500
|
[categories]
|
|
7498
7501
|
);
|
|
7499
|
-
const topCategories =
|
|
7502
|
+
const topCategories = React21.useMemo(
|
|
7500
7503
|
() => [...categories].sort((a, b) => (b.productCount ?? 0) - (a.productCount ?? 0)).slice(0, 6),
|
|
7501
7504
|
[categories]
|
|
7502
7505
|
);
|
|
7503
|
-
const productInsights =
|
|
7506
|
+
const productInsights = React21.useMemo(() => {
|
|
7504
7507
|
if (!products.length) {
|
|
7505
7508
|
return { newArrivals: 0, inStockCount: 0 };
|
|
7506
7509
|
}
|
|
@@ -7513,7 +7516,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7513
7516
|
});
|
|
7514
7517
|
return { newArrivals: newArrivals2, inStockCount };
|
|
7515
7518
|
}, [products]);
|
|
7516
|
-
const insightCards =
|
|
7519
|
+
const insightCards = React21.useMemo(
|
|
7517
7520
|
() => [
|
|
7518
7521
|
{
|
|
7519
7522
|
id: "new",
|
|
@@ -7546,7 +7549,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7546
7549
|
filters.newArrivals
|
|
7547
7550
|
]
|
|
7548
7551
|
);
|
|
7549
|
-
const filteredProducts =
|
|
7552
|
+
const filteredProducts = React21.useMemo(() => {
|
|
7550
7553
|
if (isLoading) return products;
|
|
7551
7554
|
let items = [...products];
|
|
7552
7555
|
if (filters.tags?.length) {
|
|
@@ -7558,7 +7561,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7558
7561
|
}
|
|
7559
7562
|
return items;
|
|
7560
7563
|
}, [isLoading, products, filters.tags, filters.newArrivals]);
|
|
7561
|
-
const sortedProducts =
|
|
7564
|
+
const sortedProducts = React21.useMemo(() => {
|
|
7562
7565
|
if (isLoading) {
|
|
7563
7566
|
return filteredProducts;
|
|
7564
7567
|
}
|
|
@@ -7577,14 +7580,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7577
7580
|
}
|
|
7578
7581
|
}, [isLoading, filteredProducts, sortOption]);
|
|
7579
7582
|
const displayedProducts = sortedProducts;
|
|
7580
|
-
const quickSearches =
|
|
7583
|
+
const quickSearches = React21.useMemo(() => {
|
|
7581
7584
|
const counts = /* @__PURE__ */ new Map();
|
|
7582
7585
|
products.forEach((p) => {
|
|
7583
7586
|
(p.tags || []).forEach((t) => counts.set(t, (counts.get(t) || 0) + 1));
|
|
7584
7587
|
});
|
|
7585
7588
|
return Array.from(counts.entries()).sort((a, b) => b[1] - a[1]).slice(0, 4).map(([tag]) => tag);
|
|
7586
7589
|
}, [products]);
|
|
7587
|
-
const handleQuickSearch =
|
|
7590
|
+
const handleQuickSearch = React21.useCallback((term) => {
|
|
7588
7591
|
setSearchQuery("");
|
|
7589
7592
|
setFilters((current) => ({
|
|
7590
7593
|
...current,
|
|
@@ -7593,7 +7596,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7593
7596
|
}));
|
|
7594
7597
|
setPage(1);
|
|
7595
7598
|
}, []);
|
|
7596
|
-
const handleCategoryChange =
|
|
7599
|
+
const handleCategoryChange = React21.useCallback(
|
|
7597
7600
|
(categorySlug) => {
|
|
7598
7601
|
setFilters((current) => {
|
|
7599
7602
|
if (current.category === categorySlug) {
|
|
@@ -7610,7 +7613,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7610
7613
|
},
|
|
7611
7614
|
[]
|
|
7612
7615
|
);
|
|
7613
|
-
const handleSubCategoryChange =
|
|
7616
|
+
const handleSubCategoryChange = React21.useCallback((parentCategoryId, subCategoryId) => {
|
|
7614
7617
|
setFilters((current) => {
|
|
7615
7618
|
if (current.subCategory === subCategoryId) {
|
|
7616
7619
|
const { subCategory, ...rest } = current;
|
|
@@ -7620,7 +7623,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7620
7623
|
});
|
|
7621
7624
|
setPage(1);
|
|
7622
7625
|
}, []);
|
|
7623
|
-
const handleToggleStock =
|
|
7626
|
+
const handleToggleStock = React21.useCallback(() => {
|
|
7624
7627
|
setFilters((current) => {
|
|
7625
7628
|
if (current.inStock) {
|
|
7626
7629
|
const { inStock, ...rest } = current;
|
|
@@ -7630,7 +7633,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7630
7633
|
});
|
|
7631
7634
|
setPage(1);
|
|
7632
7635
|
}, []);
|
|
7633
|
-
const handleToggleNewArrivals =
|
|
7636
|
+
const handleToggleNewArrivals = React21.useCallback(() => {
|
|
7634
7637
|
setFilters((current) => {
|
|
7635
7638
|
if (current.newArrivals) {
|
|
7636
7639
|
const { newArrivals: newArrivals2, ...rest } = current;
|
|
@@ -7640,21 +7643,21 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7640
7643
|
});
|
|
7641
7644
|
setPage(1);
|
|
7642
7645
|
}, []);
|
|
7643
|
-
const handleClearFilters =
|
|
7646
|
+
const handleClearFilters = React21.useCallback(() => {
|
|
7644
7647
|
setFilters({});
|
|
7645
7648
|
setSearchQuery("");
|
|
7646
7649
|
setSelectedPriceRange(null);
|
|
7647
7650
|
setCustomPrice({ min: "", max: "" });
|
|
7648
7651
|
setPage(1);
|
|
7649
7652
|
}, []);
|
|
7650
|
-
const handleRemoveCategory =
|
|
7653
|
+
const handleRemoveCategory = React21.useCallback(() => {
|
|
7651
7654
|
setFilters((current) => {
|
|
7652
7655
|
const { category, subCategory, ...rest } = current;
|
|
7653
7656
|
return rest;
|
|
7654
7657
|
});
|
|
7655
7658
|
setPage(1);
|
|
7656
7659
|
}, []);
|
|
7657
|
-
const handleRemoveSubCategory =
|
|
7660
|
+
const handleRemoveSubCategory = React21.useCallback(() => {
|
|
7658
7661
|
setFilters((current) => {
|
|
7659
7662
|
const next = { ...current };
|
|
7660
7663
|
delete next.subCategory;
|
|
@@ -7662,7 +7665,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7662
7665
|
});
|
|
7663
7666
|
setPage(1);
|
|
7664
7667
|
}, []);
|
|
7665
|
-
const handleRemoveSearch =
|
|
7668
|
+
const handleRemoveSearch = React21.useCallback(() => {
|
|
7666
7669
|
setFilters((current) => {
|
|
7667
7670
|
const { search, ...rest } = current;
|
|
7668
7671
|
return rest;
|
|
@@ -7670,14 +7673,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7670
7673
|
setSearchQuery("");
|
|
7671
7674
|
setPage(1);
|
|
7672
7675
|
}, []);
|
|
7673
|
-
const handleRemoveInStock =
|
|
7676
|
+
const handleRemoveInStock = React21.useCallback(() => {
|
|
7674
7677
|
setFilters((current) => {
|
|
7675
7678
|
const { inStock, ...rest } = current;
|
|
7676
7679
|
return rest;
|
|
7677
7680
|
});
|
|
7678
7681
|
setPage(1);
|
|
7679
7682
|
}, []);
|
|
7680
|
-
const handleRemovePrice =
|
|
7683
|
+
const handleRemovePrice = React21.useCallback(() => {
|
|
7681
7684
|
setFilters((current) => {
|
|
7682
7685
|
const next = { ...current };
|
|
7683
7686
|
delete next.minPrice;
|
|
@@ -7688,7 +7691,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7688
7691
|
setCustomPrice({ min: "", max: "" });
|
|
7689
7692
|
setPage(1);
|
|
7690
7693
|
}, []);
|
|
7691
|
-
const handleRemoveTag =
|
|
7694
|
+
const handleRemoveTag = React21.useCallback((tag) => {
|
|
7692
7695
|
setFilters((current) => {
|
|
7693
7696
|
if (!current.tags) return current;
|
|
7694
7697
|
const updated = current.tags.filter((item) => item !== tag);
|
|
@@ -7702,7 +7705,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7702
7705
|
});
|
|
7703
7706
|
setPage(1);
|
|
7704
7707
|
}, []);
|
|
7705
|
-
const handlePriceRangeSelect =
|
|
7708
|
+
const handlePriceRangeSelect = React21.useCallback(
|
|
7706
7709
|
(value) => {
|
|
7707
7710
|
const range = priceRanges.find((item) => item.value === value);
|
|
7708
7711
|
if (selectedPriceRange === value) {
|
|
@@ -7741,7 +7744,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7741
7744
|
},
|
|
7742
7745
|
[priceRanges, selectedPriceRange]
|
|
7743
7746
|
);
|
|
7744
|
-
const applyCustomPrice =
|
|
7747
|
+
const applyCustomPrice = React21.useCallback(() => {
|
|
7745
7748
|
const rawMin = customPrice.min.trim();
|
|
7746
7749
|
const rawMax = customPrice.max.trim();
|
|
7747
7750
|
const minValue = rawMin !== "" ? Number(rawMin) : void 0;
|
|
@@ -7778,7 +7781,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7778
7781
|
tags,
|
|
7779
7782
|
newArrivals
|
|
7780
7783
|
} = filters;
|
|
7781
|
-
const activeFilterChips =
|
|
7784
|
+
const activeFilterChips = React21.useMemo(() => {
|
|
7782
7785
|
const chips = [];
|
|
7783
7786
|
if (searchFilter) {
|
|
7784
7787
|
chips.push({
|
|
@@ -7870,7 +7873,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7870
7873
|
]);
|
|
7871
7874
|
const hasActiveFilters = activeFilterChips.length > 0;
|
|
7872
7875
|
const isCustomPriceDirty = customPrice.min.trim() !== "" || customPrice.max.trim() !== "";
|
|
7873
|
-
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(
|
|
7874
7877
|
"button",
|
|
7875
7878
|
{
|
|
7876
7879
|
type: "button",
|
|
@@ -7878,10 +7881,10 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7878
7881
|
className: "text-sm font-semibold text-primary-600 hover:text-primary-700"
|
|
7879
7882
|
},
|
|
7880
7883
|
"Clear all"
|
|
7881
|
-
)), /* @__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) => {
|
|
7882
7885
|
const isCategoryActive = categoryFilter === category.id;
|
|
7883
7886
|
const isExpanded = !!expandedCategories[category.id];
|
|
7884
|
-
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(
|
|
7885
7888
|
"div",
|
|
7886
7889
|
{
|
|
7887
7890
|
role: "button",
|
|
@@ -7892,8 +7895,8 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7892
7895
|
},
|
|
7893
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"}`
|
|
7894
7897
|
},
|
|
7895
|
-
/* @__PURE__ */
|
|
7896
|
-
/* @__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(
|
|
7897
7900
|
"button",
|
|
7898
7901
|
{
|
|
7899
7902
|
type: "button",
|
|
@@ -7905,11 +7908,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7905
7908
|
className: "rounded-md p-1 hover:bg-gray-100",
|
|
7906
7909
|
"aria-label": isExpanded ? "Collapse" : "Expand"
|
|
7907
7910
|
},
|
|
7908
|
-
/* @__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"}` })
|
|
7909
7912
|
)
|
|
7910
|
-
), 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) => {
|
|
7911
7914
|
const isSubActive = subCategoryFilter === sub.id;
|
|
7912
|
-
return /* @__PURE__ */
|
|
7915
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7913
7916
|
"button",
|
|
7914
7917
|
{
|
|
7915
7918
|
key: sub.id,
|
|
@@ -7920,9 +7923,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7920
7923
|
sub.name
|
|
7921
7924
|
);
|
|
7922
7925
|
}))));
|
|
7923
|
-
}))))), /* @__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) => {
|
|
7924
7927
|
const isActive = selectedPriceRange === range.value;
|
|
7925
|
-
return /* @__PURE__ */
|
|
7928
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
7926
7929
|
"button",
|
|
7927
7930
|
{
|
|
7928
7931
|
type: "button",
|
|
@@ -7932,7 +7935,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7932
7935
|
},
|
|
7933
7936
|
range.label
|
|
7934
7937
|
);
|
|
7935
|
-
})), /* @__PURE__ */
|
|
7938
|
+
})), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-2 gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
7936
7939
|
Input,
|
|
7937
7940
|
{
|
|
7938
7941
|
type: "number",
|
|
@@ -7941,7 +7944,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7941
7944
|
value: customPrice.min,
|
|
7942
7945
|
onChange: (event) => setCustomPrice((current) => ({ ...current, min: event.target.value }))
|
|
7943
7946
|
}
|
|
7944
|
-
), /* @__PURE__ */
|
|
7947
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
7945
7948
|
Input,
|
|
7946
7949
|
{
|
|
7947
7950
|
type: "number",
|
|
@@ -7950,7 +7953,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7950
7953
|
value: customPrice.max,
|
|
7951
7954
|
onChange: (event) => setCustomPrice((current) => ({ ...current, max: event.target.value }))
|
|
7952
7955
|
}
|
|
7953
|
-
)), /* @__PURE__ */
|
|
7956
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
7954
7957
|
"button",
|
|
7955
7958
|
{
|
|
7956
7959
|
type: "button",
|
|
@@ -7959,48 +7962,48 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
7959
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"
|
|
7960
7963
|
},
|
|
7961
7964
|
"Apply price range"
|
|
7962
|
-
)), /* @__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(
|
|
7963
7966
|
"button",
|
|
7964
7967
|
{
|
|
7965
7968
|
type: "button",
|
|
7966
7969
|
onClick: handleToggleStock,
|
|
7967
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"}`
|
|
7968
7971
|
},
|
|
7969
|
-
/* @__PURE__ */
|
|
7970
|
-
/* @__PURE__ */
|
|
7971
|
-
), /* @__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(
|
|
7972
7975
|
"button",
|
|
7973
7976
|
{
|
|
7974
7977
|
type: "button",
|
|
7975
7978
|
onClick: handleToggleNewArrivals,
|
|
7976
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"}`
|
|
7977
7980
|
},
|
|
7978
|
-
/* @__PURE__ */
|
|
7979
|
-
/* @__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" })
|
|
7980
7983
|
))));
|
|
7981
|
-
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(
|
|
7982
7985
|
"div",
|
|
7983
7986
|
{
|
|
7984
7987
|
className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]",
|
|
7985
7988
|
"aria-hidden": "true"
|
|
7986
7989
|
}
|
|
7987
|
-
), /* @__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(
|
|
7988
7991
|
framerMotion.motion.div,
|
|
7989
7992
|
{
|
|
7990
7993
|
initial: { opacity: 0, y: 24 },
|
|
7991
7994
|
animate: { opacity: 1, y: 0 },
|
|
7992
7995
|
className: "max-w-3xl space-y-8 text-center md:mx-auto md:text-left"
|
|
7993
7996
|
},
|
|
7994
|
-
/* @__PURE__ */
|
|
7995
|
-
/* @__PURE__ */
|
|
7996
|
-
/* @__PURE__ */
|
|
7997
|
-
/* @__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(
|
|
7998
8001
|
"form",
|
|
7999
8002
|
{
|
|
8000
8003
|
onSubmit: handleSearch,
|
|
8001
8004
|
className: "mx-auto max-w-2xl md:mx-0"
|
|
8002
8005
|
},
|
|
8003
|
-
/* @__PURE__ */
|
|
8006
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative w-full" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8004
8007
|
"input",
|
|
8005
8008
|
{
|
|
8006
8009
|
type: "search",
|
|
@@ -8011,17 +8014,17 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8011
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",
|
|
8012
8015
|
disabled: isSearching
|
|
8013
8016
|
}
|
|
8014
|
-
), /* @__PURE__ */
|
|
8017
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8015
8018
|
"button",
|
|
8016
8019
|
{
|
|
8017
8020
|
type: "submit",
|
|
8018
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",
|
|
8019
8022
|
disabled: !searchQuery.trim() || isSearching
|
|
8020
8023
|
},
|
|
8021
|
-
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" })
|
|
8022
8025
|
))
|
|
8023
8026
|
)
|
|
8024
|
-
), /* @__PURE__ */
|
|
8027
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8025
8028
|
framerMotion.motion.div,
|
|
8026
8029
|
{
|
|
8027
8030
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8029,7 +8032,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8029
8032
|
transition: { delay: 0.15 },
|
|
8030
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"
|
|
8031
8034
|
},
|
|
8032
|
-
/* @__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(
|
|
8033
8036
|
"button",
|
|
8034
8037
|
{
|
|
8035
8038
|
key: term,
|
|
@@ -8039,7 +8042,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8039
8042
|
},
|
|
8040
8043
|
term
|
|
8041
8044
|
)))),
|
|
8042
|
-
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(
|
|
8043
8046
|
"button",
|
|
8044
8047
|
{
|
|
8045
8048
|
key: category.id,
|
|
@@ -8049,9 +8052,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8049
8052
|
},
|
|
8050
8053
|
category.name
|
|
8051
8054
|
))))
|
|
8052
|
-
), /* @__PURE__ */
|
|
8055
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-10 grid gap-4 md:grid-cols-3" }, insightCards.map((card, index) => {
|
|
8053
8056
|
const Icon = card.icon;
|
|
8054
|
-
return /* @__PURE__ */
|
|
8057
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8055
8058
|
framerMotion.motion.div,
|
|
8056
8059
|
{
|
|
8057
8060
|
key: card.id,
|
|
@@ -8064,10 +8067,10 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8064
8067
|
"aria-pressed": card.id === "new" ? newArrivals ? "true" : "false" : void 0,
|
|
8065
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
|
|
8066
8069
|
},
|
|
8067
|
-
/* @__PURE__ */
|
|
8068
|
-
/* @__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)
|
|
8069
8072
|
);
|
|
8070
|
-
})))), /* @__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(
|
|
8071
8074
|
"select",
|
|
8072
8075
|
{
|
|
8073
8076
|
value: sortOption,
|
|
@@ -8076,11 +8079,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8076
8079
|
},
|
|
8077
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"
|
|
8078
8081
|
},
|
|
8079
|
-
/* @__PURE__ */
|
|
8080
|
-
/* @__PURE__ */
|
|
8081
|
-
/* @__PURE__ */
|
|
8082
|
-
/* @__PURE__ */
|
|
8083
|
-
), /* @__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(
|
|
8084
8087
|
"button",
|
|
8085
8088
|
{
|
|
8086
8089
|
type: "button",
|
|
@@ -8088,9 +8091,9 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8088
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"}`,
|
|
8089
8092
|
"aria-pressed": viewMode === "grid"
|
|
8090
8093
|
},
|
|
8091
|
-
/* @__PURE__ */
|
|
8094
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LayoutGrid, { className: "h-4 w-4" }),
|
|
8092
8095
|
"Grid"
|
|
8093
|
-
), /* @__PURE__ */
|
|
8096
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8094
8097
|
"button",
|
|
8095
8098
|
{
|
|
8096
8099
|
type: "button",
|
|
@@ -8098,19 +8101,19 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8098
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"}`,
|
|
8099
8102
|
"aria-pressed": viewMode === "list"
|
|
8100
8103
|
},
|
|
8101
|
-
/* @__PURE__ */
|
|
8104
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LayoutList, { className: "h-4 w-4" }),
|
|
8102
8105
|
"List"
|
|
8103
|
-
)))), /* @__PURE__ */
|
|
8106
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 md:hidden" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8104
8107
|
Button,
|
|
8105
8108
|
{
|
|
8106
8109
|
variant: "outline",
|
|
8107
8110
|
className: "w-full",
|
|
8108
8111
|
onClick: () => setShowFilters(true)
|
|
8109
8112
|
},
|
|
8110
|
-
/* @__PURE__ */
|
|
8113
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.SlidersHorizontal, { className: "h-5 w-5" }),
|
|
8111
8114
|
"Filters",
|
|
8112
|
-
hasActiveFilters && /* @__PURE__ */
|
|
8113
|
-
)), 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(
|
|
8114
8117
|
"button",
|
|
8115
8118
|
{
|
|
8116
8119
|
key: chip.key,
|
|
@@ -8119,8 +8122,8 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8119
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"
|
|
8120
8123
|
},
|
|
8121
8124
|
chip.label,
|
|
8122
|
-
/* @__PURE__ */
|
|
8123
|
-
)), /* @__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(
|
|
8124
8127
|
"button",
|
|
8125
8128
|
{
|
|
8126
8129
|
type: "button",
|
|
@@ -8128,7 +8131,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8128
8131
|
className: "text-sm font-semibold text-gray-500 hover:text-gray-700"
|
|
8129
8132
|
},
|
|
8130
8133
|
"Reset all"
|
|
8131
|
-
))), /* @__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(
|
|
8132
8135
|
ProductCard,
|
|
8133
8136
|
{
|
|
8134
8137
|
product,
|
|
@@ -8137,11 +8140,11 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8137
8140
|
router.push(buildPath(`/products/${item.id}?product=${productData}`));
|
|
8138
8141
|
}
|
|
8139
8142
|
}
|
|
8140
|
-
)))) : /* @__PURE__ */
|
|
8143
|
+
)))) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "space-y-4" }, displayedProducts.map((product) => {
|
|
8141
8144
|
product.priceBeforeDiscount && product.priceBeforeDiscount > product.finalPrice ? Math.round(
|
|
8142
8145
|
(product.priceBeforeDiscount - product.finalPrice) / product.priceBeforeDiscount * 100
|
|
8143
8146
|
) : 0;
|
|
8144
|
-
return /* @__PURE__ */
|
|
8147
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8145
8148
|
framerMotion.motion.div,
|
|
8146
8149
|
{
|
|
8147
8150
|
key: product.id,
|
|
@@ -8149,7 +8152,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8149
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",
|
|
8150
8153
|
onClick: () => router.push(buildPath(`/products/${product.id}`))
|
|
8151
8154
|
},
|
|
8152
|
-
/* @__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(
|
|
8153
8156
|
Image3__default.default,
|
|
8154
8157
|
{
|
|
8155
8158
|
src: product.productMedia[0]?.file || "/placeholder-product.jpg",
|
|
@@ -8158,15 +8161,15 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8158
8161
|
className: "object-cover transition duration-500 group-hover:scale-105"
|
|
8159
8162
|
}
|
|
8160
8163
|
)),
|
|
8161
|
-
/* @__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(
|
|
8162
8165
|
"span",
|
|
8163
8166
|
{
|
|
8164
8167
|
key: tag,
|
|
8165
8168
|
className: "rounded-full bg-slate-100 px-3 py-1 text-gray-600"
|
|
8166
8169
|
},
|
|
8167
8170
|
tag
|
|
8168
|
-
))), /* @__PURE__ */
|
|
8169
|
-
/* @__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(
|
|
8170
8173
|
Button,
|
|
8171
8174
|
{
|
|
8172
8175
|
size: "sm",
|
|
@@ -8178,7 +8181,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8178
8181
|
"View product"
|
|
8179
8182
|
))
|
|
8180
8183
|
);
|
|
8181
|
-
})) : /* @__PURE__ */
|
|
8184
|
+
})) : /* @__PURE__ */ React21__default.default.createElement(
|
|
8182
8185
|
EmptyState,
|
|
8183
8186
|
{
|
|
8184
8187
|
icon: lucideReact.Package,
|
|
@@ -8187,7 +8190,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8187
8190
|
actionLabel: hasActiveFilters ? "Clear filters" : void 0,
|
|
8188
8191
|
onAction: hasActiveFilters ? handleClearFilters : void 0
|
|
8189
8192
|
}
|
|
8190
|
-
)), 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(
|
|
8191
8194
|
Button,
|
|
8192
8195
|
{
|
|
8193
8196
|
variant: "outline",
|
|
@@ -8195,7 +8198,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8195
8198
|
disabled: page === 1
|
|
8196
8199
|
},
|
|
8197
8200
|
"Previous"
|
|
8198
|
-
), /* @__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(
|
|
8199
8202
|
Button,
|
|
8200
8203
|
{
|
|
8201
8204
|
variant: "outline",
|
|
@@ -8203,7 +8206,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8203
8206
|
disabled: page === pagination.totalPages
|
|
8204
8207
|
},
|
|
8205
8208
|
"Next"
|
|
8206
|
-
))))))), /* @__PURE__ */
|
|
8209
|
+
))))))), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, showFilters && /* @__PURE__ */ React21__default.default.createElement(
|
|
8207
8210
|
framerMotion.motion.div,
|
|
8208
8211
|
{
|
|
8209
8212
|
initial: { opacity: 0 },
|
|
@@ -8211,7 +8214,7 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8211
8214
|
exit: { opacity: 0 },
|
|
8212
8215
|
className: "fixed inset-0 z-50 bg-black/40 backdrop-blur-sm lg:hidden"
|
|
8213
8216
|
},
|
|
8214
|
-
/* @__PURE__ */
|
|
8217
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8215
8218
|
framerMotion.motion.div,
|
|
8216
8219
|
{
|
|
8217
8220
|
initial: { y: "100%" },
|
|
@@ -8220,14 +8223,14 @@ function ShopScreen({ initialFilters = {}, categoryName }) {
|
|
|
8220
8223
|
transition: { type: "spring", stiffness: 260, damping: 26 },
|
|
8221
8224
|
className: "absolute inset-x-0 bottom-0 max-h-[85vh] overflow-y-auto rounded-t-3xl bg-white p-6 shadow-2xl"
|
|
8222
8225
|
},
|
|
8223
|
-
/* @__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(
|
|
8224
8227
|
"button",
|
|
8225
8228
|
{
|
|
8226
8229
|
type: "button",
|
|
8227
8230
|
onClick: () => setShowFilters(false),
|
|
8228
8231
|
className: "rounded-full border border-gray-200 p-2 text-gray-500 hover:text-gray-700"
|
|
8229
8232
|
},
|
|
8230
|
-
/* @__PURE__ */
|
|
8233
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "h-4 w-4" })
|
|
8231
8234
|
)),
|
|
8232
8235
|
renderFiltersPanel()
|
|
8233
8236
|
)
|
|
@@ -8246,7 +8249,7 @@ function Badge({ children, variant = "primary", size = "md", className = "" }) {
|
|
|
8246
8249
|
sm: "px-2 py-1 text-xs",
|
|
8247
8250
|
md: "px-3 py-1 text-sm"
|
|
8248
8251
|
};
|
|
8249
|
-
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);
|
|
8250
8253
|
}
|
|
8251
8254
|
var safeFormatDate = (date, format = "long") => {
|
|
8252
8255
|
if (!date) return "N/A";
|
|
@@ -8263,17 +8266,17 @@ function ProductDetailScreen({ productId }) {
|
|
|
8263
8266
|
const { buildPath } = useBasePath();
|
|
8264
8267
|
const { product: productData, isLoading } = useProduct(productId);
|
|
8265
8268
|
const { addToCart } = useCart();
|
|
8266
|
-
const [selectedVariant, setSelectedVariant] =
|
|
8267
|
-
const [quantity, setQuantity] =
|
|
8268
|
-
const [isAddingToCart, setIsAddingToCart] =
|
|
8269
|
-
const [isFavorited, setIsFavorited] =
|
|
8270
|
-
const [relatedProducts, setRelatedProducts] =
|
|
8271
|
-
const [initialProductData, setInitialProductData] =
|
|
8272
|
-
const [activeImageIndex, setActiveImageIndex] =
|
|
8273
|
-
|
|
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(() => {
|
|
8274
8277
|
setActiveImageIndex(0);
|
|
8275
8278
|
}, [selectedVariant]);
|
|
8276
|
-
const product =
|
|
8279
|
+
const product = React21.useMemo(() => {
|
|
8277
8280
|
if (initialProductData && !productData) {
|
|
8278
8281
|
return initialProductData;
|
|
8279
8282
|
}
|
|
@@ -8324,7 +8327,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8324
8327
|
);
|
|
8325
8328
|
const variantSku = currentVariant?.sku || product?.sku || "N/A";
|
|
8326
8329
|
const variantInStock = currentVariant?.inventoryCount > 0;
|
|
8327
|
-
|
|
8330
|
+
React21.useEffect(() => {
|
|
8328
8331
|
if (typeof window === "undefined") return;
|
|
8329
8332
|
const searchParams = new URLSearchParams(window.location.search);
|
|
8330
8333
|
const productParam = searchParams.get("product");
|
|
@@ -8337,13 +8340,13 @@ function ProductDetailScreen({ productId }) {
|
|
|
8337
8340
|
}
|
|
8338
8341
|
}
|
|
8339
8342
|
}, []);
|
|
8340
|
-
|
|
8343
|
+
React21.useEffect(() => {
|
|
8341
8344
|
if (product?.productVariants?.length > 0) {
|
|
8342
8345
|
const newVariant = product?.productVariants?.[0];
|
|
8343
8346
|
setSelectedVariant(newVariant);
|
|
8344
8347
|
}
|
|
8345
8348
|
}, [product?.productVariants]);
|
|
8346
|
-
|
|
8349
|
+
React21.useEffect(() => {
|
|
8347
8350
|
if (!product?.id) return;
|
|
8348
8351
|
const fetchRelated = async () => {
|
|
8349
8352
|
try {
|
|
@@ -8384,7 +8387,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8384
8387
|
}
|
|
8385
8388
|
};
|
|
8386
8389
|
const { addToWishlist, removeFromWishlist, isInWishlist } = useWishlist();
|
|
8387
|
-
|
|
8390
|
+
React21.useEffect(() => {
|
|
8388
8391
|
if (product) {
|
|
8389
8392
|
setIsFavorited(isInWishlist(product.id));
|
|
8390
8393
|
}
|
|
@@ -8406,10 +8409,10 @@ function ProductDetailScreen({ productId }) {
|
|
|
8406
8409
|
}
|
|
8407
8410
|
};
|
|
8408
8411
|
if (isLoading) {
|
|
8409
|
-
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" })))));
|
|
8410
8413
|
}
|
|
8411
8414
|
if (!product) {
|
|
8412
|
-
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"))))));
|
|
8413
8416
|
}
|
|
8414
8417
|
product.tags && product.tags.length > 0 ? product.tags.slice(0, 6) : ["Pharmacist approved", "Gentle on daily routines", "Backed by real customers"];
|
|
8415
8418
|
const highlightCards = [
|
|
@@ -8429,29 +8432,29 @@ function ProductDetailScreen({ productId }) {
|
|
|
8429
8432
|
description: "Average rating 4.8/5 with over 120 verified customer experiences."
|
|
8430
8433
|
}
|
|
8431
8434
|
];
|
|
8432
|
-
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(
|
|
8433
8436
|
"div",
|
|
8434
8437
|
{
|
|
8435
8438
|
className: "absolute inset-0 bg-[radial-gradient(circle_at_top_left,_rgba(255,255,255,0.35),_transparent_60%)]",
|
|
8436
8439
|
"aria-hidden": "true"
|
|
8437
8440
|
}
|
|
8438
|
-
), /* @__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(
|
|
8439
8442
|
Button,
|
|
8440
8443
|
{
|
|
8441
8444
|
variant: "ghost",
|
|
8442
8445
|
className: "text-white hover:bg-white/10",
|
|
8443
8446
|
onClick: () => router.push(buildPath("/shop"))
|
|
8444
8447
|
},
|
|
8445
|
-
/* @__PURE__ */
|
|
8448
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowLeft, { className: "h-5 w-5" }),
|
|
8446
8449
|
"Continue shopping"
|
|
8447
|
-
), /* @__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(
|
|
8448
8451
|
framerMotion.motion.div,
|
|
8449
8452
|
{
|
|
8450
8453
|
initial: { opacity: 0, y: 24 },
|
|
8451
8454
|
animate: { opacity: 1, y: 0 },
|
|
8452
8455
|
className: "max-w-3xl space-y-4"
|
|
8453
8456
|
},
|
|
8454
|
-
product.category && /* @__PURE__ */
|
|
8457
|
+
product.category && /* @__PURE__ */ React21__default.default.createElement(
|
|
8455
8458
|
Badge,
|
|
8456
8459
|
{
|
|
8457
8460
|
variant: "secondary",
|
|
@@ -8459,9 +8462,9 @@ function ProductDetailScreen({ productId }) {
|
|
|
8459
8462
|
},
|
|
8460
8463
|
product.category
|
|
8461
8464
|
),
|
|
8462
|
-
/* @__PURE__ */
|
|
8463
|
-
/* @__PURE__ */
|
|
8464
|
-
)))), /* @__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(
|
|
8465
8468
|
framerMotion.motion.div,
|
|
8466
8469
|
{
|
|
8467
8470
|
key: variantImages[activeImageIndex],
|
|
@@ -8470,7 +8473,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8470
8473
|
transition: { duration: 0.35 },
|
|
8471
8474
|
className: "relative overflow-hidden rounded-3xl bg-slate-100 h-[420px] md:h-[560px]"
|
|
8472
8475
|
},
|
|
8473
|
-
/* @__PURE__ */
|
|
8476
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8474
8477
|
Image3__default.default,
|
|
8475
8478
|
{
|
|
8476
8479
|
src: variantImages[activeImageIndex],
|
|
@@ -8481,7 +8484,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8481
8484
|
className: "object-contain"
|
|
8482
8485
|
}
|
|
8483
8486
|
),
|
|
8484
|
-
discount > 0 && /* @__PURE__ */
|
|
8487
|
+
discount > 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
8485
8488
|
Badge,
|
|
8486
8489
|
{
|
|
8487
8490
|
variant: "danger",
|
|
@@ -8491,7 +8494,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8491
8494
|
discount,
|
|
8492
8495
|
"%"
|
|
8493
8496
|
),
|
|
8494
|
-
!variantInStock && /* @__PURE__ */
|
|
8497
|
+
!variantInStock && /* @__PURE__ */ React21__default.default.createElement(
|
|
8495
8498
|
Badge,
|
|
8496
8499
|
{
|
|
8497
8500
|
variant: "secondary",
|
|
@@ -8499,7 +8502,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8499
8502
|
},
|
|
8500
8503
|
"Out of Stock"
|
|
8501
8504
|
)
|
|
8502
|
-
), /* @__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(
|
|
8503
8506
|
"button",
|
|
8504
8507
|
{
|
|
8505
8508
|
key: variant.id,
|
|
@@ -8508,7 +8511,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8508
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"}`
|
|
8509
8512
|
},
|
|
8510
8513
|
variant.name
|
|
8511
|
-
)))), /* @__PURE__ */
|
|
8514
|
+
)))), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid grid-cols-3 gap-3" }, variantImages.map((image, index) => /* @__PURE__ */ React21__default.default.createElement(
|
|
8512
8515
|
"button",
|
|
8513
8516
|
{
|
|
8514
8517
|
key: image.src + index,
|
|
@@ -8516,7 +8519,7 @@ function ProductDetailScreen({ productId }) {
|
|
|
8516
8519
|
onClick: () => setActiveImageIndex(index),
|
|
8517
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"}`
|
|
8518
8521
|
},
|
|
8519
|
-
/* @__PURE__ */
|
|
8522
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8520
8523
|
Image3__default.default,
|
|
8521
8524
|
{
|
|
8522
8525
|
src: image.src,
|
|
@@ -8527,18 +8530,18 @@ function ProductDetailScreen({ productId }) {
|
|
|
8527
8530
|
unoptimized: true
|
|
8528
8531
|
}
|
|
8529
8532
|
)
|
|
8530
|
-
)))))), /* @__PURE__ */
|
|
8533
|
+
)))))), /* @__PURE__ */ React21__default.default.createElement("section", { className: "grid gap-6 lg:grid-cols-3" }, highlightCards.map((card) => {
|
|
8531
8534
|
const Icon = card.icon;
|
|
8532
|
-
return /* @__PURE__ */
|
|
8535
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8533
8536
|
"div",
|
|
8534
8537
|
{
|
|
8535
8538
|
key: card.title,
|
|
8536
8539
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-sm transition hover:-translate-y-1 hover:shadow-lg"
|
|
8537
8540
|
},
|
|
8538
|
-
/* @__PURE__ */
|
|
8539
|
-
/* @__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)
|
|
8540
8543
|
);
|
|
8541
|
-
})), /* @__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(
|
|
8542
8545
|
"button",
|
|
8543
8546
|
{
|
|
8544
8547
|
type: "button",
|
|
@@ -8546,8 +8549,8 @@ function ProductDetailScreen({ productId }) {
|
|
|
8546
8549
|
className: "rounded-l-full p-2 hover:bg-primary-100/60",
|
|
8547
8550
|
"aria-label": "Decrease quantity"
|
|
8548
8551
|
},
|
|
8549
|
-
/* @__PURE__ */
|
|
8550
|
-
), /* @__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(
|
|
8551
8554
|
"button",
|
|
8552
8555
|
{
|
|
8553
8556
|
type: "button",
|
|
@@ -8555,8 +8558,8 @@ function ProductDetailScreen({ productId }) {
|
|
|
8555
8558
|
className: "rounded-r-full p-2 hover:bg-primary-100/60",
|
|
8556
8559
|
"aria-label": "Increase quantity"
|
|
8557
8560
|
},
|
|
8558
|
-
/* @__PURE__ */
|
|
8559
|
-
)))), 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(
|
|
8560
8563
|
Button,
|
|
8561
8564
|
{
|
|
8562
8565
|
size: "lg",
|
|
@@ -8565,9 +8568,9 @@ function ProductDetailScreen({ productId }) {
|
|
|
8565
8568
|
isLoading: isAddingToCart,
|
|
8566
8569
|
disabled: !selectedVariant || selectedVariant.inventoryStatus === "OUT_OF_STOCK" /* OUTOFSTOCK */
|
|
8567
8570
|
},
|
|
8568
|
-
/* @__PURE__ */
|
|
8571
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ShoppingCart, { className: "h-5 w-5" }),
|
|
8569
8572
|
!selectedVariant ? "Select a variant" : selectedVariant.inventoryStatus === "OUT_OF_STOCK" /* OUTOFSTOCK */ ? "Out of Stock" : `Add to Cart`
|
|
8570
|
-
), /* @__PURE__ */
|
|
8573
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8571
8574
|
Button,
|
|
8572
8575
|
{
|
|
8573
8576
|
size: "lg",
|
|
@@ -8575,18 +8578,18 @@ function ProductDetailScreen({ productId }) {
|
|
|
8575
8578
|
className: "w-full",
|
|
8576
8579
|
onClick: handleToggleFavorite
|
|
8577
8580
|
},
|
|
8578
|
-
/* @__PURE__ */
|
|
8581
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
8579
8582
|
lucideReact.Heart,
|
|
8580
8583
|
{
|
|
8581
8584
|
className: `h-5 w-5 ${isFavorited ? "fill-red-500 text-red-500" : "text-slate-500"}`
|
|
8582
8585
|
}
|
|
8583
8586
|
),
|
|
8584
8587
|
isFavorited ? "Saved" : "Save for later"
|
|
8585
|
-
))), /* @__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 })))))));
|
|
8586
8589
|
}
|
|
8587
8590
|
function CartItem({ item }) {
|
|
8588
8591
|
const { updateQuantity, removeFromCart } = useCart();
|
|
8589
|
-
const [isUpdating, setIsUpdating] =
|
|
8592
|
+
const [isUpdating, setIsUpdating] = React21.useState(false);
|
|
8590
8593
|
const handleUpdateQuantity = async (newQuantity) => {
|
|
8591
8594
|
if (newQuantity < 1) return;
|
|
8592
8595
|
setIsUpdating(true);
|
|
@@ -8600,7 +8603,7 @@ function CartItem({ item }) {
|
|
|
8600
8603
|
await removeFromCart(item.productVariantId);
|
|
8601
8604
|
};
|
|
8602
8605
|
const itemTotal = item.productVariantData.finalPrice * item.quantity;
|
|
8603
|
-
return /* @__PURE__ */
|
|
8606
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8604
8607
|
framerMotion.motion.div,
|
|
8605
8608
|
{
|
|
8606
8609
|
layout: true,
|
|
@@ -8609,7 +8612,7 @@ function CartItem({ item }) {
|
|
|
8609
8612
|
exit: { opacity: 0, x: -100 },
|
|
8610
8613
|
className: "flex gap-4 bg-white p-4 rounded-xl border border-gray-200 hover:border-primary-300 transition-colors"
|
|
8611
8614
|
},
|
|
8612
|
-
/* @__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(
|
|
8613
8616
|
Image3__default.default,
|
|
8614
8617
|
{
|
|
8615
8618
|
src: item.productVariantData.productMedia[0]?.file || "/placeholder-product.jpg",
|
|
@@ -8618,32 +8621,32 @@ function CartItem({ item }) {
|
|
|
8618
8621
|
className: "object-cover"
|
|
8619
8622
|
}
|
|
8620
8623
|
)),
|
|
8621
|
-
/* @__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(
|
|
8622
8625
|
"button",
|
|
8623
8626
|
{
|
|
8624
8627
|
onClick: () => handleUpdateQuantity(item.quantity - 1),
|
|
8625
8628
|
disabled: isUpdating || item.quantity <= 0,
|
|
8626
8629
|
className: "p-2 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
|
|
8627
8630
|
},
|
|
8628
|
-
/* @__PURE__ */
|
|
8629
|
-
), /* @__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(
|
|
8630
8633
|
"button",
|
|
8631
8634
|
{
|
|
8632
8635
|
onClick: () => handleUpdateQuantity(item.quantity + 1),
|
|
8633
8636
|
disabled: isUpdating || item.quantity >= item.productVariantData.inventoryCount,
|
|
8634
8637
|
className: "p-2 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
|
|
8635
8638
|
},
|
|
8636
|
-
/* @__PURE__ */
|
|
8637
|
-
)), /* @__PURE__ */
|
|
8639
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "w-4 h-4" })
|
|
8640
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
8638
8641
|
"button",
|
|
8639
8642
|
{
|
|
8640
8643
|
onClick: handleRemove,
|
|
8641
8644
|
className: "p-2 text-red-600 hover:bg-red-50 rounded-lg transition-colors",
|
|
8642
8645
|
"aria-label": "Remove item"
|
|
8643
8646
|
},
|
|
8644
|
-
/* @__PURE__ */
|
|
8647
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "w-5 h-5" })
|
|
8645
8648
|
))),
|
|
8646
|
-
/* @__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)))
|
|
8647
8650
|
);
|
|
8648
8651
|
}
|
|
8649
8652
|
function CartScreen() {
|
|
@@ -8651,7 +8654,7 @@ function CartScreen() {
|
|
|
8651
8654
|
const { cart, isLoading } = useCart();
|
|
8652
8655
|
const { buildPath } = useBasePath();
|
|
8653
8656
|
if (!cart || cart.cartBody.items.length === 0) {
|
|
8654
|
-
return /* @__PURE__ */
|
|
8657
|
+
return /* @__PURE__ */ React21__default.default.createElement("div", { className: "min-h-screen bg-gradient-to-br from-primary-700 via-primary-600 to-secondary-600 flex items-center justify-center" }, /* @__PURE__ */ React21__default.default.createElement("div", { className: "mx-auto px-20 py-5 bg-white rounded-3xl" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8655
8658
|
EmptyState,
|
|
8656
8659
|
{
|
|
8657
8660
|
icon: lucideReact.ShoppingBag,
|
|
@@ -8666,16 +8669,16 @@ function CartScreen() {
|
|
|
8666
8669
|
const shipping = 0;
|
|
8667
8670
|
const tax = 0;
|
|
8668
8671
|
const total = subtotal + shipping + tax;
|
|
8669
|
-
return /* @__PURE__ */
|
|
8672
|
+
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(
|
|
8670
8673
|
framerMotion.motion.div,
|
|
8671
8674
|
{
|
|
8672
8675
|
initial: { opacity: 0, y: 24 },
|
|
8673
8676
|
animate: { opacity: 1, y: 0 },
|
|
8674
8677
|
className: "flex flex-col gap-6 md:flex-row md:items-center md:justify-between"
|
|
8675
8678
|
},
|
|
8676
|
-
/* @__PURE__ */
|
|
8677
|
-
/* @__PURE__ */
|
|
8678
|
-
))), /* @__PURE__ */
|
|
8679
|
+
/* @__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.")),
|
|
8680
|
+
/* @__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"))
|
|
8681
|
+
))), /* @__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(
|
|
8679
8682
|
framerMotion.motion.section,
|
|
8680
8683
|
{
|
|
8681
8684
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8683,10 +8686,10 @@ function CartScreen() {
|
|
|
8683
8686
|
transition: { delay: 0.05 },
|
|
8684
8687
|
className: "space-y-6 rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
8685
8688
|
},
|
|
8686
|
-
/* @__PURE__ */
|
|
8687
|
-
isLoading && /* @__PURE__ */
|
|
8688
|
-
/* @__PURE__ */
|
|
8689
|
-
), /* @__PURE__ */
|
|
8689
|
+
/* @__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")),
|
|
8690
|
+
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"),
|
|
8691
|
+
/* @__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 })))
|
|
8692
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8690
8693
|
framerMotion.motion.aside,
|
|
8691
8694
|
{
|
|
8692
8695
|
initial: { opacity: 0, y: 24 },
|
|
@@ -8694,7 +8697,7 @@ function CartScreen() {
|
|
|
8694
8697
|
transition: { delay: 0.1 },
|
|
8695
8698
|
className: "space-y-6 lg:sticky lg:top-28"
|
|
8696
8699
|
},
|
|
8697
|
-
/* @__PURE__ */
|
|
8700
|
+
/* @__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(
|
|
8698
8701
|
Button,
|
|
8699
8702
|
{
|
|
8700
8703
|
size: "lg",
|
|
@@ -8702,8 +8705,8 @@ function CartScreen() {
|
|
|
8702
8705
|
onClick: () => router.push(buildPath("/checkout"))
|
|
8703
8706
|
},
|
|
8704
8707
|
"Secure checkout",
|
|
8705
|
-
/* @__PURE__ */
|
|
8706
|
-
), /* @__PURE__ */
|
|
8708
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-5 w-5" })
|
|
8709
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8707
8710
|
"button",
|
|
8708
8711
|
{
|
|
8709
8712
|
type: "button",
|
|
@@ -8712,24 +8715,24 @@ function CartScreen() {
|
|
|
8712
8715
|
},
|
|
8713
8716
|
"Continue shopping"
|
|
8714
8717
|
)),
|
|
8715
|
-
/* @__PURE__ */
|
|
8718
|
+
/* @__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."))
|
|
8716
8719
|
)))));
|
|
8717
8720
|
}
|
|
8718
8721
|
function useAddresses() {
|
|
8719
|
-
const [addresses, setAddresses] =
|
|
8720
|
-
const [isLoading, setIsLoading] =
|
|
8721
|
-
const [error, setError] =
|
|
8722
|
-
const refresh =
|
|
8722
|
+
const [addresses, setAddresses] = React21.useState([]);
|
|
8723
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
8724
|
+
const [error, setError] = React21.useState(null);
|
|
8725
|
+
const refresh = React21.useCallback(async () => {
|
|
8723
8726
|
setIsLoading(true);
|
|
8724
8727
|
setError(null);
|
|
8725
8728
|
const response = await new AddressesApi(AXIOS_CONFIG).getMyAddresses();
|
|
8726
8729
|
setAddresses(response.data || []);
|
|
8727
8730
|
setIsLoading(false);
|
|
8728
8731
|
}, []);
|
|
8729
|
-
|
|
8732
|
+
React21.useEffect(() => {
|
|
8730
8733
|
refresh();
|
|
8731
8734
|
}, [refresh]);
|
|
8732
|
-
const sortedAddresses =
|
|
8735
|
+
const sortedAddresses = React21.useMemo(() => {
|
|
8733
8736
|
return [...addresses].sort((a, b) => {
|
|
8734
8737
|
if (a.isDefault === b.isDefault) {
|
|
8735
8738
|
return (b.updatedAt.toISOString() || "").localeCompare(a.updatedAt.toISOString() || "");
|
|
@@ -8737,26 +8740,26 @@ function useAddresses() {
|
|
|
8737
8740
|
return a.isDefault ? -1 : 1;
|
|
8738
8741
|
});
|
|
8739
8742
|
}, [addresses]);
|
|
8740
|
-
const defaultAddress =
|
|
8743
|
+
const defaultAddress = React21.useMemo(
|
|
8741
8744
|
() => sortedAddresses.find((address) => address.isDefault) || null,
|
|
8742
8745
|
[sortedAddresses]
|
|
8743
8746
|
);
|
|
8744
|
-
const addAddress =
|
|
8747
|
+
const addAddress = React21.useCallback(async (payload) => {
|
|
8745
8748
|
const response = await new AddressesApi(AXIOS_CONFIG).createAddressForUser(payload);
|
|
8746
8749
|
setAddresses((prev) => [...prev, response.data]);
|
|
8747
8750
|
return response.data;
|
|
8748
8751
|
}, []);
|
|
8749
|
-
const updateAddress =
|
|
8752
|
+
const updateAddress = React21.useCallback(async (id, payload) => {
|
|
8750
8753
|
const response = await new AddressesApi(AXIOS_CONFIG).updateUserAddress(payload, id);
|
|
8751
8754
|
setAddresses((prev) => prev.map((address) => address.id === id ? response.data : address));
|
|
8752
8755
|
return response.data;
|
|
8753
8756
|
}, []);
|
|
8754
|
-
const removeAddress =
|
|
8757
|
+
const removeAddress = React21.useCallback(async (id) => {
|
|
8755
8758
|
await new AddressesApi(AXIOS_CONFIG).deleteUserAddress(id);
|
|
8756
8759
|
setAddresses((prev) => prev.filter((address) => address.id !== id));
|
|
8757
8760
|
return;
|
|
8758
8761
|
}, []);
|
|
8759
|
-
const markAsDefault =
|
|
8762
|
+
const markAsDefault = React21.useCallback(async (id) => {
|
|
8760
8763
|
const response = await new AddressesApi(AXIOS_CONFIG).updateDefaultAddress(id);
|
|
8761
8764
|
setAddresses((prev) => prev.map((address) => address.id === id ? response.data : address));
|
|
8762
8765
|
return response.data;
|
|
@@ -8774,7 +8777,7 @@ function useAddresses() {
|
|
|
8774
8777
|
};
|
|
8775
8778
|
}
|
|
8776
8779
|
function Card({ className = "", ...props }) {
|
|
8777
|
-
return /* @__PURE__ */
|
|
8780
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8778
8781
|
"div",
|
|
8779
8782
|
{
|
|
8780
8783
|
className: `rounded-lg border bg-white shadow-sm ${className}`,
|
|
@@ -8783,7 +8786,7 @@ function Card({ className = "", ...props }) {
|
|
|
8783
8786
|
);
|
|
8784
8787
|
}
|
|
8785
8788
|
function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
8786
|
-
|
|
8789
|
+
React21.useEffect(() => {
|
|
8787
8790
|
if (typeof window === "undefined") return;
|
|
8788
8791
|
if (isOpen) {
|
|
8789
8792
|
document.body.style.overflow = "hidden";
|
|
@@ -8800,7 +8803,7 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8800
8803
|
lg: "max-w-2xl",
|
|
8801
8804
|
xl: "max-w-4xl"
|
|
8802
8805
|
};
|
|
8803
|
-
return /* @__PURE__ */
|
|
8806
|
+
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(
|
|
8804
8807
|
framerMotion.motion.div,
|
|
8805
8808
|
{
|
|
8806
8809
|
initial: { opacity: 0 },
|
|
@@ -8809,7 +8812,7 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8809
8812
|
onClick: onClose,
|
|
8810
8813
|
className: "fixed inset-0 bg-black/50 backdrop-blur-sm z-50"
|
|
8811
8814
|
}
|
|
8812
|
-
), /* @__PURE__ */
|
|
8815
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8813
8816
|
framerMotion.motion.div,
|
|
8814
8817
|
{
|
|
8815
8818
|
initial: { opacity: 0, scale: 0.95, y: 20 },
|
|
@@ -8817,15 +8820,15 @@ function Modal({ isOpen, onClose, title, children, size = "md" }) {
|
|
|
8817
8820
|
exit: { opacity: 0, scale: 0.95, y: 20 },
|
|
8818
8821
|
className: `bg-white rounded-2xl shadow-2xl w-full ${sizes[size]} max-h-[90vh] overflow-hidden flex flex-col`
|
|
8819
8822
|
},
|
|
8820
|
-
title && /* @__PURE__ */
|
|
8823
|
+
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(
|
|
8821
8824
|
"button",
|
|
8822
8825
|
{
|
|
8823
8826
|
onClick: onClose,
|
|
8824
8827
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors"
|
|
8825
8828
|
},
|
|
8826
|
-
/* @__PURE__ */
|
|
8829
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "w-5 h-5" })
|
|
8827
8830
|
)),
|
|
8828
|
-
/* @__PURE__ */
|
|
8831
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex-1 overflow-y-auto p-6" }, children)
|
|
8829
8832
|
))));
|
|
8830
8833
|
}
|
|
8831
8834
|
var addressSchema = zod.z.object({
|
|
@@ -8839,7 +8842,7 @@ var addressSchema = zod.z.object({
|
|
|
8839
8842
|
phone: zod.z.string().min(10, "Phone number is required")
|
|
8840
8843
|
});
|
|
8841
8844
|
function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, initialAddress }) {
|
|
8842
|
-
const [isSubmitting, setIsSubmitting] =
|
|
8845
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
8843
8846
|
const {
|
|
8844
8847
|
register,
|
|
8845
8848
|
handleSubmit,
|
|
@@ -8858,7 +8861,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8858
8861
|
country: initialAddress?.country || "United States"
|
|
8859
8862
|
}
|
|
8860
8863
|
});
|
|
8861
|
-
|
|
8864
|
+
React21.useEffect(() => {
|
|
8862
8865
|
reset({
|
|
8863
8866
|
name: initialAddress?.name || "",
|
|
8864
8867
|
phone: initialAddress?.phone || "",
|
|
@@ -8915,7 +8918,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8915
8918
|
setIsSubmitting(false);
|
|
8916
8919
|
}
|
|
8917
8920
|
};
|
|
8918
|
-
return /* @__PURE__ */
|
|
8921
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
8919
8922
|
Modal,
|
|
8920
8923
|
{
|
|
8921
8924
|
isOpen,
|
|
@@ -8923,7 +8926,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8923
8926
|
title: initialAddress ? "Edit Address" : "Add New Address",
|
|
8924
8927
|
size: "lg"
|
|
8925
8928
|
},
|
|
8926
|
-
/* @__PURE__ */
|
|
8929
|
+
/* @__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(
|
|
8927
8930
|
Input,
|
|
8928
8931
|
{
|
|
8929
8932
|
label: "Full name",
|
|
@@ -8931,7 +8934,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8931
8934
|
...register("name"),
|
|
8932
8935
|
error: errors.name?.message
|
|
8933
8936
|
}
|
|
8934
|
-
), /* @__PURE__ */
|
|
8937
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8935
8938
|
Input,
|
|
8936
8939
|
{
|
|
8937
8940
|
label: "Phone number",
|
|
@@ -8939,7 +8942,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8939
8942
|
...register("phone"),
|
|
8940
8943
|
error: errors.phone?.message
|
|
8941
8944
|
}
|
|
8942
|
-
), /* @__PURE__ */
|
|
8945
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8943
8946
|
Input,
|
|
8944
8947
|
{
|
|
8945
8948
|
label: "Address line 1",
|
|
@@ -8947,14 +8950,14 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8947
8950
|
...register("street1"),
|
|
8948
8951
|
error: errors.street1?.message
|
|
8949
8952
|
}
|
|
8950
|
-
)), /* @__PURE__ */
|
|
8953
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "md:col-span-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8951
8954
|
Input,
|
|
8952
8955
|
{
|
|
8953
8956
|
label: "Address line 2 (optional)",
|
|
8954
8957
|
placeholder: "Apt 4B",
|
|
8955
8958
|
...register("street2")
|
|
8956
8959
|
}
|
|
8957
|
-
)), /* @__PURE__ */
|
|
8960
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
8958
8961
|
Input,
|
|
8959
8962
|
{
|
|
8960
8963
|
label: "City",
|
|
@@ -8962,7 +8965,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8962
8965
|
...register("city"),
|
|
8963
8966
|
error: errors.city?.message
|
|
8964
8967
|
}
|
|
8965
|
-
), /* @__PURE__ */
|
|
8968
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8966
8969
|
Input,
|
|
8967
8970
|
{
|
|
8968
8971
|
label: "State",
|
|
@@ -8970,7 +8973,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8970
8973
|
...register("state"),
|
|
8971
8974
|
error: errors.state?.message
|
|
8972
8975
|
}
|
|
8973
|
-
), /* @__PURE__ */
|
|
8976
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8974
8977
|
Input,
|
|
8975
8978
|
{
|
|
8976
8979
|
label: "ZIP code",
|
|
@@ -8978,7 +8981,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8978
8981
|
...register("zip"),
|
|
8979
8982
|
error: errors.zip?.message
|
|
8980
8983
|
}
|
|
8981
|
-
), /* @__PURE__ */
|
|
8984
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
8982
8985
|
Input,
|
|
8983
8986
|
{
|
|
8984
8987
|
label: "Country",
|
|
@@ -8986,7 +8989,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8986
8989
|
...register("country"),
|
|
8987
8990
|
error: errors.country?.message
|
|
8988
8991
|
}
|
|
8989
|
-
)), /* @__PURE__ */
|
|
8992
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex justify-end gap-4" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
8990
8993
|
Button,
|
|
8991
8994
|
{
|
|
8992
8995
|
type: "button",
|
|
@@ -8994,7 +8997,7 @@ function AddressFormModal({ isOpen, onClose, onAddressAdded, onAddressUpdated, i
|
|
|
8994
8997
|
onClick: onClose
|
|
8995
8998
|
},
|
|
8996
8999
|
"Cancel"
|
|
8997
|
-
), /* @__PURE__ */
|
|
9000
|
+
), /* @__PURE__ */ React21__default.default.createElement(Button, { type: "submit", disabled: isSubmitting }, isSubmitting ? "Adding Address..." : "Add Address")))
|
|
8998
9001
|
);
|
|
8999
9002
|
}
|
|
9000
9003
|
var checkoutSchema = zod.z.object({
|
|
@@ -9006,7 +9009,7 @@ var PAYMENT_METHODS = [
|
|
|
9006
9009
|
{
|
|
9007
9010
|
label: "Card",
|
|
9008
9011
|
value: "Card",
|
|
9009
|
-
icon: /* @__PURE__ */
|
|
9012
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "w-5 h-5" }),
|
|
9010
9013
|
description: "Pay securely with your credit or debit card",
|
|
9011
9014
|
className: "border-blue-500 hover:bg-blue-50",
|
|
9012
9015
|
activeClass: "bg-blue-50 border-blue-500 text-blue-700"
|
|
@@ -9014,7 +9017,7 @@ var PAYMENT_METHODS = [
|
|
|
9014
9017
|
{
|
|
9015
9018
|
label: "Cash",
|
|
9016
9019
|
value: "Cash",
|
|
9017
|
-
icon: /* @__PURE__ */
|
|
9020
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.PackageCheck, { className: "w-5 h-5" }),
|
|
9018
9021
|
description: "Pay with cash on delivery or at pickup",
|
|
9019
9022
|
className: "border-amber-500 hover:bg-amber-50",
|
|
9020
9023
|
activeClass: "bg-amber-50 border-amber-500 text-amber-700"
|
|
@@ -9022,7 +9025,7 @@ var PAYMENT_METHODS = [
|
|
|
9022
9025
|
{
|
|
9023
9026
|
label: "Credit",
|
|
9024
9027
|
value: "Credit",
|
|
9025
|
-
icon: /* @__PURE__ */
|
|
9028
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.ShieldCheck, { className: "w-5 h-5" }),
|
|
9026
9029
|
description: "Use your account credit",
|
|
9027
9030
|
className: "border-emerald-500 hover:bg-emerald-50",
|
|
9028
9031
|
activeClass: "bg-emerald-50 border-emerald-500 text-emerald-700"
|
|
@@ -9033,25 +9036,25 @@ function CheckoutScreen() {
|
|
|
9033
9036
|
const { cart, clearCart } = useCart();
|
|
9034
9037
|
const { isAuthenticated, user } = useAuth();
|
|
9035
9038
|
const { buildPath } = useBasePath();
|
|
9036
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9037
|
-
const [isDelivery, setIsDelivery] =
|
|
9038
|
-
const [paymentMethod, setPaymentMethod] =
|
|
9039
|
-
const [error, setError] =
|
|
9040
|
-
const [selectedAddressId, setSelectedAddressId] =
|
|
9041
|
-
const [selectedStoreAddressId, setSelectedStoreAddressId] =
|
|
9042
|
-
const [storeAddresses, setStoreAddresses] =
|
|
9043
|
-
const [isAddressModalOpen, setIsAddressModalOpen] =
|
|
9044
|
-
const [editingAddress, setEditingAddress] =
|
|
9045
|
-
const [shippingPrice, setShippingPrice] =
|
|
9039
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9040
|
+
const [isDelivery, setIsDelivery] = React21.useState(true);
|
|
9041
|
+
const [paymentMethod, setPaymentMethod] = React21.useState("Card");
|
|
9042
|
+
const [error, setError] = React21.useState(null);
|
|
9043
|
+
const [selectedAddressId, setSelectedAddressId] = React21.useState(null);
|
|
9044
|
+
const [selectedStoreAddressId, setSelectedStoreAddressId] = React21.useState(null);
|
|
9045
|
+
const [storeAddresses, setStoreAddresses] = React21.useState([]);
|
|
9046
|
+
const [isAddressModalOpen, setIsAddressModalOpen] = React21.useState(false);
|
|
9047
|
+
const [editingAddress, setEditingAddress] = React21.useState(null);
|
|
9048
|
+
const [shippingPrice, setShippingPrice] = React21.useState(0);
|
|
9046
9049
|
const {
|
|
9047
9050
|
addresses: userAddresses,
|
|
9048
9051
|
defaultAddress
|
|
9049
9052
|
} = useAddresses();
|
|
9050
|
-
const [selectedShippingRateId, setSelectedShippingRateId] =
|
|
9051
|
-
const [shippingRates, setShippingRates] =
|
|
9052
|
-
const [shippingRatesLoading, setShippingRatesLoading] =
|
|
9053
|
-
const [shippingRatesError, setShippingRatesError] =
|
|
9054
|
-
const [storeData, setStoreData] =
|
|
9053
|
+
const [selectedShippingRateId, setSelectedShippingRateId] = React21.useState(null);
|
|
9054
|
+
const [shippingRates, setShippingRates] = React21.useState([]);
|
|
9055
|
+
const [shippingRatesLoading, setShippingRatesLoading] = React21.useState(false);
|
|
9056
|
+
const [shippingRatesError, setShippingRatesError] = React21.useState(null);
|
|
9057
|
+
const [storeData, setStoreData] = React21.useState(null);
|
|
9055
9058
|
const { addresses, isLoading, refresh, removeAddress } = useAddresses();
|
|
9056
9059
|
const {
|
|
9057
9060
|
register,
|
|
@@ -9076,7 +9079,7 @@ function CheckoutScreen() {
|
|
|
9076
9079
|
}
|
|
9077
9080
|
});
|
|
9078
9081
|
const sameAsShipping = watch("sameAsShipping", true);
|
|
9079
|
-
|
|
9082
|
+
React21.useEffect(() => {
|
|
9080
9083
|
if (sameAsShipping) {
|
|
9081
9084
|
setValue("billing.name", watch("shipping.name"));
|
|
9082
9085
|
setValue("billing.phone", watch("shipping.phone"));
|
|
@@ -9088,7 +9091,7 @@ function CheckoutScreen() {
|
|
|
9088
9091
|
setValue("billing.country", watch("shipping.country"));
|
|
9089
9092
|
}
|
|
9090
9093
|
}, [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")]);
|
|
9091
|
-
|
|
9094
|
+
React21.useEffect(() => {
|
|
9092
9095
|
if (defaultAddress && !selectedAddressId) {
|
|
9093
9096
|
setSelectedAddressId(defaultAddress.id);
|
|
9094
9097
|
setValue("shipping.name", defaultAddress.name);
|
|
@@ -9123,7 +9126,7 @@ function CheckoutScreen() {
|
|
|
9123
9126
|
setShippingRates([]);
|
|
9124
9127
|
setSelectedShippingRateId(null);
|
|
9125
9128
|
};
|
|
9126
|
-
|
|
9129
|
+
React21.useEffect(() => {
|
|
9127
9130
|
if (!isDelivery || !selectedAddressId || !cart || cart?.cartBody?.items?.length === 0 || !cart?.cartBody?.items) {
|
|
9128
9131
|
setShippingRates([]);
|
|
9129
9132
|
setSelectedShippingRateId(null);
|
|
@@ -9152,7 +9155,7 @@ function CheckoutScreen() {
|
|
|
9152
9155
|
}
|
|
9153
9156
|
})();
|
|
9154
9157
|
}, [isDelivery, selectedAddressId, cart]);
|
|
9155
|
-
|
|
9158
|
+
React21.useEffect(() => {
|
|
9156
9159
|
if (!isDelivery) {
|
|
9157
9160
|
const stores = [
|
|
9158
9161
|
{ id: "store1", name: "Main Pharmacy", street1: "123 Main St", city: "Seattle" },
|
|
@@ -9226,7 +9229,7 @@ function CheckoutScreen() {
|
|
|
9226
9229
|
}
|
|
9227
9230
|
}
|
|
9228
9231
|
setIsSubmitting(true);
|
|
9229
|
-
sonner.toast("Submitting order...", { icon: /* @__PURE__ */
|
|
9232
|
+
sonner.toast("Submitting order...", { icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "h-4 w-4" }) });
|
|
9230
9233
|
try {
|
|
9231
9234
|
const items = (cart?.cartBody?.items || []).map((item) => ({
|
|
9232
9235
|
productVariantId: String(item.productVariantId),
|
|
@@ -9291,33 +9294,33 @@ function CheckoutScreen() {
|
|
|
9291
9294
|
const subtotal = cart.total;
|
|
9292
9295
|
const tax = 0;
|
|
9293
9296
|
const total = subtotal + shippingPrice + tax;
|
|
9294
|
-
return /* @__PURE__ */
|
|
9297
|
+
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(
|
|
9295
9298
|
framerMotion.motion.div,
|
|
9296
9299
|
{
|
|
9297
9300
|
initial: { opacity: 0, y: 24 },
|
|
9298
9301
|
animate: { opacity: 1, y: 0 },
|
|
9299
9302
|
className: "space-y-6"
|
|
9300
9303
|
},
|
|
9301
|
-
/* @__PURE__ */
|
|
9302
|
-
/* @__PURE__ */
|
|
9303
|
-
/* @__PURE__ */
|
|
9304
|
-
/* @__PURE__ */
|
|
9304
|
+
/* @__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"),
|
|
9305
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Provide delivery details"),
|
|
9306
|
+
/* @__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."),
|
|
9307
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex flex-wrap gap-3" }, checkoutSteps.map((step) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9305
9308
|
"div",
|
|
9306
9309
|
{
|
|
9307
9310
|
key: step.id,
|
|
9308
9311
|
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"}`
|
|
9309
9312
|
},
|
|
9310
|
-
/* @__PURE__ */
|
|
9313
|
+
/* @__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),
|
|
9311
9314
|
step.label
|
|
9312
9315
|
)))
|
|
9313
|
-
)))), /* @__PURE__ */
|
|
9316
|
+
)))), /* @__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(
|
|
9314
9317
|
framerMotion.motion.div,
|
|
9315
9318
|
{
|
|
9316
9319
|
initial: { opacity: 0, y: 24 },
|
|
9317
9320
|
animate: { opacity: 1, y: 0 },
|
|
9318
9321
|
className: "space-y-8"
|
|
9319
9322
|
},
|
|
9320
|
-
/* @__PURE__ */
|
|
9323
|
+
/* @__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(
|
|
9321
9324
|
Button,
|
|
9322
9325
|
{
|
|
9323
9326
|
type: "button",
|
|
@@ -9328,15 +9331,15 @@ function CheckoutScreen() {
|
|
|
9328
9331
|
setIsAddressModalOpen(true);
|
|
9329
9332
|
}
|
|
9330
9333
|
},
|
|
9331
|
-
/* @__PURE__ */
|
|
9334
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
|
|
9332
9335
|
"Add New Address"
|
|
9333
|
-
)), userAddresses.length > 0 ? /* @__PURE__ */
|
|
9336
|
+
)), userAddresses.length > 0 ? /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4" }, userAddresses.map((addr) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9334
9337
|
"label",
|
|
9335
9338
|
{
|
|
9336
9339
|
key: addr.id,
|
|
9337
9340
|
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`
|
|
9338
9341
|
},
|
|
9339
|
-
/* @__PURE__ */
|
|
9342
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9340
9343
|
"input",
|
|
9341
9344
|
{
|
|
9342
9345
|
type: "radio",
|
|
@@ -9357,7 +9360,7 @@ function CheckoutScreen() {
|
|
|
9357
9360
|
className: "mt-1"
|
|
9358
9361
|
}
|
|
9359
9362
|
),
|
|
9360
|
-
/* @__PURE__ */
|
|
9363
|
+
/* @__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(
|
|
9361
9364
|
"button",
|
|
9362
9365
|
{
|
|
9363
9366
|
type: "button",
|
|
@@ -9368,9 +9371,9 @@ function CheckoutScreen() {
|
|
|
9368
9371
|
},
|
|
9369
9372
|
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"
|
|
9370
9373
|
},
|
|
9371
|
-
/* @__PURE__ */
|
|
9374
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Edit3, { className: "h-3.5 w-3.5" }),
|
|
9372
9375
|
" Edit"
|
|
9373
|
-
), /* @__PURE__ */
|
|
9376
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9374
9377
|
"button",
|
|
9375
9378
|
{
|
|
9376
9379
|
type: "button",
|
|
@@ -9388,23 +9391,23 @@ function CheckoutScreen() {
|
|
|
9388
9391
|
},
|
|
9389
9392
|
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"
|
|
9390
9393
|
},
|
|
9391
|
-
/* @__PURE__ */
|
|
9394
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-3.5 w-3.5" }),
|
|
9392
9395
|
" Delete"
|
|
9393
9396
|
)))
|
|
9394
|
-
))) : /* @__PURE__ */
|
|
9397
|
+
))) : /* @__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(
|
|
9395
9398
|
"select",
|
|
9396
9399
|
{
|
|
9397
9400
|
className: "w-full border rounded p-2",
|
|
9398
9401
|
value: selectedStoreAddressId || "",
|
|
9399
9402
|
onChange: (e) => setSelectedStoreAddressId(e.target.value)
|
|
9400
9403
|
},
|
|
9401
|
-
storeAddresses.map((addr) => /* @__PURE__ */
|
|
9404
|
+
storeAddresses.map((addr) => /* @__PURE__ */ React21__default.default.createElement("option", { key: addr.id, value: addr.id }, addr.name, " - ", addr.street1, ", ", addr.city))
|
|
9402
9405
|
)))),
|
|
9403
|
-
isDelivery && selectedAddressId && /* @__PURE__ */
|
|
9406
|
+
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) => {
|
|
9404
9407
|
const isSelected = !!selectedShippingRateId && selectedShippingRateId === rate.objectId;
|
|
9405
9408
|
const isTest = rate.test;
|
|
9406
9409
|
const hasAttributes = rate.attributes && rate.attributes.length > 0;
|
|
9407
|
-
return /* @__PURE__ */
|
|
9410
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9408
9411
|
"div",
|
|
9409
9412
|
{
|
|
9410
9413
|
key: rate.objectId,
|
|
@@ -9413,7 +9416,7 @@ function CheckoutScreen() {
|
|
|
9413
9416
|
onMouseLeave: () => setShippingPrice(parseFloat(rate.amountLocal)),
|
|
9414
9417
|
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"}`
|
|
9415
9418
|
},
|
|
9416
|
-
/* @__PURE__ */
|
|
9419
|
+
/* @__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(
|
|
9417
9420
|
Image3__default.default,
|
|
9418
9421
|
{
|
|
9419
9422
|
src: rate.providerImage75 || "/placeholder-product.jpg",
|
|
@@ -9426,18 +9429,18 @@ function CheckoutScreen() {
|
|
|
9426
9429
|
width: 48,
|
|
9427
9430
|
height: 48
|
|
9428
9431
|
}
|
|
9429
|
-
)), /* @__PURE__ */
|
|
9432
|
+
)), /* @__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(
|
|
9430
9433
|
"span",
|
|
9431
9434
|
{
|
|
9432
9435
|
key: attr,
|
|
9433
9436
|
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"}`
|
|
9434
9437
|
},
|
|
9435
9438
|
attr
|
|
9436
|
-
))), /* @__PURE__ */
|
|
9437
|
-
isSelected && /* @__PURE__ */
|
|
9439
|
+
))), /* @__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))),
|
|
9440
|
+
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" })))
|
|
9438
9441
|
);
|
|
9439
|
-
})) : /* @__PURE__ */
|
|
9440
|
-
), /* @__PURE__ */
|
|
9442
|
+
})) : /* @__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.")))
|
|
9443
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9441
9444
|
framerMotion.motion.aside,
|
|
9442
9445
|
{
|
|
9443
9446
|
initial: { opacity: 0, y: 32 },
|
|
@@ -9445,22 +9448,22 @@ function CheckoutScreen() {
|
|
|
9445
9448
|
transition: { duration: 0.5, ease: "easeOut", delay: 0.1 },
|
|
9446
9449
|
className: "space-y-10 lg:sticky lg:top-24"
|
|
9447
9450
|
},
|
|
9448
|
-
/* @__PURE__ */
|
|
9451
|
+
/* @__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" }, [
|
|
9449
9452
|
{
|
|
9450
9453
|
label: "Delivery",
|
|
9451
|
-
icon: /* @__PURE__ */
|
|
9454
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Truck, { className: "w-5 h-5" }),
|
|
9452
9455
|
value: true,
|
|
9453
9456
|
desc: "Shipped to your address"
|
|
9454
9457
|
},
|
|
9455
9458
|
{
|
|
9456
9459
|
label: "Pickup",
|
|
9457
|
-
icon: /* @__PURE__ */
|
|
9460
|
+
icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "w-5 h-5" }),
|
|
9458
9461
|
value: false,
|
|
9459
9462
|
desc: "Collect from pharmacy"
|
|
9460
9463
|
}
|
|
9461
9464
|
].map((option) => {
|
|
9462
9465
|
const active = isDelivery === option.value;
|
|
9463
|
-
return /* @__PURE__ */
|
|
9466
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9464
9467
|
"button",
|
|
9465
9468
|
{
|
|
9466
9469
|
key: option.label,
|
|
@@ -9469,18 +9472,18 @@ function CheckoutScreen() {
|
|
|
9469
9472
|
"aria-pressed": active,
|
|
9470
9473
|
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"}`
|
|
9471
9474
|
},
|
|
9472
|
-
/* @__PURE__ */
|
|
9475
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9473
9476
|
"div",
|
|
9474
9477
|
{
|
|
9475
9478
|
className: `p-2 rounded-lg ${active ? "bg-primary-100 text-primary-600" : "bg-slate-100 text-slate-600 group-hover:bg-slate-50"}`
|
|
9476
9479
|
},
|
|
9477
9480
|
option.icon
|
|
9478
|
-
), /* @__PURE__ */
|
|
9479
|
-
active && /* @__PURE__ */
|
|
9481
|
+
), /* @__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))),
|
|
9482
|
+
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" }))
|
|
9480
9483
|
);
|
|
9481
|
-
}))), /* @__PURE__ */
|
|
9484
|
+
}))), /* @__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) => {
|
|
9482
9485
|
const active = paymentMethod === pm.value;
|
|
9483
|
-
return /* @__PURE__ */
|
|
9486
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
9484
9487
|
"button",
|
|
9485
9488
|
{
|
|
9486
9489
|
key: pm.value,
|
|
@@ -9488,22 +9491,22 @@ function CheckoutScreen() {
|
|
|
9488
9491
|
onClick: () => setPaymentMethod(pm.value),
|
|
9489
9492
|
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`}`
|
|
9490
9493
|
},
|
|
9491
|
-
/* @__PURE__ */
|
|
9494
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9492
9495
|
"div",
|
|
9493
9496
|
{
|
|
9494
9497
|
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"}`
|
|
9495
9498
|
},
|
|
9496
9499
|
pm.icon
|
|
9497
|
-
), /* @__PURE__ */
|
|
9498
|
-
active && /* @__PURE__ */
|
|
9500
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-medium text-slate-900" }, pm.label)),
|
|
9501
|
+
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" }))
|
|
9499
9502
|
);
|
|
9500
|
-
})), /* @__PURE__ */
|
|
9503
|
+
})), /* @__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(
|
|
9501
9504
|
"div",
|
|
9502
9505
|
{
|
|
9503
9506
|
key: item.productId,
|
|
9504
9507
|
className: "flex gap-4 rounded-2xl border border-slate-100 p-4 hover:bg-slate-50/50 transition"
|
|
9505
9508
|
},
|
|
9506
|
-
/* @__PURE__ */
|
|
9509
|
+
/* @__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(
|
|
9507
9510
|
Image3__default.default,
|
|
9508
9511
|
{
|
|
9509
9512
|
src: item.productVariantData.productMedia?.[0]?.file || "/placeholder-product.jpg",
|
|
@@ -9513,9 +9516,9 @@ function CheckoutScreen() {
|
|
|
9513
9516
|
className: "object-contain"
|
|
9514
9517
|
}
|
|
9515
9518
|
)),
|
|
9516
|
-
/* @__PURE__ */
|
|
9517
|
-
/* @__PURE__ */
|
|
9518
|
-
))), /* @__PURE__ */
|
|
9519
|
+
/* @__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)),
|
|
9520
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold text-slate-900" }, formatPrice(item.productVariantData.finalPrice * item.quantity))
|
|
9521
|
+
))), /* @__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(
|
|
9519
9522
|
Button,
|
|
9520
9523
|
{
|
|
9521
9524
|
type: "submit",
|
|
@@ -9523,11 +9526,11 @@ function CheckoutScreen() {
|
|
|
9523
9526
|
isLoading: isSubmitting,
|
|
9524
9527
|
className: "mt-6 w-full transition-transform hover:scale-[1.02] active:scale-[0.99]"
|
|
9525
9528
|
},
|
|
9526
|
-
/* @__PURE__ */
|
|
9529
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "h-5 w-5" }),
|
|
9527
9530
|
isSubmitting ? "Placing order..." : "Place Secure Order"
|
|
9528
|
-
), /* @__PURE__ */
|
|
9529
|
-
/* @__PURE__ */
|
|
9530
|
-
))), /* @__PURE__ */
|
|
9531
|
+
), /* @__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.")),
|
|
9532
|
+
/* @__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."))))
|
|
9533
|
+
))), /* @__PURE__ */ React21__default.default.createElement(
|
|
9531
9534
|
AddressFormModal,
|
|
9532
9535
|
{
|
|
9533
9536
|
isOpen: isAddressModalOpen,
|
|
@@ -9562,8 +9565,8 @@ function LoginScreen() {
|
|
|
9562
9565
|
const searchParams = navigation.useSearchParams();
|
|
9563
9566
|
const redirectUrl = searchParams?.get("redirect") || buildPath("/");
|
|
9564
9567
|
const { login } = useAuth();
|
|
9565
|
-
const [showPassword, setShowPassword] =
|
|
9566
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9568
|
+
const [showPassword, setShowPassword] = React21.useState(false);
|
|
9569
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9567
9570
|
const {
|
|
9568
9571
|
register,
|
|
9569
9572
|
handleSubmit,
|
|
@@ -9583,7 +9586,7 @@ function LoginScreen() {
|
|
|
9583
9586
|
setIsSubmitting(false);
|
|
9584
9587
|
}
|
|
9585
9588
|
};
|
|
9586
|
-
return /* @__PURE__ */
|
|
9589
|
+
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(
|
|
9587
9590
|
framerMotion.motion.section,
|
|
9588
9591
|
{
|
|
9589
9592
|
initial: { opacity: 0, x: -24 },
|
|
@@ -9591,18 +9594,18 @@ function LoginScreen() {
|
|
|
9591
9594
|
transition: { duration: 0.4 },
|
|
9592
9595
|
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"
|
|
9593
9596
|
},
|
|
9594
|
-
/* @__PURE__ */
|
|
9595
|
-
/* @__PURE__ */
|
|
9596
|
-
/* @__PURE__ */
|
|
9597
|
+
/* @__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.")),
|
|
9598
|
+
/* @__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."))),
|
|
9599
|
+
/* @__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(
|
|
9597
9600
|
Link8__default.default,
|
|
9598
9601
|
{
|
|
9599
9602
|
href: "/register",
|
|
9600
9603
|
className: "inline-flex items-center gap-2 rounded-full bg-white/15 px-4 py-2 font-semibold transition hover:bg-white/25"
|
|
9601
9604
|
},
|
|
9602
9605
|
"Create one now",
|
|
9603
|
-
/* @__PURE__ */
|
|
9606
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowRight, { className: "h-4 w-4" })
|
|
9604
9607
|
))
|
|
9605
|
-
), /* @__PURE__ */
|
|
9608
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9606
9609
|
framerMotion.motion.section,
|
|
9607
9610
|
{
|
|
9608
9611
|
initial: { opacity: 0, x: 24 },
|
|
@@ -9610,7 +9613,7 @@ function LoginScreen() {
|
|
|
9610
9613
|
transition: { duration: 0.4 },
|
|
9611
9614
|
className: "flex items-center justify-center px-6 py-12 lg:px-16"
|
|
9612
9615
|
},
|
|
9613
|
-
/* @__PURE__ */
|
|
9616
|
+
/* @__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(
|
|
9614
9617
|
Input,
|
|
9615
9618
|
{
|
|
9616
9619
|
type: "email",
|
|
@@ -9619,7 +9622,7 @@ function LoginScreen() {
|
|
|
9619
9622
|
...register("email"),
|
|
9620
9623
|
error: errors.email?.message
|
|
9621
9624
|
}
|
|
9622
|
-
)), /* @__PURE__ */
|
|
9625
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9623
9626
|
Input,
|
|
9624
9627
|
{
|
|
9625
9628
|
type: showPassword ? "text" : "password",
|
|
@@ -9628,28 +9631,28 @@ function LoginScreen() {
|
|
|
9628
9631
|
...register("password"),
|
|
9629
9632
|
error: errors.password?.message
|
|
9630
9633
|
}
|
|
9631
|
-
), /* @__PURE__ */
|
|
9634
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9632
9635
|
"button",
|
|
9633
9636
|
{
|
|
9634
9637
|
type: "button",
|
|
9635
9638
|
onClick: () => setShowPassword((prev) => !prev),
|
|
9636
9639
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9637
9640
|
},
|
|
9638
|
-
showPassword ? /* @__PURE__ */
|
|
9639
|
-
)), /* @__PURE__ */
|
|
9641
|
+
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" })
|
|
9642
|
+
)), /* @__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(
|
|
9640
9643
|
"input",
|
|
9641
9644
|
{
|
|
9642
9645
|
type: "checkbox",
|
|
9643
9646
|
className: "h-4 w-4 rounded border-slate-300 text-primary-600 focus:ring-primary-500"
|
|
9644
9647
|
}
|
|
9645
|
-
), "Remember me"), /* @__PURE__ */
|
|
9648
|
+
), "Remember me"), /* @__PURE__ */ React21__default.default.createElement(
|
|
9646
9649
|
Link8__default.default,
|
|
9647
9650
|
{
|
|
9648
9651
|
href: "/forgot-password",
|
|
9649
9652
|
className: "font-medium text-primary-600 transition hover:text-primary-700"
|
|
9650
9653
|
},
|
|
9651
9654
|
"Forgot password?"
|
|
9652
|
-
)), /* @__PURE__ */
|
|
9655
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
9653
9656
|
Button,
|
|
9654
9657
|
{
|
|
9655
9658
|
type: "submit",
|
|
@@ -9658,7 +9661,7 @@ function LoginScreen() {
|
|
|
9658
9661
|
className: "w-full"
|
|
9659
9662
|
},
|
|
9660
9663
|
"Sign in securely"
|
|
9661
|
-
)), /* @__PURE__ */
|
|
9664
|
+
)), /* @__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.")))))
|
|
9662
9665
|
)));
|
|
9663
9666
|
}
|
|
9664
9667
|
var registerSchema = zod.z.object({
|
|
@@ -9681,9 +9684,9 @@ function RegisterScreen() {
|
|
|
9681
9684
|
const router = navigation.useRouter();
|
|
9682
9685
|
const { register: registerUser } = useAuth();
|
|
9683
9686
|
const { buildPath } = useBasePath();
|
|
9684
|
-
const [showPassword, setShowPassword] =
|
|
9685
|
-
const [showConfirmPassword, setShowConfirmPassword] =
|
|
9686
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9687
|
+
const [showPassword, setShowPassword] = React21.useState(false);
|
|
9688
|
+
const [showConfirmPassword, setShowConfirmPassword] = React21.useState(false);
|
|
9689
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9687
9690
|
const {
|
|
9688
9691
|
register,
|
|
9689
9692
|
handleSubmit,
|
|
@@ -9709,7 +9712,7 @@ function RegisterScreen() {
|
|
|
9709
9712
|
setIsSubmitting(false);
|
|
9710
9713
|
}
|
|
9711
9714
|
};
|
|
9712
|
-
return /* @__PURE__ */
|
|
9715
|
+
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(
|
|
9713
9716
|
framerMotion.motion.section,
|
|
9714
9717
|
{
|
|
9715
9718
|
initial: { opacity: 0, x: -24 },
|
|
@@ -9717,9 +9720,9 @@ function RegisterScreen() {
|
|
|
9717
9720
|
transition: { duration: 0.4 },
|
|
9718
9721
|
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"
|
|
9719
9722
|
},
|
|
9720
|
-
/* @__PURE__ */
|
|
9721
|
-
/* @__PURE__ */
|
|
9722
|
-
/* @__PURE__ */
|
|
9723
|
+
/* @__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.")),
|
|
9724
|
+
/* @__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)))),
|
|
9725
|
+
/* @__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(
|
|
9723
9726
|
Link8__default.default,
|
|
9724
9727
|
{
|
|
9725
9728
|
href: "/login",
|
|
@@ -9727,7 +9730,7 @@ function RegisterScreen() {
|
|
|
9727
9730
|
},
|
|
9728
9731
|
"Sign in"
|
|
9729
9732
|
))
|
|
9730
|
-
), /* @__PURE__ */
|
|
9733
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9731
9734
|
framerMotion.motion.section,
|
|
9732
9735
|
{
|
|
9733
9736
|
initial: { opacity: 0, x: 24 },
|
|
@@ -9735,13 +9738,13 @@ function RegisterScreen() {
|
|
|
9735
9738
|
transition: { duration: 0.4 },
|
|
9736
9739
|
className: "flex items-center justify-center px-6 py-12 lg:px-16"
|
|
9737
9740
|
},
|
|
9738
|
-
/* @__PURE__ */
|
|
9741
|
+
/* @__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(
|
|
9739
9742
|
"form",
|
|
9740
9743
|
{
|
|
9741
9744
|
onSubmit: handleSubmit(onSubmit),
|
|
9742
9745
|
className: "space-y-6 rounded-3xl border border-slate-100 bg-white p-8 shadow-lg shadow-primary-50"
|
|
9743
9746
|
},
|
|
9744
|
-
/* @__PURE__ */
|
|
9747
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9745
9748
|
Input,
|
|
9746
9749
|
{
|
|
9747
9750
|
label: "First name",
|
|
@@ -9749,7 +9752,7 @@ function RegisterScreen() {
|
|
|
9749
9752
|
...register("firstName"),
|
|
9750
9753
|
error: errors.firstName?.message
|
|
9751
9754
|
}
|
|
9752
|
-
), /* @__PURE__ */
|
|
9755
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9753
9756
|
Input,
|
|
9754
9757
|
{
|
|
9755
9758
|
label: "Last name",
|
|
@@ -9758,7 +9761,7 @@ function RegisterScreen() {
|
|
|
9758
9761
|
error: errors.lastName?.message
|
|
9759
9762
|
}
|
|
9760
9763
|
)),
|
|
9761
|
-
/* @__PURE__ */
|
|
9764
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9762
9765
|
Input,
|
|
9763
9766
|
{
|
|
9764
9767
|
type: "email",
|
|
@@ -9768,7 +9771,7 @@ function RegisterScreen() {
|
|
|
9768
9771
|
error: errors.email?.message
|
|
9769
9772
|
}
|
|
9770
9773
|
),
|
|
9771
|
-
/* @__PURE__ */
|
|
9774
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9772
9775
|
Input,
|
|
9773
9776
|
{
|
|
9774
9777
|
type: "tel",
|
|
@@ -9778,7 +9781,7 @@ function RegisterScreen() {
|
|
|
9778
9781
|
error: errors.phone?.message
|
|
9779
9782
|
}
|
|
9780
9783
|
),
|
|
9781
|
-
/* @__PURE__ */
|
|
9784
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9782
9785
|
Input,
|
|
9783
9786
|
{
|
|
9784
9787
|
type: showPassword ? "text" : "password",
|
|
@@ -9787,16 +9790,16 @@ function RegisterScreen() {
|
|
|
9787
9790
|
...register("password"),
|
|
9788
9791
|
error: errors.password?.message
|
|
9789
9792
|
}
|
|
9790
|
-
), /* @__PURE__ */
|
|
9793
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9791
9794
|
"button",
|
|
9792
9795
|
{
|
|
9793
9796
|
type: "button",
|
|
9794
9797
|
onClick: () => setShowPassword((prev) => !prev),
|
|
9795
9798
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9796
9799
|
},
|
|
9797
|
-
showPassword ? /* @__PURE__ */
|
|
9800
|
+
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" })
|
|
9798
9801
|
)),
|
|
9799
|
-
/* @__PURE__ */
|
|
9802
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9800
9803
|
Input,
|
|
9801
9804
|
{
|
|
9802
9805
|
type: showConfirmPassword ? "text" : "password",
|
|
@@ -9805,16 +9808,16 @@ function RegisterScreen() {
|
|
|
9805
9808
|
...register("confirmPassword"),
|
|
9806
9809
|
error: errors.confirmPassword?.message
|
|
9807
9810
|
}
|
|
9808
|
-
), /* @__PURE__ */
|
|
9811
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9809
9812
|
"button",
|
|
9810
9813
|
{
|
|
9811
9814
|
type: "button",
|
|
9812
9815
|
onClick: () => setShowConfirmPassword((prev) => !prev),
|
|
9813
9816
|
className: "absolute right-3 top-[42px] text-slate-400 transition hover:text-slate-600"
|
|
9814
9817
|
},
|
|
9815
|
-
showConfirmPassword ? /* @__PURE__ */
|
|
9818
|
+
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" })
|
|
9816
9819
|
)),
|
|
9817
|
-
/* @__PURE__ */
|
|
9820
|
+
/* @__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: "/terms", className: "font-semibold text-primary-600 hover:text-primary-700" }, "Terms of Service"), " ", "and", " ", /* @__PURE__ */ React21__default.default.createElement(
|
|
9818
9821
|
Link8__default.default,
|
|
9819
9822
|
{
|
|
9820
9823
|
href: "/privacy",
|
|
@@ -9822,7 +9825,7 @@ function RegisterScreen() {
|
|
|
9822
9825
|
},
|
|
9823
9826
|
"Privacy Policy"
|
|
9824
9827
|
), ". We protect your information with bank-level encryption.")),
|
|
9825
|
-
/* @__PURE__ */
|
|
9828
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
9826
9829
|
Button,
|
|
9827
9830
|
{
|
|
9828
9831
|
type: "submit",
|
|
@@ -9830,10 +9833,10 @@ function RegisterScreen() {
|
|
|
9830
9833
|
isLoading: isSubmitting,
|
|
9831
9834
|
className: "w-full"
|
|
9832
9835
|
},
|
|
9833
|
-
/* @__PURE__ */
|
|
9836
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.UserPlus, { className: "h-5 w-5" }),
|
|
9834
9837
|
"Create my account"
|
|
9835
9838
|
)
|
|
9836
|
-
), /* @__PURE__ */
|
|
9839
|
+
), /* @__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.")))))
|
|
9837
9840
|
)));
|
|
9838
9841
|
}
|
|
9839
9842
|
var profileSchema = zod.z.object({
|
|
@@ -9846,7 +9849,7 @@ function ProfileScreen() {
|
|
|
9846
9849
|
const router = navigation.useRouter();
|
|
9847
9850
|
const { user, updateUser, logout } = useAuth();
|
|
9848
9851
|
const { buildPath } = useBasePath();
|
|
9849
|
-
const [isSubmitting, setIsSubmitting] =
|
|
9852
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
9850
9853
|
const {
|
|
9851
9854
|
register,
|
|
9852
9855
|
handleSubmit,
|
|
@@ -9900,15 +9903,15 @@ function ProfileScreen() {
|
|
|
9900
9903
|
href: buildPath("/account/addresses")
|
|
9901
9904
|
}
|
|
9902
9905
|
];
|
|
9903
|
-
return /* @__PURE__ */
|
|
9906
|
+
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(
|
|
9904
9907
|
framerMotion.motion.div,
|
|
9905
9908
|
{
|
|
9906
9909
|
initial: { opacity: 0, y: 24 },
|
|
9907
9910
|
animate: { opacity: 1, y: 0 },
|
|
9908
9911
|
className: "flex flex-col gap-8 md:flex-row md:items-center md:justify-between"
|
|
9909
9912
|
},
|
|
9910
|
-
/* @__PURE__ */
|
|
9911
|
-
/* @__PURE__ */
|
|
9913
|
+
/* @__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"))),
|
|
9914
|
+
/* @__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(
|
|
9912
9915
|
Button,
|
|
9913
9916
|
{
|
|
9914
9917
|
variant: "ghost",
|
|
@@ -9917,14 +9920,14 @@ function ProfileScreen() {
|
|
|
9917
9920
|
},
|
|
9918
9921
|
"Change password"
|
|
9919
9922
|
))
|
|
9920
|
-
))), /* @__PURE__ */
|
|
9923
|
+
))), /* @__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(
|
|
9921
9924
|
framerMotion.motion.div,
|
|
9922
9925
|
{
|
|
9923
9926
|
initial: { opacity: 0, y: 24 },
|
|
9924
9927
|
animate: { opacity: 1, y: 0 },
|
|
9925
9928
|
className: "space-y-6"
|
|
9926
9929
|
},
|
|
9927
|
-
/* @__PURE__ */
|
|
9930
|
+
/* @__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(
|
|
9928
9931
|
Input,
|
|
9929
9932
|
{
|
|
9930
9933
|
label: "First name",
|
|
@@ -9932,7 +9935,7 @@ function ProfileScreen() {
|
|
|
9932
9935
|
...register("firstName"),
|
|
9933
9936
|
error: errors.firstName?.message
|
|
9934
9937
|
}
|
|
9935
|
-
), /* @__PURE__ */
|
|
9938
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9936
9939
|
Input,
|
|
9937
9940
|
{
|
|
9938
9941
|
label: "Last name",
|
|
@@ -9940,7 +9943,7 @@ function ProfileScreen() {
|
|
|
9940
9943
|
...register("lastName"),
|
|
9941
9944
|
error: errors.lastName?.message
|
|
9942
9945
|
}
|
|
9943
|
-
)), /* @__PURE__ */
|
|
9946
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
9944
9947
|
Input,
|
|
9945
9948
|
{
|
|
9946
9949
|
type: "email",
|
|
@@ -9950,7 +9953,7 @@ function ProfileScreen() {
|
|
|
9950
9953
|
...register("email"),
|
|
9951
9954
|
error: errors.email?.message
|
|
9952
9955
|
}
|
|
9953
|
-
), /* @__PURE__ */
|
|
9956
|
+
), /* @__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(
|
|
9954
9957
|
Input,
|
|
9955
9958
|
{
|
|
9956
9959
|
type: "tel",
|
|
@@ -9960,7 +9963,7 @@ function ProfileScreen() {
|
|
|
9960
9963
|
...register("phone"),
|
|
9961
9964
|
error: errors.phone?.message
|
|
9962
9965
|
}
|
|
9963
|
-
), /* @__PURE__ */
|
|
9966
|
+
), /* @__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(
|
|
9964
9967
|
Button,
|
|
9965
9968
|
{
|
|
9966
9969
|
type: "submit",
|
|
@@ -9968,7 +9971,7 @@ function ProfileScreen() {
|
|
|
9968
9971
|
isLoading: isSubmitting
|
|
9969
9972
|
},
|
|
9970
9973
|
"Save changes"
|
|
9971
|
-
), /* @__PURE__ */
|
|
9974
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9972
9975
|
Button,
|
|
9973
9976
|
{
|
|
9974
9977
|
type: "button",
|
|
@@ -9978,16 +9981,16 @@ function ProfileScreen() {
|
|
|
9978
9981
|
},
|
|
9979
9982
|
"View recent orders"
|
|
9980
9983
|
)))),
|
|
9981
|
-
/* @__PURE__ */
|
|
9984
|
+
/* @__PURE__ */ React21__default.default.createElement("section", { className: "grid gap-4 md:grid-cols-2" }, quickLinks.map((item) => /* @__PURE__ */ React21__default.default.createElement(
|
|
9982
9985
|
Link8__default.default,
|
|
9983
9986
|
{
|
|
9984
9987
|
key: item.href,
|
|
9985
9988
|
href: item.href,
|
|
9986
9989
|
className: "group rounded-3xl border border-slate-100 bg-white p-6 shadow-sm transition hover:-translate-y-1 hover:shadow-lg"
|
|
9987
9990
|
},
|
|
9988
|
-
/* @__PURE__ */
|
|
9991
|
+
/* @__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)))
|
|
9989
9992
|
)))
|
|
9990
|
-
), /* @__PURE__ */
|
|
9993
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
9991
9994
|
framerMotion.motion.aside,
|
|
9992
9995
|
{
|
|
9993
9996
|
initial: { opacity: 0, y: 24 },
|
|
@@ -9995,7 +9998,7 @@ function ProfileScreen() {
|
|
|
9995
9998
|
transition: { delay: 0.1 },
|
|
9996
9999
|
className: "space-y-6"
|
|
9997
10000
|
},
|
|
9998
|
-
/* @__PURE__ */
|
|
10001
|
+
/* @__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(
|
|
9999
10002
|
Button,
|
|
10000
10003
|
{
|
|
10001
10004
|
variant: "outline",
|
|
@@ -10004,14 +10007,14 @@ function ProfileScreen() {
|
|
|
10004
10007
|
},
|
|
10005
10008
|
"Manage preferences"
|
|
10006
10009
|
)),
|
|
10007
|
-
/* @__PURE__ */
|
|
10008
|
-
/* @__PURE__ */
|
|
10010
|
+
/* @__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.")),
|
|
10011
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
10009
10012
|
"button",
|
|
10010
10013
|
{
|
|
10011
10014
|
onClick: handleLogout,
|
|
10012
10015
|
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"
|
|
10013
10016
|
},
|
|
10014
|
-
/* @__PURE__ */
|
|
10017
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.LogOut, { className: "h-4 w-4" }),
|
|
10015
10018
|
"Log out"
|
|
10016
10019
|
)
|
|
10017
10020
|
)))));
|
|
@@ -10019,7 +10022,7 @@ function ProfileScreen() {
|
|
|
10019
10022
|
function OrderCard({ order }) {
|
|
10020
10023
|
const { buildPath } = useBasePath();
|
|
10021
10024
|
const config = order.orderStatus;
|
|
10022
|
-
return /* @__PURE__ */
|
|
10025
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
10023
10026
|
framerMotion.motion.div,
|
|
10024
10027
|
{
|
|
10025
10028
|
initial: { opacity: 0, y: 20 },
|
|
@@ -10027,9 +10030,9 @@ function OrderCard({ order }) {
|
|
|
10027
10030
|
whileHover: { y: -4 },
|
|
10028
10031
|
className: "bg-white rounded-2xl p-6 shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100"
|
|
10029
10032
|
},
|
|
10030
|
-
/* @__PURE__ */
|
|
10031
|
-
/* @__PURE__ */
|
|
10032
|
-
/* @__PURE__ */
|
|
10033
|
+
/* @__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)),
|
|
10034
|
+
/* @__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" : "")),
|
|
10035
|
+
/* @__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(
|
|
10033
10036
|
"a",
|
|
10034
10037
|
{
|
|
10035
10038
|
href: order?.payment?.paymentIntent?.hostedInvoiceUrl || "",
|
|
@@ -10037,16 +10040,16 @@ function OrderCard({ order }) {
|
|
|
10037
10040
|
rel: "noopener noreferrer",
|
|
10038
10041
|
className: "inline-flex items-center gap-2 px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors"
|
|
10039
10042
|
},
|
|
10040
|
-
/* @__PURE__ */
|
|
10043
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.CreditCard, { className: "w-4 h-4" }),
|
|
10041
10044
|
"Pay Now"
|
|
10042
10045
|
)))
|
|
10043
10046
|
);
|
|
10044
10047
|
}
|
|
10045
10048
|
function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
10046
|
-
const [orders, setOrders] =
|
|
10047
|
-
const [isLoading, setIsLoading] =
|
|
10048
|
-
const [error, setError] =
|
|
10049
|
-
const [pagination, setPagination] =
|
|
10049
|
+
const [orders, setOrders] = React21.useState([]);
|
|
10050
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10051
|
+
const [error, setError] = React21.useState(null);
|
|
10052
|
+
const [pagination, setPagination] = React21.useState({
|
|
10050
10053
|
page: 1,
|
|
10051
10054
|
limit: 10,
|
|
10052
10055
|
total: 0,
|
|
@@ -10054,7 +10057,7 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10054
10057
|
});
|
|
10055
10058
|
const { user } = useAuth();
|
|
10056
10059
|
const resolvedUserId = user?._id || user?.id;
|
|
10057
|
-
const fetchOrders =
|
|
10060
|
+
const fetchOrders = React21.useCallback(async () => {
|
|
10058
10061
|
setIsLoading(true);
|
|
10059
10062
|
setError(null);
|
|
10060
10063
|
try {
|
|
@@ -10081,7 +10084,7 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10081
10084
|
setIsLoading(false);
|
|
10082
10085
|
}
|
|
10083
10086
|
}, [page, limit, resolvedUserId, orderStatus, paymentStatus]);
|
|
10084
|
-
|
|
10087
|
+
React21.useEffect(() => {
|
|
10085
10088
|
fetchOrders();
|
|
10086
10089
|
}, [fetchOrders]);
|
|
10087
10090
|
return {
|
|
@@ -10093,10 +10096,10 @@ function useOrders(page = 1, limit = 10, orderStatus, paymentStatus) {
|
|
|
10093
10096
|
};
|
|
10094
10097
|
}
|
|
10095
10098
|
function useOrder(id) {
|
|
10096
|
-
const [order, setOrder] =
|
|
10097
|
-
const [isLoading, setIsLoading] =
|
|
10098
|
-
const [error, setError] =
|
|
10099
|
-
const fetchOrder =
|
|
10099
|
+
const [order, setOrder] = React21.useState(null);
|
|
10100
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10101
|
+
const [error, setError] = React21.useState(null);
|
|
10102
|
+
const fetchOrder = React21.useCallback(async () => {
|
|
10100
10103
|
setIsLoading(true);
|
|
10101
10104
|
setError(null);
|
|
10102
10105
|
try {
|
|
@@ -10108,7 +10111,7 @@ function useOrder(id) {
|
|
|
10108
10111
|
setIsLoading(false);
|
|
10109
10112
|
}
|
|
10110
10113
|
}, [id]);
|
|
10111
|
-
|
|
10114
|
+
React21.useEffect(() => {
|
|
10112
10115
|
if (id) {
|
|
10113
10116
|
fetchOrder();
|
|
10114
10117
|
}
|
|
@@ -10116,10 +10119,10 @@ function useOrder(id) {
|
|
|
10116
10119
|
return { order, isLoading, error, refetch: fetchOrder };
|
|
10117
10120
|
}
|
|
10118
10121
|
function useCurrentOrders() {
|
|
10119
|
-
const [orders, setOrders] =
|
|
10120
|
-
const [isLoading, setIsLoading] =
|
|
10121
|
-
const [error, setError] =
|
|
10122
|
-
const fetchCurrentOrders =
|
|
10122
|
+
const [orders, setOrders] = React21.useState([]);
|
|
10123
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
10124
|
+
const [error, setError] = React21.useState(null);
|
|
10125
|
+
const fetchCurrentOrders = React21.useCallback(async () => {
|
|
10123
10126
|
setIsLoading(true);
|
|
10124
10127
|
setError(null);
|
|
10125
10128
|
try {
|
|
@@ -10131,7 +10134,7 @@ function useCurrentOrders() {
|
|
|
10131
10134
|
setIsLoading(false);
|
|
10132
10135
|
}
|
|
10133
10136
|
}, []);
|
|
10134
|
-
|
|
10137
|
+
React21.useEffect(() => {
|
|
10135
10138
|
fetchCurrentOrders();
|
|
10136
10139
|
}, [fetchCurrentOrders]);
|
|
10137
10140
|
return { orders, isLoading, error, refetch: fetchCurrentOrders };
|
|
@@ -10145,11 +10148,11 @@ function FilterChips({
|
|
|
10145
10148
|
maxVisible = 4,
|
|
10146
10149
|
variant = "primary"
|
|
10147
10150
|
}) {
|
|
10148
|
-
const [isOverflowOpen, setIsOverflowOpen] =
|
|
10149
|
-
const [filterSearchTerm, setFilterSearchTerm] =
|
|
10150
|
-
const overflowMenuRef =
|
|
10151
|
+
const [isOverflowOpen, setIsOverflowOpen] = React21.useState(false);
|
|
10152
|
+
const [filterSearchTerm, setFilterSearchTerm] = React21.useState("");
|
|
10153
|
+
const overflowMenuRef = React21.useRef(null);
|
|
10151
10154
|
const color = variant === "primary" ? "primary" : "secondary";
|
|
10152
|
-
const { visibleFilters, overflowFilters } =
|
|
10155
|
+
const { visibleFilters, overflowFilters } = React21.useMemo(() => {
|
|
10153
10156
|
const basePrimary = filters.slice(0, maxVisible);
|
|
10154
10157
|
if (basePrimary.includes(selected)) {
|
|
10155
10158
|
return {
|
|
@@ -10169,18 +10172,18 @@ function FilterChips({
|
|
|
10169
10172
|
overflowFilters: filters.filter((filter) => !uniquePrimary.includes(filter))
|
|
10170
10173
|
};
|
|
10171
10174
|
}, [filters, maxVisible, selected]);
|
|
10172
|
-
const filteredOverflowFilters =
|
|
10175
|
+
const filteredOverflowFilters = React21.useMemo(() => {
|
|
10173
10176
|
if (!filterSearchTerm.trim()) return overflowFilters;
|
|
10174
10177
|
return overflowFilters.filter(
|
|
10175
10178
|
(filter) => filter.toLowerCase().includes(filterSearchTerm.toLowerCase())
|
|
10176
10179
|
);
|
|
10177
10180
|
}, [filterSearchTerm, overflowFilters]);
|
|
10178
|
-
|
|
10181
|
+
React21.useEffect(() => {
|
|
10179
10182
|
if (!isOverflowOpen) {
|
|
10180
10183
|
setFilterSearchTerm("");
|
|
10181
10184
|
}
|
|
10182
10185
|
}, [isOverflowOpen]);
|
|
10183
|
-
|
|
10186
|
+
React21.useEffect(() => {
|
|
10184
10187
|
function handleClickOutside(event) {
|
|
10185
10188
|
if (overflowMenuRef.current && !overflowMenuRef.current.contains(event.target)) {
|
|
10186
10189
|
setIsOverflowOpen(false);
|
|
@@ -10193,7 +10196,7 @@ function FilterChips({
|
|
|
10193
10196
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
10194
10197
|
};
|
|
10195
10198
|
}, [isOverflowOpen]);
|
|
10196
|
-
return /* @__PURE__ */
|
|
10199
|
+
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(
|
|
10197
10200
|
"button",
|
|
10198
10201
|
{
|
|
10199
10202
|
key: filter,
|
|
@@ -10202,16 +10205,16 @@ function FilterChips({
|
|
|
10202
10205
|
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`}`
|
|
10203
10206
|
},
|
|
10204
10207
|
filter
|
|
10205
|
-
))), overflowFilters.length > 0 && /* @__PURE__ */
|
|
10208
|
+
))), overflowFilters.length > 0 && /* @__PURE__ */ React21__default.default.createElement("div", { className: "relative", ref: overflowMenuRef }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10206
10209
|
"button",
|
|
10207
10210
|
{
|
|
10208
10211
|
type: "button",
|
|
10209
10212
|
onClick: () => setIsOverflowOpen((prev) => !prev),
|
|
10210
10213
|
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"}`
|
|
10211
10214
|
},
|
|
10212
|
-
/* @__PURE__ */
|
|
10213
|
-
/* @__PURE__ */
|
|
10214
|
-
), /* @__PURE__ */
|
|
10215
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, overflowFilters.includes(selected) ? selected : "More"),
|
|
10216
|
+
/* @__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)
|
|
10217
|
+
), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isOverflowOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
10215
10218
|
framerMotion.motion.div,
|
|
10216
10219
|
{
|
|
10217
10220
|
initial: { opacity: 0, y: 8 },
|
|
@@ -10220,7 +10223,7 @@ function FilterChips({
|
|
|
10220
10223
|
transition: { duration: 0.15 },
|
|
10221
10224
|
className: "absolute right-0 z-50 mt-2 w-64 rounded-2xl border border-slate-100 bg-white shadow-xl shadow-primary-50"
|
|
10222
10225
|
},
|
|
10223
|
-
/* @__PURE__ */
|
|
10226
|
+
/* @__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(
|
|
10224
10227
|
"input",
|
|
10225
10228
|
{
|
|
10226
10229
|
type: "text",
|
|
@@ -10230,7 +10233,7 @@ function FilterChips({
|
|
|
10230
10233
|
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"
|
|
10231
10234
|
}
|
|
10232
10235
|
))),
|
|
10233
|
-
/* @__PURE__ */
|
|
10236
|
+
/* @__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(
|
|
10234
10237
|
"button",
|
|
10235
10238
|
{
|
|
10236
10239
|
key: filter,
|
|
@@ -10241,10 +10244,10 @@ function FilterChips({
|
|
|
10241
10244
|
},
|
|
10242
10245
|
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"}`
|
|
10243
10246
|
},
|
|
10244
|
-
/* @__PURE__ */
|
|
10245
|
-
selected === filter && /* @__PURE__ */
|
|
10246
|
-
)) : /* @__PURE__ */
|
|
10247
|
-
/* @__PURE__ */
|
|
10247
|
+
/* @__PURE__ */ React21__default.default.createElement("span", null, filter),
|
|
10248
|
+
selected === filter && /* @__PURE__ */ React21__default.default.createElement(lucideReact.Check, { className: "h-4 w-4" })
|
|
10249
|
+
)) : /* @__PURE__ */ React21__default.default.createElement("p", { className: "px-3 py-4 text-sm text-slate-500" }, "No items found.")),
|
|
10250
|
+
/* @__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(
|
|
10248
10251
|
"button",
|
|
10249
10252
|
{
|
|
10250
10253
|
type: "button",
|
|
@@ -10263,19 +10266,19 @@ var PAYMENT_FILTERS = ["All", ...Object.values(PaymentPaymentStatusEnum)];
|
|
|
10263
10266
|
function OrdersScreen() {
|
|
10264
10267
|
const router = navigation.useRouter();
|
|
10265
10268
|
const { buildPath } = useBasePath();
|
|
10266
|
-
const [page, setPage] =
|
|
10267
|
-
const [selectedFilter, setSelectedFilter] =
|
|
10268
|
-
const [selectedPaymentFilter, setSelectedPaymentFilter] =
|
|
10269
|
+
const [page, setPage] = React21.useState(1);
|
|
10270
|
+
const [selectedFilter, setSelectedFilter] = React21.useState("All");
|
|
10271
|
+
const [selectedPaymentFilter, setSelectedPaymentFilter] = React21.useState("All");
|
|
10269
10272
|
const { orders, isLoading, pagination } = useOrders(
|
|
10270
10273
|
page,
|
|
10271
10274
|
10,
|
|
10272
10275
|
selectedFilter,
|
|
10273
10276
|
selectedPaymentFilter
|
|
10274
10277
|
);
|
|
10275
|
-
const [isOverflowOpen, setIsOverflowOpen] =
|
|
10276
|
-
const [filterSearchTerm, setFilterSearchTerm] =
|
|
10277
|
-
const overflowMenuRef =
|
|
10278
|
-
const filteredOrders =
|
|
10278
|
+
const [isOverflowOpen, setIsOverflowOpen] = React21.useState(false);
|
|
10279
|
+
const [filterSearchTerm, setFilterSearchTerm] = React21.useState("");
|
|
10280
|
+
const overflowMenuRef = React21.useRef(null);
|
|
10281
|
+
const filteredOrders = React21.useMemo(() => {
|
|
10279
10282
|
return orders.filter((order) => {
|
|
10280
10283
|
const matchesStatus = selectedFilter === "All" || order?.orderStatus?.toLowerCase() === selectedFilter.toLowerCase();
|
|
10281
10284
|
const matchesPayment = selectedPaymentFilter === "All" || order?.payment?.paymentStatus?.toLowerCase() === selectedPaymentFilter.toLowerCase();
|
|
@@ -10284,12 +10287,12 @@ function OrdersScreen() {
|
|
|
10284
10287
|
}, [orders, selectedFilter, selectedPaymentFilter]);
|
|
10285
10288
|
const hasOrders = filteredOrders.length > 0;
|
|
10286
10289
|
const MAX_VISIBLE_FILTERS = 4;
|
|
10287
|
-
|
|
10290
|
+
React21.useEffect(() => {
|
|
10288
10291
|
if (!isOverflowOpen) {
|
|
10289
10292
|
setFilterSearchTerm("");
|
|
10290
10293
|
}
|
|
10291
10294
|
}, [isOverflowOpen]);
|
|
10292
|
-
|
|
10295
|
+
React21.useEffect(() => {
|
|
10293
10296
|
function handleClickOutside(event) {
|
|
10294
10297
|
if (overflowMenuRef.current && !overflowMenuRef.current.contains(event.target)) {
|
|
10295
10298
|
setIsOverflowOpen(false);
|
|
@@ -10302,23 +10305,23 @@ function OrdersScreen() {
|
|
|
10302
10305
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
10303
10306
|
};
|
|
10304
10307
|
}, [isOverflowOpen]);
|
|
10305
|
-
return /* @__PURE__ */
|
|
10308
|
+
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(
|
|
10306
10309
|
framerMotion.motion.div,
|
|
10307
10310
|
{
|
|
10308
10311
|
initial: { opacity: 0, y: 24 },
|
|
10309
10312
|
animate: { opacity: 1, y: 0 },
|
|
10310
10313
|
className: "space-y-6"
|
|
10311
10314
|
},
|
|
10312
|
-
/* @__PURE__ */
|
|
10313
|
-
/* @__PURE__ */
|
|
10314
|
-
))), /* @__PURE__ */
|
|
10315
|
+
/* @__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"),
|
|
10316
|
+
/* @__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.")))
|
|
10317
|
+
))), /* @__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(
|
|
10315
10318
|
framerMotion.motion.div,
|
|
10316
10319
|
{
|
|
10317
10320
|
initial: { opacity: 0, y: 24 },
|
|
10318
10321
|
animate: { opacity: 1, y: 0 },
|
|
10319
10322
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
10320
10323
|
},
|
|
10321
|
-
/* @__PURE__ */
|
|
10324
|
+
/* @__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(
|
|
10322
10325
|
FilterChips,
|
|
10323
10326
|
{
|
|
10324
10327
|
label: "Status filters",
|
|
@@ -10332,7 +10335,7 @@ function OrdersScreen() {
|
|
|
10332
10335
|
maxVisible: MAX_VISIBLE_FILTERS,
|
|
10333
10336
|
variant: "primary"
|
|
10334
10337
|
}
|
|
10335
|
-
), /* @__PURE__ */
|
|
10338
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10336
10339
|
FilterChips,
|
|
10337
10340
|
{
|
|
10338
10341
|
label: "Payment status",
|
|
@@ -10347,7 +10350,7 @@ function OrdersScreen() {
|
|
|
10347
10350
|
variant: "primary"
|
|
10348
10351
|
}
|
|
10349
10352
|
))),
|
|
10350
|
-
/* @__PURE__ */
|
|
10353
|
+
/* @__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(
|
|
10351
10354
|
EmptyState,
|
|
10352
10355
|
{
|
|
10353
10356
|
icon: lucideReact.Package,
|
|
@@ -10357,16 +10360,16 @@ function OrdersScreen() {
|
|
|
10357
10360
|
onAction: () => router.push(buildPath("/shop"))
|
|
10358
10361
|
}
|
|
10359
10362
|
)),
|
|
10360
|
-
!isLoading && pagination.totalPages > 1 && hasOrders && /* @__PURE__ */
|
|
10363
|
+
!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(
|
|
10361
10364
|
Button,
|
|
10362
10365
|
{
|
|
10363
10366
|
variant: "outline",
|
|
10364
10367
|
onClick: () => setPage((current) => Math.max(1, current - 1)),
|
|
10365
10368
|
disabled: page === 1
|
|
10366
10369
|
},
|
|
10367
|
-
/* @__PURE__ */
|
|
10370
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronLeft, { className: "h-5 w-5" }),
|
|
10368
10371
|
"Previous"
|
|
10369
|
-
), /* @__PURE__ */
|
|
10372
|
+
), /* @__PURE__ */ React21__default.default.createElement("span", { className: "text-sm font-semibold text-slate-600" }, "Page ", page, " of ", pagination.totalPages), /* @__PURE__ */ React21__default.default.createElement(
|
|
10370
10373
|
Button,
|
|
10371
10374
|
{
|
|
10372
10375
|
variant: "outline",
|
|
@@ -10374,7 +10377,7 @@ function OrdersScreen() {
|
|
|
10374
10377
|
disabled: page === pagination.totalPages
|
|
10375
10378
|
},
|
|
10376
10379
|
"Next",
|
|
10377
|
-
/* @__PURE__ */
|
|
10380
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ChevronRight, { className: "h-5 w-5" })
|
|
10378
10381
|
))
|
|
10379
10382
|
))));
|
|
10380
10383
|
}
|
|
@@ -10383,17 +10386,17 @@ function CurrentOrdersScreen() {
|
|
|
10383
10386
|
const { orders, isLoading } = useCurrentOrders();
|
|
10384
10387
|
const { buildPath } = useBasePath();
|
|
10385
10388
|
const hasOrders = orders.length > 0;
|
|
10386
|
-
return /* @__PURE__ */
|
|
10389
|
+
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(
|
|
10387
10390
|
framerMotion.motion.div,
|
|
10388
10391
|
{
|
|
10389
10392
|
initial: { opacity: 0, y: 24 },
|
|
10390
10393
|
animate: { opacity: 1, y: 0 },
|
|
10391
10394
|
className: "space-y-4"
|
|
10392
10395
|
},
|
|
10393
|
-
/* @__PURE__ */
|
|
10394
|
-
/* @__PURE__ */
|
|
10395
|
-
/* @__PURE__ */
|
|
10396
|
-
), /* @__PURE__ */
|
|
10396
|
+
/* @__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"),
|
|
10397
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Current orders"),
|
|
10398
|
+
/* @__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.")
|
|
10399
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10397
10400
|
framerMotion.motion.div,
|
|
10398
10401
|
{
|
|
10399
10402
|
initial: { opacity: 0, y: 24 },
|
|
@@ -10401,24 +10404,24 @@ function CurrentOrdersScreen() {
|
|
|
10401
10404
|
transition: { delay: 0.1 },
|
|
10402
10405
|
className: "rounded-3xl bg-white/15 p-6 backdrop-blur"
|
|
10403
10406
|
},
|
|
10404
|
-
/* @__PURE__ */
|
|
10405
|
-
/* @__PURE__ */
|
|
10407
|
+
/* @__PURE__ */ React21__default.default.createElement("p", { className: "text-sm font-semibold uppercase tracking-[0.35em] text-white/70" }, "Quick actions"),
|
|
10408
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-4 space-y-3 text-sm text-white/80" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10406
10409
|
Link8__default.default,
|
|
10407
10410
|
{
|
|
10408
10411
|
href: buildPath("/orders"),
|
|
10409
10412
|
className: "flex items-center justify-between rounded-2xl bg-white/10 px-4 py-3 transition hover:bg-white/20"
|
|
10410
10413
|
},
|
|
10411
|
-
/* @__PURE__ */
|
|
10412
|
-
/* @__PURE__ */
|
|
10413
|
-
), /* @__PURE__ */
|
|
10414
|
-
)))), /* @__PURE__ */
|
|
10414
|
+
/* @__PURE__ */ React21__default.default.createElement("span", { className: "font-semibold text-white" }, "View order history"),
|
|
10415
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.ArrowUpRight, { className: "h-4 w-4" })
|
|
10416
|
+
), /* @__PURE__ */ React21__default.default.createElement("p", null, "Need help fast? Chat with a pharmacist and we will triage your request in under 10 minutes."))
|
|
10417
|
+
)))), /* @__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(
|
|
10415
10418
|
framerMotion.motion.section,
|
|
10416
10419
|
{
|
|
10417
10420
|
initial: { opacity: 0, y: 24 },
|
|
10418
10421
|
animate: { opacity: 1, y: 0 },
|
|
10419
10422
|
className: "grid gap-6 lg:grid-cols-[minmax(0,2fr)_minmax(0,1fr)]"
|
|
10420
10423
|
},
|
|
10421
|
-
/* @__PURE__ */
|
|
10424
|
+
/* @__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(
|
|
10422
10425
|
EmptyState,
|
|
10423
10426
|
{
|
|
10424
10427
|
icon: lucideReact.PackageCheck,
|
|
@@ -10428,7 +10431,7 @@ function CurrentOrdersScreen() {
|
|
|
10428
10431
|
onAction: () => router.push(buildPath("/shop"))
|
|
10429
10432
|
}
|
|
10430
10433
|
))),
|
|
10431
|
-
/* @__PURE__ */
|
|
10434
|
+
/* @__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.")))
|
|
10432
10435
|
))));
|
|
10433
10436
|
}
|
|
10434
10437
|
var addressFormSchema = zod.z.object({
|
|
@@ -10461,12 +10464,12 @@ function formatAddressSnippet(address) {
|
|
|
10461
10464
|
function getAddressTypeCopy(type) {
|
|
10462
10465
|
switch (type) {
|
|
10463
10466
|
case "Billing":
|
|
10464
|
-
return { label: "Billing", icon: /* @__PURE__ */
|
|
10467
|
+
return { label: "Billing", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Home, { className: "h-4 w-4" }) };
|
|
10465
10468
|
case "Both":
|
|
10466
|
-
return { label: "Billing & Shipping", icon: /* @__PURE__ */
|
|
10469
|
+
return { label: "Billing & Shipping", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.Globe, { className: "h-4 w-4" }) };
|
|
10467
10470
|
case "Shipping":
|
|
10468
10471
|
default:
|
|
10469
|
-
return { label: "Shipping", icon: /* @__PURE__ */
|
|
10472
|
+
return { label: "Shipping", icon: /* @__PURE__ */ React21__default.default.createElement(lucideReact.MapPin, { className: "h-4 w-4" }) };
|
|
10470
10473
|
}
|
|
10471
10474
|
}
|
|
10472
10475
|
function AddressesScreen() {
|
|
@@ -10480,8 +10483,8 @@ function AddressesScreen() {
|
|
|
10480
10483
|
removeAddress,
|
|
10481
10484
|
markAsDefault
|
|
10482
10485
|
} = useAddresses();
|
|
10483
|
-
const [isModalOpen, setIsModalOpen] =
|
|
10484
|
-
const [editingAddress, setEditingAddress] =
|
|
10486
|
+
const [isModalOpen, setIsModalOpen] = React21.useState(false);
|
|
10487
|
+
const [editingAddress, setEditingAddress] = React21.useState(null);
|
|
10485
10488
|
const {
|
|
10486
10489
|
register,
|
|
10487
10490
|
handleSubmit,
|
|
@@ -10491,7 +10494,7 @@ function AddressesScreen() {
|
|
|
10491
10494
|
resolver: zod$1.zodResolver(addressFormSchema),
|
|
10492
10495
|
defaultValues: FORM_DEFAULTS
|
|
10493
10496
|
});
|
|
10494
|
-
|
|
10497
|
+
React21.useEffect(() => {
|
|
10495
10498
|
if (editingAddress) {
|
|
10496
10499
|
reset({
|
|
10497
10500
|
fullName: editingAddress.name,
|
|
@@ -10586,7 +10589,7 @@ You can add it back at any time.`
|
|
|
10586
10589
|
});
|
|
10587
10590
|
}
|
|
10588
10591
|
};
|
|
10589
|
-
const stats =
|
|
10592
|
+
const stats = React21.useMemo(() => {
|
|
10590
10593
|
const shippingCount = addresses.filter((address) => address.addressType !== "Billing").length;
|
|
10591
10594
|
const billingCount = addresses.filter((address) => address.addressType !== "Shipping").length;
|
|
10592
10595
|
return [
|
|
@@ -10610,18 +10613,18 @@ You can add it back at any time.`
|
|
|
10610
10613
|
}
|
|
10611
10614
|
];
|
|
10612
10615
|
}, [addresses]);
|
|
10613
|
-
return /* @__PURE__ */
|
|
10616
|
+
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(
|
|
10614
10617
|
framerMotion.motion.div,
|
|
10615
10618
|
{
|
|
10616
10619
|
initial: { opacity: 0, y: 24 },
|
|
10617
10620
|
animate: { opacity: 1, y: 0 },
|
|
10618
10621
|
className: "space-y-5"
|
|
10619
10622
|
},
|
|
10620
|
-
/* @__PURE__ */
|
|
10621
|
-
/* @__PURE__ */
|
|
10622
|
-
/* @__PURE__ */
|
|
10623
|
-
/* @__PURE__ */
|
|
10624
|
-
), /* @__PURE__ */
|
|
10623
|
+
/* @__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"),
|
|
10624
|
+
/* @__PURE__ */ React21__default.default.createElement("h1", { className: "text-4xl font-bold md:text-5xl" }, "Manage where your care arrives"),
|
|
10625
|
+
/* @__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."),
|
|
10626
|
+
/* @__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"))
|
|
10627
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10625
10628
|
framerMotion.motion.div,
|
|
10626
10629
|
{
|
|
10627
10630
|
initial: { opacity: 0, y: 24 },
|
|
@@ -10629,14 +10632,14 @@ You can add it back at any time.`
|
|
|
10629
10632
|
transition: { delay: 0.1 },
|
|
10630
10633
|
className: "grid gap-4 rounded-3xl bg-white/15 p-6 text-sm text-white/80 backdrop-blur"
|
|
10631
10634
|
},
|
|
10632
|
-
stats.map((stat) => /* @__PURE__ */
|
|
10633
|
-
)))), /* @__PURE__ */
|
|
10635
|
+
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)))
|
|
10636
|
+
)))), /* @__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(
|
|
10634
10637
|
"div",
|
|
10635
10638
|
{
|
|
10636
10639
|
key: index,
|
|
10637
10640
|
className: "h-56 animate-pulse rounded-3xl border border-slate-100 bg-white"
|
|
10638
10641
|
}
|
|
10639
|
-
))) : error ? /* @__PURE__ */
|
|
10642
|
+
))) : 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(
|
|
10640
10643
|
EmptyState,
|
|
10641
10644
|
{
|
|
10642
10645
|
icon: lucideReact.MapPin,
|
|
@@ -10645,9 +10648,9 @@ You can add it back at any time.`
|
|
|
10645
10648
|
actionLabel: "Add your first address",
|
|
10646
10649
|
onAction: openCreateModal
|
|
10647
10650
|
}
|
|
10648
|
-
)) : /* @__PURE__ */
|
|
10651
|
+
)) : /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-3" }, addresses.map((address) => {
|
|
10649
10652
|
const typeCopy = getAddressTypeCopy(address.addressType);
|
|
10650
|
-
return /* @__PURE__ */
|
|
10653
|
+
return /* @__PURE__ */ React21__default.default.createElement(
|
|
10651
10654
|
framerMotion.motion.div,
|
|
10652
10655
|
{
|
|
10653
10656
|
key: address.id,
|
|
@@ -10655,39 +10658,39 @@ You can add it back at any time.`
|
|
|
10655
10658
|
animate: { opacity: 1, y: 0 },
|
|
10656
10659
|
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"
|
|
10657
10660
|
},
|
|
10658
|
-
address.isDefault && /* @__PURE__ */
|
|
10659
|
-
/* @__PURE__ */
|
|
10660
|
-
/* @__PURE__ */
|
|
10661
|
-
/* @__PURE__ */
|
|
10661
|
+
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"),
|
|
10662
|
+
/* @__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))),
|
|
10663
|
+
/* @__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")),
|
|
10664
|
+
/* @__PURE__ */ React21__default.default.createElement("div", { className: "mt-6 flex items-center justify-between gap-3" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10662
10665
|
"button",
|
|
10663
10666
|
{
|
|
10664
10667
|
type: "button",
|
|
10665
10668
|
onClick: () => openEditModal(address),
|
|
10666
10669
|
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"
|
|
10667
10670
|
},
|
|
10668
|
-
/* @__PURE__ */
|
|
10671
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Edit3, { className: "h-4 w-4" }),
|
|
10669
10672
|
"Edit"
|
|
10670
|
-
), /* @__PURE__ */
|
|
10673
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex items-center gap-2" }, !address.isDefault && /* @__PURE__ */ React21__default.default.createElement(
|
|
10671
10674
|
"button",
|
|
10672
10675
|
{
|
|
10673
10676
|
type: "button",
|
|
10674
10677
|
onClick: () => handleSetDefault(address),
|
|
10675
10678
|
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"
|
|
10676
10679
|
},
|
|
10677
|
-
/* @__PURE__ */
|
|
10680
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Star, { className: "h-4 w-4" }),
|
|
10678
10681
|
"Make default"
|
|
10679
|
-
), /* @__PURE__ */
|
|
10682
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10680
10683
|
"button",
|
|
10681
10684
|
{
|
|
10682
10685
|
type: "button",
|
|
10683
10686
|
onClick: () => handleDelete(address),
|
|
10684
10687
|
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"
|
|
10685
10688
|
},
|
|
10686
|
-
/* @__PURE__ */
|
|
10689
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-4 w-4" }),
|
|
10687
10690
|
"Delete"
|
|
10688
10691
|
)))
|
|
10689
10692
|
);
|
|
10690
|
-
})))), /* @__PURE__ */
|
|
10693
|
+
})))), /* @__PURE__ */ React21__default.default.createElement(
|
|
10691
10694
|
Modal,
|
|
10692
10695
|
{
|
|
10693
10696
|
isOpen: isModalOpen,
|
|
@@ -10695,7 +10698,7 @@ You can add it back at any time.`
|
|
|
10695
10698
|
title: editingAddress ? "Edit address" : "Add new address",
|
|
10696
10699
|
size: "lg"
|
|
10697
10700
|
},
|
|
10698
|
-
/* @__PURE__ */
|
|
10701
|
+
/* @__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(
|
|
10699
10702
|
Input,
|
|
10700
10703
|
{
|
|
10701
10704
|
label: "Full name",
|
|
@@ -10703,7 +10706,7 @@ You can add it back at any time.`
|
|
|
10703
10706
|
...register("fullName"),
|
|
10704
10707
|
error: errors.fullName?.message
|
|
10705
10708
|
}
|
|
10706
|
-
), /* @__PURE__ */
|
|
10709
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10707
10710
|
Input,
|
|
10708
10711
|
{
|
|
10709
10712
|
label: "Phone number",
|
|
@@ -10711,7 +10714,7 @@ You can add it back at any time.`
|
|
|
10711
10714
|
...register("phone"),
|
|
10712
10715
|
error: errors.phone?.message
|
|
10713
10716
|
}
|
|
10714
|
-
)), /* @__PURE__ */
|
|
10717
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
10715
10718
|
Input,
|
|
10716
10719
|
{
|
|
10717
10720
|
label: "Address line 1",
|
|
@@ -10719,7 +10722,7 @@ You can add it back at any time.`
|
|
|
10719
10722
|
...register("addressLine1"),
|
|
10720
10723
|
error: errors.addressLine1?.message
|
|
10721
10724
|
}
|
|
10722
|
-
), /* @__PURE__ */
|
|
10725
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10723
10726
|
Input,
|
|
10724
10727
|
{
|
|
10725
10728
|
label: "Address line 2 (optional)",
|
|
@@ -10727,7 +10730,7 @@ You can add it back at any time.`
|
|
|
10727
10730
|
...register("addressLine2"),
|
|
10728
10731
|
error: errors.addressLine2?.message
|
|
10729
10732
|
}
|
|
10730
|
-
), /* @__PURE__ */
|
|
10733
|
+
), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10731
10734
|
Input,
|
|
10732
10735
|
{
|
|
10733
10736
|
label: "City",
|
|
@@ -10735,7 +10738,7 @@ You can add it back at any time.`
|
|
|
10735
10738
|
...register("city"),
|
|
10736
10739
|
error: errors.city?.message
|
|
10737
10740
|
}
|
|
10738
|
-
), /* @__PURE__ */
|
|
10741
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10739
10742
|
Input,
|
|
10740
10743
|
{
|
|
10741
10744
|
label: "State / Region",
|
|
@@ -10743,7 +10746,7 @@ You can add it back at any time.`
|
|
|
10743
10746
|
...register("state"),
|
|
10744
10747
|
error: errors.state?.message
|
|
10745
10748
|
}
|
|
10746
|
-
)), /* @__PURE__ */
|
|
10749
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "grid gap-4 md:grid-cols-2" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10747
10750
|
Input,
|
|
10748
10751
|
{
|
|
10749
10752
|
label: "Postal code",
|
|
@@ -10751,7 +10754,7 @@ You can add it back at any time.`
|
|
|
10751
10754
|
...register("zipCode"),
|
|
10752
10755
|
error: errors.zipCode?.message
|
|
10753
10756
|
}
|
|
10754
|
-
), /* @__PURE__ */
|
|
10757
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10755
10758
|
Input,
|
|
10756
10759
|
{
|
|
10757
10760
|
label: "Country",
|
|
@@ -10759,35 +10762,35 @@ You can add it back at any time.`
|
|
|
10759
10762
|
...register("country"),
|
|
10760
10763
|
error: errors.country?.message
|
|
10761
10764
|
}
|
|
10762
|
-
)), /* @__PURE__ */
|
|
10765
|
+
)), /* @__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(
|
|
10763
10766
|
"select",
|
|
10764
10767
|
{
|
|
10765
10768
|
...register("addressType"),
|
|
10766
10769
|
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"
|
|
10767
10770
|
},
|
|
10768
|
-
/* @__PURE__ */
|
|
10769
|
-
/* @__PURE__ */
|
|
10770
|
-
/* @__PURE__ */
|
|
10771
|
-
)), /* @__PURE__ */
|
|
10771
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Shipping" }, "Shipping"),
|
|
10772
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Billing" }, "Billing"),
|
|
10773
|
+
/* @__PURE__ */ React21__default.default.createElement("option", { value: "Both" }, "Billing & Shipping")
|
|
10774
|
+
)), /* @__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(
|
|
10772
10775
|
"input",
|
|
10773
10776
|
{
|
|
10774
10777
|
type: "checkbox",
|
|
10775
10778
|
...register("isDefault"),
|
|
10776
10779
|
className: "h-4 w-4 rounded border-primary-300 text-primary-600 focus:ring-primary-500"
|
|
10777
10780
|
}
|
|
10778
|
-
))), /* @__PURE__ */
|
|
10781
|
+
))), /* @__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")))
|
|
10779
10782
|
));
|
|
10780
10783
|
}
|
|
10781
10784
|
function useWishlistProducts(productIds = []) {
|
|
10782
|
-
const [products, setProducts] =
|
|
10783
|
-
const [isLoading, setIsLoading] =
|
|
10784
|
-
const [error, setError] =
|
|
10785
|
-
const [cache] =
|
|
10786
|
-
const uniqueIds =
|
|
10785
|
+
const [products, setProducts] = React21.useState([]);
|
|
10786
|
+
const [isLoading, setIsLoading] = React21.useState(false);
|
|
10787
|
+
const [error, setError] = React21.useState(null);
|
|
10788
|
+
const [cache] = React21.useState(() => /* @__PURE__ */ new Map());
|
|
10789
|
+
const uniqueIds = React21.useMemo(
|
|
10787
10790
|
() => Array.from(new Set((productIds || []).filter(Boolean))),
|
|
10788
10791
|
[productIds]
|
|
10789
10792
|
);
|
|
10790
|
-
const fetchProducts =
|
|
10793
|
+
const fetchProducts = React21.useCallback(async () => {
|
|
10791
10794
|
if (uniqueIds.length === 0) {
|
|
10792
10795
|
setProducts([]);
|
|
10793
10796
|
setIsLoading(false);
|
|
@@ -10815,7 +10818,7 @@ function useWishlistProducts(productIds = []) {
|
|
|
10815
10818
|
setIsLoading(false);
|
|
10816
10819
|
}
|
|
10817
10820
|
}, [cache, uniqueIds]);
|
|
10818
|
-
|
|
10821
|
+
React21.useEffect(() => {
|
|
10819
10822
|
fetchProducts();
|
|
10820
10823
|
}, [fetchProducts]);
|
|
10821
10824
|
return {
|
|
@@ -10847,10 +10850,10 @@ function WishlistScreen() {
|
|
|
10847
10850
|
const { products: wishlistProducts, isLoading, error } = useWishlistProducts(
|
|
10848
10851
|
wishlistItems
|
|
10849
10852
|
);
|
|
10850
|
-
const [onlyInStock, setOnlyInStock] =
|
|
10851
|
-
const [viewMode, setViewMode] =
|
|
10852
|
-
const [sortOption, setSortOption] =
|
|
10853
|
-
|
|
10853
|
+
const [onlyInStock, setOnlyInStock] = React21.useState(false);
|
|
10854
|
+
const [viewMode, setViewMode] = React21.useState("list");
|
|
10855
|
+
const [sortOption, setSortOption] = React21.useState("featured");
|
|
10856
|
+
React21.useEffect(() => {
|
|
10854
10857
|
if (error) {
|
|
10855
10858
|
sonner.toast.error("We had trouble loading your saved products. Please try again.");
|
|
10856
10859
|
}
|
|
@@ -10872,11 +10875,11 @@ function WishlistScreen() {
|
|
|
10872
10875
|
console.error("Error clearing wishlist:", err);
|
|
10873
10876
|
}
|
|
10874
10877
|
};
|
|
10875
|
-
const totalValue =
|
|
10878
|
+
const totalValue = React21.useMemo(
|
|
10876
10879
|
() => wishlistProducts.reduce((sum, product) => sum + (product.finalPrice ?? 0), 0),
|
|
10877
10880
|
[wishlistProducts]
|
|
10878
10881
|
);
|
|
10879
|
-
|
|
10882
|
+
React21.useMemo(
|
|
10880
10883
|
() => wishlistProducts.reduce((sum, product) => {
|
|
10881
10884
|
const before = product.priceBeforeDiscount ?? product.finalPrice ?? 0;
|
|
10882
10885
|
const after = product.finalPrice ?? 0;
|
|
@@ -10885,11 +10888,11 @@ function WishlistScreen() {
|
|
|
10885
10888
|
}, 0),
|
|
10886
10889
|
[wishlistProducts]
|
|
10887
10890
|
);
|
|
10888
|
-
|
|
10891
|
+
React21.useMemo(
|
|
10889
10892
|
() => wishlistProducts.filter((product) => (product.inventoryCount ?? 0) > 0).length,
|
|
10890
10893
|
[wishlistProducts]
|
|
10891
10894
|
);
|
|
10892
|
-
const processedProducts =
|
|
10895
|
+
const processedProducts = React21.useMemo(() => {
|
|
10893
10896
|
let list = [...wishlistProducts];
|
|
10894
10897
|
if (onlyInStock) {
|
|
10895
10898
|
list = list.filter((product) => (product.inventoryCount ?? 0) > 0);
|
|
@@ -10915,14 +10918,14 @@ function WishlistScreen() {
|
|
|
10915
10918
|
return list;
|
|
10916
10919
|
}, [wishlistProducts, onlyInStock, sortOption]);
|
|
10917
10920
|
const emptyAfterFiltering = !isLoading && wishlistProducts.length > 0 && processedProducts.length === 0;
|
|
10918
|
-
return /* @__PURE__ */
|
|
10921
|
+
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(
|
|
10919
10922
|
framerMotion.motion.div,
|
|
10920
10923
|
{
|
|
10921
10924
|
initial: { opacity: 0, y: 24 },
|
|
10922
10925
|
animate: { opacity: 1, y: 0 },
|
|
10923
10926
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-xl shadow-primary-50"
|
|
10924
10927
|
},
|
|
10925
|
-
/* @__PURE__ */
|
|
10928
|
+
/* @__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(
|
|
10926
10929
|
"input",
|
|
10927
10930
|
{
|
|
10928
10931
|
type: "checkbox",
|
|
@@ -10930,54 +10933,54 @@ function WishlistScreen() {
|
|
|
10930
10933
|
onChange: (event) => setOnlyInStock(event.target.checked),
|
|
10931
10934
|
className: "h-4 w-4 rounded border-slate-300 text-primary-600 focus:ring-primary-500"
|
|
10932
10935
|
}
|
|
10933
|
-
), "Only show in-stock"), /* @__PURE__ */
|
|
10936
|
+
), "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(
|
|
10934
10937
|
"select",
|
|
10935
10938
|
{
|
|
10936
10939
|
value: sortOption,
|
|
10937
10940
|
onChange: (event) => setSortOption(event.target.value),
|
|
10938
10941
|
className: "bg-transparent text-sm font-medium text-slate-700 outline-none"
|
|
10939
10942
|
},
|
|
10940
|
-
SORT_OPTIONS.map((option) => /* @__PURE__ */
|
|
10941
|
-
)), /* @__PURE__ */
|
|
10943
|
+
SORT_OPTIONS.map((option) => /* @__PURE__ */ React21__default.default.createElement("option", { key: option.value, value: option.value }, option.label))
|
|
10944
|
+
)), /* @__PURE__ */ React21__default.default.createElement("div", { className: "flex overflow-hidden rounded-full border border-slate-200 bg-slate-50" }, /* @__PURE__ */ React21__default.default.createElement(
|
|
10942
10945
|
"button",
|
|
10943
10946
|
{
|
|
10944
10947
|
type: "button",
|
|
10945
10948
|
onClick: () => setViewMode("grid"),
|
|
10946
10949
|
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"}`
|
|
10947
10950
|
},
|
|
10948
|
-
/* @__PURE__ */
|
|
10951
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Grid, { className: "h-4 w-4" }),
|
|
10949
10952
|
"Grid"
|
|
10950
|
-
), /* @__PURE__ */
|
|
10953
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
10951
10954
|
"button",
|
|
10952
10955
|
{
|
|
10953
10956
|
type: "button",
|
|
10954
10957
|
onClick: () => setViewMode("list"),
|
|
10955
10958
|
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"}`
|
|
10956
10959
|
},
|
|
10957
|
-
/* @__PURE__ */
|
|
10960
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.List, { className: "h-4 w-4" }),
|
|
10958
10961
|
"List"
|
|
10959
|
-
)), wishlistCount > 0 && /* @__PURE__ */
|
|
10962
|
+
)), wishlistCount > 0 && /* @__PURE__ */ React21__default.default.createElement(
|
|
10960
10963
|
Button,
|
|
10961
10964
|
{
|
|
10962
10965
|
variant: "ghost",
|
|
10963
10966
|
className: "text-sm font-semibold text-slate-500 hover:text-red-500",
|
|
10964
10967
|
onClick: handleClearWishlist
|
|
10965
10968
|
},
|
|
10966
|
-
/* @__PURE__ */
|
|
10969
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Trash2, { className: "h-4 w-4" }),
|
|
10967
10970
|
"Clear all"
|
|
10968
|
-
))), isLoading && /* @__PURE__ */
|
|
10971
|
+
))), 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(
|
|
10969
10972
|
"div",
|
|
10970
10973
|
{
|
|
10971
10974
|
key: index,
|
|
10972
10975
|
className: "h-72 animate-pulse rounded-2xl border border-slate-200 bg-slate-100"
|
|
10973
10976
|
}
|
|
10974
|
-
))), !isLoading && wishlistCount === 0 && /* @__PURE__ */
|
|
10977
|
+
))), !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(
|
|
10975
10978
|
framerMotion.motion.div,
|
|
10976
10979
|
{
|
|
10977
10980
|
layout: true,
|
|
10978
10981
|
className: "grid grid-cols-1 gap-5 sm:grid-cols-2 xl:grid-cols-3"
|
|
10979
10982
|
},
|
|
10980
|
-
/* @__PURE__ */
|
|
10983
|
+
/* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, processedProducts.map((product) => /* @__PURE__ */ React21__default.default.createElement(
|
|
10981
10984
|
framerMotion.motion.div,
|
|
10982
10985
|
{
|
|
10983
10986
|
key: product.id,
|
|
@@ -10987,7 +10990,7 @@ function WishlistScreen() {
|
|
|
10987
10990
|
exit: { opacity: 0, y: -20 },
|
|
10988
10991
|
transition: { duration: 0.2 }
|
|
10989
10992
|
},
|
|
10990
|
-
/* @__PURE__ */
|
|
10993
|
+
/* @__PURE__ */ React21__default.default.createElement(
|
|
10991
10994
|
ProductCard,
|
|
10992
10995
|
{
|
|
10993
10996
|
product,
|
|
@@ -10997,7 +11000,7 @@ function WishlistScreen() {
|
|
|
10997
11000
|
}
|
|
10998
11001
|
)
|
|
10999
11002
|
)))
|
|
11000
|
-
) : /* @__PURE__ */
|
|
11003
|
+
) : /* @__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(
|
|
11001
11004
|
framerMotion.motion.div,
|
|
11002
11005
|
{
|
|
11003
11006
|
key: product.id,
|
|
@@ -11008,7 +11011,7 @@ function WishlistScreen() {
|
|
|
11008
11011
|
transition: { duration: 0.2 },
|
|
11009
11012
|
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"
|
|
11010
11013
|
},
|
|
11011
|
-
/* @__PURE__ */
|
|
11014
|
+
/* @__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(
|
|
11012
11015
|
Image3__default.default,
|
|
11013
11016
|
{
|
|
11014
11017
|
fill: true,
|
|
@@ -11017,14 +11020,14 @@ function WishlistScreen() {
|
|
|
11017
11020
|
className: "h-full w-full object-cover"
|
|
11018
11021
|
}
|
|
11019
11022
|
)),
|
|
11020
|
-
/* @__PURE__ */
|
|
11023
|
+
/* @__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(
|
|
11021
11024
|
Button,
|
|
11022
11025
|
{
|
|
11023
11026
|
size: "sm",
|
|
11024
11027
|
onClick: () => router.push(buildPath(`/products/${product.id}`))
|
|
11025
11028
|
},
|
|
11026
11029
|
"View details"
|
|
11027
|
-
), /* @__PURE__ */
|
|
11030
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11028
11031
|
Button,
|
|
11029
11032
|
{
|
|
11030
11033
|
size: "sm",
|
|
@@ -11034,7 +11037,7 @@ function WishlistScreen() {
|
|
|
11034
11037
|
},
|
|
11035
11038
|
"Remove"
|
|
11036
11039
|
)))
|
|
11037
|
-
))))), isAuthenticated && emptyAfterFiltering && /* @__PURE__ */
|
|
11040
|
+
))))), 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"))))
|
|
11038
11041
|
))));
|
|
11039
11042
|
}
|
|
11040
11043
|
function SearchPage() {
|
|
@@ -11042,12 +11045,12 @@ function SearchPage() {
|
|
|
11042
11045
|
const { buildPath } = useBasePath();
|
|
11043
11046
|
const searchParams = navigation.useSearchParams();
|
|
11044
11047
|
const searchQuery = searchParams.get("q") || "";
|
|
11045
|
-
const [products, setProducts] =
|
|
11046
|
-
const [isLoading, setIsLoading] =
|
|
11047
|
-
const [searchInput, setSearchInput] =
|
|
11048
|
-
const [hasSearched, setHasSearched] =
|
|
11048
|
+
const [products, setProducts] = React21.useState([]);
|
|
11049
|
+
const [isLoading, setIsLoading] = React21.useState(true);
|
|
11050
|
+
const [searchInput, setSearchInput] = React21.useState(searchQuery);
|
|
11051
|
+
const [hasSearched, setHasSearched] = React21.useState(false);
|
|
11049
11052
|
const { isInWishlist } = useWishlist();
|
|
11050
|
-
|
|
11053
|
+
React21.useEffect(() => {
|
|
11051
11054
|
const fetchSearchResults = async () => {
|
|
11052
11055
|
if (!searchQuery.trim()) {
|
|
11053
11056
|
setProducts([]);
|
|
@@ -11148,31 +11151,31 @@ function CategoriesScreen() {
|
|
|
11148
11151
|
const { categories, isLoading } = useCategories();
|
|
11149
11152
|
const router = navigation.useRouter();
|
|
11150
11153
|
const { buildPath } = useBasePath();
|
|
11151
|
-
return /* @__PURE__ */
|
|
11154
|
+
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(
|
|
11152
11155
|
framerMotion.motion.div,
|
|
11153
11156
|
{
|
|
11154
11157
|
initial: { opacity: 0, y: 24 },
|
|
11155
11158
|
animate: { opacity: 1, y: 0 },
|
|
11156
11159
|
className: "space-y-6"
|
|
11157
11160
|
},
|
|
11158
|
-
/* @__PURE__ */
|
|
11159
|
-
/* @__PURE__ */
|
|
11160
|
-
))), /* @__PURE__ */
|
|
11161
|
+
/* @__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"),
|
|
11162
|
+
/* @__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.")))
|
|
11163
|
+
))), /* @__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(
|
|
11161
11164
|
framerMotion.motion.div,
|
|
11162
11165
|
{
|
|
11163
11166
|
initial: { opacity: 0, y: 24 },
|
|
11164
11167
|
animate: { opacity: 1, y: 0 },
|
|
11165
11168
|
className: "rounded-3xl border border-slate-100 bg-white p-6 shadow-lg shadow-primary-50"
|
|
11166
11169
|
},
|
|
11167
|
-
/* @__PURE__ */
|
|
11168
|
-
isLoading ? /* @__PURE__ */
|
|
11170
|
+
/* @__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.")),
|
|
11171
|
+
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(
|
|
11169
11172
|
Link8__default.default,
|
|
11170
11173
|
{
|
|
11171
11174
|
key: category.id,
|
|
11172
11175
|
href: buildPath(`/shop?category=${category.name}`),
|
|
11173
11176
|
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"
|
|
11174
11177
|
},
|
|
11175
|
-
/* @__PURE__ */
|
|
11178
|
+
/* @__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(
|
|
11176
11179
|
Image3__default.default,
|
|
11177
11180
|
{
|
|
11178
11181
|
src: category.image,
|
|
@@ -11181,10 +11184,10 @@ function CategoriesScreen() {
|
|
|
11181
11184
|
className: "object-cover transition-transform group-hover:scale-105",
|
|
11182
11185
|
sizes: "(max-width: 768px) 50vw, (max-width: 1200px) 33vw, 25vw"
|
|
11183
11186
|
}
|
|
11184
|
-
) : /* @__PURE__ */
|
|
11185
|
-
/* @__PURE__ */
|
|
11186
|
-
category.productCount > 0 && /* @__PURE__ */
|
|
11187
|
-
))) : /* @__PURE__ */
|
|
11187
|
+
) : /* @__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" }))),
|
|
11188
|
+
/* @__PURE__ */ React21__default.default.createElement("h3", { className: "text-lg font-semibold text-gray-900 group-hover:text-primary-600 transition-colors" }, category.name),
|
|
11189
|
+
category.productCount > 0 && /* @__PURE__ */ React21__default.default.createElement("p", { className: "mt-1 text-sm text-gray-500" }, category.productCount, " ", category.productCount === 1 ? "product" : "products")
|
|
11190
|
+
))) : /* @__PURE__ */ React21__default.default.createElement(
|
|
11188
11191
|
EmptyState,
|
|
11189
11192
|
{
|
|
11190
11193
|
title: "No categories found",
|
|
@@ -11198,7 +11201,7 @@ function CategoriesScreen() {
|
|
|
11198
11201
|
}
|
|
11199
11202
|
function NewAddressPage() {
|
|
11200
11203
|
const router = navigation.useRouter();
|
|
11201
|
-
const [isSubmitting, setIsSubmitting] =
|
|
11204
|
+
const [isSubmitting, setIsSubmitting] = React21.useState(false);
|
|
11202
11205
|
const {
|
|
11203
11206
|
register,
|
|
11204
11207
|
handleSubmit,
|
|
@@ -11340,9 +11343,9 @@ function Header() {
|
|
|
11340
11343
|
const { cart } = useCart() || { cart: { } };
|
|
11341
11344
|
const { getWishlistCount } = useWishlist();
|
|
11342
11345
|
const wishlistCount = getWishlistCount?.() || 0;
|
|
11343
|
-
const [isMobileMenuOpen, setIsMobileMenuOpen] =
|
|
11344
|
-
const [isSearchOpen, setIsSearchOpen] =
|
|
11345
|
-
const [searchQuery, setSearchQuery] =
|
|
11346
|
+
const [isMobileMenuOpen, setIsMobileMenuOpen] = React21.useState(false);
|
|
11347
|
+
const [isSearchOpen, setIsSearchOpen] = React21.useState(false);
|
|
11348
|
+
const [searchQuery, setSearchQuery] = React21.useState("");
|
|
11346
11349
|
const { buildPath } = useBasePath();
|
|
11347
11350
|
const navLinks = [
|
|
11348
11351
|
{ href: buildPath("/shop"), label: "Shop" },
|
|
@@ -11351,7 +11354,7 @@ function Header() {
|
|
|
11351
11354
|
{ href: buildPath("/about"), label: "About" },
|
|
11352
11355
|
{ href: buildPath("/contact"), label: "Contact" }
|
|
11353
11356
|
];
|
|
11354
|
-
return /* @__PURE__ */
|
|
11357
|
+
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(
|
|
11355
11358
|
Image3__default.default,
|
|
11356
11359
|
{
|
|
11357
11360
|
src: config.logo,
|
|
@@ -11359,7 +11362,7 @@ function Header() {
|
|
|
11359
11362
|
fill: true,
|
|
11360
11363
|
className: "object-contain"
|
|
11361
11364
|
}
|
|
11362
|
-
)), /* @__PURE__ */
|
|
11365
|
+
)), /* @__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(
|
|
11363
11366
|
Link8__default.default,
|
|
11364
11367
|
{
|
|
11365
11368
|
key: link.href,
|
|
@@ -11367,16 +11370,16 @@ function Header() {
|
|
|
11367
11370
|
className: "text-gray-700 hover:text-primary-600 font-medium transition-colors relative group"
|
|
11368
11371
|
},
|
|
11369
11372
|
link.label,
|
|
11370
|
-
/* @__PURE__ */
|
|
11371
|
-
))), /* @__PURE__ */
|
|
11373
|
+
/* @__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" })
|
|
11374
|
+
))), /* @__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(
|
|
11372
11375
|
"button",
|
|
11373
11376
|
{
|
|
11374
11377
|
onClick: () => setIsSearchOpen(!isSearchOpen),
|
|
11375
11378
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
11376
11379
|
"aria-label": "Search"
|
|
11377
11380
|
},
|
|
11378
|
-
/* @__PURE__ */
|
|
11379
|
-
), /* @__PURE__ */
|
|
11381
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Search, { className: "w-5 h-5 text-gray-700" })
|
|
11382
|
+
), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isSearchOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
11380
11383
|
framerMotion.motion.div,
|
|
11381
11384
|
{
|
|
11382
11385
|
initial: { opacity: 0, width: 0 },
|
|
@@ -11384,7 +11387,7 @@ function Header() {
|
|
|
11384
11387
|
exit: { opacity: 0, width: 0 },
|
|
11385
11388
|
className: "absolute right-0 top-full mt-2 bg-white rounded-lg shadow-lg overflow-hidden"
|
|
11386
11389
|
},
|
|
11387
|
-
/* @__PURE__ */
|
|
11390
|
+
/* @__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(
|
|
11388
11391
|
"input",
|
|
11389
11392
|
{
|
|
11390
11393
|
type: "text",
|
|
@@ -11399,36 +11402,36 @@ function Header() {
|
|
|
11399
11402
|
className: "w-full outline-none text-gray-700",
|
|
11400
11403
|
autoFocus: true
|
|
11401
11404
|
}
|
|
11402
|
-
), searchQuery && /* @__PURE__ */
|
|
11405
|
+
), searchQuery && /* @__PURE__ */ React21__default.default.createElement(
|
|
11403
11406
|
"button",
|
|
11404
11407
|
{
|
|
11405
11408
|
onClick: () => setSearchQuery(""),
|
|
11406
11409
|
className: "text-gray-400 hover:text-gray-600"
|
|
11407
11410
|
},
|
|
11408
|
-
/* @__PURE__ */
|
|
11411
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.X, { className: "w-4 h-4" })
|
|
11409
11412
|
))
|
|
11410
|
-
))), /* @__PURE__ */
|
|
11413
|
+
))), /* @__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(
|
|
11411
11414
|
Link8__default.default,
|
|
11412
11415
|
{
|
|
11413
11416
|
href: buildPath("/account"),
|
|
11414
11417
|
className: "p-2 hover:bg-gray-100 rounded-lg transition-colors"
|
|
11415
11418
|
},
|
|
11416
|
-
/* @__PURE__ */
|
|
11417
|
-
) : /* @__PURE__ */
|
|
11419
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.User, { className: "w-6 h-6 text-gray-700" })
|
|
11420
|
+
) : /* @__PURE__ */ React21__default.default.createElement(
|
|
11418
11421
|
Link8__default.default,
|
|
11419
11422
|
{
|
|
11420
11423
|
href: buildPath("/login"),
|
|
11421
11424
|
className: "hidden sm:block px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors font-medium"
|
|
11422
11425
|
},
|
|
11423
11426
|
"Sign In"
|
|
11424
|
-
)), /* @__PURE__ */
|
|
11427
|
+
)), /* @__PURE__ */ React21__default.default.createElement(
|
|
11425
11428
|
"button",
|
|
11426
11429
|
{
|
|
11427
11430
|
className: "lg:hidden p-2 hover:bg-gray-100 rounded-lg transition-colors",
|
|
11428
11431
|
onClick: () => setIsMobileMenuOpen(!isMobileMenuOpen)
|
|
11429
11432
|
},
|
|
11430
|
-
isMobileMenuOpen ? /* @__PURE__ */
|
|
11431
|
-
)), /* @__PURE__ */
|
|
11433
|
+
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" })
|
|
11434
|
+
)), /* @__PURE__ */ React21__default.default.createElement(framerMotion.AnimatePresence, null, isMobileMenuOpen && /* @__PURE__ */ React21__default.default.createElement(
|
|
11432
11435
|
framerMotion.motion.div,
|
|
11433
11436
|
{
|
|
11434
11437
|
initial: { opacity: 0, height: 0 },
|
|
@@ -11436,7 +11439,7 @@ function Header() {
|
|
|
11436
11439
|
exit: { opacity: 0, height: 0 },
|
|
11437
11440
|
className: "lg:hidden overflow-hidden border-t border-gray-200"
|
|
11438
11441
|
},
|
|
11439
|
-
/* @__PURE__ */
|
|
11442
|
+
/* @__PURE__ */ React21__default.default.createElement("nav", { className: "flex flex-col gap-1 py-2" }, navLinks.map((link) => /* @__PURE__ */ React21__default.default.createElement(
|
|
11440
11443
|
Link8__default.default,
|
|
11441
11444
|
{
|
|
11442
11445
|
key: link.href,
|
|
@@ -11445,7 +11448,7 @@ function Header() {
|
|
|
11445
11448
|
onClick: () => setIsMobileMenuOpen(false)
|
|
11446
11449
|
},
|
|
11447
11450
|
link.label
|
|
11448
|
-
)), !isAuthenticated && /* @__PURE__ */
|
|
11451
|
+
)), !isAuthenticated && /* @__PURE__ */ React21__default.default.createElement(
|
|
11449
11452
|
Link8__default.default,
|
|
11450
11453
|
{
|
|
11451
11454
|
href: buildPath("/login"),
|
|
@@ -11484,48 +11487,48 @@ function Footer() {
|
|
|
11484
11487
|
{ label: "Cookie Policy", href: buildPath("/cookies") }
|
|
11485
11488
|
]
|
|
11486
11489
|
};
|
|
11487
|
-
return /* @__PURE__ */
|
|
11490
|
+
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(
|
|
11488
11491
|
Link8__default.default,
|
|
11489
11492
|
{
|
|
11490
11493
|
href: link.href,
|
|
11491
11494
|
className: "hover:text-primary-500 transition-colors"
|
|
11492
11495
|
},
|
|
11493
11496
|
link.label
|
|
11494
|
-
))))), /* @__PURE__ */
|
|
11497
|
+
))))), /* @__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(
|
|
11495
11498
|
Link8__default.default,
|
|
11496
11499
|
{
|
|
11497
11500
|
href: link.href,
|
|
11498
11501
|
className: "hover:text-primary-500 transition-colors"
|
|
11499
11502
|
},
|
|
11500
11503
|
link.label
|
|
11501
|
-
))))), /* @__PURE__ */
|
|
11504
|
+
))))), /* @__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(
|
|
11502
11505
|
Link8__default.default,
|
|
11503
11506
|
{
|
|
11504
11507
|
href: link.href,
|
|
11505
11508
|
className: "hover:text-primary-500 transition-colors"
|
|
11506
11509
|
},
|
|
11507
11510
|
link.label
|
|
11508
|
-
)))))), /* @__PURE__ */
|
|
11511
|
+
)))))), /* @__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(
|
|
11509
11512
|
"a",
|
|
11510
11513
|
{
|
|
11511
11514
|
href: "#",
|
|
11512
11515
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11513
11516
|
},
|
|
11514
|
-
/* @__PURE__ */
|
|
11515
|
-
), /* @__PURE__ */
|
|
11517
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Facebook, { className: "w-5 h-5" })
|
|
11518
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11516
11519
|
"a",
|
|
11517
11520
|
{
|
|
11518
11521
|
href: "#",
|
|
11519
11522
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11520
11523
|
},
|
|
11521
|
-
/* @__PURE__ */
|
|
11522
|
-
), /* @__PURE__ */
|
|
11524
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Twitter, { className: "w-5 h-5" })
|
|
11525
|
+
), /* @__PURE__ */ React21__default.default.createElement(
|
|
11523
11526
|
"a",
|
|
11524
11527
|
{
|
|
11525
11528
|
href: "#",
|
|
11526
11529
|
className: "w-10 h-10 bg-gray-800 hover:bg-primary-600 rounded-full flex items-center justify-center transition-colors"
|
|
11527
11530
|
},
|
|
11528
|
-
/* @__PURE__ */
|
|
11531
|
+
/* @__PURE__ */ React21__default.default.createElement(lucideReact.Instagram, { className: "w-5 h-5" })
|
|
11529
11532
|
)))));
|
|
11530
11533
|
}
|
|
11531
11534
|
|