login flow

pedi-foods/Sources/PediFoods/Components/StoreCard.swift

@@ -6,19 +6,7 @@ struct FeaturedStoreCard: View {
     var body: some View {
         VStack(alignment: .leading, spacing: 12) {
             ZStack(alignment: .topLeading) {
-                RoundedRectangle(cornerRadius: AppLayout.radiusLG, style: .continuous)
-                    .fill(AppColors.brandSoft)
-                    .frame(height: 120)
-                    .overlay(
-                        Circle()
-                            .fill(AppColors.surface)
-                            .frame(width: 64, height: 64)
-                            .overlay(
-                                Image(systemName: store.iconName)
-                                    .font(.title2)
-                                    .foregroundStyle(AppColors.primary)
-                            )
-                    )
+                mediaBlock
 
                 if let promo = store.promoText {
                     Text(promo)
@@ -76,6 +64,58 @@ struct FeaturedStoreCard: View {
         .background(AppColors.surface)
         .clipShape(RoundedRectangle(cornerRadius: AppLayout.radiusXL, style: .continuous))
     }
+
+    private var mediaBlock: some View {
+        ZStack {
+            RoundedRectangle(cornerRadius: AppLayout.radiusLG, style: .continuous)
+                .fill(AppColors.brandSoft)
+
+            mediaImage
+        }
+        .frame(height: 120)
+        .clipShape(RoundedRectangle(cornerRadius: AppLayout.radiusLG, style: .continuous))
+    }
+
+    @ViewBuilder
+    private var mediaImage: some View {
+        if let imageURL = store.imageURL,
+           let url = URL(string: imageURL) {
+            AsyncImage(url: url) { phase in
+                switch phase {
+                case .success(let image):
+                    image
+                        .resizable()
+                        .scaledToFill()
+                default:
+                    storeIconPlaceholder
+                }
+            }
+            .frame(maxWidth: .infinity, maxHeight: .infinity)
+            .clipped()
+        } else {
+            storeIconPlaceholder
+        }
+    }
+
+    private var storeIconPlaceholder: some View {
+        ZStack {
+            Image("placeholder-product")
+                .resizable()
+                .scaledToFill()
+                .opacity(0.7)
+                .frame(maxWidth: .infinity, maxHeight: .infinity)
+                .clipped()
+
+            Circle()
+                .fill(AppColors.surface.opacity(0.92))
+                .frame(width: 64, height: 64)
+                .overlay(
+                    Image(systemName: store.iconName)
+                        .font(.title2)
+                        .foregroundStyle(AppColors.primary)
+                )
+        }
+    }
 }
 
 struct FeaturedStoreCardModel: Identifiable {
@@ -88,6 +128,7 @@ struct FeaturedStoreCardModel: Identifiable {
     let promoText: String?
     let isFavorite: Bool
     let iconName: String
+    let imageURL: String?
 }
 
 struct SpecialOfferCard: View {