Skip to content

Commit 86894e0

Browse files
WarningImHack3rWarningImHack3r
committed
Remove $derived's for data, likely fix long-standing issue, adding missing Tooltip.Provider, fix boolean, finally dedupe badges
Would have been a perfect commit if I didn't get rate-limited
1 parent 0925fd4 commit 86894e0

File tree

5 files changed

+167
-198
lines changed

5 files changed

+167
-198
lines changed

‎src/lib/octokit.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { tokenKey } from "./types";
1313
*/
1414
export function getOctokit() {
1515
// TODO: Invert the condition to make the logged in token take precedence over the environment token
16-
const hasTokenInDev = dev && env.PUBLIC_GITHUB_TOKEN;
16+
const hasTokenInDev = dev && !!env.PUBLIC_GITHUB_TOKEN;
1717
const octokit = new Octokit(
1818
hasTokenInDev
1919
? {

‎src/routes/+layout.svelte‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@
2929
const tabState = getTabState();
3030
3131
let { data, children } = $props();
32-
let { repos } = $derived(data);
3332
3433
let scrollY = $state(0);
3534
@@ -156,7 +155,7 @@
156155
{#if scrollY > 150 && $page.route.id === "/"}
157156
<ul transition:fade={{ duration: 200 }} class="ml-6 hidden sm:block">
158157
<li>
159-
{#each typedEntries(repos) as [id, { name }]}
158+
{#each typedEntries(data.repos) as [id, { name }]}
160159
<Button
161160
variant="ghost"
162161
class="hover:bg-accent/75"

‎src/routes/+page.svelte‎

Lines changed: 115 additions & 152 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@
2929
import { decodeBase64, scrollToAsync, toRelativeDateString, typedEntries } from "$lib/util";
3030
3131
let { data } = $props();
32-
let { repos } = $derived(data);
3332
3433
const octokit = getOctokit();
3534
@@ -83,7 +82,7 @@
8382
return Promise.resolve(cachedResponses[category]);
8483
}
8584
return Promise.all(
86-
repos[category].repos.map(
85+
data.repos[category].repos.map(
8786
async (
8887
{ changesMode, repoName, dataFilter, versionFromTag, changelogContentsReplacer },
8988
repoIndex
@@ -210,7 +209,7 @@
210209
let previousTab: Tab = "svelte";
211210
let visitedTabs = $state<Tab[]>([]);
212211
let loadedTabs = $state<Tab[]>([]);
213-
let isLoadingDone = $derived(loadedTabs.length === Object.keys(repos).length);
212+
let isLoadingDone = $derived(loadedTabs.length === Object.keys(data.repos).length);
214213
const lastVisitKey = "lastVisit" as const;
215214
let lastVisitDateString = $state("");
216215
@@ -237,7 +236,7 @@
237236
</script>
238237

239238
<MetaTags
240-
title={repos[currentTab].name}
239+
title={data.repos[currentTab].name}
241240
titleTemplate="%s | Svelte Changelog"
242241
description="A nice UI to stay up-to-date with Svelte releases"
243242
canonical={PROD_URL}
@@ -267,15 +266,15 @@
267266

268267
<div class="container py-8">
269268
<h2 class="text-3xl font-bold">
270-
<span class="text-primary">{repos[currentTab].name}</span>
269+
<span class="text-primary">{data.repos[currentTab].name}</span>
271270
Releases
272271
</h2>
273272
<Tabs.Root bind:value={currentTab} class="mt-8" onValueChange={onTabChange}>
274273
<div
275274
class="flex flex-col items-start gap-4 xs:flex-row xs:items-center xs:justify-between xs:gap-0"
276275
>
277276
<Tabs.List class="bg-input dark:bg-muted">
278-
{#each typedEntries(repos) as [id, { name }]}
277+
{#each typedEntries(data.repos) as [id, { name }]}
279278
<BlinkingBadge
280279
storedDateItem="{id}MostRecentUpdate"
281280
show={!visitedTabs.includes(id) && id !== currentTab}
@@ -315,12 +314,12 @@
315314
for="beta-releases-{currentTab}"
316315
class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
317316
>
318-
Show {repos[currentTab].name} prereleases
317+
Show {data.repos[currentTab].name} prereleases
319318
</Label>
320319
</div>
321320
</div>
322321
<!-- Tabs content creation -->
323-
{#each typedEntries(repos) as [id, { name, repos: repoList }]}
322+
{#each typedEntries(data.repos) as [id, { name, repos: repoList }]}
324323
<Tabs.Content value={id}>
325324
<!-- Fetch releases from GitHub -->
326325
{#await fetchReleases(id)}
@@ -340,12 +339,13 @@
340339
<!-- eslint-disable-next-line @typescript-eslint/no-unused-vars -->
341340
{@const _ = (() => {
342341
// Cache the response
343-
cachedResponses[id] = releases;
342+
// TODO: restore with refactor
343+
// cachedResponses[id] = releases;
344344

345345
// Add tab to loaded tabs
346-
const toSet = new Set(loadedTabs);
347-
toSet.add(id);
348-
loadedTabs = [...toSet];
346+
// const toSet = new Set(loadedTabs);
347+
// toSet.add(id);
348+
// loadedTabs = [...toSet];
349349

350350
// Update the most recent date of a release of the list
351351
const latestRelease = releases.sort(
@@ -561,6 +561,69 @@
561561
}
562562
);
563563
})()}
564+
565+
{#snippet badges()}
566+
{#if isLatestRelease}
567+
<Tooltip.Provider>
568+
<Tooltip.Root delayDuration={300}>
569+
<Tooltip.Trigger>
570+
<Badge
571+
class="bg-green-600 hover:bg-green-600 dark:bg-green-700 dark:hover:bg-green-700"
572+
>
573+
Latest
574+
</Badge>
575+
</Tooltip.Trigger>
576+
<Tooltip.Content>
577+
{#if id === "others"}
578+
This is a latest stable release
579+
{:else}
580+
This is the latest stable release of {name}
581+
{/if}
582+
</Tooltip.Content>
583+
</Tooltip.Root>
584+
</Tooltip.Provider>
585+
{/if}
586+
{#if isMajorRelease}
587+
<Tooltip.Provider>
588+
<Tooltip.Root delayDuration={300}>
589+
<Tooltip.Trigger>
590+
<Badge>Major</Badge>
591+
</Tooltip.Trigger>
592+
<Tooltip.Content>Major update (e.g.: 1.0.0, 2.0.0, 3.0.0...)</Tooltip.Content>
593+
</Tooltip.Root>
594+
</Tooltip.Provider>
595+
{:else if release.prerelease}
596+
<Tooltip.Provider>
597+
<Tooltip.Root delayDuration={300}>
598+
<Tooltip.Trigger>
599+
<Badge variant="outline" class="border-primary text-primary">
600+
Prerelease
601+
</Badge>
602+
</Tooltip.Trigger>
603+
<Tooltip.Content>
604+
This version is an alpha or a beta, unstable version{id === "others"
605+
? ""
606+
: ` of ${name}`}
607+
</Tooltip.Content>
608+
</Tooltip.Root>
609+
</Tooltip.Provider>
610+
{:else if isMaintenanceRelease}
611+
<Tooltip.Provider>
612+
<Tooltip.Root delayDuration={300}>
613+
<Tooltip.Trigger>
614+
<Badge variant="outline" class="border-blue-600 text-blue-600">
615+
Maintenance
616+
</Badge>
617+
</Tooltip.Trigger>
618+
<Tooltip.Content>
619+
An update bringing bug fixes and minor improvements to an older major
620+
version
621+
</Tooltip.Content>
622+
</Tooltip.Root>
623+
</Tooltip.Provider>
624+
{/if}
625+
{/snippet}
626+
564627
<Accordion.Item
565628
value={release.id.toString()}
566629
class={isMajorRelease && id !== "others" && index < 3
@@ -586,29 +649,31 @@
586649
{@const newReleaseMajor = releaseRepo
587650
?.versionFromTag(release.tag_name)
588651
?.split(".")[0]}
589-
<Tooltip.Root delayDuration={300}>
590-
<Tooltip.Trigger>
591-
{#if index === 0 && currentTab === id}
592-
<div
593-
class="mx-auto"
594-
use:confetti={{
595-
duration: 5000,
596-
colors: ["orange", "white"]
597-
}}
598-
></div>
599-
{/if}
600-
<span class="majorGradient text-left text-xl">
601-
{releaseName}
602-
</span>
603-
</Tooltip.Trigger>
604-
<Tooltip.Content>
605-
{#if newReleaseMajor}
606-
{name} {newReleaseMajor} is available!
607-
{:else}
608-
A new major of {name} is available!
609-
{/if}
610-
</Tooltip.Content>
611-
</Tooltip.Root>
652+
<Tooltip.Provider>
653+
<Tooltip.Root delayDuration={300}>
654+
<Tooltip.Trigger>
655+
{#if index === 0 && currentTab === id}
656+
<div
657+
class="mx-auto"
658+
use:confetti={{
659+
duration: 5000,
660+
colors: ["orange", "white"]
661+
}}
662+
></div>
663+
{/if}
664+
<span class="majorGradient text-left text-xl">
665+
{releaseName}
666+
</span>
667+
</Tooltip.Trigger>
668+
<Tooltip.Content>
669+
{#if newReleaseMajor}
670+
{name} {newReleaseMajor} is available!
671+
{:else}
672+
A new major of {name} is available!
673+
{/if}
674+
</Tooltip.Content>
675+
</Tooltip.Root>
676+
</Tooltip.Provider>
612677
{:else}
613678
<span class="flex flex-col text-left">
614679
<span class="text-lg group-hover:underline">{releaseName}</span>
@@ -620,135 +685,33 @@
620685
</span>
621686
{/if}
622687
<div class="flex items-center gap-2 xs:hidden">
623-
{#if isLatestRelease}
624-
<Tooltip.Root delayDuration={300}>
625-
<Tooltip.Trigger>
626-
<Badge
627-
class="bg-green-600 hover:bg-green-600 dark:bg-green-700 dark:hover:bg-green-700"
628-
>
629-
Latest
630-
</Badge>
631-
</Tooltip.Trigger>
632-
<Tooltip.Content>
633-
{#if id === "others"}
634-
This is a latest stable release
635-
{:else}
636-
This is the latest stable release of {name}
637-
{/if}
638-
</Tooltip.Content>
639-
</Tooltip.Root>
640-
{/if}
641-
{#if isMajorRelease}
642-
<Tooltip.Root delayDuration={300}>
643-
<Tooltip.Trigger>
644-
<Badge>Major</Badge>
645-
</Tooltip.Trigger>
646-
<Tooltip.Content>
647-
Major update (e.g.: 1.0.0, 2.0.0, 3.0.0...)
648-
</Tooltip.Content>
649-
</Tooltip.Root>
650-
{:else if release.prerelease}
651-
<Tooltip.Root delayDuration={300}>
652-
<Tooltip.Trigger>
653-
<Badge variant="outline" class="border-primary text-primary">
654-
Prerelease
655-
</Badge>
656-
</Tooltip.Trigger>
657-
<Tooltip.Content>
658-
This version is an alpha or a beta, unstable version{id === "others"
659-
? ""
660-
: ` of ${name}`}
661-
</Tooltip.Content>
662-
</Tooltip.Root>
663-
{:else if isMaintenanceRelease}
664-
<Tooltip.Root delayDuration={300}>
665-
<Tooltip.Trigger>
666-
<Badge variant="outline" class="border-blue-600 text-blue-600">
667-
Maintenance
668-
</Badge>
669-
</Tooltip.Trigger>
670-
<Tooltip.Content>
671-
An update bringing bug fixes and minor improvements to an older major
672-
version
673-
</Tooltip.Content>
674-
</Tooltip.Root>
675-
{/if}
688+
{@render badges()}
676689
</div>
677690
</div>
678691
<span
679692
class="ml-auto mr-4 flex text-right text-sm text-muted-foreground xs:ml-0 xs:mr-2"
680693
>
681694
<span class="mr-1 hidden xs:block">•</span>
682-
<Tooltip.Root delayDuration={300}>
683-
<Tooltip.Trigger>
684-
{isOlderThanAWeek
685-
? releaseDate.toLocaleDateString("en")
686-
: toRelativeDateString(releaseDate)}
687-
</Tooltip.Trigger>
688-
<Tooltip.Content>
689-
{isOlderThanAWeek
690-
? toRelativeDateString(releaseDate)
691-
: new Intl.DateTimeFormat("en", {
692-
dateStyle: "medium",
693-
timeStyle: "short"
694-
}).format(releaseDate)}
695-
</Tooltip.Content>
696-
</Tooltip.Root>
697-
</span>
698-
<div class="hidden items-center gap-2 xs:flex">
699-
{#if isLatestRelease}
695+
<Tooltip.Provider>
700696
<Tooltip.Root delayDuration={300}>
701697
<Tooltip.Trigger>
702-
<Badge
703-
class="bg-green-600 hover:bg-green-600 dark:bg-green-700 dark:hover:bg-green-700"
704-
>
705-
Latest
706-
</Badge>
698+
{isOlderThanAWeek
699+
? releaseDate.toLocaleDateString("en")
700+
: toRelativeDateString(releaseDate)}
707701
</Tooltip.Trigger>
708702
<Tooltip.Content>
709-
{#if id === "others"}
710-
This is a latest stable release
711-
{:else}
712-
This is the latest stable release of {name}
713-
{/if}
703+
{isOlderThanAWeek
704+
? toRelativeDateString(releaseDate)
705+
: new Intl.DateTimeFormat("en", {
706+
dateStyle: "medium",
707+
timeStyle: "short"
708+
}).format(releaseDate)}
714709
</Tooltip.Content>
715710
</Tooltip.Root>
716-
{/if}
717-
{#if isMajorRelease}
718-
<Tooltip.Root delayDuration={300}>
719-
<Tooltip.Trigger>
720-
<Badge>Major</Badge>
721-
</Tooltip.Trigger>
722-
<Tooltip.Content>
723-
Major update (e.g.: 1.0.0, 2.0.0, 3.0.0...)
724-
</Tooltip.Content>
725-
</Tooltip.Root>
726-
{:else if release.prerelease}
727-
<Tooltip.Root delayDuration={300}>
728-
<Tooltip.Trigger>
729-
<Badge variant="outline" class="border-primary text-primary">
730-
Prerelease
731-
</Badge>
732-
</Tooltip.Trigger>
733-
<Tooltip.Content>
734-
This version is an alpha or a beta, unstable version{id === "others"
735-
? ""
736-
: ` of ${name}`}
737-
</Tooltip.Content>
738-
</Tooltip.Root>
739-
{:else if isMaintenanceRelease}
740-
<Tooltip.Root delayDuration={300}>
741-
<Tooltip.Trigger>
742-
<Badge variant="outline" class="border-blue-600 text-blue-600">
743-
Maintenance
744-
</Badge>
745-
</Tooltip.Trigger>
746-
<Tooltip.Content>
747-
An update bringing bug fixes and minor improvements to an older major
748-
version
749-
</Tooltip.Content>
750-
</Tooltip.Root>
751-
{/if}
711+
</Tooltip.Provider>
712+
</span>
713+
<div class="hidden items-center gap-2 xs:flex">
714+
{@render badges()}
752715
</div>
753716
</div>
754717
</Accordion.Trigger>

0 commit comments

Comments
 (0)