aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Tools/Wrapped/Top/Activity.svelte
blob: a000389c3e5e5bb4f92ee5b4a415e98ee494c2cd (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<script lang="ts">
	import type { ActivityHistoryEntry } from '$lib/AniList/activity';
	import type { UserIdentity } from '$lib/AniList/identity';
	import type { Wrapped } from '$lib/AniList/wrapped';
	import proxy from '$lib/Utility/proxy';

	export let wrapped: Wrapped;
	export let identity: UserIdentity;
	export let year: number;
	export let activities: ActivityHistoryEntry[];
	export let useFullActivityHistory: boolean;
	export let updateWidth: () => void;

	const currentYear = new Date(Date.now()).getFullYear();
</script>

<div class="grid-item image-grid avatar-grid category top-category">
	<a href={`https://anilist.co/user/${identity.name}`} target="_blank">
		<img src={proxy(wrapped.avatar.large)} alt="User Avatar" on:load={updateWidth} />
	</a>
	<div>
		<div>
			<a href={`https://anilist.co/user/${identity.name}`} target="_blank">
				<b>
					{identity.name}
				</b>
			</a>
		</div>
		<div>
			Status Posts: {wrapped.activities.statusCount}
		</div>
		<div>
			Messages: {wrapped.activities.messageCount}
		</div>
		<div>
			Days Active: {#if year !== currentYear}
				?/365
			{:else}
				{activities.length}/{useFullActivityHistory ? 365 : 189}
			{/if}
		</div>
	</div>
</div>