Flutter / Firebase - List Tile repeating firebase array values

I am creating a horizontal list view inside a vertical list view using firebase as the data source. I have created my vertical list view (with firestore documents) but I now need to access fields within each document (array to be precise) and create list tiles using the values. My data in firestore is stored like this:

And as an example, Anniversary list tiles should be "Boyfriend" and "Girlfriend" (more to be added) but currently, when I create the list tiles, they are populated with each array from each document:

Birthday should only contain "18th" and "21st", Anniversary "Boyfriend"/"Girlfriend" and so on

Here is my dart code thus far:

   class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: const Size.fromHeight(80),
        child: MainAppBar(
          text: 'Pick an occasion...',
        ),
      ),
      body: StreamBuilder(
        stream: Firestore.instance
            .collection('events')
            .orderBy('order')
            .snapshots(),
        builder: buildProductList,
      ),
    );
  }
}

Widget buildProductList(
    BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
  if (snapshot.hasData) {
    return ListView.builder(
      scrollDirection: Axis.vertical,
      shrinkWrap: true,
      itemCount: snapshot.data.documents.length,
      itemBuilder: (context, index) {
        DocumentSnapshot user = snapshot.data.documents[index];
        print(user['Occasions'].runtimeType);
        print(user.documentID);
        return Column(
          children: [
            ListTile(
                leading: Image(
                  image: FirebaseImage(user.data['img_url']),
                  height: 25,
                  width: 25,
                ),
                // Access the fields as defined in FireStore
                title: Transform(
                    transform: Matrix4.translationValues(-20, 0.0, 0.0),
                    child: Text(user.documentID))),
            Container(
              margin: EdgeInsets.only(left: 8.0),
              height: 150.0,
              child: ListView(
                scrollDirection: Axis.horizontal,
                    children: snapshot.data.documents.map((document) {
                      return Container(
                        height: 150,
                        width: 75.0,
                        child: new ListTile(
                          title: new Text(document['Occasions'].toString()),
                        ),
                      );
                    }).toList(),
                  ),
              )
          ],
        );
      },
    );
  } else if (snapshot.connectionState == ConnectionState.done &&
      !snapshot.hasData) {
    // Handle no data
    return Center(
      child: Text("No products found."),
    );
  } else {
    // Still loading
    return CircularProgressIndicator();
  }
}

Here is how i'd like the output to look:

Any ideas?