ReVanced/revanced-website
1
0
Fork 0
mirror of https://github.com/revanced/revanced-website.git synced 2025-04-30 06:34:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: sort packages by number of patches

Browse Source
This commit is contained in:
afn 2022-11-26 14:22:18 -05:00
parent 33953db98a
commit 246a851c9d
3 changed files with 133 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.css
View File

@ -102,7 +102,7 @@ h6 {
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-color: var(--grey-six); background-color: var(--grey-one);
background-clip: content-box; background-clip: content-box;
border-radius: 100px; border-radius: 100px;
} }

245
src/data/api/index.ts
View File

@ -1,161 +1,172 @@
import type { Readable, Subscriber, Unsubscriber, Writable } from "svelte/store"; import type { Readable, Subscriber, Unsubscriber, Writable } from 'svelte/store';
import { writable } from "svelte/store"; import { writable } from 'svelte/store';
import { error } from "@sveltejs/kit"; import { error } from '@sveltejs/kit';
import { prerendering, browser, dev } from "$app/environment"; import { prerendering, browser, dev } from '$app/environment';
import * as settings from "./settings"; import * as settings from './settings';
import * as cache from "./cache"; import * as cache from './cache';
export class API<T> implements Readable<T> { export class API<T> implements Readable<T> {
private store: Writable<T>; private store: Writable<T>;
// True if we have or are about to request data from the API. // True if we have or are about to request data from the API.
has_requested: boolean; has_requested: boolean;
// `transform` will transform the data received from the API. // `transform` will transform the data received from the API.
constructor(public readonly endpoint: string, private readonly default_value: T, private readonly transform: ((v: any) => T) = (v) => v as T) { constructor(
// Initialize with cached data if possible. public readonly endpoint: string,
const cached_data = cache.get(this.endpoint); private readonly default_value: T,
this.has_requested = cached_data !== null; private readonly transform: (v: any) => T = (v) => v as T
) {
// Initialize with cached data if possible.
const cached_data = cache.get(this.endpoint);
this.has_requested = cached_data !== null;
this.store = writable(cached_data || this.default_value); this.store = writable(cached_data || this.default_value);
} }
private url() { private url() {
return `${settings.api_base_url()}/${this.endpoint}`; return `${settings.api_base_url()}/${this.endpoint}`;
} }
// Please don't call this directly // Please don't call this directly
private async _update(fetch_fn: typeof fetch) { private async _update(fetch_fn: typeof fetch) {
// Try to get data from the cache. // Try to get data from the cache.
let data = cache.get(this.endpoint); let data = cache.get(this.endpoint);
if (data === null) { if (data === null) {
// Fetch and transform data // Fetch and transform data
const response = await fetch_fn(this.url()); const response = await fetch_fn(this.url());
data = this.transform(await response.json()); data = this.transform(await response.json());
// Update the cache. // Update the cache.
cache.update(this.endpoint, data); cache.update(this.endpoint, data);
} }
this.store.set(data); this.store.set(data);
} }
// Retrieve data and update. // Retrieve data and update.
private update(fetch_fn = fetch) { private update(fetch_fn = fetch) {
// Make sure we set this immediately outside of the async function to avoid JS event loop weirdness. // Make sure we set this immediately outside of the async function to avoid JS event loop weirdness.
this.has_requested = true; this.has_requested = true;
return this._update(fetch_fn); return this._update(fetch_fn);
} }
// Start retrieving data if needed. // Start retrieving data if needed.
retrieve_if_needed() { retrieve_if_needed() {
if (!this.has_requested) { if (!this.has_requested) {
return this.update(); return this.update();
} }
return Promise.resolve() return Promise.resolve();
} }
// Implements the load function found in `+page/layout.ts` files. // Implements the load function found in `+page/layout.ts` files.
page_load_impl() { page_load_impl() {
return async ({ fetch }) => { return async ({ fetch }) => {
if (prerendering) { if (prerendering) {
return {}; return {};
} }
// Might be better to actually return some data from the load function and use that on the client. // Might be better to actually return some data from the load function and use that on the client.
if (!(dev || browser || prerendering)) { if (!(dev || browser || prerendering)) {
throw new Error("The API client is not optimized for production server-side rendering. Please change that :)"); throw new Error(
} 'The API client is not optimized for production server-side rendering. Please change that :)'
);
}
try { try {
await this.update(fetch); await this.update(fetch);
return {}; return {};
} catch(e) { } catch (e) {
console.error(e); console.error(e);
throw error(504, "API Request Error"); throw error(504, 'API Request Error');
} }
}; };
} }
// Implement Svelte store. // Implement Svelte store.
subscribe(run: Subscriber<T>, invalidate?: any): Unsubscriber { subscribe(run: Subscriber<T>, invalidate?: any): Unsubscriber {
// Make sure we have up-to-date data from the API. // Make sure we have up-to-date data from the API.
if (browser) { if (browser) {
this.retrieve_if_needed(); this.retrieve_if_needed();
} }
return this.store.subscribe(run, invalidate); return this.store.subscribe(run, invalidate);
} }
} }
// API Endpoints // API Endpoints
import type { Patch, Repository, Tool } from '../types'; import type { Patch, Repository, Tool } from '../types';
import { dev_log } from "$lib/utils"; import { dev_log } from '$lib/utils';
export type ReposData = Repository[]; export type ReposData = Repository[];
export type PatchesData = { patches: Patch[]; packages: string[] }; export type PatchesData = { patches: Patch[]; packages: string[] };
export type ToolsData = { [repo: string]: Tool }; export type ToolsData = { [repo: string]: Tool };
export const repositories = new API<ReposData>("contributors", [], json => json.repositories); export const repositories = new API<ReposData>('contributors', [], (json) => json.repositories);
// It needs to look this way to not break everything. // It needs to look this way to not break everything.
const tools_placeholder: ToolsData = { const tools_placeholder: ToolsData = {
"revanced/revanced-manager": { 'revanced/revanced-manager': {
version: "v0.0.0", version: 'v0.0.0',
timestamp: "", timestamp: '',
repository: "", repository: '',
assets: [{ assets: [
url: "", {
name: "", url: '',
content_type: "", name: '',
size: null, content_type: '',
}] size: null
} }
} ]
}
};
export const tools = new API<ToolsData>("tools", tools_placeholder, json => { export const tools = new API<ToolsData>('tools', tools_placeholder, (json) => {
// The API returns data in a weird shape. Make it easier to work with. // The API returns data in a weird shape. Make it easier to work with.
let map: Map<string, Tool> = new Map(); let map: Map<string, Tool> = new Map();
for (const tool of json["tools"]) { for (const tool of json['tools']) {
const repo: string = tool.repository; const repo: string = tool.repository;
if (!map.has(repo)) { if (!map.has(repo)) {
map.set(repo, { map.set(repo, {
version: tool.version, version: tool.version,
repository: repo, repository: repo,
// Just use the timestamp of the first one we find. // Just use the timestamp of the first one we find.
timestamp: tool.timestamp, timestamp: tool.timestamp,
assets: [] assets: []
}); });
} }
let value = map.get(repo); let value = map.get(repo);
value.assets.push({ value.assets.push({
name: tool.name, name: tool.name,
size: tool.size, size: tool.size,
url: tool.browser_download_url, url: tool.browser_download_url,
content_type: tool.content_type content_type: tool.content_type
}); });
map.set(repo, value); map.set(repo, value);
} }
return Object.fromEntries(map); return Object.fromEntries(map);
}); });
export const patches = new API<PatchesData>("patches", { patches: [], packages: [] }, patches => { export const patches = new API<PatchesData>('patches', { patches: [], packages: [] }, (patches) => {
let packages: string[] = []; const packagesWithCount: { [key: string]: number } = {};
// gets packages // gets packages and patch count
for (let i = 0; i < patches.length; i++) { for (let i = 0; i < patches.length; i++) {
patches[i].compatiblePackages.forEach((pkg: Patch) => { patches[i].compatiblePackages.forEach((pkg: Patch) => {
let index = packages.findIndex((x) => x == pkg.name); packagesWithCount[pkg.name] = (packagesWithCount[pkg.name] || 0) + 1;
if (index === -1) {
packages.push(pkg.name);
}
}); });
} }
// sort packages by patch count to get most relevant apps on top
const packages = Object.entries(packagesWithCount)
.sort((a, b) => b[1] - a[1])
.map((pkg) => pkg[0]);
return { patches, packages }; return { patches, packages };
}); });

6
src/lib/components/molecules/TreeMenu.svelte
View File

@ -12,14 +12,16 @@
<style> <style>
.menu { .menu {
height: calc(100vh - 7rem); height: calc(100vh - 70px);
width: 100%; width: 100%;
padding: 0px 30px 30px 10px; padding: 0px 30px 30px 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: sticky; position: sticky;
top: 7rem; top: 70px;
padding-top: calc(7rem - 70px);
overflow-y: scroll; overflow-y: scroll;
border-right: 1px solid var(--grey-six);
} }
h5 { h5 {