From 10373447d89e94db693f9dbc414bd6875b7f92d1 Mon Sep 17 00:00:00 2001
From: Matthias Luger <malua007@live.de>
Date: Mon, 9 Sep 2024 19:18:27 +0200
Subject: [PATCH] fix restriction items not showing on phone

---
 .../FlipRestrictionList/FlipRestrictionList.tsx       | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx b/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx
index 557ba466..147d8a4f 100644
--- a/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx
+++ b/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx
@@ -413,6 +413,7 @@ function FlipRestrictionList(props: Props) {
     )
 
     let windowWidth = isSSR ? 1920 : window.innerWidth
+    let singleColumn = windowWidth < 1024
 
     let addIcon = (
         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" className="bi bi-plus-circle" viewBox="0 0 16 16">
@@ -520,16 +521,16 @@ function FlipRestrictionList(props: Props) {
                                 <Grid
                                     ref={listRef}
                                     itemKey={({ columnIndex, rowIndex, data }) => {
-                                        let r = restrictionsToDisplay[rowIndex * 2 + columnIndex]
+                                        let r = restrictionsToDisplay[singleColumn ? rowIndex : rowIndex * 2 + columnIndex]
                                         if (!r) {
                                             return null
                                         }
                                         return r.itemKey
                                     }}
-                                    columnCount={windowWidth < 1024 ? 1 : 2}
-                                    columnWidth={() => (windowWidth < 1024 ? width : width / 2)}
+                                    columnCount={singleColumn ? 1 : 2}
+                                    columnWidth={() => (singleColumn ? width : width / 2)}
                                     height={height}
-                                    rowCount={windowWidth < 1024 ? restrictionsToDisplay.length : Math.ceil(restrictionsToDisplay.length / 2)}
+                                    rowCount={singleColumn ? restrictionsToDisplay.length : Math.ceil(restrictionsToDisplay.length / 2)}
                                     rowHeight={index => {
                                         function getCellHeight(index) {
                                             let defaultHeight = 81.5
@@ -551,7 +552,7 @@ function FlipRestrictionList(props: Props) {
                                     style={{ overflowX: 'hidden' }}
                                 >
                                     {({ columnIndex, rowIndex, style }) => {
-                                        let restriction = restrictionsToDisplay[rowIndex * 2 + columnIndex]
+                                        let restriction = restrictionsToDisplay[singleColumn ? rowIndex : rowIndex * 2 + columnIndex]
                                         if (!restriction) {
                                             return null
                                         }