Change Pagination to clientside as well

ddxv · Oct 20, 2024 · 0a225b6 · 0a225b6
1 parent f1141d7
commit 0a225b6
Show file tree

Hide file tree

Showing 7 changed files with 102 additions and 53 deletions.
diff --git a/backend/api_app/controllers/companies.py b/backend/api_app/controllers/companies.py
@@ -161,63 +161,21 @@ def get_overviews(category: str | None = None) -> CompaniesOverview:
 
 
     overview_df['percentage'] = overview_df['app_count'] / overview_df['total_app_count']
-
     overview_df['store_tag'] = np.where(overview_df['store'].str.contains('Google'), 'google', 'apple')
-
     overview_df['store_tag_source'] = overview_df['store_tag'] + '_' + overview_df['tag_source']
+    overview_df = overview_df.pivot(index=['company_name', 'company_domain'], columns=["store_tag_source"], values="percentage").reset_index()
+    overview_df = overview_df.sort_values(by=['google_sdk', 'apple_sdk', 'google_app_ads_direct', 'apple_app_ads_direct'], ascending=False).head(1000)
 
 
-    new_overview_df = overview_df.pivot(index=['company_name', 'company_domain'], columns=["store_tag_source"], values="percentage").reset_index()
-
-    new_overview_df = new_overview_df.sort_values(by=['google_sdk', 'apple_sdk', 'google_app_ads_direct', 'apple_app_ads_direct'], ascending=False).head(1000)
-
-
-
-    ios_sdk = overview_df[
-        (~overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "sdk")
-    ]
-
-    ios_adstxt_direct = overview_df[
-        (~overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "app_ads_direct")
-    ]
-
-    ios_adstxt_reseller = overview_df[
-        (~overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "app_ads_reseller")
-    ]
-
-    android_sdk = overview_df[
-        (overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "sdk")
-    ]
-
-    android_adstxt_direct = overview_df[
-        (overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "app_ads_direct")
-    ]
-
-    android_adstxt_reseller = overview_df[
-        (overview_df["store"].str.contains("google", case=False))
-        & (overview_df["tag_source"] == "app_ads_reseller")
-    ]
-
     results = CompaniesOverview(
-        companies_overview=new_overview_df.to_dict(orient="records"),
+        companies_overview=overview_df.to_dict(orient="records"),
         sdk=PlatformCompanies(
-            android=android_sdk.to_dict(orient="records"),
-            ios=ios_sdk.to_dict(orient="records"),
             top=top_sdk_df.to_dict(orient="records"),
         ),
         adstxt_direct=PlatformCompanies(
-            android=android_adstxt_direct.to_dict(orient="records"),
-            ios=ios_adstxt_direct.to_dict(orient="records"),
             top=top_adstxt_direct_df.to_dict(orient="records"),
         ),
         adstxt_reseller=PlatformCompanies(
-            android=android_adstxt_reseller.to_dict(orient="records"),
-            ios=ios_adstxt_reseller.to_dict(orient="records"),
             top=top_adstxt_reseller_df.to_dict(orient="records"),
         ),
         categories=category_overview,

diff --git a/backend/api_app/models.py b/backend/api_app/models.py
@@ -190,8 +190,6 @@ class PlatformCompanies:
 
     """Represents companies for a specific platform."""
 
-    ios: list[CompanyDetail]
-    android: list[CompanyDetail]
     top: list[dict]
 
 

diff --git a/frontend/src/lib/CompaniesTableGrid.svelte b/frontend/src/lib/CompaniesTableGrid.svelte
@@ -0,0 +1,80 @@
+<div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mt-6">
+
+
+	<!-- SDK Section -->
+	<div class="bg-white p-6 rounded-lg shadow-md">
+		<h2 class="text-xl font-bold text-gray-800 mb-4">SDK</h2>
+		<p class="text-lg text-gray-700 mb-2">
+			SDK data is derived by downloading the app's Android APK or iOS IPA file and unzipped. We then
+			check the app's data for SDK signatures in paths, AndroidManifest.xml and the Info.plist. Many
+			apps are unable to be zipped. Downloading and opening the APK or IPA takes time and resources
+			thus the smaller totals.
+		</p>
+		<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+			<!-- Android SDK -->
+			<div class="card variant-glass-surface">
+				<div class="card-header">
+					<p class="text-lg text-gray-700">
+						<slot name="sdk-android-total-apps">Android Apps:</slot>
+					</p>
+				</div>
+				<div class="card-content">
+				</div>
+			</div>
+			<!-- iOS SDK -->
+			<div class="card variant-glass-surface">
+				<div class="card-header">
+					<p class="text-lg text-gray-700">
+						<slot name="sdk-ios-total-apps">iOS Apps:</slot>
+					</p>
+				</div>
+				<div class="card-content">
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<!-- App Ads.txt Section -->
+	<div class="bg-white p-6 rounded-lg shadow-md">
+		<h2 class="text-xl font-bold text-gray-800">App Ads.txt</h2>
+		<p class="text-small font-bold text-gray-800 mb-4">('DIRECT')</p>
+		<p class="text-lg text-gray-700 mb-2">
+			App-ads.txt files are an open standard by the IAB to help combat ad fraud. This data was
+			crawled from the URLs on the app's developer pages. Not all apps have app-ads.txt, many do
+			not.
+		</p>
+		<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+			<!-- Android App Ads.txt -->
+			<div class="card variant-glass-surface">
+				<div class="card-header">
+					<p class="text-lg text-gray-700">
+						<slot name="adstxt-android-total-apps">Android Apps:</slot>
+					</p>
+				</div>
+				<div class="card-content">
+				</div>
+			</div>
+			<!-- iOS App Ads.txt -->
+			<div class="card variant-glass-surface">
+				<div class="card-header">
+					<p class="text-lg text-gray-700">
+						<slot name="adstxt-ios-total-apps">iOS Apps:</slot>
+					</p>
+				</div>
+				<div class="card-content">
+				</div>
+			</div>
+		</div>
+	</div>
+
+</div>
+<div class="grid grid-cols-1 gap-8 mt-6">
+	<!-- MAIN TABLE -->
+			<div class="card variant-glass-surface">
+				<div class="card-content">
+					<slot name="main-table" />
+				</div>
+			</div>
+
+
+</div>
diff --git a/frontend/src/lib/clientside/ThFilter.svelte b/frontend/src/lib/clientside/ThFilter.svelte
@@ -0,0 +1,19 @@
+<script lang="ts">
+	import type { DataHandler } from '@vincjo/datatables';
+    import { check } from '@vincjo/datatables'
+	export let handler: DataHandler;
+	export let filterBy: string;
+	let value: string;
+</script>
+
+<th>
+	<input
+		class="input text-sm w-full"
+		type="text"
+		placeholder="Filter"
+		bind:value
+		on:input={() => {
+			if (filterBy) handler.filter(value, filterBy, check.isLike);
+		}}
+	/>
+</th>
diff --git a/frontend/src/routes/(newcategorical)/companies/+page.svelte b/frontend/src/routes/(newcategorical)/companies/+page.svelte
@@ -1,10 +1,8 @@
 <script lang="ts">
 	import type { CompaniesOverview } from '../../../types';
 	export let data: CompaniesOverview;
-	import CompaniesOverviewTablePart from '$lib/CompaniesOverviewTablePart.svelte';
 	import CompaniesOverviewTable from '$lib/CompaniesOverviewTable.svelte';
 	import CompaniesBarChart from '$lib/CompaniesBarChart.svelte';
-	import CompanyTableGrid from '$lib/CompanyTableGrid.svelte';
 	import WhiteCard from '$lib/WhiteCard.svelte';
 	import CompaniesLayout from '$lib/CompaniesLayout.svelte';
 	import CompaniesTableGrid from '$lib/CompaniesTableGrid.svelte';

diff --git a/frontend/src/routes/(newcategorical)/companies/categories/[category]/+page.svelte b/frontend/src/routes/(newcategorical)/companies/categories/[category]/+page.svelte
@@ -1,11 +1,9 @@
 <script lang="ts">
 	import type { CompaniesOverview } from '../../../../../types';
 	export let data: CompaniesOverview;
-	import CompaniesOverviewTablePart from '$lib/CompaniesOverviewTablePart.svelte';
 	import CompaniesBarChart from '$lib/CompaniesBarChart.svelte';
 	import CompaniesOverviewTable from '$lib/CompaniesOverviewTable.svelte';
 
-	import CompanyTableGrid from '$lib/CompanyTableGrid.svelte';
 	import WhiteCard from '$lib/WhiteCard.svelte';
 	import CompaniesLayout from '$lib/CompaniesLayout.svelte';
 	import CompaniesTableGrid from '$lib/CompaniesTableGrid.svelte';

diff --git a/frontend/src/types.ts b/frontend/src/types.ts
@@ -167,8 +167,6 @@ export interface CompaniesOverviewEntries extends ClientRow {
 }
 
 export interface CompaniesOverviewPlatforms {
-	android: CompaniesOverviewEntries[];
-	ios: CompaniesOverviewEntries[];
 	top: {
 		group: string;
 		value: number;