From 54fdb7066f3c7656a963334744cbea281af79195 Mon Sep 17 00:00:00 2001
From: Bettenbuk Zoltan <zoltan.bettenbuk@gmail.com>
Date: Fri, 24 May 2019 13:39:41 +0200
Subject: [PATCH] feat: scrollable bottom sheet

---
 .../features/base/dialog/components/native/BottomSheet.js  | 6 ++++--
 react/features/base/dialog/components/native/styles.js     | 7 +++++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/react/features/base/dialog/components/native/BottomSheet.js b/react/features/base/dialog/components/native/BottomSheet.js
index 48276e5c0..12186cdc7 100644
--- a/react/features/base/dialog/components/native/BottomSheet.js
+++ b/react/features/base/dialog/components/native/BottomSheet.js
@@ -1,7 +1,7 @@
 // @flow
 
 import React, { PureComponent, type Node } from 'react';
-import { Platform, SafeAreaView, View } from 'react-native';
+import { Platform, SafeAreaView, ScrollView, View } from 'react-native';
 
 import { ColorSchemeRegistry } from '../../../color-scheme';
 import { SlidingView } from '../../../react';
@@ -61,7 +61,9 @@ class BottomSheet extends PureComponent<Props> {
                             styles.sheetItemContainer,
                             _styles.sheet
                         ] }>
-                        { this._getWrappedContent() }
+                        <ScrollView bounces = { false }>
+                            { this._getWrappedContent() }
+                        </ScrollView>
                     </View>
                 </View>
             </SlidingView>
diff --git a/react/features/base/dialog/components/native/styles.js b/react/features/base/dialog/components/native/styles.js
index 25645f915..91bcdc3da 100644
--- a/react/features/base/dialog/components/native/styles.js
+++ b/react/features/base/dialog/components/native/styles.js
@@ -37,12 +37,15 @@ export const bottomSheetStyles = {
      * Style for the container of the sheet.
      */
     sheetContainer: {
-        alignContent: 'stretch',
+        alignItems: 'stretch',
         flex: 1,
-        flexDirection: 'column'
+        flexDirection: 'column',
+        justifyContent: 'flex-end'
     },
 
     sheetItemContainer: {
+        flex: -1,
+        maxHeight: '60%',
         paddingHorizontal: MD_ITEM_MARGIN_PADDING
     }
 };