import React from 'react';
import { Text, View } from 'react-native';
import themedStyles from './styles';
import { useTheme } from '../../branding';
import SectionIndicator from './SectionIndicator';
import type { SectionTitleProps } from './types';

export const SectionTitle = ({ title, indicator }: SectionTitleProps) => {
    const { theme } = useTheme();
    const styles = themedStyles[theme];

    return (
        <View style={styles.sectionTitleContainer}>
            <Text style={styles.sectionTitle}>{title}</Text>
            <SectionIndicator indicator={indicator} />
        </View>
    );
};

export default SectionTitle;