your personal website on atproto - mirror
blento.app
flo-bit.dev
Compare changes
Choose any two refs to compare.
+17
-3
CLAUDE.md
+17
-3
CLAUDE.md
···
53
53
**Card System (`src/lib/cards/`):**
54
54
55
55
- `CardDefinition` type in `types.ts` defines the interface for card types
56
-
- Each card type exports a definition with: `type`, `contentComponent`, optional `editingContentComponent`, `creationModalComponent`, `sidebarButtonText`, `loadData`, `upload` (see more info and description in `src/lib/cards/types.ts`)
56
+
- Each card type exports a definition with: `type`, `contentComponent`, optional `editingContentComponent`, `creationModalComponent`, `sidebarButtonText`, `loadData`, `loadDataServer`, `upload` (see more info and description in `src/lib/cards/types.ts`)
57
+
- `loadData` fetches external data on the client (via remote functions). `loadDataServer` is the server-side equivalent used during SSR to avoid self-referential HTTP requests on Cloudflare Workers.
58
+
- Cards that need external data use `.remote.ts` files (SvelteKit remote functions) co-located in the card folder (e.g. `GitHubProfileCard/api.remote.ts`, `LastFMCard/api.remote.ts`). These use `query()` from `$app/server` and run server-side, with SvelteKit generating fetch wrappers for client use.
57
59
- Card types include Text, Link, Image, Bluesky, Embed, Map, Livestream, ATProto collections, and special cards (see `src/lib/cards`).
58
60
- `AllCardDefinitions` and `CardDefinitionsByType` in `index.ts` aggregate all card types
59
61
- See e.g. `src/lib/cards/EmbedCard/` and `src/lib/cards/LivestreamCard/` for examples of implementation.
···
66
68
- Data is stored in user's PDS under collection `app.blento.card`
67
69
- **Important**: ATProto does not allow floating point numbers in records. All numeric values must be integers.
68
70
71
+
**Caching (`src/lib/cache.ts`):**
72
+
73
+
- `CacheService` class wraps a single Cloudflare KV namespace (`USER_DATA_CACHE`) with namespaced keys
74
+
- Keys are stored as `namespace:key` (e.g. `blento:did:plc:abc`, `github:someuser`, `lastfm:method:user:period:limit`)
75
+
- Per-namespace default TTLs via KV `expirationTtl`: `blento` (24h), `identity` (7d), `github` (12h), `gh-contrib` (12h), `lastfm` (1h, overridable), `npmx` (12h), `meta` (no expiry)
76
+
- Blento data is keyed by DID with bidirectional handle↔DID identity mappings (`identity:h:{handle}` → DID, `identity:d:{did}` → handle)
77
+
- `getBlento(identifier)` accepts either a handle or DID and resolves automatically
78
+
- `putBlento(did, handle, data)` writes data + both identity mappings
79
+
- Generic `get(namespace, key)` / `put(namespace, key, value, ttl?)` and JSON variants `getJSON` / `putJSON` for all namespaces
80
+
- `createCache(platform)` factory function creates a `CacheService` from `platform.env`
81
+
- `CUSTOM_DOMAINS` KV namespace is separate and accessed directly for custom domain → DID resolution
82
+
69
83
**Data Loading (`src/lib/website/`):**
70
84
71
-
- `load.ts` - Fetches user data from their PDS, with optional KV caching via `UserCache`
85
+
- `load.ts` - Fetches user data from their PDS, with optional caching via `CacheService`
72
86
- `data.ts` - Defines which collections/records to fetch
73
87
- `context.ts` - Svelte contexts for passing DID, handle, and data down the component tree
74
88
···
80
94
- `/edit` - Self-hosted edit mode
81
95
- `/api/links` - Link preview API
82
96
- `/api/geocoding` - Geocoding API for map cards
83
-
- `/api/instagram`, `/api/reloadRecent`, `/api/update` - Additional data endpoints
97
+
- `/api/reloadRecent`, `/api/update` - Additional data endpoints
84
98
85
99
### Item Type
86
100
+98
src/lib/cache.ts
+98
src/lib/cache.ts
···
1
+
import type { ActorIdentifier, Did } from '@atcute/lexicons';
2
+
import { isDid } from '@atcute/lexicons/syntax';
3
+
import type { KVNamespace } from '@cloudflare/workers-types';
4
+
5
+
/** TTL in seconds for each cache namespace */
6
+
const NAMESPACE_TTL = {
7
+
blento: 60 * 60 * 24, // 24 hours
8
+
identity: 60 * 60 * 24 * 7, // 7 days
9
+
github: 60 * 60 * 12, // 12 hours
10
+
'gh-contrib': 60 * 60 * 12, // 12 hours
11
+
lastfm: 60 * 60, // 1 hour (default, overridable per-put)
12
+
npmx: 60 * 60 * 12, // 12 hours
13
+
meta: 0 // no auto-expiry
14
+
} as const;
15
+
16
+
export type CacheNamespace = keyof typeof NAMESPACE_TTL;
17
+
18
+
export class CacheService {
19
+
constructor(private kv: KVNamespace) {}
20
+
21
+
// === Generic namespaced operations ===
22
+
23
+
async get(namespace: CacheNamespace, key: string): Promise<string | null> {
24
+
return this.kv.get(`${namespace}:${key}`);
25
+
}
26
+
27
+
async put(
28
+
namespace: CacheNamespace,
29
+
key: string,
30
+
value: string,
31
+
ttlSeconds?: number
32
+
): Promise<void> {
33
+
const ttl = ttlSeconds ?? NAMESPACE_TTL[namespace] ?? 0;
34
+
await this.kv.put(`${namespace}:${key}`, value, ttl > 0 ? { expirationTtl: ttl } : undefined);
35
+
}
36
+
37
+
async delete(namespace: CacheNamespace, key: string): Promise<void> {
38
+
await this.kv.delete(`${namespace}:${key}`);
39
+
}
40
+
41
+
async list(namespace: CacheNamespace): Promise<string[]> {
42
+
const prefix = `${namespace}:`;
43
+
const result = await this.kv.list({ prefix });
44
+
return result.keys.map((k) => k.name.slice(prefix.length));
45
+
}
46
+
47
+
// === JSON convenience ===
48
+
49
+
async getJSON<T = unknown>(namespace: CacheNamespace, key: string): Promise<T | null> {
50
+
const raw = await this.get(namespace, key);
51
+
if (!raw) return null;
52
+
return JSON.parse(raw) as T;
53
+
}
54
+
55
+
async putJSON(
56
+
namespace: CacheNamespace,
57
+
key: string,
58
+
value: unknown,
59
+
ttlSeconds?: number
60
+
): Promise<void> {
61
+
await this.put(namespace, key, JSON.stringify(value), ttlSeconds);
62
+
}
63
+
64
+
// === blento data (keyed by DID, with handle↔did resolution) ===
65
+
async getBlento(identifier: ActorIdentifier): Promise<string | null> {
66
+
const did = await this.resolveDid(identifier);
67
+
if (!did) return null;
68
+
return this.get('blento', did);
69
+
}
70
+
71
+
async putBlento(did: string, handle: string, data: string): Promise<void> {
72
+
await Promise.all([
73
+
this.put('blento', did, data),
74
+
this.put('identity', `h:${handle}`, did),
75
+
this.put('identity', `d:${did}`, handle)
76
+
]);
77
+
}
78
+
79
+
async listBlentos(): Promise<string[]> {
80
+
return this.list('blento');
81
+
}
82
+
83
+
// === Identity resolution ===
84
+
async resolveDid(identifier: ActorIdentifier): Promise<string | null> {
85
+
if (isDid(identifier)) return identifier;
86
+
return this.get('identity', `h:${identifier}`);
87
+
}
88
+
89
+
async resolveHandle(did: Did): Promise<string | null> {
90
+
return this.get('identity', `d:${did}`);
91
+
}
92
+
}
93
+
94
+
export function createCache(platform?: App.Platform): CacheService | undefined {
95
+
const kv = platform?.env?.USER_DATA_CACHE;
96
+
if (!kv) return undefined;
97
+
return new CacheService(kv);
98
+
}
+6
-5
src/lib/cards/media/LastFMCard/LastFMProfileCard/LastFMProfileCard.svelte
+6
-5
src/lib/cards/media/LastFMCard/LastFMProfileCard/LastFMProfileCard.svelte
···
4
4
import { getAdditionalUserData } from '$lib/website/context';
5
5
import type { ContentComponentProps } from '../../../types';
6
6
import { qrOverlay } from '$lib/components/qr/qrOverlay.svelte';
7
+
import { fetchLastFM } from '../api.remote';
7
8
8
9
interface UserInfo {
9
10
name: string;
···
27
28
if (!item.cardData.lastfmUsername) return;
28
29
29
30
try {
30
-
const response = await fetch(
31
-
`/api/lastfm?method=user.getInfo&user=${encodeURIComponent(item.cardData.lastfmUsername)}`
32
-
);
33
-
if (response.ok) {
34
-
const result = await response.json();
31
+
const result = await fetchLastFM({
32
+
method: 'user.getInfo',
33
+
user: item.cardData.lastfmUsername
34
+
});
35
+
if (result) {
35
36
userInfo = result?.user;
36
37
data[cacheKey] = userInfo;
37
38
}
+17
-7
src/lib/cards/media/LastFMCard/LastFMProfileCard/index.ts
+17
-7
src/lib/cards/media/LastFMCard/LastFMProfileCard/index.ts
···
1
1
import type { CardDefinition } from '../../../types';
2
2
import CreateLastFMCardModal from '../CreateLastFMCardModal.svelte';
3
3
import LastFMProfileCard from './LastFMProfileCard.svelte';
4
+
import { fetchLastFM } from '../api.remote';
4
5
5
6
export const LastFMProfileCardDefinition = {
6
7
type: 'lastfmProfile',
···
18
19
const username = item.cardData.lastfmUsername;
19
20
if (!username) continue;
20
21
try {
21
-
const response = await fetch(
22
-
`https://blento.app/api/lastfm?method=user.getInfo&user=${encodeURIComponent(username)}`
23
-
);
24
-
if (!response.ok) continue;
25
-
const text = await response.text();
26
-
const result = JSON.parse(text);
27
-
allData[`lastfmProfile:${username}`] = result?.user;
22
+
const data = await fetchLastFM({ method: 'user.getInfo', user: username });
23
+
if (data) allData[`lastfmProfile:${username}`] = data?.user;
24
+
} catch (error) {
25
+
console.error('Failed to fetch Last.fm profile:', error);
26
+
}
27
+
}
28
+
return allData;
29
+
},
30
+
loadDataServer: async (items) => {
31
+
const allData: Record<string, unknown> = {};
32
+
for (const item of items) {
33
+
const username = item.cardData.lastfmUsername;
34
+
if (!username) continue;
35
+
try {
36
+
const data = await fetchLastFM({ method: 'user.getInfo', user: username });
37
+
if (data) allData[`lastfmProfile:${username}`] = data?.user;
28
38
} catch (error) {
29
39
console.error('Failed to fetch Last.fm profile:', error);
30
40
}
+6
-5
src/lib/cards/media/LastFMCard/LastFMRecentTracksCard/LastFMRecentTracksCard.svelte
+6
-5
src/lib/cards/media/LastFMCard/LastFMRecentTracksCard/LastFMRecentTracksCard.svelte
···
4
4
import type { ContentComponentProps } from '../../../types';
5
5
import LastFMAlbumArt from '../LastFMAlbumArt.svelte';
6
6
import { RelativeTime } from '@foxui/time';
7
+
import { fetchLastFM } from '../api.remote';
7
8
8
9
interface Track {
9
10
name: string;
···
29
30
if (!item.cardData.lastfmUsername) return;
30
31
31
32
try {
32
-
const response = await fetch(
33
-
`/api/lastfm?method=user.getRecentTracks&user=${encodeURIComponent(item.cardData.lastfmUsername)}&limit=50`
34
-
);
35
-
if (response.ok) {
36
-
const result = await response.json();
33
+
const result = await fetchLastFM({
34
+
method: 'user.getRecentTracks',
35
+
user: item.cardData.lastfmUsername
36
+
});
37
+
if (result) {
37
38
tracks = result?.recenttracks?.track ?? [];
38
39
data[cacheKey] = tracks;
39
40
} else {
+17
-7
src/lib/cards/media/LastFMCard/LastFMRecentTracksCard/index.ts
+17
-7
src/lib/cards/media/LastFMCard/LastFMRecentTracksCard/index.ts
···
1
1
import type { CardDefinition } from '../../../types';
2
2
import CreateLastFMCardModal from '../CreateLastFMCardModal.svelte';
3
3
import LastFMRecentTracksCard from './LastFMRecentTracksCard.svelte';
4
+
import { fetchLastFM } from '../api.remote';
4
5
5
6
export const LastFMRecentTracksCardDefinition = {
6
7
type: 'lastfmRecentTracks',
···
18
19
const username = item.cardData.lastfmUsername;
19
20
if (!username) continue;
20
21
try {
21
-
const response = await fetch(
22
-
`https://blento.app/api/lastfm?method=user.getRecentTracks&user=${encodeURIComponent(username)}&limit=50`
23
-
);
24
-
if (!response.ok) continue;
25
-
const text = await response.text();
26
-
const result = JSON.parse(text);
27
-
allData[`lastfmRecentTracks:${username}`] = result?.recenttracks?.track ?? [];
22
+
const data = await fetchLastFM({ method: 'user.getRecentTracks', user: username });
23
+
if (data) allData[`lastfmRecentTracks:${username}`] = data?.recenttracks?.track ?? [];
24
+
} catch (error) {
25
+
console.error('Failed to fetch Last.fm recent tracks:', error);
26
+
}
27
+
}
28
+
return allData;
29
+
},
30
+
loadDataServer: async (items) => {
31
+
const allData: Record<string, unknown> = {};
32
+
for (const item of items) {
33
+
const username = item.cardData.lastfmUsername;
34
+
if (!username) continue;
35
+
try {
36
+
const data = await fetchLastFM({ method: 'user.getRecentTracks', user: username });
37
+
if (data) allData[`lastfmRecentTracks:${username}`] = data?.recenttracks?.track ?? [];
28
38
} catch (error) {
29
39
console.error('Failed to fetch Last.fm recent tracks:', error);
30
40
}
+7
-5
src/lib/cards/media/LastFMCard/LastFMTopAlbumsCard/LastFMTopAlbumsCard.svelte
+7
-5
src/lib/cards/media/LastFMCard/LastFMTopAlbumsCard/LastFMTopAlbumsCard.svelte
···
3
3
import type { ContentComponentProps } from '../../../types';
4
4
import { getAdditionalUserData } from '$lib/website/context';
5
5
import ImageGrid from '$lib/components/ImageGrid.svelte';
6
+
import { fetchLastFM } from '../api.remote';
6
7
7
8
interface Album {
8
9
name: string;
···
30
31
loading = true;
31
32
32
33
try {
33
-
const response = await fetch(
34
-
`/api/lastfm?method=user.getTopAlbums&user=${encodeURIComponent(item.cardData.lastfmUsername)}&period=${period}&limit=50`
35
-
);
36
-
if (response.ok) {
37
-
const result = await response.json();
34
+
const result = await fetchLastFM({
35
+
method: 'user.getTopAlbums',
36
+
user: item.cardData.lastfmUsername,
37
+
period
38
+
});
39
+
if (result) {
38
40
albums = result?.topalbums?.album ?? [];
39
41
data[cacheKey] = albums;
40
42
} else {
+18
-7
src/lib/cards/media/LastFMCard/LastFMTopAlbumsCard/index.ts
+18
-7
src/lib/cards/media/LastFMCard/LastFMTopAlbumsCard/index.ts
···
2
2
import CreateLastFMCardModal from '../CreateLastFMCardModal.svelte';
3
3
import LastFMTopAlbumsCard from './LastFMTopAlbumsCard.svelte';
4
4
import LastFMTopAlbumsCardSettings from './LastFMTopAlbumsCardSettings.svelte';
5
+
import { fetchLastFM } from '../api.remote';
5
6
6
7
export const LastFMTopAlbumsCardDefinition = {
7
8
type: 'lastfmTopAlbums',
···
22
23
const period = item.cardData.period ?? '7day';
23
24
if (!username) continue;
24
25
try {
25
-
const response = await fetch(
26
-
`https://blento.app/api/lastfm?method=user.getTopAlbums&user=${encodeURIComponent(username)}&period=${period}&limit=50`
27
-
);
28
-
if (!response.ok) continue;
29
-
const text = await response.text();
30
-
const result = JSON.parse(text);
31
-
allData[`lastfmTopAlbums:${username}:${period}`] = result?.topalbums?.album ?? [];
26
+
const data = await fetchLastFM({ method: 'user.getTopAlbums', user: username, period });
27
+
if (data) allData[`lastfmTopAlbums:${username}:${period}`] = data?.topalbums?.album ?? [];
28
+
} catch (error) {
29
+
console.error('Failed to fetch Last.fm top albums:', error);
30
+
}
31
+
}
32
+
return allData;
33
+
},
34
+
loadDataServer: async (items) => {
35
+
const allData: Record<string, unknown> = {};
36
+
for (const item of items) {
37
+
const username = item.cardData.lastfmUsername;
38
+
const period = item.cardData.period ?? '7day';
39
+
if (!username) continue;
40
+
try {
41
+
const data = await fetchLastFM({ method: 'user.getTopAlbums', user: username, period });
42
+
if (data) allData[`lastfmTopAlbums:${username}:${period}`] = data?.topalbums?.album ?? [];
32
43
} catch (error) {
33
44
console.error('Failed to fetch Last.fm top albums:', error);
34
45
}
+7
-5
src/lib/cards/media/LastFMCard/LastFMTopTracksCard/LastFMTopTracksCard.svelte
+7
-5
src/lib/cards/media/LastFMCard/LastFMTopTracksCard/LastFMTopTracksCard.svelte
···
3
3
import { getAdditionalUserData } from '$lib/website/context';
4
4
import type { ContentComponentProps } from '../../../types';
5
5
import LastFMAlbumArt from '../LastFMAlbumArt.svelte';
6
+
import { fetchLastFM } from '../api.remote';
6
7
7
8
interface Track {
8
9
name: string;
···
29
30
loading = true;
30
31
31
32
try {
32
-
const response = await fetch(
33
-
`/api/lastfm?method=user.getTopTracks&user=${encodeURIComponent(item.cardData.lastfmUsername)}&period=${period}&limit=50`
34
-
);
35
-
if (response.ok) {
36
-
const result = await response.json();
33
+
const result = await fetchLastFM({
34
+
method: 'user.getTopTracks',
35
+
user: item.cardData.lastfmUsername,
36
+
period
37
+
});
38
+
if (result) {
37
39
tracks = result?.toptracks?.track ?? [];
38
40
data[cacheKey] = tracks;
39
41
} else {
+18
-7
src/lib/cards/media/LastFMCard/LastFMTopTracksCard/index.ts
+18
-7
src/lib/cards/media/LastFMCard/LastFMTopTracksCard/index.ts
···
2
2
import CreateLastFMCardModal from '../CreateLastFMCardModal.svelte';
3
3
import LastFMPeriodSettings from '../LastFMPeriodSettings.svelte';
4
4
import LastFMTopTracksCard from './LastFMTopTracksCard.svelte';
5
+
import { fetchLastFM } from '../api.remote';
5
6
6
7
export const LastFMTopTracksCardDefinition = {
7
8
type: 'lastfmTopTracks',
···
22
23
const period = item.cardData.period ?? '7day';
23
24
if (!username) continue;
24
25
try {
25
-
const response = await fetch(
26
-
`https://blento.app/api/lastfm?method=user.getTopTracks&user=${encodeURIComponent(username)}&period=${period}&limit=50`
27
-
);
28
-
if (!response.ok) continue;
29
-
const text = await response.text();
30
-
const result = JSON.parse(text);
31
-
allData[`lastfmTopTracks:${username}:${period}`] = result?.toptracks?.track ?? [];
26
+
const data = await fetchLastFM({ method: 'user.getTopTracks', user: username, period });
27
+
if (data) allData[`lastfmTopTracks:${username}:${period}`] = data?.toptracks?.track ?? [];
28
+
} catch (error) {
29
+
console.error('Failed to fetch Last.fm top tracks:', error);
30
+
}
31
+
}
32
+
return allData;
33
+
},
34
+
loadDataServer: async (items) => {
35
+
const allData: Record<string, unknown> = {};
36
+
for (const item of items) {
37
+
const username = item.cardData.lastfmUsername;
38
+
const period = item.cardData.period ?? '7day';
39
+
if (!username) continue;
40
+
try {
41
+
const data = await fetchLastFM({ method: 'user.getTopTracks', user: username, period });
42
+
if (data) allData[`lastfmTopTracks:${username}:${period}`] = data?.toptracks?.track ?? [];
32
43
} catch (error) {
33
44
console.error('Failed to fetch Last.fm top tracks:', error);
34
45
}
+59
src/lib/cards/media/LastFMCard/api.remote.ts
+59
src/lib/cards/media/LastFMCard/api.remote.ts
···
1
+
import { query, getRequestEvent } from '$app/server';
2
+
import { env } from '$env/dynamic/private';
3
+
import { createCache } from '$lib/cache';
4
+
5
+
const LASTFM_API_URL = 'https://ws.audioscrobbler.com/2.0/';
6
+
7
+
const CACHE_TTL: Record<string, number> = {
8
+
'user.getRecentTracks': 15 * 60,
9
+
'user.getTopTracks': 60 * 60,
10
+
'user.getTopAlbums': 60 * 60,
11
+
'user.getInfo': 12 * 60 * 60
12
+
};
13
+
14
+
export const fetchLastFM = query(
15
+
'unchecked',
16
+
async ({
17
+
method,
18
+
user,
19
+
period = '7day',
20
+
limit = '50'
21
+
}: {
22
+
method: string;
23
+
user: string;
24
+
period?: string;
25
+
limit?: string;
26
+
}) => {
27
+
const apiKey = env?.LASTFM_API_KEY;
28
+
if (!apiKey) return undefined;
29
+
30
+
const { platform } = getRequestEvent();
31
+
const cache = createCache(platform);
32
+
33
+
const cacheKey = `${method}:${user}:${period}:${limit}`;
34
+
const cached = await cache?.get('lastfm', cacheKey);
35
+
if (cached) return JSON.parse(cached);
36
+
37
+
const params = new URLSearchParams({
38
+
method,
39
+
user,
40
+
api_key: apiKey,
41
+
format: 'json',
42
+
limit
43
+
});
44
+
45
+
if (method === 'user.getTopTracks' || method === 'user.getTopAlbums') {
46
+
params.set('period', period);
47
+
}
48
+
49
+
const response = await fetch(`${LASTFM_API_URL}?${params}`);
50
+
if (!response.ok) return undefined;
51
+
52
+
const data = await response.json();
53
+
if (data.error) return undefined;
54
+
55
+
const ttl = CACHE_TTL[method] || 60 * 60;
56
+
await cache?.put('lastfm', cacheKey, JSON.stringify(data), ttl);
57
+
return data;
58
+
}
59
+
);
+3
-4
src/lib/cards/special/UpdatedBlentos/index.ts
+3
-4
src/lib/cards/special/UpdatedBlentos/index.ts
···
15
15
'https://ufos-api.microcosm.blue/records?collection=app.blento.card'
16
16
);
17
17
const recentRecords = await response.json();
18
-
const existingUsers = await cache?.get('updatedBlentos');
18
+
const existingUsers = await cache?.get('meta', 'updatedBlentos');
19
19
const existingUsersArray: ProfileWithBlentoFlag[] = existingUsers
20
20
? JSON.parse(existingUsers)
21
21
: [];
···
50
50
(v) => v && v.handle !== 'handle.invalid' && !v.handle.endsWith('.pds.rip')
51
51
);
52
52
53
-
if (cache) {
54
-
await cache?.put('updatedBlentos', JSON.stringify(result));
55
-
}
53
+
await cache?.put('meta', 'updatedBlentos', JSON.stringify(result));
54
+
56
55
return JSON.parse(JSON.stringify(result.slice(0, 20)));
57
56
} catch (error) {
58
57
console.error('error fetching updated blentos', error);
+20
-2
src/lib/cards/types.ts
+20
-2
src/lib/cards/types.ts
···
1
1
import type { Component } from 'svelte';
2
-
import type { Item, UserCache } from '$lib/types';
2
+
import type { Item } from '$lib/types';
3
+
import type { CacheService } from '$lib/cache';
3
4
import type { Did } from '@atcute/lexicons';
4
5
5
6
export type CreationModalComponentProps = {
···
36
37
loadData?: (
37
38
// all cards of that type
38
39
items: Item[],
39
-
{ did, handle, cache }: { did: Did; handle: string; cache?: UserCache }
40
+
{ did, handle, cache }: { did: Did; handle: string; cache?: CacheService }
41
+
) => Promise<unknown>;
42
+
43
+
// server-side version of loadData that calls external APIs directly
44
+
// instead of going through self-referential /api/ routes (avoids 522 on Cloudflare Workers)
45
+
loadDataServer?: (
46
+
items: Item[],
47
+
{
48
+
did,
49
+
handle,
50
+
cache,
51
+
env
52
+
}: {
53
+
did: Did;
54
+
handle: string;
55
+
cache?: CacheService;
56
+
env?: Record<string, string | undefined>;
57
+
}
40
58
) => Promise<unknown>;
41
59
42
60
// show color selection popup
+2
-1
src/lib/layout/EditableGrid.svelte
+2
-1
src/lib/layout/EditableGrid.svelte
···
373
373
ondrop={handleFileDrop}
374
374
/>
375
375
376
-
<!-- svelte-ignore a11y_no_static_element_interactions a11y_click_events_have_key_events -->
376
+
<!-- svelte-ignore a11y_no_static_element_interactions -->
377
+
<!-- svelte-ignore a11y_click_events_have_key_events -->
377
378
<div
378
379
bind:this={container}
379
380
onpointerdown={handlePointerDown}
-5
src/lib/types.ts
-5
src/lib/types.ts
+23
-24
src/lib/website/load.ts
+23
-24
src/lib/website/load.ts
···
1
1
import { getDetailedProfile, listRecords, resolveHandle, parseUri, getRecord } from '$lib/atproto';
2
2
import { CardDefinitionsByType } from '$lib/cards';
3
-
import type { Item, UserCache, WebsiteData } from '$lib/types';
3
+
import type { CacheService } from '$lib/cache';
4
+
import type { Item, WebsiteData } from '$lib/types';
4
5
import { error } from '@sveltejs/kit';
5
6
import type { ActorIdentifier, Did } from '@atcute/lexicons';
6
7
···
9
10
10
11
const CURRENT_CACHE_VERSION = 1;
11
12
12
-
export async function getCache(handle: string, page: string, cache?: UserCache) {
13
+
export async function getCache(identifier: ActorIdentifier, page: string, cache?: CacheService) {
13
14
try {
14
-
const cachedResult = await cache?.get?.(handle);
15
+
const cachedResult = await cache?.getBlento(identifier);
15
16
16
17
if (!cachedResult) return;
17
18
const result = JSON.parse(cachedResult);
18
-
const update = result.updatedAt;
19
-
const timePassed = (Date.now() - update) / 1000;
20
-
21
-
const ONE_DAY = 60 * 60 * 24;
22
19
23
20
if (!result.version || result.version !== CURRENT_CACHE_VERSION) {
24
21
console.log('skipping cache because of version mismatch');
25
22
return;
26
23
}
27
24
28
-
if (timePassed > ONE_DAY) {
29
-
console.log('skipping cache because of age');
30
-
return;
31
-
}
32
-
33
25
result.page = 'blento.' + page;
34
26
35
27
result.publication = (result.publications as Awaited<ReturnType<typeof listRecords>>).find(
···
42
34
43
35
delete result['publications'];
44
36
45
-
console.log('using cached result for handle', handle, 'last update', timePassed, 'seconds ago');
46
37
return checkData(result);
47
38
} catch (error) {
48
39
console.log('getting cached result failed', error);
···
51
42
52
43
export async function loadData(
53
44
handle: ActorIdentifier,
54
-
cache: UserCache | undefined,
45
+
cache: CacheService | undefined,
55
46
forceUpdate: boolean = false,
56
-
page: string = 'self'
47
+
page: string = 'self',
48
+
env?: Record<string, string | undefined>
57
49
): Promise<WebsiteData> {
58
50
if (!handle) throw error(404);
59
51
if (handle === 'favicon.ico') throw error(404);
···
74
66
}
75
67
76
68
const [cards, mainPublication, pages, profile] = await Promise.all([
77
-
listRecords({ did, collection: 'app.blento.card' }).catch(() => {
78
-
console.error('error getting records for collection app.blento.card');
69
+
listRecords({ did, collection: 'app.blento.card' }).catch((e) => {
70
+
console.error('error getting records for collection app.blento.card', e);
79
71
return [] as Awaited<ReturnType<typeof listRecords>>;
80
72
}),
81
73
getRecord({
···
103
95
for (const cardType of cardTypesArray) {
104
96
const cardDef = CardDefinitionsByType[cardType];
105
97
106
-
if (!cardDef?.loadData) continue;
98
+
const items = cards.filter((v) => cardType === v.value.cardType).map((v) => v.value) as Item[];
107
99
108
100
try {
109
-
additionDataPromises[cardType] = cardDef.loadData(
110
-
cards.filter((v) => cardType === v.value.cardType).map((v) => v.value) as Item[],
111
-
loadOptions
112
-
);
101
+
if (cardDef?.loadDataServer) {
102
+
additionDataPromises[cardType] = cardDef.loadDataServer(items, {
103
+
...loadOptions,
104
+
env
105
+
});
106
+
} else if (cardDef?.loadData) {
107
+
additionDataPromises[cardType] = cardDef.loadData(items, loadOptions);
108
+
}
113
109
} catch {
114
110
console.error('error getting additional data for', cardType);
115
111
}
···
140
136
version: CURRENT_CACHE_VERSION
141
137
};
142
138
143
-
const stringifiedResult = JSON.stringify(result);
144
-
await cache?.put?.(handle, stringifiedResult);
139
+
// Only cache results that have cards to avoid caching PDS errors
140
+
if (result.cards.length > 0) {
141
+
const stringifiedResult = JSON.stringify(result);
142
+
await cache?.putBlento(did, handle as string, stringifiedResult);
143
+
}
145
144
146
145
const parsedResult = structuredClone(result) as any;
147
146
+6
src/params/actor.ts
+6
src/params/actor.ts
-6
src/params/handle.ts
-6
src/params/handle.ts
-2
src/routes/+layout.server.ts
-2
src/routes/+layout.server.ts
-1
src/routes/+layout.svelte
-1
src/routes/+layout.svelte
+5
-4
src/routes/+page.server.ts
+5
-4
src/routes/+page.server.ts
···
1
1
import { loadData } from '$lib/website/load';
2
2
import { env } from '$env/dynamic/public';
3
-
import type { UserCache } from '$lib/types';
3
+
import { env as privateEnv } from '$env/dynamic/private';
4
+
import { createCache } from '$lib/cache';
4
5
import type { ActorIdentifier } from '@atcute/lexicons';
5
6
6
7
export async function load({ platform, request }) {
···
8
9
9
10
const kv = platform?.env?.CUSTOM_DOMAINS;
10
11
11
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
12
+
const cache = createCache(platform);
12
13
const customDomain = request.headers.get('X-Custom-Domain')?.toLocaleLowerCase();
13
14
14
15
if (kv && customDomain) {
15
16
try {
16
17
const did = await kv.get(customDomain);
17
18
18
-
if (did) return await loadData(did as ActorIdentifier, cache as UserCache);
19
+
if (did) return await loadData(did as ActorIdentifier, cache, false, 'self', privateEnv);
19
20
} catch (error) {
20
21
console.error('failed to get custom domain kv', error);
21
22
}
22
23
}
23
24
24
-
return await loadData(handle as ActorIdentifier, cache as UserCache);
25
+
return await loadData(handle as ActorIdentifier, cache, false, 'self', privateEnv);
25
26
}
+18
src/routes/[actor=actor]/(pages)/+layout.server.ts
+18
src/routes/[actor=actor]/(pages)/+layout.server.ts
···
1
+
import { loadData } from '$lib/website/load';
2
+
import { env } from '$env/dynamic/private';
3
+
import { error } from '@sveltejs/kit';
4
+
import { createCache } from '$lib/cache';
5
+
6
+
export async function load({ params, platform, request }) {
7
+
if (env.PUBLIC_IS_SELFHOSTED) error(404);
8
+
9
+
const cache = createCache(platform);
10
+
11
+
const customDomain = request.headers.get('X-Custom-Domain');
12
+
13
+
if (customDomain) {
14
+
throw error(404, 'Page not found!');
15
+
}
16
+
17
+
return await loadData(params.actor, cache, false, params.page, env);
18
+
}
+13
src/routes/[actor=actor]/(pages)/+page.svelte
+13
src/routes/[actor=actor]/(pages)/+page.svelte
···
1
+
<script lang="ts">
2
+
import { refreshData } from '$lib/helper.js';
3
+
import Website from '$lib/website/Website.svelte';
4
+
import { onMount } from 'svelte';
5
+
6
+
let { data } = $props();
7
+
8
+
onMount(() => {
9
+
refreshData(data);
10
+
});
11
+
</script>
12
+
13
+
<Website {data} />
+6
src/routes/[actor=actor]/(pages)/edit/+page.svelte
+6
src/routes/[actor=actor]/(pages)/edit/+page.svelte
+13
src/routes/[actor=actor]/(pages)/p/[[page]]/+page.svelte
+13
src/routes/[actor=actor]/(pages)/p/[[page]]/+page.svelte
···
1
+
<script lang="ts">
2
+
import { refreshData } from '$lib/helper.js';
3
+
import Website from '$lib/website/Website.svelte';
4
+
import { onMount } from 'svelte';
5
+
6
+
let { data } = $props();
7
+
8
+
onMount(() => {
9
+
refreshData(data);
10
+
});
11
+
</script>
12
+
13
+
<Website {data} />
+252
src/routes/[actor=actor]/(pages)/p/[[page]]/copy/+page.svelte
+252
src/routes/[actor=actor]/(pages)/p/[[page]]/copy/+page.svelte
···
1
+
<script lang="ts">
2
+
import {
3
+
putRecord,
4
+
deleteRecord,
5
+
listRecords,
6
+
uploadBlob,
7
+
getCDNImageBlobUrl
8
+
} from '$lib/atproto/methods';
9
+
import { user } from '$lib/atproto/auth.svelte';
10
+
import { goto } from '$app/navigation';
11
+
import * as TID from '@atcute/tid';
12
+
import { Button } from '@foxui/core';
13
+
import { loginModalState } from '$lib/atproto/UI/LoginModal.svelte';
14
+
15
+
let { data } = $props();
16
+
17
+
let destinationPage = $state('');
18
+
let copying = $state(false);
19
+
let error = $state('');
20
+
let success = $state(false);
21
+
22
+
const sourceHandle = $derived(data.handle);
23
+
24
+
const sourcePage = $derived(
25
+
data.page === 'blento.self' ? 'main' : data.page.replace('blento.', '')
26
+
);
27
+
const sourceCards = $derived(data.cards);
28
+
29
+
// Re-upload blobs from source repo to current user's repo
30
+
async function reuploadBlobs(obj: any, sourceDid: string): Promise<void> {
31
+
if (!obj || typeof obj !== 'object') return;
32
+
33
+
for (const key of Object.keys(obj)) {
34
+
const value = obj[key];
35
+
36
+
if (value && typeof value === 'object') {
37
+
// Check if this is a blob reference
38
+
if (value.$type === 'blob' && value.ref?.$link) {
39
+
try {
40
+
// Get the blob URL from source repo
41
+
const blobUrl = getCDNImageBlobUrl({ did: sourceDid, blob: value });
42
+
if (!blobUrl) continue;
43
+
44
+
// Fetch the blob via proxy to avoid CORS
45
+
const response = await fetch(`/api/image-proxy?url=${encodeURIComponent(blobUrl)}`);
46
+
if (!response.ok) {
47
+
console.error('Failed to fetch blob:', blobUrl);
48
+
continue;
49
+
}
50
+
51
+
// Upload to current user's repo
52
+
const blob = await response.blob();
53
+
const newBlobRef = await uploadBlob({ blob });
54
+
55
+
if (newBlobRef) {
56
+
// Replace with new blob reference
57
+
obj[key] = newBlobRef;
58
+
}
59
+
} catch (err) {
60
+
console.error('Failed to re-upload blob:', err);
61
+
}
62
+
} else {
63
+
// Recursively check nested objects
64
+
await reuploadBlobs(value, sourceDid);
65
+
}
66
+
}
67
+
}
68
+
}
69
+
70
+
async function copyPage() {
71
+
if (!user.isLoggedIn || !user.did) {
72
+
error = 'You must be logged in to copy pages';
73
+
return;
74
+
}
75
+
76
+
copying = true;
77
+
error = '';
78
+
79
+
try {
80
+
const targetPage =
81
+
destinationPage.trim() === '' ? 'blento.self' : `blento.${destinationPage.trim()}`;
82
+
83
+
// Fetch existing cards from destination page and delete them
84
+
const existingCards = await listRecords({
85
+
did: user.did,
86
+
collection: 'app.blento.card'
87
+
});
88
+
89
+
const cardsToDelete = existingCards.filter(
90
+
(card: { value: { page?: string } }) => card.value.page === targetPage
91
+
);
92
+
93
+
// Delete existing cards from destination page
94
+
const deletePromises = cardsToDelete.map((card: { uri: string }) => {
95
+
const rkey = card.uri.split('/').pop()!;
96
+
return deleteRecord({
97
+
collection: 'app.blento.card',
98
+
rkey
99
+
});
100
+
});
101
+
102
+
await Promise.all(deletePromises);
103
+
104
+
// Copy each card with a new ID to the destination page
105
+
// Re-upload blobs from source repo to current user's repo
106
+
for (const card of sourceCards) {
107
+
const newCard = {
108
+
...structuredClone(card),
109
+
id: TID.now(),
110
+
page: targetPage,
111
+
updatedAt: new Date().toISOString(),
112
+
version: 2
113
+
};
114
+
115
+
// Re-upload any blobs in cardData
116
+
await reuploadBlobs(newCard.cardData, data.did);
117
+
118
+
await putRecord({
119
+
collection: 'app.blento.card',
120
+
rkey: newCard.id,
121
+
record: newCard
122
+
});
123
+
}
124
+
125
+
const userHandle = user.profile?.handle ?? data.handle;
126
+
127
+
// Copy publication data if it exists
128
+
if (data.publication) {
129
+
const publicationCopy = structuredClone(data.publication) as Record<string, unknown>;
130
+
131
+
// Re-upload any blobs in publication (e.g., icon)
132
+
await reuploadBlobs(publicationCopy, data.did);
133
+
134
+
// Update the URL to point to the user's page
135
+
publicationCopy.url = `https://blento.app/${userHandle}`;
136
+
if (targetPage !== 'blento.self') {
137
+
publicationCopy.url += '/' + targetPage.replace('blento.', '');
138
+
}
139
+
140
+
// Save to appropriate collection based on destination page type
141
+
if (targetPage === 'blento.self') {
142
+
await putRecord({
143
+
collection: 'site.standard.publication',
144
+
rkey: targetPage,
145
+
record: publicationCopy
146
+
});
147
+
} else {
148
+
await putRecord({
149
+
collection: 'app.blento.page',
150
+
rkey: targetPage,
151
+
record: publicationCopy
152
+
});
153
+
}
154
+
}
155
+
156
+
// Refresh the logged-in user's cache
157
+
await fetch(`/${userHandle}/api/refresh`);
158
+
159
+
success = true;
160
+
161
+
// Redirect to the logged-in user's destination page edit
162
+
const destPath = destinationPage.trim() === '' ? '' : `/${destinationPage.trim()}`;
163
+
setTimeout(() => {
164
+
goto(`/${userHandle}${destPath}/edit`);
165
+
}, 1000);
166
+
} catch (e) {
167
+
error = e instanceof Error ? e.message : 'Failed to copy page';
168
+
} finally {
169
+
copying = false;
170
+
}
171
+
}
172
+
</script>
173
+
174
+
<div class="bg-base-50 dark:bg-base-900 flex min-h-screen items-center justify-center p-4">
175
+
<div class="bg-base-100 dark:bg-base-800 w-full max-w-md rounded-2xl p-6 shadow-lg">
176
+
{#if user.isLoggedIn}
177
+
<h1 class="text-base-900 dark:text-base-50 mb-6 text-2xl font-bold">Copy Page</h1>
178
+
179
+
<div class="mb-4">
180
+
<div class="text-base-700 dark:text-base-300 mb-1 block text-sm font-medium">
181
+
Source Page
182
+
</div>
183
+
<div
184
+
class="bg-base-200 dark:bg-base-700 text-base-900 dark:text-base-100 rounded-lg px-3 py-2"
185
+
>
186
+
{sourceHandle}/{sourcePage || 'main'}
187
+
</div>
188
+
<p class="text-base-500 mt-1 text-sm">{sourceCards.length} cards</p>
189
+
</div>
190
+
191
+
<div class="mb-6">
192
+
<label
193
+
for="destination"
194
+
class="text-base-700 dark:text-base-300 mb-1 block text-sm font-medium"
195
+
>
196
+
Destination Page (on your profile: {user.profile?.handle})
197
+
</label>
198
+
<input
199
+
id="destination"
200
+
type="text"
201
+
bind:value={destinationPage}
202
+
placeholder="Leave empty for main page"
203
+
class="bg-base-50 dark:bg-base-700 border-base-300 dark:border-base-600 text-base-900 dark:text-base-100 focus:ring-accent-500 w-full rounded-lg border px-3 py-2 focus:ring-2 focus:outline-none"
204
+
/>
205
+
</div>
206
+
207
+
{#if error}
208
+
<div
209
+
class="mb-4 rounded-lg bg-red-100 p-3 text-red-700 dark:bg-red-900/30 dark:text-red-400"
210
+
>
211
+
{error}
212
+
</div>
213
+
{/if}
214
+
215
+
{#if success}
216
+
<div
217
+
class="mb-4 rounded-lg bg-green-100 p-3 text-green-700 dark:bg-green-900/30 dark:text-green-400"
218
+
>
219
+
Page copied successfully! Redirecting...
220
+
</div>
221
+
{/if}
222
+
223
+
<div class="flex gap-3">
224
+
<a
225
+
href="/{data.handle}/{sourcePage === 'main' ? '' : sourcePage}"
226
+
class="bg-base-200 hover:bg-base-300 dark:bg-base-700 dark:hover:bg-base-600 text-base-700 dark:text-base-300 flex-1 rounded-lg px-4 py-2 text-center font-medium transition-colors"
227
+
>
228
+
Cancel
229
+
</a>
230
+
<button
231
+
onclick={copyPage}
232
+
disabled={copying || success}
233
+
class="bg-accent-500 hover:bg-accent-600 flex-1 rounded-lg px-4 py-2 font-medium text-white transition-colors disabled:cursor-not-allowed disabled:opacity-50"
234
+
>
235
+
{#if copying}
236
+
Copying...
237
+
{:else}
238
+
Copy {sourceCards.length} cards
239
+
{/if}
240
+
</button>
241
+
</div>
242
+
{:else}
243
+
<h1 class="text-base-900 dark:text-base-50 mb-6 text-2xl font-bold">
244
+
You must be signed in to copy a page!
245
+
</h1>
246
+
247
+
<div class="flex w-full justify-center">
248
+
<Button size="lg" onclick={() => loginModalState.show()}>Login</Button>
249
+
</div>
250
+
{/if}
251
+
</div>
252
+
</div>
+6
src/routes/[actor=actor]/(pages)/p/[[page]]/edit/+page.svelte
+6
src/routes/[actor=actor]/(pages)/p/[[page]]/edit/+page.svelte
+16
src/routes/[actor=actor]/.well-known/site.standard.publication/+server.ts
+16
src/routes/[actor=actor]/.well-known/site.standard.publication/+server.ts
···
1
+
import { loadData } from '$lib/website/load';
2
+
import { createCache } from '$lib/cache';
3
+
import { env } from '$env/dynamic/private';
4
+
5
+
import { error } from '@sveltejs/kit';
6
+
import { text } from '@sveltejs/kit';
7
+
8
+
export async function GET({ params, platform }) {
9
+
const cache = createCache(platform);
10
+
11
+
const data = await loadData(params.actor, cache, false, params.page, env);
12
+
13
+
if (!data.publication) throw error(300);
14
+
15
+
return text(data.did + '/site.standard.publication/blento.self');
16
+
}
+14
src/routes/[actor=actor]/api/refresh/+server.ts
+14
src/routes/[actor=actor]/api/refresh/+server.ts
···
1
+
import { createCache } from '$lib/cache';
2
+
import { loadData } from '$lib/website/load.js';
3
+
import { env } from '$env/dynamic/private';
4
+
import type { Handle } from '@atcute/lexicons';
5
+
import { json } from '@sveltejs/kit';
6
+
7
+
export async function GET({ params, platform }) {
8
+
const cache = createCache(platform);
9
+
if (!cache) return json('no cache');
10
+
11
+
await loadData(params.actor, cache, true, 'self', env);
12
+
13
+
return json('ok');
14
+
}
+58
src/routes/[actor=actor]/og.png/+server.ts
+58
src/routes/[actor=actor]/og.png/+server.ts
···
1
+
import { getCDNImageBlobUrl } from '$lib/atproto/methods.js';
2
+
import { createCache } from '$lib/cache';
3
+
import { loadData } from '$lib/website/load';
4
+
import { env } from '$env/dynamic/private';
5
+
import type { Handle } from '@atcute/lexicons';
6
+
import { ImageResponse } from '@ethercorps/sveltekit-og';
7
+
8
+
function escapeHtml(str: string): string {
9
+
return str
10
+
.replace(/&/g, '&')
11
+
.replace(/</g, '<')
12
+
.replace(/>/g, '>')
13
+
.replace(/"/g, '"')
14
+
.replace(/'/g, ''');
15
+
}
16
+
17
+
export async function GET({ params, platform }) {
18
+
const cache = createCache(platform);
19
+
20
+
const data = await loadData(params.actor, cache, false, 'self', env);
21
+
22
+
let image: string | undefined = data.profile.avatar;
23
+
24
+
if (data.publication.icon) {
25
+
image =
26
+
getCDNImageBlobUrl({ did: data.did, blob: data.publication.icon }) ?? data.profile.avatar;
27
+
}
28
+
29
+
const name = data.publication?.name ?? data.profile.displayName ?? data.profile.handle;
30
+
31
+
const htmlString = `
32
+
<div class="flex flex-col p-8 w-full h-full bg-neutral-900">
33
+
<div class="flex items-center mb-8 mt-16">
34
+
<img src="${escapeHtml(image ?? '')}" width="128" height="128" class="rounded-full" />
35
+
36
+
<h1 class="text-neutral-50 text-7xl ml-4">${escapeHtml(name)}</h1>
37
+
</div>
38
+
39
+
<p class="mt-8 text-4xl text-neutral-300">Check out my blento</p>
40
+
41
+
<svg class="absolute w-130 h-130 top-50 right-0" viewBox="0 0 900 900" fill="none" xmlns="http://www.w3.org/2000/svg">
42
+
<rect x="100" y="100" width="160" height="340" rx="23" fill="#EF4444"/>
43
+
<rect x="640" y="280" width="160" height="340" rx="23" fill="#22C55E"/>
44
+
<rect x="280" y="100" width="340" height="340" rx="23" fill="#F59E0B"/>
45
+
<rect x="100" y="460" width="340" height="160" rx="23" fill="#0EA5E9"/>
46
+
<rect x="640" y="100" width="160" height="160" rx="23" fill="#EAB308"/>
47
+
<rect x="100" y="640" width="160" height="160" rx="23" fill="#6366F1"/>
48
+
<rect x="460" y="460" width="160" height="160" rx="23" fill="#14B8A6"/>
49
+
<rect x="280" y="640" width="520" height="160" rx="23" fill="#A855F7"/>
50
+
</svg>
51
+
</div>
52
+
`;
53
+
54
+
return new ImageResponse(htmlString, {
55
+
width: 1200,
56
+
height: 630
57
+
});
58
+
}
-13
src/routes/[handle=handle]/(pages)/+layout.server.ts
-13
src/routes/[handle=handle]/(pages)/+layout.server.ts
···
1
-
import { loadData } from '$lib/website/load';
2
-
import { env } from '$env/dynamic/private';
3
-
import { error } from '@sveltejs/kit';
4
-
import type { UserCache } from '$lib/types';
5
-
import type { Handle } from '@atcute/lexicons';
6
-
7
-
export async function load({ params, platform }) {
8
-
if (env.PUBLIC_IS_SELFHOSTED) error(404);
9
-
10
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
11
-
12
-
return await loadData(params.handle as Handle, cache as UserCache, false, params.page);
13
-
}
-13
src/routes/[handle=handle]/(pages)/+page.svelte
-13
src/routes/[handle=handle]/(pages)/+page.svelte
···
1
-
<script lang="ts">
2
-
import { refreshData } from '$lib/helper.js';
3
-
import Website from '$lib/website/Website.svelte';
4
-
import { onMount } from 'svelte';
5
-
6
-
let { data } = $props();
7
-
8
-
onMount(() => {
9
-
refreshData(data);
10
-
});
11
-
</script>
12
-
13
-
<Website {data} />
-6
src/routes/[handle=handle]/(pages)/edit/+page.svelte
-6
src/routes/[handle=handle]/(pages)/edit/+page.svelte
-13
src/routes/[handle=handle]/(pages)/p/[[page]]/+page.svelte
-13
src/routes/[handle=handle]/(pages)/p/[[page]]/+page.svelte
···
1
-
<script lang="ts">
2
-
import { refreshData } from '$lib/helper.js';
3
-
import Website from '$lib/website/Website.svelte';
4
-
import { onMount } from 'svelte';
5
-
6
-
let { data } = $props();
7
-
8
-
onMount(() => {
9
-
refreshData(data);
10
-
});
11
-
</script>
12
-
13
-
<Website {data} />
-252
src/routes/[handle=handle]/(pages)/p/[[page]]/copy/+page.svelte
-252
src/routes/[handle=handle]/(pages)/p/[[page]]/copy/+page.svelte
···
1
-
<script lang="ts">
2
-
import {
3
-
putRecord,
4
-
deleteRecord,
5
-
listRecords,
6
-
uploadBlob,
7
-
getCDNImageBlobUrl
8
-
} from '$lib/atproto/methods';
9
-
import { user } from '$lib/atproto/auth.svelte';
10
-
import { goto } from '$app/navigation';
11
-
import * as TID from '@atcute/tid';
12
-
import { Button } from '@foxui/core';
13
-
import { loginModalState } from '$lib/atproto/UI/LoginModal.svelte';
14
-
15
-
let { data } = $props();
16
-
17
-
let destinationPage = $state('');
18
-
let copying = $state(false);
19
-
let error = $state('');
20
-
let success = $state(false);
21
-
22
-
const sourceHandle = $derived(data.handle);
23
-
24
-
const sourcePage = $derived(
25
-
data.page === 'blento.self' ? 'main' : data.page.replace('blento.', '')
26
-
);
27
-
const sourceCards = $derived(data.cards);
28
-
29
-
// Re-upload blobs from source repo to current user's repo
30
-
async function reuploadBlobs(obj: any, sourceDid: string): Promise<void> {
31
-
if (!obj || typeof obj !== 'object') return;
32
-
33
-
for (const key of Object.keys(obj)) {
34
-
const value = obj[key];
35
-
36
-
if (value && typeof value === 'object') {
37
-
// Check if this is a blob reference
38
-
if (value.$type === 'blob' && value.ref?.$link) {
39
-
try {
40
-
// Get the blob URL from source repo
41
-
const blobUrl = getCDNImageBlobUrl({ did: sourceDid, blob: value });
42
-
if (!blobUrl) continue;
43
-
44
-
// Fetch the blob via proxy to avoid CORS
45
-
const response = await fetch(`/api/image-proxy?url=${encodeURIComponent(blobUrl)}`);
46
-
if (!response.ok) {
47
-
console.error('Failed to fetch blob:', blobUrl);
48
-
continue;
49
-
}
50
-
51
-
// Upload to current user's repo
52
-
const blob = await response.blob();
53
-
const newBlobRef = await uploadBlob({ blob });
54
-
55
-
if (newBlobRef) {
56
-
// Replace with new blob reference
57
-
obj[key] = newBlobRef;
58
-
}
59
-
} catch (err) {
60
-
console.error('Failed to re-upload blob:', err);
61
-
}
62
-
} else {
63
-
// Recursively check nested objects
64
-
await reuploadBlobs(value, sourceDid);
65
-
}
66
-
}
67
-
}
68
-
}
69
-
70
-
async function copyPage() {
71
-
if (!user.isLoggedIn || !user.did) {
72
-
error = 'You must be logged in to copy pages';
73
-
return;
74
-
}
75
-
76
-
copying = true;
77
-
error = '';
78
-
79
-
try {
80
-
const targetPage =
81
-
destinationPage.trim() === '' ? 'blento.self' : `blento.${destinationPage.trim()}`;
82
-
83
-
// Fetch existing cards from destination page and delete them
84
-
const existingCards = await listRecords({
85
-
did: user.did,
86
-
collection: 'app.blento.card'
87
-
});
88
-
89
-
const cardsToDelete = existingCards.filter(
90
-
(card: { value: { page?: string } }) => card.value.page === targetPage
91
-
);
92
-
93
-
// Delete existing cards from destination page
94
-
const deletePromises = cardsToDelete.map((card: { uri: string }) => {
95
-
const rkey = card.uri.split('/').pop()!;
96
-
return deleteRecord({
97
-
collection: 'app.blento.card',
98
-
rkey
99
-
});
100
-
});
101
-
102
-
await Promise.all(deletePromises);
103
-
104
-
// Copy each card with a new ID to the destination page
105
-
// Re-upload blobs from source repo to current user's repo
106
-
for (const card of sourceCards) {
107
-
const newCard = {
108
-
...structuredClone(card),
109
-
id: TID.now(),
110
-
page: targetPage,
111
-
updatedAt: new Date().toISOString(),
112
-
version: 2
113
-
};
114
-
115
-
// Re-upload any blobs in cardData
116
-
await reuploadBlobs(newCard.cardData, data.did);
117
-
118
-
await putRecord({
119
-
collection: 'app.blento.card',
120
-
rkey: newCard.id,
121
-
record: newCard
122
-
});
123
-
}
124
-
125
-
const userHandle = user.profile?.handle ?? data.handle;
126
-
127
-
// Copy publication data if it exists
128
-
if (data.publication) {
129
-
const publicationCopy = structuredClone(data.publication) as Record<string, unknown>;
130
-
131
-
// Re-upload any blobs in publication (e.g., icon)
132
-
await reuploadBlobs(publicationCopy, data.did);
133
-
134
-
// Update the URL to point to the user's page
135
-
publicationCopy.url = `https://blento.app/${userHandle}`;
136
-
if (targetPage !== 'blento.self') {
137
-
publicationCopy.url += '/' + targetPage.replace('blento.', '');
138
-
}
139
-
140
-
// Save to appropriate collection based on destination page type
141
-
if (targetPage === 'blento.self') {
142
-
await putRecord({
143
-
collection: 'site.standard.publication',
144
-
rkey: targetPage,
145
-
record: publicationCopy
146
-
});
147
-
} else {
148
-
await putRecord({
149
-
collection: 'app.blento.page',
150
-
rkey: targetPage,
151
-
record: publicationCopy
152
-
});
153
-
}
154
-
}
155
-
156
-
// Refresh the logged-in user's cache
157
-
await fetch(`/${userHandle}/api/refresh`);
158
-
159
-
success = true;
160
-
161
-
// Redirect to the logged-in user's destination page edit
162
-
const destPath = destinationPage.trim() === '' ? '' : `/${destinationPage.trim()}`;
163
-
setTimeout(() => {
164
-
goto(`/${userHandle}${destPath}/edit`);
165
-
}, 1000);
166
-
} catch (e) {
167
-
error = e instanceof Error ? e.message : 'Failed to copy page';
168
-
} finally {
169
-
copying = false;
170
-
}
171
-
}
172
-
</script>
173
-
174
-
<div class="bg-base-50 dark:bg-base-900 flex min-h-screen items-center justify-center p-4">
175
-
<div class="bg-base-100 dark:bg-base-800 w-full max-w-md rounded-2xl p-6 shadow-lg">
176
-
{#if user.isLoggedIn}
177
-
<h1 class="text-base-900 dark:text-base-50 mb-6 text-2xl font-bold">Copy Page</h1>
178
-
179
-
<div class="mb-4">
180
-
<div class="text-base-700 dark:text-base-300 mb-1 block text-sm font-medium">
181
-
Source Page
182
-
</div>
183
-
<div
184
-
class="bg-base-200 dark:bg-base-700 text-base-900 dark:text-base-100 rounded-lg px-3 py-2"
185
-
>
186
-
{sourceHandle}/{sourcePage || 'main'}
187
-
</div>
188
-
<p class="text-base-500 mt-1 text-sm">{sourceCards.length} cards</p>
189
-
</div>
190
-
191
-
<div class="mb-6">
192
-
<label
193
-
for="destination"
194
-
class="text-base-700 dark:text-base-300 mb-1 block text-sm font-medium"
195
-
>
196
-
Destination Page (on your profile: {user.profile?.handle})
197
-
</label>
198
-
<input
199
-
id="destination"
200
-
type="text"
201
-
bind:value={destinationPage}
202
-
placeholder="Leave empty for main page"
203
-
class="bg-base-50 dark:bg-base-700 border-base-300 dark:border-base-600 text-base-900 dark:text-base-100 focus:ring-accent-500 w-full rounded-lg border px-3 py-2 focus:ring-2 focus:outline-none"
204
-
/>
205
-
</div>
206
-
207
-
{#if error}
208
-
<div
209
-
class="mb-4 rounded-lg bg-red-100 p-3 text-red-700 dark:bg-red-900/30 dark:text-red-400"
210
-
>
211
-
{error}
212
-
</div>
213
-
{/if}
214
-
215
-
{#if success}
216
-
<div
217
-
class="mb-4 rounded-lg bg-green-100 p-3 text-green-700 dark:bg-green-900/30 dark:text-green-400"
218
-
>
219
-
Page copied successfully! Redirecting...
220
-
</div>
221
-
{/if}
222
-
223
-
<div class="flex gap-3">
224
-
<a
225
-
href="/{data.handle}/{sourcePage === 'main' ? '' : sourcePage}"
226
-
class="bg-base-200 hover:bg-base-300 dark:bg-base-700 dark:hover:bg-base-600 text-base-700 dark:text-base-300 flex-1 rounded-lg px-4 py-2 text-center font-medium transition-colors"
227
-
>
228
-
Cancel
229
-
</a>
230
-
<button
231
-
onclick={copyPage}
232
-
disabled={copying || success}
233
-
class="bg-accent-500 hover:bg-accent-600 flex-1 rounded-lg px-4 py-2 font-medium text-white transition-colors disabled:cursor-not-allowed disabled:opacity-50"
234
-
>
235
-
{#if copying}
236
-
Copying...
237
-
{:else}
238
-
Copy {sourceCards.length} cards
239
-
{/if}
240
-
</button>
241
-
</div>
242
-
{:else}
243
-
<h1 class="text-base-900 dark:text-base-50 mb-6 text-2xl font-bold">
244
-
You must be signed in to copy a page!
245
-
</h1>
246
-
247
-
<div class="flex w-full justify-center">
248
-
<Button size="lg" onclick={() => loginModalState.show()}>Login</Button>
249
-
</div>
250
-
{/if}
251
-
</div>
252
-
</div>
-6
src/routes/[handle=handle]/(pages)/p/[[page]]/edit/+page.svelte
-6
src/routes/[handle=handle]/(pages)/p/[[page]]/edit/+page.svelte
-14
src/routes/[handle=handle]/.well-known/site.standard.publication/+server.ts
-14
src/routes/[handle=handle]/.well-known/site.standard.publication/+server.ts
···
1
-
import { loadData } from '$lib/website/load';
2
-
import { error } from '@sveltejs/kit';
3
-
import type { UserCache } from '$lib/types';
4
-
import { text } from '@sveltejs/kit';
5
-
6
-
export async function GET({ params, platform }) {
7
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
8
-
9
-
const data = await loadData(params.handle, cache as UserCache, false, params.page);
10
-
11
-
if (!data.publication) throw error(300);
12
-
13
-
return text(data.did + '/site.standard.publication/blento.self');
14
-
}
-14
src/routes/[handle=handle]/api/refresh/+server.ts
-14
src/routes/[handle=handle]/api/refresh/+server.ts
···
1
-
import type { UserCache } from '$lib/types';
2
-
import { loadData } from '$lib/website/load.js';
3
-
import type { Handle } from '@atcute/lexicons';
4
-
import { json } from '@sveltejs/kit';
5
-
6
-
export async function GET({ params, platform }) {
7
-
if (!platform?.env?.USER_DATA_CACHE) return json('no cache');
8
-
const handle = params.handle;
9
-
10
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
11
-
await loadData(handle as Handle, cache as UserCache, true);
12
-
13
-
return json('ok');
14
-
}
-58
src/routes/[handle=handle]/og.png/+server.ts
-58
src/routes/[handle=handle]/og.png/+server.ts
···
1
-
import { getCDNImageBlobUrl } from '$lib/atproto/methods.js';
2
-
import type { UserCache } from '$lib/types';
3
-
import { loadData } from '$lib/website/load';
4
-
import type { Handle } from '@atcute/lexicons';
5
-
import { isDid } from '@atcute/lexicons/syntax';
6
-
import { ImageResponse } from '@ethercorps/sveltekit-og';
7
-
8
-
function escapeHtml(str: string): string {
9
-
return str
10
-
.replace(/&/g, '&')
11
-
.replace(/</g, '<')
12
-
.replace(/>/g, '>')
13
-
.replace(/"/g, '"')
14
-
.replace(/'/g, ''');
15
-
}
16
-
17
-
export async function GET({ params, platform }) {
18
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
19
-
20
-
const data = await loadData(params.handle as Handle, cache as UserCache);
21
-
22
-
let image: string | undefined = data.profile.avatar;
23
-
24
-
if (data.publication.icon) {
25
-
image =
26
-
getCDNImageBlobUrl({ did: data.did, blob: data.publication.icon }) ?? data.profile.avatar;
27
-
}
28
-
29
-
const name = data.publication?.name ?? data.profile.displayName ?? data.profile.handle;
30
-
31
-
const htmlString = `
32
-
<div class="flex flex-col p-8 w-full h-full bg-neutral-900">
33
-
<div class="flex items-center mb-8 mt-16">
34
-
<img src="${escapeHtml(image ?? '')}" width="128" height="128" class="rounded-full" />
35
-
36
-
<h1 class="text-neutral-50 text-7xl ml-4">${escapeHtml(name)}</h1>
37
-
</div>
38
-
39
-
<p class="mt-8 text-4xl text-neutral-300">Check out my blento</p>
40
-
41
-
<svg class="absolute w-130 h-130 top-50 right-0" viewBox="0 0 900 900" fill="none" xmlns="http://www.w3.org/2000/svg">
42
-
<rect x="100" y="100" width="160" height="340" rx="23" fill="#EF4444"/>
43
-
<rect x="640" y="280" width="160" height="340" rx="23" fill="#22C55E"/>
44
-
<rect x="280" y="100" width="340" height="340" rx="23" fill="#F59E0B"/>
45
-
<rect x="100" y="460" width="340" height="160" rx="23" fill="#0EA5E9"/>
46
-
<rect x="640" y="100" width="160" height="160" rx="23" fill="#EAB308"/>
47
-
<rect x="100" y="640" width="160" height="160" rx="23" fill="#6366F1"/>
48
-
<rect x="460" y="460" width="160" height="160" rx="23" fill="#14B8A6"/>
49
-
<rect x="280" y="640" width="520" height="160" rx="23" fill="#A855F7"/>
50
-
</svg>
51
-
</div>
52
-
`;
53
-
54
-
return new ImageResponse(htmlString, {
55
-
width: 1200,
56
-
height: 630
57
-
});
58
-
}
-35
src/routes/all/+page.server.ts
-35
src/routes/all/+page.server.ts
···
1
-
import { env } from '$env/dynamic/public';
2
-
import type { UserCache, WebsiteData } from '$lib/types.js';
3
-
import { loadData } from '$lib/website/load';
4
-
import type { Handle } from '@atcute/lexicons';
5
-
import type { AppBskyActorDefs } from '@atcute/bluesky';
6
-
7
-
export async function load({ platform }) {
8
-
const cache = platform?.env?.USER_DATA_CACHE;
9
-
10
-
const list = await cache?.list();
11
-
12
-
const profiles: AppBskyActorDefs.ProfileViewDetailed[] = [];
13
-
for (const value of list?.keys ?? []) {
14
-
// check if at least one card
15
-
const result = await cache?.get(value.name);
16
-
if (!result) continue;
17
-
const parsed = JSON.parse(result) as WebsiteData;
18
-
19
-
if (parsed.version !== 1 || !parsed.cards?.length) continue;
20
-
21
-
profiles.push(parsed.profile);
22
-
}
23
-
24
-
profiles.sort((a, b) => a.handle.localeCompare(b.handle));
25
-
26
-
const handle = env.PUBLIC_HANDLE;
27
-
28
-
const data = await loadData(handle as Handle, cache as unknown as UserCache);
29
-
30
-
data.publication ??= {};
31
-
data.publication.preferences ??= {};
32
-
data.publication.preferences.hideProfileSection = true;
33
-
34
-
return { ...data, profiles };
35
-
}
-29
src/routes/all/+page.svelte
-29
src/routes/all/+page.svelte
···
1
-
<script lang="ts">
2
-
import { createEmptyCard } from '$lib/helper.js';
3
-
import Website from '$lib/website/Website.svelte';
4
-
5
-
let { data } = $props();
6
-
</script>
7
-
8
-
<Website
9
-
data={{
10
-
...data,
11
-
cards: data.profiles.map((v, i) => {
12
-
const card = createEmptyCard('');
13
-
card.cardType = 'blueskyProfile';
14
-
card.cardData = {
15
-
avatar: v.avatar,
16
-
handle: v.handle,
17
-
displayName: v.displayName
18
-
};
19
-
20
-
card.x = (i % 4) * 2;
21
-
card.y = Math.floor(i / 4) * 2;
22
-
23
-
card.mobileX = (i % 2) * 4;
24
-
card.mobileY = Math.floor(i / 2) * 4;
25
-
26
-
return card;
27
-
})
28
-
}}
29
-
/>
-54
src/routes/api/github/+server.ts
-54
src/routes/api/github/+server.ts
···
1
-
import { json } from '@sveltejs/kit';
2
-
import type { RequestHandler } from './$types';
3
-
import type { GitHubContributionsData } from '$lib/cards/social/GitHubProfileCard/types';
4
-
5
-
const GithubAPIURL = 'https://edge-function-github-contribution.vercel.app/api/github-data?user=';
6
-
7
-
export const GET: RequestHandler = async ({ url, platform }) => {
8
-
const user = url.searchParams.get('user');
9
-
10
-
if (!user) {
11
-
return json({ error: 'No user provided' }, { status: 400 });
12
-
}
13
-
14
-
const cachedData = await platform?.env?.USER_DATA_CACHE?.get('#github:' + user);
15
-
16
-
if (cachedData) {
17
-
const parsedCache = JSON.parse(cachedData);
18
-
19
-
const TWELVE_HOURS = 12 * 60 * 60 * 1000;
20
-
const now = Date.now();
21
-
22
-
if (now - (parsedCache.updatedAt || 0) < TWELVE_HOURS) {
23
-
return json(parsedCache);
24
-
}
25
-
}
26
-
27
-
try {
28
-
const response = await fetch(GithubAPIURL + user);
29
-
30
-
if (!response.ok) {
31
-
console.error('error', response.statusText);
32
-
return json(
33
-
{ error: 'Failed to fetch GitHub data ' + response.statusText },
34
-
{ status: response.status }
35
-
);
36
-
}
37
-
38
-
const data = await response.json();
39
-
40
-
if (!data?.user) {
41
-
return json({ error: 'User not found' }, { status: 404 });
42
-
}
43
-
44
-
const result = data.user as GitHubContributionsData;
45
-
result.updatedAt = Date.now();
46
-
47
-
await platform?.env?.USER_DATA_CACHE?.put('#github:' + user, JSON.stringify(result));
48
-
49
-
return json(result);
50
-
} catch (error) {
51
-
console.error('Error fetching GitHub contributions:', error);
52
-
return json({ error: 'Failed to fetch GitHub data' }, { status: 500 });
53
-
}
54
-
};
-53
src/routes/api/github/contributors/+server.ts
-53
src/routes/api/github/contributors/+server.ts
···
1
-
import { json } from '@sveltejs/kit';
2
-
import type { RequestHandler } from './$types';
3
-
4
-
const GithubContributorsAPIURL =
5
-
'https://edge-function-github-contribution.vercel.app/api/github-contributors';
6
-
7
-
export const GET: RequestHandler = async ({ url, platform }) => {
8
-
const owner = url.searchParams.get('owner');
9
-
const repo = url.searchParams.get('repo');
10
-
11
-
if (!owner || !repo) {
12
-
return json({ error: 'Missing owner or repo parameter' }, { status: 400 });
13
-
}
14
-
15
-
const cacheKey = `#github-contributors:${owner}/${repo}`;
16
-
const cachedData = await platform?.env?.USER_DATA_CACHE?.get(cacheKey);
17
-
18
-
if (cachedData) {
19
-
const parsedCache = JSON.parse(cachedData);
20
-
21
-
const TWELVE_HOURS = 12 * 60 * 60 * 1000;
22
-
const now = Date.now();
23
-
24
-
if (now - (parsedCache.updatedAt || 0) < TWELVE_HOURS) {
25
-
return json(parsedCache.data);
26
-
}
27
-
}
28
-
29
-
try {
30
-
const response = await fetch(
31
-
`${GithubContributorsAPIURL}?owner=${encodeURIComponent(owner)}&repo=${encodeURIComponent(repo)}`
32
-
);
33
-
34
-
if (!response.ok) {
35
-
return json(
36
-
{ error: 'Failed to fetch GitHub contributors ' + response.statusText },
37
-
{ status: response.status }
38
-
);
39
-
}
40
-
41
-
const data = await response.json();
42
-
43
-
await platform?.env?.USER_DATA_CACHE?.put(
44
-
cacheKey,
45
-
JSON.stringify({ data, updatedAt: Date.now() })
46
-
);
47
-
48
-
return json(data);
49
-
} catch (error) {
50
-
console.error('Error fetching GitHub contributors:', error);
51
-
return json({ error: 'Failed to fetch GitHub contributors' }, { status: 500 });
52
-
}
53
-
};
-89
src/routes/api/lastfm/+server.ts
-89
src/routes/api/lastfm/+server.ts
···
1
-
import { json } from '@sveltejs/kit';
2
-
import type { RequestHandler } from './$types';
3
-
import { env } from '$env/dynamic/private';
4
-
5
-
const LASTFM_API_URL = 'https://ws.audioscrobbler.com/2.0/';
6
-
7
-
const ALLOWED_METHODS = [
8
-
'user.getRecentTracks',
9
-
'user.getTopTracks',
10
-
'user.getTopAlbums',
11
-
'user.getInfo'
12
-
];
13
-
14
-
const CACHE_TTL: Record<string, number> = {
15
-
'user.getRecentTracks': 15 * 60 * 1000,
16
-
'user.getTopTracks': 60 * 60 * 1000,
17
-
'user.getTopAlbums': 60 * 60 * 1000,
18
-
'user.getInfo': 12 * 60 * 60 * 1000
19
-
};
20
-
21
-
export const GET: RequestHandler = async ({ url, platform }) => {
22
-
const method = url.searchParams.get('method');
23
-
const user = url.searchParams.get('user');
24
-
const period = url.searchParams.get('period') || '7day';
25
-
const limit = url.searchParams.get('limit') || '50';
26
-
27
-
if (!method || !user) {
28
-
return json({ error: 'Missing method or user parameter' }, { status: 400 });
29
-
}
30
-
31
-
if (!ALLOWED_METHODS.includes(method)) {
32
-
return json({ error: 'Method not allowed' }, { status: 400 });
33
-
}
34
-
35
-
const cacheKey = `#lastfm:${method}:${user}:${period}:${limit}`;
36
-
const cachedData = await platform?.env?.USER_DATA_CACHE?.get(cacheKey);
37
-
38
-
if (cachedData) {
39
-
const parsed = JSON.parse(cachedData);
40
-
const ttl = CACHE_TTL[method] || 60 * 60 * 1000;
41
-
42
-
if (Date.now() - (parsed._cachedAt || 0) < ttl) {
43
-
return json(parsed);
44
-
}
45
-
}
46
-
47
-
const apiKey = env?.LASTFM_API_KEY;
48
-
if (!apiKey) {
49
-
return json({ error: 'Last.fm API key not configured' }, { status: 500 });
50
-
}
51
-
52
-
try {
53
-
const params = new URLSearchParams({
54
-
method,
55
-
user,
56
-
api_key: apiKey,
57
-
format: 'json',
58
-
limit
59
-
});
60
-
61
-
if (method === 'user.getTopTracks' || method === 'user.getTopAlbums') {
62
-
params.set('period', period);
63
-
}
64
-
65
-
const response = await fetch(`${LASTFM_API_URL}?${params}`);
66
-
67
-
if (!response.ok) {
68
-
return json(
69
-
{ error: 'Failed to fetch Last.fm data: ' + response.statusText },
70
-
{ status: response.status }
71
-
);
72
-
}
73
-
74
-
const data = await response.json();
75
-
76
-
if (data.error) {
77
-
return json({ error: data.message || 'Last.fm API error' }, { status: 400 });
78
-
}
79
-
80
-
data._cachedAt = Date.now();
81
-
82
-
await platform?.env?.USER_DATA_CACHE?.put(cacheKey, JSON.stringify(data));
83
-
84
-
return json(data);
85
-
} catch (error) {
86
-
console.error('Error fetching Last.fm data:', error);
87
-
return json({ error: 'Failed to fetch Last.fm data' }, { status: 500 });
88
-
}
89
-
};
-44
src/routes/api/npmx-leaderboard/+server.ts
-44
src/routes/api/npmx-leaderboard/+server.ts
···
1
-
import { json } from '@sveltejs/kit';
2
-
import type { RequestHandler } from './$types';
3
-
4
-
const LEADERBOARD_API_URL =
5
-
'https://npmx-likes-leaderboard-api-production.up.railway.app/api/leaderboard/likes?limit=20';
6
-
7
-
export const GET: RequestHandler = async ({ platform }) => {
8
-
const cacheKey = '#npmx-leaderboard:likes';
9
-
const cachedData = await platform?.env?.USER_DATA_CACHE?.get(cacheKey);
10
-
11
-
if (cachedData) {
12
-
const parsedCache = JSON.parse(cachedData);
13
-
14
-
const TWELVE_HOURS = 12 * 60 * 60 * 1000;
15
-
const now = Date.now();
16
-
17
-
if (now - (parsedCache.updatedAt || 0) < TWELVE_HOURS) {
18
-
return json(parsedCache.data);
19
-
}
20
-
}
21
-
22
-
try {
23
-
const response = await fetch(LEADERBOARD_API_URL);
24
-
25
-
if (!response.ok) {
26
-
return json(
27
-
{ error: 'Failed to fetch npmx leaderboard ' + response.statusText },
28
-
{ status: response.status }
29
-
);
30
-
}
31
-
32
-
const data = await response.json();
33
-
34
-
await platform?.env?.USER_DATA_CACHE?.put(
35
-
cacheKey,
36
-
JSON.stringify({ data, updatedAt: Date.now() })
37
-
);
38
-
39
-
return json(data);
40
-
} catch (error) {
41
-
console.error('Error fetching npmx leaderboard:', error);
42
-
return json({ error: 'Failed to fetch npmx leaderboard' }, { status: 500 });
43
-
}
44
-
};
+6
-3
src/routes/api/reloadRecent/+server.ts
+6
-3
src/routes/api/reloadRecent/+server.ts
···
1
1
import { getDetailedProfile } from '$lib/atproto';
2
+
import { createCache } from '$lib/cache';
2
3
import { json } from '@sveltejs/kit';
3
4
import type { AppBskyActorDefs } from '@atcute/bluesky';
4
5
5
6
export async function GET({ platform }) {
6
-
if (!platform?.env?.USER_DATA_CACHE) return json('no cache');
7
-
const existingUsers = await platform?.env?.USER_DATA_CACHE?.get('updatedBlentos');
7
+
const cache = createCache(platform);
8
+
if (!cache) return json('no cache');
9
+
10
+
const existingUsers = await cache.get('meta', 'updatedBlentos');
8
11
9
12
const existingUsersArray: AppBskyActorDefs.ProfileViewDetailed[] = existingUsers
10
13
? JSON.parse(existingUsers)
···
21
24
22
25
const newProfiles = await Promise.all(newProfilesPromises);
23
26
24
-
await platform?.env?.USER_DATA_CACHE.put('updatedBlentos', JSON.stringify(newProfiles));
27
+
await cache.put('meta', 'updatedBlentos', JSON.stringify(newProfiles));
25
28
26
29
return json('ok');
27
30
}
+9
-8
src/routes/api/update/+server.ts
+9
-8
src/routes/api/update/+server.ts
···
1
-
import type { UserCache } from '$lib/types';
1
+
import { createCache } from '$lib/cache';
2
2
import { getCache, loadData } from '$lib/website/load';
3
-
import type { AppBskyActorDefs } from '@atcute/bluesky';
3
+
import { env } from '$env/dynamic/private';
4
4
import { json } from '@sveltejs/kit';
5
+
import type { AppBskyActorDefs } from '@atcute/bluesky';
5
6
6
7
export async function GET({ platform }) {
7
-
if (!platform?.env?.USER_DATA_CACHE) return json('no cache');
8
-
const existingUsers = await platform?.env?.USER_DATA_CACHE?.get('updatedBlentos');
8
+
const cache = createCache(platform);
9
+
if (!cache) return json('no cache');
10
+
11
+
const existingUsers = await cache.get('meta', 'updatedBlentos');
9
12
10
13
const existingUsersArray: AppBskyActorDefs.ProfileViewDetailed[] = existingUsers
11
14
? JSON.parse(existingUsers)
12
15
: [];
13
16
14
17
const existingUsersHandle = existingUsersArray.map((v) => v.handle);
15
-
16
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
17
18
18
19
for (const handle of existingUsersHandle) {
19
20
if (!handle) continue;
20
21
21
22
try {
22
-
const cached = await getCache(handle, 'self', cache as UserCache);
23
-
if (!cached) await loadData(handle, cache as UserCache, true);
23
+
const cached = await getCache(handle, 'self', cache);
24
+
if (!cached) await loadData(handle, cache, true, 'self', env);
24
25
} catch (error) {
25
26
console.error(error);
26
27
return json('error');
+6
-5
src/routes/edit/+page.server.ts
+6
-5
src/routes/edit/+page.server.ts
···
1
1
import { loadData } from '$lib/website/load';
2
2
import { env } from '$env/dynamic/public';
3
-
import type { UserCache } from '$lib/types';
3
+
import { env as privateEnv } from '$env/dynamic/private';
4
+
import { createCache } from '$lib/cache';
4
5
import type { ActorIdentifier } from '@atcute/lexicons';
5
6
6
7
export async function load({ platform, request }) {
···
8
9
9
10
const kv = platform?.env?.CUSTOM_DOMAINS;
10
11
11
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
12
-
const customDomain = request.headers.get('X-Custom-Domain')?.toLocaleLowerCase();
12
+
const cache = createCache(platform);
13
+
const customDomain = request.headers.get('X-Custom-Domain')?.toLowerCase();
13
14
14
15
if (kv && customDomain) {
15
16
try {
16
17
const did = await kv.get(customDomain);
17
18
18
-
if (did) return await loadData(did as ActorIdentifier, cache as UserCache);
19
+
if (did) return await loadData(did as ActorIdentifier, cache, false, 'self', privateEnv);
19
20
} catch (error) {
20
21
console.error('failed to get custom domain kv', error);
21
22
}
22
23
}
23
24
24
-
return await loadData(handle as ActorIdentifier, cache as UserCache);
25
+
return await loadData(handle as ActorIdentifier, cache, false, 'self', privateEnv);
25
26
}
+5
-4
src/routes/p/[[page]]/+layout.server.ts
+5
-4
src/routes/p/[[page]]/+layout.server.ts
···
1
1
import { loadData } from '$lib/website/load';
2
2
import { env } from '$env/dynamic/public';
3
-
import type { UserCache } from '$lib/types';
3
+
import { env as privateEnv } from '$env/dynamic/private';
4
+
import { createCache } from '$lib/cache';
4
5
import type { Did, Handle } from '@atcute/lexicons';
5
6
6
7
export async function load({ params, platform, request }) {
7
-
const cache = platform?.env?.USER_DATA_CACHE as unknown;
8
+
const cache = createCache(platform);
8
9
9
10
const handle = env.PUBLIC_HANDLE;
10
11
···
15
16
if (kv && customDomain) {
16
17
try {
17
18
const did = await kv.get(customDomain);
18
-
return await loadData(did as Did, cache as UserCache, false, params.page);
19
+
return await loadData(did as Did, cache, false, params.page, privateEnv);
19
20
} catch {
20
21
console.error('failed');
21
22
}
22
23
}
23
24
24
-
return await loadData(handle as Handle, cache as UserCache, false, params.page);
25
+
return await loadData(handle as Handle, cache, false, params.page, privateEnv);
25
26
}
-30
src/routes/random/+page.server.ts
-30
src/routes/random/+page.server.ts
···
1
-
import type { UserCache, WebsiteData } from '$lib/types.js';
2
-
import { getCache } from '$lib/website/load.js';
3
-
import { error } from '@sveltejs/kit';
4
-
5
-
export async function load({ platform }) {
6
-
const cache = platform?.env?.USER_DATA_CACHE;
7
-
8
-
const list = await cache?.list();
9
-
10
-
if (!list) {
11
-
throw error(404);
12
-
}
13
-
14
-
let foundData: WebsiteData | undefined = undefined;
15
-
let i = 0;
16
-
17
-
while (!foundData && i < 20) {
18
-
const rando = Math.floor(Math.random() * list.keys.length);
19
-
console.log(list.keys[rando].name);
20
-
21
-
foundData = await getCache(list.keys[rando].name, 'self', cache as unknown as UserCache);
22
-
23
-
if (!foundData?.cards.length) foundData = undefined;
24
-
i++;
25
-
}
26
-
27
-
if (!foundData) throw error(404);
28
-
29
-
return foundData;
30
-
}
-40
src/routes/random/+page.svelte
-40
src/routes/random/+page.svelte
···
1
-
<script lang="ts">
2
-
import Website from '$lib/website/Website.svelte';
3
-
import { Button } from '@foxui/core';
4
-
5
-
let { data } = $props();
6
-
</script>
7
-
8
-
<svelte:body
9
-
onkeydown={(e) => {
10
-
if (e.key === 'ArrowRight' || e.key === 'r') {
11
-
window.location.reload();
12
-
}
13
-
}}
14
-
/>
15
-
16
-
<Website {data} />
17
-
18
-
<Button
19
-
onclick={() => {
20
-
window.location.reload();
21
-
}}
22
-
size="lg"
23
-
class="bg-accent-100 hover:bg-accent-200 dark:bg-accent-950/50 dark:hover:bg-accent-900/50 fixed right-4 bottom-4"
24
-
><svg
25
-
xmlns="http://www.w3.org/2000/svg"
26
-
width="24"
27
-
height="24"
28
-
viewBox="0 0 24 24"
29
-
fill="none"
30
-
stroke="currentColor"
31
-
stroke-width="2"
32
-
stroke-linecap="round"
33
-
stroke-linejoin="round"
34
-
class="lucide lucide-dices-icon lucide-dices"
35
-
><rect width="12" height="12" x="2" y="10" rx="2" ry="2" /><path
36
-
d="m17.92 14 3.5-3.5a2.24 2.24 0 0 0 0-3l-5-4.92a2.24 2.24 0 0 0-3 0L10 6"
37
-
/><path d="M6 18h.01" /><path d="M10 14h.01" /><path d="M15 6h.01" /><path d="M18 9h.01" /></svg
38
-
>Next
39
-
<span class="sr-only">Next random profile</span></Button
40
-
>
-16
src/routes/test/domains/+server.ts
-16
src/routes/test/domains/+server.ts
···
1
-
import { json } from '@sveltejs/kit';
2
-
3
-
export async function GET({ platform }) {
4
-
const kv = platform?.env?.CUSTOM_DOMAINS;
5
-
if (!kv) return json({ error: 'KV not available' }, { status: 500 });
6
-
7
-
const list = await kv.list();
8
-
const entries: Record<string, string> = {};
9
-
10
-
for (const key of list.keys) {
11
-
const value = await kv.get(key.name);
12
-
entries[key.name] = value ?? '';
13
-
}
14
-
15
-
return json(entries);
16
-
}