diff --git a/packages/i18n/strings/en.json b/packages/i18n/strings/en.json
index be88518f9..edb890560 100644
--- a/packages/i18n/strings/en.json
+++ b/packages/i18n/strings/en.json
@@ -863,7 +863,7 @@
"reset": "Reset",
"shuffle": "Shuffle",
"remove": "Remove played",
- "tracking": "BlitzKit is tracking your playlist",
+ "tracking": "BlitzKit is tracking your battles",
"sort": {
"button": "Sort by",
@@ -881,7 +881,6 @@
"wins": "Wins"
},
- "no_login_warning": "You are not logged in. BlitzKit will not keep track of your played tanks.",
"generate": "Generate playlist",
"name": "Playlist",
"description": "Tank playlist generator",
diff --git a/packages/website/src/components/PlaylistGenerator.tsx b/packages/website/src/components/PlaylistGenerator.tsx
index 8a7260079..c4c279102 100644
--- a/packages/website/src/components/PlaylistGenerator.tsx
+++ b/packages/website/src/components/PlaylistGenerator.tsx
@@ -1,7 +1,6 @@
import { fisherYates, tankIcon } from "@blitzkit/core";
import { literals } from "@blitzkit/i18n";
-import { ExclamationTriangleIcon } from "@radix-ui/react-icons";
-import { Box, Button, Flex, Grid, Text } from "@radix-ui/themes";
+import { Box, Button, Flex, Grid, Skeleton, Text } from "@radix-ui/themes";
import { useMemo } from "react";
import usePromise from "react-promise-suspense";
import { awaitableTankDefinitions } from "../core/awaitables/tankDefinitions";
@@ -10,6 +9,7 @@ import { generatePlaylist } from "../core/blitzkit/generatePlaylist";
import { useLocale } from "../hooks/useLocale";
import { App } from "../stores/app";
import { TankFilters } from "../stores/tankFilters";
+import type { MaybeSkeletonComponentProps } from "../types/maybeSkeletonComponentProps";
import { LinkI18n } from "./LinkI18n";
import { FilterControl } from "./TankSearch/components/FilterControl";
@@ -17,7 +17,7 @@ const tankDefinitions = await awaitableTankDefinitions;
const POOL_HEIGHT = "16rem";
-export function PlaylistGenerator() {
+export function PlaylistGenerator({ skeleton }: MaybeSkeletonComponentProps) {
const { strings, locale } = useLocale();
const wargaming = App.use((state) => state.logins.wargaming);
const filters = TankFilters.use();
@@ -47,15 +47,6 @@ export function PlaylistGenerator() {
-
- {!wargaming && (
-
-
-
- {strings.website.tools.playlist.no_login_warning}
-
-
- )}
- {tanksTrimmed.map((tank) => (
-
- ))}
+ {tanksTrimmed.map((tank) =>
+ skeleton ? (
+
+
+
+ ) : (
+
+ )
+ )}
state.list !== undefined);
- const wargaming = App.use((state) => state.logins.wargaming);
- useEffect(() => {
- if (wargaming) {
- TankFilters.mutate((draft) => {
- draft.ownership = "owned";
- });
- }
- }, []);
+ if (App.state.logins.wargaming) TankFilters.state.ownership = "owned";
return (
- {!generated && }
+ {!generated && }
{generated && }