<script lang="ts">
import type { ActivityHistoryEntry } from "$lib/Data/AniList/activity";
import type { AniListAuthorisation } from "$lib/Data/AniList/identity";
import ActivityHistoryGrid from "../ActivityHistory/Grid.svelte";

export let user: AniListAuthorisation;
export let activities: ActivityHistoryEntry[];
export let year: number;
export let activityHistoryPosition: "TOP" | "BELOW_TOP" | "ORIGINAL";
</script>

<div
  class="categories-grid"
  style={`padding-${activityHistoryPosition === 'ORIGINAL' ? 'top' : 'bottom'}: 0;`}
>
  <div class="category-grid bottom-category pure-category category">
    <div id="activity-history">
      <ActivityHistoryGrid {user} activityData={activities} currentYear={year} />
    </div>
  </div>
</div>
