[WIP] Fixed the app permissions grid in AppDetailView

AltStore/Views/App Detail/AppDetailView.swift

@@ -7,7 +7,6 @@
 //
 
 import SwiftUI
-import GridStack
 import AsyncImage
 import ExpandableText
 import AltStoreCore
@@ -88,7 +87,7 @@ struct AppDetailView: View {
     }
     
     var contentView: some View {
-        VStack(alignment: .leading, spacing: 24) {
+        VStack(alignment: .leading, spacing: 32) {
             if let subtitle = storeApp.subtitle {
                 Text(subtitle)
                     .multilineTextAlignment(.center)
@@ -170,18 +169,7 @@ struct AppDetailView: View {
                     .font(.callout)
                     .foregroundColor(.secondary)
             } else {
-                GridStack(minCellWidth: 40, spacing: 8, numItems: storeApp.permissions.count, alignment: .leading) { index, cellWidth in
-                    let permission = storeApp.permissions[index]
-                    
-                    VStack {
-                        Image(systemName: "photo.on.rectangle")
-                            .padding()
-                            .background(Circle().foregroundColor(Color(UIColor.secondarySystemBackground)))
-                        Text(permission.type.localizedShortName ?? "")
-                    }
-                    .frame(width: cellWidth, height: cellWidth * 1.2)
-                    .background(Color.red)
-                }
+                AppPermissionsGrid(permissions: storeApp.permissions)
             }
             
             Spacer()

AltStore/Views/App Detail/AppPermissionsGrid.swift

@@ -0,0 +1,54 @@
+//
+//  AppPermissionsGrid.swift
+//  SideStore
+//
+//  Created by Fabian Thies on 27.11.22.
+//  Copyright © 2022 SideStore. All rights reserved.
+//
+
+import SwiftUI
+import AltStoreCore
+
+struct AppPermissionsGrid: View {
+    
+    let permissions: [AppPermission]
+    
+    let columns = Array(repeating: GridItem(.flexible()), count: 3)
+    
+    var body: some View {
+        LazyVGrid(columns: columns) {
+            ForEach(permissions, id: \.type) { permission in
+                AppPermissionGridItemView(permission: permission)
+            }
+        }
+    }
+}
+
+struct AppPermissionGridItemView: View {
+    let permission: AppPermission
+    
+    @State var isPopoverPresented = false
+    
+    var body: some View {
+        SwiftUI.Button {
+            self.isPopoverPresented = true
+        } label: {
+            VStack {
+                Image(uiImage: (permission.type.icon?.withRenderingMode(.alwaysTemplate) ?? UIImage(systemName: "questionmark"))!)  // TODO: Replace with system icon
+                    .padding()
+                    .background(Circle().foregroundColor(Color(.secondarySystemBackground)))
+                Text(permission.type.localizedShortName ?? "")
+            }
+            .foregroundColor(.primary)
+        }
+        .alert(isPresented: self.$isPopoverPresented) {
+            Alert(title: Text("Usage Description"), message: Text(permission.usageDescription))
+        }
+    }
+}
+
+//struct AppPermissionsGrid_Previews: PreviewProvider {
+//    static var previews: some View {
+//        AppPermissionsGrid()
+//    }
+//}