this repo has no description
imports
+32
-32
+4
-4
src/routes/_chapters/basic.tsx
+4
-4
src/routes/_chapters/basic.tsx
···
8
8
PokedexTableSection,
9
9
} from "~/demos/components/pokedex-table-section";
10
10
import { getPokemonListQueryFn, getPokemonListQueryKey } from "~/demos/query/pokemon-query";
11
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
12
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
11
+
import { getArticle } from "~/articles/article.functions";
12
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
13
13
14
14
const searchParamsSchema = v.object({
15
15
offset: v.optional(v.number(), 0),
···
22
22
},
23
23
validateSearch: searchParamsSchema,
24
24
loader: async () => {
25
-
const { Renderable: Article } = await getStrategyArticle({
25
+
const { Renderable: Article } = await getArticle({
26
26
data: { title: "No prefetching", slug: "basic" },
27
27
});
28
28
return { Article };
···
35
35
const { Article } = Route.useLoaderData();
36
36
37
37
return (
38
-
<BlogTableSplitColumn
38
+
<ChapterSplitColumn
39
39
blog={Article}
40
40
table={
41
41
<ConsoleCard className="mb-6">
+4
-4
src/routes/_chapters/debounced-preload-filters.tsx
+4
-4
src/routes/_chapters/debounced-preload-filters.tsx
···
3
3
import { queryOptions, useQueryClient, useSuspenseQuery } from "@tanstack/react-query";
4
4
import * as v from "valibot";
5
5
import { FilterForm } from "~/demos/components/filter-form";
6
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
6
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
7
7
import { ConsoleCard } from "~/demos/components/console-card";
8
8
import {
9
9
PokedexPagination,
···
14
14
getFilteredPokemonListQueryKey,
15
15
getFilteredPokemonListQueryFn,
16
16
} from "~/demos/query/pokemon-query";
17
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
17
+
import { getArticle } from "~/articles/article.functions";
18
18
19
19
const searchParamsSchema = v.object({
20
20
offset: v.optional(v.number(), 0),
···
49
49
},
50
50
loader: async ({ context }) => {
51
51
void context.queryClient.prefetchQuery(context.pokemonListOptions);
52
-
const { Renderable: Article } = await getStrategyArticle({
52
+
const { Renderable: Article } = await getArticle({
53
53
data: { title: "Debounced filter prefetch", slug: "debounced-preload-filters" },
54
54
});
55
55
return { Article };
···
80
80
);
81
81
82
82
return (
83
-
<BlogTableSplitColumn
83
+
<ChapterSplitColumn
84
84
blog={Article}
85
85
table={
86
86
<>
+4
-4
src/routes/_chapters/filters.tsx
+4
-4
src/routes/_chapters/filters.tsx
···
2
2
import { queryOptions, useSuspenseQuery } from "@tanstack/react-query";
3
3
import * as v from "valibot";
4
4
import { FilterForm } from "~/demos/components/filter-form";
5
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
5
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
6
6
import { ConsoleCard } from "~/demos/components/console-card";
7
7
import {
8
8
PokedexPagination,
···
13
13
getFilteredPokemonListQueryKey,
14
14
getFilteredPokemonListQueryFn,
15
15
} from "~/demos/query/pokemon-query";
16
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
16
+
import { getArticle } from "~/articles/article.functions";
17
17
18
18
const searchParamsSchema = v.object({
19
19
offset: v.optional(v.number(), 0),
···
44
44
},
45
45
loader: async ({ context }) => {
46
46
void context.queryClient.prefetchQuery(context.pokemonListOptions);
47
-
const { Renderable: Article } = await getStrategyArticle({
47
+
const { Renderable: Article } = await getArticle({
48
48
data: { title: "Submitted filter prefetch", slug: "filters" },
49
49
});
50
50
return { Article };
···
58
58
const navigate = Route.useNavigate();
59
59
60
60
return (
61
-
<BlogTableSplitColumn
61
+
<ChapterSplitColumn
62
62
blog={Article}
63
63
table={
64
64
<>
+4
-4
src/routes/_chapters/intent-preloading.tsx
+4
-4
src/routes/_chapters/intent-preloading.tsx
···
1
1
import { createFileRoute, useRouteContext } from "@tanstack/react-router";
2
2
import { queryOptions, useSuspenseQuery } from "@tanstack/react-query";
3
3
import * as v from "valibot";
4
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
4
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
5
5
import { ConsoleCard } from "~/demos/components/console-card";
6
6
import {
7
7
PokedexPagination,
···
9
9
PokedexTableSection,
10
10
} from "~/demos/components/pokedex-table-section";
11
11
import { getPokemonListQueryKey, getPokemonListQueryFn } from "~/demos/query/pokemon-query";
12
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
12
+
import { getArticle } from "~/articles/article.functions";
13
13
14
14
const searchParamsSchema = v.object({
15
15
offset: v.optional(v.number(), 0),
···
38
38
},
39
39
loader: async ({ context }) => {
40
40
void context.queryClient.prefetchQuery(context.pokemonListOptions);
41
-
const { Renderable: Article } = await getStrategyArticle({
41
+
const { Renderable: Article } = await getArticle({
42
42
data: { title: "Hover and focus preloading", slug: "intent-preloading" },
43
43
});
44
44
return { Article };
···
51
51
const { Article } = Route.useLoaderData();
52
52
53
53
return (
54
-
<BlogTableSplitColumn
54
+
<ChapterSplitColumn
55
55
blog={Article}
56
56
table={
57
57
<ConsoleCard className="mb-6">
+4
-4
src/routes/_chapters/live-query-filters.tsx
+4
-4
src/routes/_chapters/live-query-filters.tsx
···
1
1
import { createFileRoute } from "@tanstack/react-router";
2
2
import { useLiveSuspenseQuery, eq, ilike, toArray } from "@tanstack/react-db";
3
3
import * as v from "valibot";
4
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
4
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
5
5
import { ConsoleCard } from "~/demos/components/console-card";
6
6
import { FilterForm } from "~/demos/components/filter-form";
7
7
import {
···
19
19
normalizePokemonNameFilter,
20
20
toPokemonListing,
21
21
} from "~/demos/pokemon-listing/pokemon-listing";
22
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
22
+
import { getArticle } from "~/articles/article.functions";
23
23
24
24
const searchParamsSchema = v.object({
25
25
offset: v.optional(v.number(), 0),
···
34
34
ssr: false,
35
35
validateSearch: searchParamsSchema,
36
36
loader: async () => {
37
-
const { Renderable: Article } = await getStrategyArticle({
37
+
const { Renderable: Article } = await getArticle({
38
38
data: { title: "Reactive filtered data", slug: "live-query-filters" },
39
39
});
40
40
return { Article };
···
48
48
const navigate = Route.useNavigate();
49
49
50
50
return (
51
-
<BlogTableSplitColumn
51
+
<ChapterSplitColumn
52
52
blog={Article}
53
53
table={
54
54
<>
+4
-4
src/routes/_chapters/live-query.tsx
+4
-4
src/routes/_chapters/live-query.tsx
···
1
1
import { createFileRoute } from "@tanstack/react-router";
2
2
import { useLiveSuspenseQuery, eq, toArray } from "@tanstack/react-db";
3
3
import * as v from "valibot";
4
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
4
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
5
5
import { ConsoleCard } from "~/demos/components/console-card";
6
6
import {
7
7
PokedexPagination,
8
8
PokedexTableResults,
9
9
PokedexTableSection,
10
10
} from "~/demos/components/pokedex-table-section";
11
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
11
+
import { getArticle } from "~/articles/article.functions";
12
12
import {
13
13
pokemonCollection,
14
14
typesCollection,
···
31
31
ssr: false,
32
32
validateSearch: searchParamsSchema,
33
33
loader: async () => {
34
-
const { Renderable: Article } = await getStrategyArticle({
34
+
const { Renderable: Article } = await getArticle({
35
35
data: { title: "Synced collection", slug: "live-query" },
36
36
});
37
37
return { Article };
···
44
44
const { Article } = Route.useLoaderData();
45
45
46
46
return (
47
-
<BlogTableSplitColumn
47
+
<ChapterSplitColumn
48
48
blog={Article}
49
49
table={
50
50
<ConsoleCard className="mb-6">
+4
-4
src/routes/_chapters/pagination.tsx
+4
-4
src/routes/_chapters/pagination.tsx
···
1
1
import { createFileRoute, useRouteContext } from "@tanstack/react-router";
2
2
import { queryOptions, useSuspenseQuery } from "@tanstack/react-query";
3
3
import * as v from "valibot";
4
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
4
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
5
5
import { ConsoleCard } from "~/demos/components/console-card";
6
6
import {
7
7
PokedexPagination,
···
9
9
PokedexTableSection,
10
10
} from "~/demos/components/pokedex-table-section";
11
11
import { getPokemonListQueryKey, getPokemonListQueryFn } from "~/demos/query/pokemon-query";
12
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
12
+
import { getArticle } from "~/articles/article.functions";
13
13
14
14
const searchParamsSchema = v.object({
15
15
offset: v.optional(v.number(), 0),
···
38
38
},
39
39
loader: async ({ context }) => {
40
40
void context.queryClient.prefetchQuery(context.pokemonListOptions);
41
-
const { Renderable: Article } = await getStrategyArticle({
41
+
const { Renderable: Article } = await getArticle({
42
42
data: { title: "Viewport pagination preload", slug: "pagination" },
43
43
});
44
44
return { Article };
···
51
51
const { Article } = Route.useLoaderData();
52
52
53
53
return (
54
-
<BlogTableSplitColumn
54
+
<ChapterSplitColumn
55
55
blog={Article}
56
56
table={
57
57
<ConsoleCard className="mb-6">
+4
-4
src/routes/_chapters/preloading.tsx
+4
-4
src/routes/_chapters/preloading.tsx
···
1
1
import { createFileRoute, useRouteContext } from "@tanstack/react-router";
2
2
import { queryOptions, useSuspenseQuery } from "@tanstack/react-query";
3
3
import * as v from "valibot";
4
-
import { BlogTableSplitColumn } from "~/chapters/chapter-split";
4
+
import { ChapterSplitColumn } from "~/chapters/chapter-split";
5
5
import { ConsoleCard } from "~/demos/components/console-card";
6
6
import {
7
7
PokedexPagination,
···
9
9
PokedexTableSection,
10
10
} from "~/demos/components/pokedex-table-section";
11
11
import { getPokemonListQueryKey, getPokemonListQueryFn } from "~/demos/query/pokemon-query";
12
-
import { getStrategyArticle } from "~/articles/strategy-article.functions";
12
+
import { getArticle } from "~/articles/article.functions";
13
13
14
14
const searchParamsSchema = v.object({
15
15
offset: v.optional(v.number(), 0),
···
38
38
},
39
39
loader: async ({ context }) => {
40
40
void context.queryClient.prefetchQuery(context.pokemonListOptions);
41
-
const { Renderable: Article } = await getStrategyArticle({
41
+
const { Renderable: Article } = await getArticle({
42
42
data: { title: "Route-level prefetch", slug: "preloading" },
43
43
});
44
44
return { Article };
···
51
51
const { Article } = Route.useLoaderData();
52
52
53
53
return (
54
-
<BlogTableSplitColumn
54
+
<ChapterSplitColumn
55
55
blog={Article}
56
56
table={
57
57
<ConsoleCard className="mb-6">