import React from 'react';
import { View, ScrollView } from 'react-native';
import Tile from '../../../components/Tile';
import { 
  condensedAccountTiles,
  accountCards, 
  creditCards, 
  serviceCards, 
  serviceGrid, 
  promotionalCards 
} from '../../core/combined-auth/data/mockData';
import { summaryStyles as styles } from './styles';

interface SummaryProps {
  screenWidth: number;
}

const Summary: React.FC<SummaryProps> = ({ screenWidth }) => {
  return (
    <View style={[styles.sectionContainer, { width: screenWidth }]}>
      <ScrollView 
        style={styles.sectionScrollView}
        showsVerticalScrollIndicator={false}
        contentContainerStyle={styles.sectionContent}
      >
        {/* Condensed Account Tiles (like Birthdays, Home Insurance) */}
        {condensedAccountTiles.map((account, index) => (
          <View key={account.id}>
            <Tile type="account" data={account} style={index === 0 ? { marginTop: 0 } : undefined} />
          </View>
        ))}
        
        {/* Detailed Account Tiles */}
        {accountCards.map((account) => (
          <View key={account.id}>
            <Tile type="account" data={account} />
          </View>
        ))}
        
        {/* Credit Cards */}
        {creditCards.map((card) => (
          <View key={card.id}>
            <Tile type="creditCard" data={card} />
          </View>
        ))}
        
        {/* Service Cards */}
        {serviceCards.map((service) => (
          <View key={service.id}>
            <Tile type="service" data={service} />
          </View>
        ))}
        
        {/* Service Grid */}
        <View key={serviceGrid.id}>
          <Tile type="serviceGrid" data={serviceGrid} />
        </View>
        
        {/* Promotional Cards */}
        {promotionalCards.map((promo) => (
          <View key={promo.id}>
            <Tile type="promotional" data={promo} />
          </View>
        ))}
        
        <View style={styles.bottomPadding} />
      </ScrollView>
    </View>
  );
};

export default Summary;