Skip to content

Commit fa79d22

Browse files
committed
remove some deprecated things
1 parent 0d80cf5 commit fa79d22

File tree

9 files changed

+87
-129
lines changed

9 files changed

+87
-129
lines changed

src/lib/components/downloads-chart/downloads-chart.svelte

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
42
import { map, max } from 'lodash-es';
53
import ChartLine from './chart-line.svelte';
64
import ChartTooltip from './chart-point-info.svelte';
@@ -77,7 +75,7 @@
7775
updatePointer(rect.width / 2, rect.height / 2, rect.width);
7876
};
7977
80-
run(() => {
78+
$effect(() => {
8179
hoveredPointCompare = comparePoints[0];
8280
});
8381
</script>

src/lib/components/mod-grid/mod-card-image.svelte

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
42
import type { Mod } from '$lib/helpers/api/get-mod-list';
53
import TagToggle from '../tag-toggle.svelte';
64
import ModImage from './mod-image.svelte';
@@ -12,11 +10,6 @@
1210
}
1311
1412
let { mod, lazy = false, hover = false }: Props = $props();
15-
16-
let imageSrc = $state(mod.openGraphImageUrl);
17-
run(() => {
18-
imageSrc = hover ? mod.imageUrl : mod.openGraphImageUrl;
19-
});
2013
</script>
2114

2215
<a href={`/mods/${mod.slug}/`} class="bg-black aspect-thumbnai relative">

src/lib/components/mod-grid/mod-grid.svelte

Lines changed: 58 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@
55
</script>
66

77
<script lang="ts">
8-
import { run } from 'svelte/legacy';
9-
10-
import { page } from '$app/stores';
118
import { goto } from '$app/navigation';
129
import ModCard from '$lib/components/mod-grid/mod-card.svelte';
1310
import {
@@ -17,12 +14,13 @@
1714
isSortOrderId,
1815
sortOrderParamName,
1916
} from '$lib/helpers/mod-sorting';
20-
import { onMount } from 'svelte';
2117
import TagsSelector from '../tags-selector.svelte';
2218
import { modTagParamName } from '$lib/helpers/get-mod-tags';
2319
import { modExcludeTagParamName } from '$lib/helpers/get-mod-tags';
2420
import type { Mod } from '$lib/helpers/api/get-mod-list';
2521
import CheckboxInput from '../checkbox-input.svelte';
22+
import { page } from '$app/state';
23+
import { onMount } from 'svelte';
2624
2725
interface Props {
2826
mods?: Mod[];
@@ -44,9 +42,40 @@
4442
4543
let selectedSortOrderId: SortOrderId = $state(defaultSortOrder);
4644
let filter = $state('');
47-
let filteredMods: Mod[] = $state(mods);
45+
46+
const anyIncludes = (term: string, list: (string | undefined)[]) => {
47+
if (!term) return true;
48+
49+
for (const listItem of list) {
50+
if (!listItem) continue;
51+
52+
if (cleanUpText(listItem).includes(cleanUpText(term))) return true;
53+
}
54+
return false;
55+
};
56+
57+
const filteredMods = $derived(
58+
sortModList(mods, selectedSortOrderId).filter((mod: Mod) => {
59+
const containsBlockedTag = mod.tags.findIndex((tag) => tagBlockList.includes(tag)) != -1;
60+
const containsAllowedTag =
61+
tagAllowList.length == 0 || mod.tags.findIndex((tag) => tagAllowList.includes(tag)) != -1;
62+
63+
return (
64+
containsAllowedTag &&
65+
!containsBlockedTag &&
66+
anyIncludes(filter, [
67+
mod.author,
68+
mod.description,
69+
mod.name,
70+
mod.repo,
71+
mod.uniqueName,
72+
mod.authorDisplay,
73+
...mod.tags,
74+
])
75+
);
76+
})
77+
);
4878
let tagStates: TagStates = $state({});
49-
let selectedTagCount = $state(0);
5079
let showDetails = $state(false);
5180
5281
const tags = $derived(
@@ -57,7 +86,7 @@
5786
if (isSortOrderId(sortOrderId)) {
5887
selectedSortOrderId = sortOrderId;
5988
60-
const url = new URL($page.url);
89+
const url = new URL(page.url);
6190
url.searchParams.set(sortOrderParamName, sortOrderId);
6291
goto(url.href);
6392
}
@@ -70,17 +99,6 @@
7099
.normalize('NFD') // Decompose combined graphemes (è => e + ̀)
71100
.replace(/[\u0300-\u036f]/g, ''); // Remove the diacritic part (è => e)
72101
73-
const anyIncludes = (term: string, list: (string | undefined)[]) => {
74-
if (!term) return true;
75-
76-
for (const listItem of list) {
77-
if (!listItem) continue;
78-
79-
if (cleanUpText(listItem).includes(cleanUpText(term))) return true;
80-
}
81-
return false;
82-
};
83-
84102
const onToggleTag = (tag: string) => {
85103
let toggledTag = tagStates[tag];
86104
@@ -102,7 +120,7 @@
102120
tagAllowList = [];
103121
tagBlockList = [];
104122
105-
const url = new URL($page.url);
123+
const url = new URL(page.url);
106124
url.searchParams.delete(modTagParamName);
107125
url.searchParams.delete(modExcludeTagParamName);
108126
for (const [tagName, tagValue] of Object.entries(tagStates)) {
@@ -118,59 +136,31 @@
118136
};
119137
120138
const onClearTags = () => {
121-
const url = new URL($page.url);
139+
const url = new URL(page.url);
122140
url.searchParams.delete(modTagParamName);
123141
url.searchParams.delete(modExcludeTagParamName);
124142
goto(url.href);
125143
};
126144
127-
run(() => {
128-
if (!import.meta.env.SSR) {
129-
const sortOrderParam = $page.url.searchParams.get(sortOrderParamName) || '';
130-
if (isSortOrderId(sortOrderParam)) {
131-
selectedSortOrderId = sortOrderParam;
132-
}
133-
134-
tagStates = {};
135-
tagAllowList = [];
136-
tagBlockList = [];
137-
const tagParams = $page.url.searchParams.getAll(modTagParamName);
138-
for (const tagParam of tagParams) {
139-
tagStates[tagParam] = 'included';
140-
tagAllowList.push(tagParam);
141-
}
142-
const excludedTagParams = $page.url.searchParams.getAll(modExcludeTagParamName);
143-
for (const tagParam of excludedTagParams) {
144-
tagStates[tagParam] = 'excluded';
145-
tagBlockList.push(tagParam);
146-
}
145+
onMount(() => {
146+
const sortOrderParam = page.url.searchParams.get(sortOrderParamName) || '';
147+
if (isSortOrderId(sortOrderParam)) {
148+
selectedSortOrderId = sortOrderParam;
147149
}
148-
});
149-
run(() => {
150-
const filterMod = (mod: Mod) => {
151-
const containsBlockedTag = mod.tags.findIndex((tag) => tagBlockList.includes(tag)) != -1;
152-
const containsAllowedTag =
153-
tagAllowList.length == 0 || mod.tags.findIndex((tag) => tagAllowList.includes(tag)) != -1;
154150
155-
return (
156-
containsAllowedTag &&
157-
!containsBlockedTag &&
158-
anyIncludes(filter, [
159-
mod.author,
160-
mod.description,
161-
mod.name,
162-
mod.repo,
163-
mod.uniqueName,
164-
mod.authorDisplay,
165-
...mod.tags,
166-
])
167-
);
168-
};
169-
170-
filteredMods = sortModList(mods, selectedSortOrderId).filter(filterMod);
171-
});
172-
run(() => {
173-
selectedTagCount = tags.filter((tag) => tagStates[tag]).length;
151+
tagStates = {};
152+
tagAllowList = [];
153+
tagBlockList = [];
154+
const tagParams = page.url.searchParams.getAll(modTagParamName);
155+
for (const tagParam of tagParams) {
156+
tagStates[tagParam] = 'included';
157+
tagAllowList.push(tagParam);
158+
}
159+
const excludedTagParams = page.url.searchParams.getAll(modExcludeTagParamName);
160+
for (const tagParam of excludedTagParams) {
161+
tagStates[tagParam] = 'excluded';
162+
tagBlockList.push(tagParam);
163+
}
174164
});
175165
176166
function getHideDlc(): boolean {
@@ -197,7 +187,9 @@
197187
Sort by: {sortOrders[selectedSortOrderId].title}
198188
</option>
199189
{#each Object.entries(sortOrders) as [sortOrderId, sortOrder]}
200-
<option value={sortOrderId}>{sortOrder.title}</option>
190+
{#if sortOrderId !== selectedSortOrderId}
191+
<option value={sortOrderId}>{sortOrder.title}</option>
192+
{/if}
201193
{/each}
202194
</select>
203195
<div class="relative flex">

src/lib/components/mod-grid/mod-image.svelte

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
42
import type { Mod } from '$lib/helpers/api/get-mod-list';
53
import { listedImageSize } from '$lib/helpers/constants';
64
import { getHueFromText } from '$lib/helpers/get-hue-from-name';
@@ -12,17 +10,9 @@
1210
smallText?: boolean;
1311
}
1412
15-
let {
16-
mod,
17-
lazy = false,
18-
hover = false,
19-
smallText = false
20-
}: Props = $props();
13+
let { mod, lazy = false, hover = false, smallText = false }: Props = $props();
2114
22-
let imageSrc = $state(mod.openGraphImageUrl);
23-
run(() => {
24-
imageSrc = hover ? mod.imageUrl : mod.openGraphImageUrl;
25-
});
15+
const imageSrc = $derived(hover ? mod.imageUrl : mod.openGraphImageUrl);
2616
</script>
2717

2818
<div class="relative aspect-thumbnail">

src/lib/components/navigation/navigation-link.svelte

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
4-
import { page, navigating } from '$app/stores';
2+
import { navigating, page } from '$app/state';
53
64
interface Props {
75
href: string;
@@ -10,18 +8,14 @@
108
children?: import('svelte').Snippet;
119
}
1210
13-
let {
14-
href,
15-
exact = false,
16-
label = '',
17-
children
18-
}: Props = $props();
19-
let isActive = $state(false);
20-
run(() => {
21-
const url = $navigating?.to?.url ?? $page.url;
22-
const pathName: string = url.pathname;
23-
isActive = exact ? pathName === href : pathName.startsWith(href);
24-
});
11+
let { href, exact = false, label = '', children }: Props = $props();
12+
const isActive = $derived(
13+
(() => {
14+
const url = navigating.to?.url ?? page.url;
15+
const pathName: string = url.pathname;
16+
return exact ? pathName === href : pathName.startsWith(href);
17+
})()
18+
);
2519
</script>
2620

2721
<a

src/routes/+layout.svelte

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,21 +5,21 @@
55
import '../styles/components.css';
66
import '../styles/utilities.css';
77
import '../styles/app.css';
8-
import { page, navigating } from '$app/stores';
98
import { onMount } from 'svelte';
109
import { goto } from '$app/navigation';
1110
import { linkedFromNotificationParamName } from '$lib/helpers/constants';
1211
import ModInstallDialog from '$lib/components/mod-install-dialog.svelte';
1312
import Analytics from '$lib/components/analytics.svelte';
13+
import { navigating, page } from '$app/state';
1414
interface Props {
1515
children?: import('svelte').Snippet;
1616
}
1717
1818
let { children }: Props = $props();
1919
2020
onMount(() => {
21-
if ($page.status == 200 && $page.url.searchParams.has(linkedFromNotificationParamName)) {
22-
const url = new URL($page.url);
21+
if (page.status == 200 && page.url.searchParams.has(linkedFromNotificationParamName)) {
22+
const url = new URL(page.url);
2323
url.searchParams.delete(linkedFromNotificationParamName);
2424
goto(url.href);
2525
}
@@ -31,13 +31,13 @@
3131
<Header />
3232
<main class="bg-background overflow-hidden highlight" data-sveltekit-preload-data="hover">
3333
<span
34-
class:opacity-20={$navigating}
35-
class:pointer-events-none={$navigating}
34+
class:opacity-20={navigating.to}
35+
class:pointer-events-none={navigating.to}
3636
class="transition-opacity"
3737
>
3838
<!-- Using the pathname as a key forces components to remount on navigating.
3939
This prevents bugs where page content lingers when navigating between two routes that point to the same page component. -->
40-
{#key $page.url.pathname}
40+
{#key page.url.pathname}
4141
{@render children?.()}
4242
{/key}
4343
</span>

src/routes/history/+page.svelte

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
42
import { getModList, type Mod } from '$lib/helpers/api/get-mod-list';
53
import { sortBy } from 'lodash-es';
64
import { onMount } from 'svelte';
@@ -287,13 +285,13 @@
287285
let selectNextEvent = $derived(() => {
288286
selectEvent(selectedEventImmediate < events.length - 1 ? selectedEventImmediate + 1 : 0);
289287
});
290-
run(() => {
288+
$effect(() => {
291289
(async () => {
292290
if (mods.length > 0) return;
293291
mods = sortBy(await getModList(), 'firstReleaseDate');
294292
})();
295293
});
296-
run(() => {
294+
$effect(() => {
297295
if (scale !== previousScale) {
298296
previousScale = scale;
299297
scrollTo(selectedEventImmediate, true);

src/routes/jam/jul-2025/+page.svelte

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script lang="ts">
2-
import { run } from 'svelte/legacy';
3-
42
import DiscordLink from '$lib/components/discord-link.svelte';
53
import PageContainer from '$lib/components/page-container.svelte';
64
import PageSection from '$lib/components/page-section/page-section.svelte';
@@ -135,13 +133,11 @@
135133
136134
let hasEntries = jamMods.length > 0;
137135
138-
let jamRootMods: Mod[] = $state([]);
139-
140-
run(() => {
141-
jamRootMods = modList.filter((otherMod) =>
136+
let jamRootMods = $derived(
137+
modList.filter((otherMod) =>
142138
['xen42.ModJam5Part1', 'xen42.ModJam5Part2'].includes(otherMod.uniqueName)
143-
);
144-
});
139+
)
140+
);
145141
146142
const firstPlaceMod = jamMods.find((mod) => mod.uniqueName === 'GameWyrm.HearthsNeighbor2');
147143
const secondPlaceMod = jamMods.find((mod) => mod.uniqueName === 'TeamErnesto.OWJam3ModProject');

0 commit comments

Comments
 (0)