import { ScrollView, StyleSheet } from "react-native";

import { Section, SectionHeader } from "@/components/ui/Sections";

import { Spacing } from "@/constants/theme";

import { TodayMedicines } from "@/components/medicine/TodayMedicines";

import { MedicineRegimenList } from "@/components/medicine/MedicineRegimenList";

export default function MedicineRegimens() {

  return (

    <ScrollView

      contentContainerStyle={styles.container}

      scrollEventThrottle={16}

    >

      <Section>

        <SectionHeader title="Hoje" />

        <TodayMedicines />

      </Section>

      <Section>

        <SectionHeader

          title="Seus medicamentos"

          subtitle="Gerencie seus medicamentos e horários"

        />

        <MedicineRegimenList />

      </Section>

    </ScrollView>

  );

}

const styles = StyleSheet.create({

  container: {

    paddingHorizontal: Spacing.containerPadding,

    paddingVertical: Spacing.sectionGap,

    gap: Spacing.sectionGap,

    paddingBottom: 80,

  },

});