From 147928695bfd27c51b29ab79dc51f4340a52e7c1 Mon Sep 17 00:00:00 2001
From: James O'Claire <jamesoclaire@gmail.com>
Date: Mon, 20 Jan 2025 12:21:58 +0800
Subject: [PATCH] Simplified table of an Apps SDKs

---
 frontend/src/lib/AppSDKOverview.svelte | 49 +++++++++++---------------
 1 file changed, 21 insertions(+), 28 deletions(-)

diff --git a/frontend/src/lib/AppSDKOverview.svelte b/frontend/src/lib/AppSDKOverview.svelte
index 0a87fc9..670e9d3 100644
--- a/frontend/src/lib/AppSDKOverview.svelte
+++ b/frontend/src/lib/AppSDKOverview.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-	import ManifestItemList from '$lib/ManifestItemList.svelte';
 	import WhiteCard from '$lib/WhiteCard.svelte';
 	import RequestSDKScanButton from '$lib/RequestSDKScanButton.svelte';
+	import CompanyButton from '$lib/CompanyButton.svelte';
 
 	import { page } from '$app/state';
 
@@ -22,42 +22,35 @@
 {:then packageInfo}
 	{#if typeof packageInfo == 'string'}
 		<p>Permissions, SDKs and trackers info not yet available for this app.</p>
-	{:else}
-		{#if packageInfo.sdk_categories && Object.keys(packageInfo.sdk_categories).length > 0}
-			{#await companyTypes}
-				Loading company types...
-			{:then myCompanyTypes}
+		<RequestSDKScanButton />
+	{:else if packageInfo.sdk_categories && Object.keys(packageInfo.sdk_categories).length > 0}
+		{#await companyTypes}
+			Loading company types...
+		{:then myCompanyTypes}
+			<div class="grid grid-cols-1 md:grid-cols-2 gap-2">
 				{#each Object.keys(packageInfo.sdk_categories) as category}
 					<WhiteCard>
 						{#snippet title()}
 							{myCompanyTypes.types.find((x: { url_slug: string }) => x.url_slug === category)
 								?.name || category}
 						{/snippet}
-						<div class="p-2">
-							<ManifestItemList items={packageInfo.sdk_categories[category]}></ManifestItemList>
+						<div class="grid grid-cols-1 md:grid-cols-2 gap-2 p-4">
+							{#each packageInfo.sdk_categories[category] as company}
+								<CompanyButton
+									companyName={company.company_name}
+									companyDomain={company.company_domain}
+								/>
+							{/each}
 						</div>
 					</WhiteCard>
 				{/each}
-			{/await}
-		{:else}
-			<p>
-				No SDKs found for this app, <a href="/apps/{page.params.id}/sdks"
-					>check the full list of SDKs
-				</a> for untagged companies.
-			</p>
-		{/if}
-		{#if packageInfo.permissions && packageInfo.permissions.length > 0}
-			<h4 class="h4 md:h3 p-2 md:p-4 mt-4">Permissions</h4>
-			<div class="px-4 md:px-8 max-w-sm md:max-w-md lg:max-w-full overflow-x-scroll">
-				{#each packageInfo.permissions as permission}
-					<p>{permission}</p>
-				{/each}
 			</div>
-		{/if}
-		{#if packageInfo.leftovers && Object.keys(packageInfo.leftovers).length > 0}
-			<h4 class="h4 md:h3 p-2 md:p-4 mt-4">Unknown SDKs and Services</h4>
-			<ManifestItemList items={packageInfo.leftovers}></ManifestItemList>
-		{/if}
+		{/await}
+	{:else}
+		<p>
+			No SDKs found for this app, <a href="/apps/{page.params.id}/sdks"
+				>check the full list of SDKs
+			</a> for untagged companies.
+		</p>
 	{/if}
 {/await}
-<RequestSDKScanButton />