Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 53f638f

Browse files
committed
feat: migrate to geist v2.2.0
1 parent 36640dc commit 53f638f

40 files changed

+1295
-3863
lines changed

‎jsconfig.json‎

Lines changed: 0 additions & 5 deletions
This file was deleted.
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from 'react'
2+
import { BlogConfigs, BlogConfigsContext } from 'lib/config-context'
3+
4+
export interface BlogConfigsProviderProps {
5+
onChange: BlogConfigs['onChange']
6+
}
7+
8+
const BlogConfigsProvider: React.FC<
9+
React.PropsWithChildren<BlogConfigsProviderProps>
10+
> = React.memo(({ onChange, children }) => {
11+
return (
12+
<BlogConfigsContext.Provider value={{ onChange }}>
13+
{children}
14+
</BlogConfigsContext.Provider>
15+
)
16+
})
17+
18+
export default BlogConfigsProvider

‎lib/components/contacts.jsx‎ renamed to ‎lib/components/contacts.tsx‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,13 @@ import SunIcon from '@geist-ui/react-icons/sun'
55
import MoonIcon from '@geist-ui/react-icons/moon'
66
import { Configs } from '../utils'
77

8-
const Contacts = ({ isDetailPage = false }) => {
8+
export interface ContactsProps {
9+
isDetailPage?: boolean
10+
}
11+
12+
const Contacts: React.FC<React.PropsWithChildren<ContactsProps>> = ({
13+
isDetailPage = false,
14+
}) => {
915
const theme = useTheme()
1016
const configs = useConfigs()
1117
const isDark = useMemo(() => theme.type === 'dark', [theme.type])
@@ -20,7 +26,7 @@ const Contacts = ({ isDetailPage = false }) => {
2026
return (
2127
<>
2228
<div className="contacts">
23-
{isDetailPage && <Divider y={0.5} />}
29+
{isDetailPage && <Divider h={0.5} />}
2430
<div className="between">
2531
<div className="socials">
2632
{Configs.email && (
@@ -115,7 +121,7 @@ const Contacts = ({ isDetailPage = false }) => {
115121
}
116122
`}</style>
117123
</div>
118-
<Spacer y={3.5} />
124+
<Spacer h={3.5} />
119125
</>
120126
)
121127
}

‎lib/components/home.jsx‎ renamed to ‎lib/components/home.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react'
22
import Profile from './profile'
33

4-
const Home = () => {
4+
const Home: React.FC<unknown> = () => {
55
return (
66
<div className="home">
77
<Profile />

‎lib/components/index.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export { default as BlogConfigsProvider } from './blog-configs-provider'
2+
export { default as Layout } from './layout'
3+
export { default as Posts } from './posts/posts'
4+
5+
export type { PostMetadata } from './layout'

‎lib/components/layout.jsx‎ renamed to ‎lib/components/layout.tsx‎

Lines changed: 33 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,18 @@ import Title from './title'
66
import { Spacer } from '@geist-ui/react'
77
import { Configs } from '../utils'
88

9-
const LayoutHeader = ({ meta }) => (
9+
export type PostMetadata = {
10+
title: string
11+
date: string
12+
description?: string
13+
image?: string
14+
}
15+
16+
export type LayoutHeader = {
17+
meta: PostMetadata
18+
}
19+
20+
const LayoutHeader: React.FC<LayoutHeader> = ({ meta }) => (
1021
<Head>
1122
{meta.title && (
1223
<title>
@@ -21,7 +32,23 @@ const LayoutHeader = ({ meta }) => (
2132
</Head>
2233
)
2334

24-
const Layout = ({ children, meta = {} }) => {
35+
export type Props = {
36+
meta?: PostMetadata
37+
}
38+
const defaultProps = {
39+
meta: {
40+
title: '',
41+
date: new Date().toISOString(),
42+
},
43+
}
44+
45+
type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
46+
export type LayoutProps = Props & NativeAttrs
47+
48+
const Layout: React.FC<React.PropsWithChildren<LayoutProps>> = ({
49+
children,
50+
meta,
51+
}: LayoutProps & typeof defaultProps) => {
2552
const [showAfterRender, setShowAfterRender] = useState(false)
2653
const inDetailPage = useMemo(() => meta && meta.title, [])
2754
useEffect(() => setShowAfterRender(true), [])
@@ -47,8 +74,8 @@ const Layout = ({ children, meta = {} }) => {
4774
<Profile />
4875
{inDetailPage && <Title title={meta.title} date={meta.date} />}
4976
{children}
50-
<Spacer y={5} />
51-
<Contacts isDetailPage={inDetailPage} />
77+
<Spacer h={5} />
78+
<Contacts isDetailPage={!!inDetailPage} />
5279
</div>
5380

5481
<style jsx>{`
@@ -95,4 +122,6 @@ const Layout = ({ children, meta = {} }) => {
95122
)
96123
}
97124

125+
Layout.defaultProps = defaultProps
126+
98127
export default Layout

‎lib/components/posts/post-item.jsx‎ renamed to ‎lib/components/posts/post-item.tsx‎

Lines changed: 21 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,31 @@
11
import React from 'react'
22
import { Link, useTheme } from '@geist-ui/react'
33
import NextLink from 'next/link'
4-
const options = { weekday: 'short', year: 'numeric', month: 'long', day: 'numeric' }
54

6-
const getDateString = date => {
5+
const options: Intl.DateTimeFormatOptions = {
6+
weekday: 'short',
7+
year: 'numeric',
8+
month: 'long',
9+
day: 'numeric',
10+
}
11+
12+
const getDateString = (date: string = ''): string => {
713
const d = new Date(date)
814
if (`${d}` === 'Invalid Date') return ''
915
return new Date(date).toLocaleString('zh-cn', options).replace('日', '日, &nbsp;')
1016
}
1117

12-
const PostItem = ({ post }) => {
18+
export interface PostItemProps {
19+
post: {
20+
url: string
21+
name: string
22+
meta?: {
23+
date: string
24+
}
25+
}
26+
}
27+
28+
const PostItem: React.FC<PostItemProps> = ({ post }) => {
1329
const theme = useTheme()
1430

1531
return (
@@ -19,7 +35,8 @@ const PostItem = ({ post }) => {
1935
{post.name}
2036
<span
2137
className="date"
22-
dangerouslySetInnerHTML={{ __html: getDateString(post.meta.date) }}></span>
38+
dangerouslySetInnerHTML={{ __html: getDateString(post.meta?.date) }}
39+
/>
2340
</Link>
2441
</NextLink>
2542
<style jsx>{`

‎lib/components/posts/posts.jsx‎ renamed to ‎lib/components/posts/posts.tsx‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import Head from 'next/head'
22
import React, { useMemo } from 'react'
33
import PostItem from './post-item'
4-
import { useTheme, Link } from '@geist-ui/react'
5-
import { Configs } from '../../utils'
4+
import { Configs } from 'lib/utils'
65
import NextLink from 'next/link'
7-
import metadata from 'lib/data/metadata'
6+
import metadata from 'lib/data/metadata.json'
7+
import { useTheme, Link } from '@geist-ui/react'
88

9-
const getMoreLink = len => {
9+
const getMoreLink = (len: number): React.ReactNode => {
1010
if (len < Configs.latestLimit) return null
1111
return (
1212
<NextLink href="/blog" passHref>
@@ -15,19 +15,23 @@ const getMoreLink = len => {
1515
)
1616
}
1717

18-
const getLatest = (data, isLatest) => {
18+
const getLatest = (data: typeofmetadata, isLatest?: boolean) => {
1919
const postNode = data.find(item => item.name === 'posts')
2020
const posts = (postNode || {}).children || []
2121
if (!isLatest) return posts
2222
return posts.slice(0, Configs.latestLimit)
2323
}
2424

25-
const getTitle = isLatest => {
25+
const getTitle = (isLatest?: boolean): string => {
2626
if (!isLatest) return Configs.labels.list
2727
return Configs.labels.latest
2828
}
2929

30-
const Posts = ({ isLatest = false }) => {
30+
export interface PostsProps {
31+
isLatest?: boolean
32+
}
33+
34+
const Posts: React.FC<PostsProps> = ({ isLatest = false }) => {
3135
const theme = useTheme()
3236
const posts = useMemo(() => getLatest(metadata, isLatest), [])
3337
const title = useMemo(() => getTitle(isLatest), [])

‎lib/components/profile-links.jsx‎ renamed to ‎lib/components/profile-links.tsx‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,32 @@
11
import React, { useMemo } from 'react'
22
import NextLink from 'next/link'
33
import { useTheme, Link } from '@geist-ui/react'
4-
import metadata from '../data/metadata'
4+
import metadata from '../data/metadata.json'
55
import { Configs } from '../utils'
66

7-
const getFixes = metas => {
7+
const getFixes = (metas: typeofmetadata) => {
88
const data = metas.find(item => item.name === 'fixed')
99
return (data || {}).children || []
1010
}
1111

12-
const fillSpace = name => {
12+
const fillSpace = (name: string): string => {
1313
return name.replace(//g, '_')
1414
}
1515

16-
const makeLink = data => {
16+
export type ProfileLinkItem = {
17+
url: string
18+
name: string
19+
}
20+
21+
const makeLink = (data: ProfileLinkItem): React.ReactNode => {
1722
return (
1823
<NextLink href={data.url} key={data.url} passHref>
1924
<Link>{fillSpace(data.name)}</Link>
2025
</NextLink>
2126
)
2227
}
2328

24-
const ProfileLinks = () => {
29+
const ProfileLinks: React.FC<unknown> = () => {
2530
const theme = useTheme()
2631
const links = useMemo(() => getFixes(metadata), [])
2732
return (

‎lib/components/profile.jsx‎ renamed to ‎lib/components/profile.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import React, { useState, useEffect } from 'react'
2-
import { Row,useTheme, User, Link } from '@geist-ui/react'
2+
import { useTheme, User, Link } from '@geist-ui/react'
33
import NextLink from 'next/link'
44
import ProfileLinks from './profile-links'
55
import { Configs } from '../utils'
66

7-
const Profile= React.memo(({}) => {
7+
const Profile: React.FC<unknown>= React.memo(() => {
88
const theme = useTheme()
99
const [showText, setShowText] = useState(theme.type === 'dark')
1010
useEffect(() => {
@@ -16,15 +16,15 @@ const Profile = React.memo(({}) => {
1616

1717
return (
1818
<div className="profile">
19-
<Rowalign="bottom" className="user">
19+
<div className="user">
2020
<NextLink href="/" passHref>
2121
<Link>
2222
<User src="/assets/avatar.png" name={Configs.author} altText="avatar">
2323
{Configs.summary}
2424
</User>
2525
</Link>
2626
</NextLink>
27-
</Row>
27+
</div>
2828
<ProfileLinks />
2929
<style jsx>{`
3030
.profile {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /