Skip to content

Commit d909102

Browse files
valentinpolitovvalentinpolitov
committed
feat: TypeScript
1 parent 4222517 commit d909102

34 files changed

+768
-643
lines changed

components/authors.js renamed to components/authors.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
export default function Authors({ date, children, by = "by" }) {
1+
export default function Authors({
2+
date,
3+
children,
4+
by = "by",
5+
}: {
6+
date: string;
7+
children?: React.ReactNode;
8+
by?: string;
9+
}) {
210
return (
311
<div className="mt-4 mb-16 text-gray-500 text-sm">
412
{date} {by} {children}
513
</div>
614
);
715
}
816

9-
export function Author({ name, link }) {
17+
export function Author({ name, link }: { name: string; link: string }) {
1018
return (
1119
<span className="after:content-[','] last:after:content-['']">
1220
<a

‎components/blog-index.js‎

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎components/blog-index.tsx‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import type { FrontMatter, Page } from "nextra";
2+
import { getPagesUnderRoute } from "nextra/context";
3+
import Link from "next/link";
4+
5+
export default function BlogIndex({ more = "Read more" }: { more?: string }) {
6+
return getPagesUnderRoute("/blog").map(
7+
(page: Page & { frontMatter?: FrontMatter }) => {
8+
return (
9+
<div key={page.route} className="mb-10">
10+
<h3>
11+
<Link
12+
href={page.route}
13+
style={{ color: "inherit", textDecoration: "none" }}
14+
className="block font-semibold mt-8 text-2xl "
15+
>
16+
{page.meta?.title || page.frontMatter?.title || page.name}
17+
</Link>
18+
</h3>
19+
<p className="opacity-80 mt-6 leading-7">
20+
{page.frontMatter?.description}{" "}
21+
<span className="inline-block">
22+
<Link
23+
href={page.route}
24+
className="text-[color:hsl(var(--nextra-primary-hue),100%,50%)] underline underline-offset-2 decoration-from-font"
25+
>
26+
{more + " →"}
27+
</Link>
28+
</span>
29+
</p>
30+
{page.frontMatter?.date ? (
31+
<p className="opacity-50 text-sm mt-6 leading-7">
32+
{page.frontMatter.date}
33+
</p>
34+
) : null}
35+
</div>
36+
);
37+
}
38+
);
39+
}

components/diagrams/cache.js renamed to components/diagrams/cache.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import useLocalesMap from "../use-locales-map";
22
import { diagramCachePathsMap } from "../../translations/svgs";
33

4-
export const Cache = () => {
4+
export const Cache: React.FC = () => {
55
const paths = useLocalesMap(diagramCachePathsMap);
66

77
return (

components/diagrams/infinite.js renamed to components/diagrams/infinite.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import useLocalesMap from "../use-locales-map";
22
import { diagramInfinitePathMap } from "../../translations/svgs";
33

4-
export const Infinite = () => {
4+
export const Infinite: React.FC = () => {
55
const path = useLocalesMap(diagramInfinitePathMap);
66

77
return (

components/diagrams/pagination.js renamed to components/diagrams/pagination.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import useLocalesMap from "../use-locales-map";
22
import { diagramPaginationPathsMap } from "../../translations/svgs";
33

4-
export const Pagination = () => {
4+
export const Pagination: React.FC = () => {
55
const paths = useLocalesMap(diagramPaginationPathsMap);
66

77
return (

components/diagrams/welcome.js renamed to components/diagrams/welcome.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import useLocalesMap from "../use-locales-map";
22
import { diagramWelcomePathMap } from "../../translations/svgs";
33

4-
export const Welcome = () => {
4+
export const Welcome: React.FC = () => {
55
const path = useLocalesMap(diagramWelcomePathMap);
66

77
return (

components/features.js renamed to components/features.tsx

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
import { useId } from "react";
22
import styles from "./features.module.css";
33
import useLocalesMap from "./use-locales-map";
4-
import { featuresMap, titleMap } from "../translations/text";
4+
import { type FeatureKey, featuresMap, titleMap } from "../translations/text";
55

6-
import BackendAgnosticIcon from "../components/icons/backend-agnostic";
7-
import LightweightIcon from "../components/icons/lightweight";
8-
import PaginationIcon from "../components/icons/pagination";
9-
import RealtimeIcon from "../components/icons/realtime";
10-
import RemoteLocalIcon from "../components/icons/remote-local";
11-
import RenderingStrategiesIcon from "../components/icons/rendering-strategies";
12-
import SuspenseIcon from "../components/icons/suspense";
13-
import TypeScriptIcon from "../components/icons/typescript";
6+
import BackendAgnosticIcon from "./icons/backend-agnostic";
7+
import LightweightIcon from "./icons/lightweight";
8+
import PaginationIcon from "./icons/pagination";
9+
import RealtimeIcon from "./icons/realtime";
10+
import RemoteLocalIcon from "./icons/remote-local";
11+
import RenderingStrategiesIcon from "./icons/rendering-strategies";
12+
import SuspenseIcon from "./icons/suspense";
13+
import TypeScriptIcon from "./icons/typescript";
1414

15-
export function Feature({ text, icon }) {
15+
export function Feature({ text, icon }: { text: string; icon: JSX.Element }) {
1616
return (
1717
<div className={styles.feature}>
1818
{icon}
@@ -21,8 +21,10 @@ export function Feature({ text, icon }) {
2121
);
2222
}
2323

24-
/** @type {{ key: string; icon: React.FC }[]} */
25-
const FEATURES_LIST = [
24+
const FEATURES_LIST: {
25+
key: FeatureKey;
26+
icon: JSX.Element;
27+
}[] = [
2628
{ key: "lightweight", icon: <LightweightIcon /> },
2729
{ key: "realtime", icon: <RealtimeIcon /> },
2830
{ key: "suspense", icon: <SuspenseIcon /> },

components/icons/backend-agnostic.js renamed to components/icons/backend-agnostic.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
export default function BackendAgnosticIcon() {
1+
export default function BackendAgnosticIcon(
2+
props: React.SVGProps<SVGSVGElement>
3+
) {
24
return (
35
<svg
46
viewBox="0 0 24 24"
@@ -10,6 +12,7 @@ export default function BackendAgnosticIcon() {
1012
strokeLinejoin="round"
1113
fill="none"
1214
shapeRendering="geometricPrecision"
15+
{...props}
1316
>
1417
<path d="M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25" />
1518
<path d="M8 16h.01" />

components/icons/lightweight.js renamed to components/icons/lightweight.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export default function LightweightIcon() {
1+
export default function LightweightIcon(props: React.SVGProps<SVGSVGElement>) {
22
return (
33
<svg
44
viewBox="0 0 24 24"
@@ -9,6 +9,7 @@ export default function LightweightIcon() {
99
fill="none"
1010
strokeLinecap="round"
1111
strokeLinejoin="round"
12+
{...props}
1213
>
1314
<path d="M20.24 12.24a6 6 0 0 0-8.49-8.49L5 10.5V19h8.5z" />
1415
<line x1="16" y1="8" x2="2" y2="22" />

0 commit comments

Comments
 (0)