this repo has no description
blegh it works lol
+18
-80
+6
-23
src/routes/intent-preloading.tsx
+6
-23
src/routes/intent-preloading.tsx
···
14
14
import { cn } from "~/lib/utils";
15
15
import { POKEMON_LIMIT, getServerPokemonList } from "~/util/pokemon";
16
16
17
-
const matchPokemonIdExp = /\/api\/v2\/pokemon\/(\d+)\/?/;
18
-
19
17
const searchParamsSchema = v.object({
20
18
offset: v.optional(v.number(), 0),
21
19
});
···
49
47
context.queryClient.prefetchQuery(context.pokemonListOptions);
50
48
},
51
49
component: RouteComponent,
52
-
notFoundComponent: NotFoundComponent,
53
-
errorComponent: ErrorComponent,
54
-
pendingComponent: LoadingComponent,
55
50
});
56
51
57
-
interface PokemonListResult {
58
-
name: string;
59
-
url: string;
60
-
}
61
-
62
-
function NotFoundComponent() {
63
-
return <div>Not Found</div>;
64
-
}
65
-
66
-
function ErrorComponent() {
67
-
return <div>Error</div>;
68
-
}
69
-
70
-
function LoadingComponent() {
71
-
return <div>Loading...</div>;
72
-
}
73
-
74
52
function RouteComponent() {
75
53
const { offset: currentOffset } = Route.useSearch();
76
54
const { pokemonListOptions } = Route.useRouteContext();
···
98
76
<TableCell className="capitalize">{pokemon.name}</TableCell>
99
77
<TableCell>
100
78
{pokemon.types.map((type) => (
101
-
<span key={type.type.name}>{type.type.name}</span>
79
+
<span
80
+
key={type.type.name}
81
+
className="inline-block px-2 py-1 mr-1 text-sm font-medium rounded-full bg-gray-100"
82
+
>
83
+
{type.type.name}
84
+
</span>
102
85
))}
103
86
</TableCell>
104
87
</TableRow>
+6
-21
src/routes/pagination.tsx
+6
-21
src/routes/pagination.tsx
···
51
51
context.queryClient.prefetchQuery(context.pokemonListOptions);
52
52
},
53
53
component: RouteComponent,
54
-
notFoundComponent: NotFoundComponent,
55
-
errorComponent: ErrorComponent,
56
-
pendingComponent: LoadingComponent,
57
54
});
58
-
59
-
interface PokemonListResult {
60
-
name: string;
61
-
url: string;
62
-
}
63
-
64
-
function NotFoundComponent() {
65
-
return <div>Not Found</div>;
66
-
}
67
-
68
-
function ErrorComponent() {
69
-
return <div>Error</div>;
70
-
}
71
-
72
-
function LoadingComponent() {
73
-
return <div>Loading...</div>;
74
-
}
75
55
76
56
function RouteComponent() {
77
57
const { offset: currentOffset } = Route.useSearch();
···
115
95
<TableCell className="capitalize">{pokemon.name}</TableCell>
116
96
<TableCell>
117
97
{pokemon.types.map((type) => (
118
-
<span key={type.type.name}>{type.type.name}</span>
98
+
<span
99
+
key={type.type.name}
100
+
className="inline-block px-2 py-1 mr-1 text-sm font-medium rounded-full bg-gray-100"
101
+
>
102
+
{type.type.name}
103
+
</span>
119
104
))}
120
105
</TableCell>
121
106
</TableRow>
+6
-21
src/routes/preloading.tsx
+6
-21
src/routes/preloading.tsx
···
50
50
context.queryClient.prefetchQuery(context.pokemonListOptions);
51
51
},
52
52
component: RouteComponent,
53
-
notFoundComponent: NotFoundComponent,
54
-
errorComponent: ErrorComponent,
55
-
pendingComponent: LoadingComponent,
56
53
});
57
-
58
-
interface PokemonListResult {
59
-
name: string;
60
-
url: string;
61
-
}
62
-
63
-
function NotFoundComponent() {
64
-
return <div>Not Found</div>;
65
-
}
66
-
67
-
function ErrorComponent() {
68
-
return <div>Error</div>;
69
-
}
70
-
71
-
function LoadingComponent() {
72
-
return <div>Loading...</div>;
73
-
}
74
54
75
55
function RouteComponent() {
76
56
const { offset: currentOffset } = Route.useSearch();
···
99
79
<TableCell className="capitalize">{pokemon.name}</TableCell>
100
80
<TableCell>
101
81
{pokemon.types.map((type) => (
102
-
<span key={type.type.name}>{type.type.name}</span>
82
+
<span
83
+
key={type.type.name}
84
+
className="inline-block px-2 py-1 mr-1 text-sm font-medium rounded-full bg-gray-100"
85
+
>
86
+
{type.type.name}
87
+
</span>
103
88
))}
104
89
</TableCell>
105
90
</TableRow>
-15
src/routes/suspense.tsx
-15
src/routes/suspense.tsx
···
21
21
export const Route = createFileRoute({
22
22
validateSearch: searchParamsSchema,
23
23
component: RouteComponent,
24
-
notFoundComponent: NotFoundComponent,
25
-
errorComponent: ErrorComponent,
26
-
pendingComponent: LoadingComponent,
27
24
});
28
-
29
-
function NotFoundComponent() {
30
-
return <div>Not Found</div>;
31
-
}
32
-
33
-
function ErrorComponent() {
34
-
return <div>Error</div>;
35
-
}
36
-
37
-
function LoadingComponent() {
38
-
return <div>Loading...</div>;
39
-
}
40
25
41
26
function RouteComponent() {
42
27
const { offset: currentOffset } = Route.useSearch();