Skip to content

Commit fa0d8d1

Browse files
thonatosthonatos
authored
refactor: split component & update doc (#22)
* feat: update about page * feat: update title length limit * refactor: split component
1 parent 276e316 commit fa0d8d1

File tree

8 files changed

+47
-38
lines changed

8 files changed

+47
-38
lines changed

‎src/page/topic/component/CommentForm.tsx‎ renamed to ‎src/component/CommentForm/index.tsx‎

File renamed without changes.

‎src/page/topic/component/CommentList/index.less‎ renamed to ‎src/component/CommentList/index.less‎

File renamed without changes.

‎src/page/topic/component/CommentList/index.tsx‎ renamed to ‎src/component/CommentList/index.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { Fragment } from 'react';
22
import dayjs from 'dayjs';
3+
import { Link } from 'umi';
34
import Markdown from '@/component/Markdown';
45

56
import { Comment, Avatar, Divider } from 'antd';
@@ -38,6 +39,7 @@ const CommentList: React.FC<Props> = (props) => {
3839
data: Node;
3940
}> = ({ data }) => {
4041
const { id, author, content, create_at, children } = data;
42+
const { loginname, avatar_url } = author;
4143

4244
return (
4345
<Fragment key={`fragment-${id}`}>
@@ -63,7 +65,11 @@ const CommentList: React.FC<Props> = (props) => {
6365
datetime={
6466
<span>{dayjs(create_at).format('YYYY-MM-DD hh:mm:ss')}</span>
6567
}
66-
avatar={<Avatar src={author.avatar_url} alt={author.loginname} />}
68+
avatar={
69+
<Link to={`/user/${loginname}`}>
70+
<Avatar src={avatar_url} alt={loginname} />
71+
</Link>
72+
}
6773
content={
6874
<div className={styles.detail}>
6975
<Markdown type="render" value={content} />

‎src/component/MessageList/index.tsx‎

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import dayjs from 'dayjs';
3-
import { useHistory } from 'umi';
3+
import { useHistory, Link } from 'umi';
44
import { Space, Avatar, Tag } from 'antd';
55
import { ListToolBarProps } from '@ant-design/pro-table';
66
import ProList, { ProListMetas } from '@ant-design/pro-list';
@@ -10,14 +10,13 @@ import { MESSAGE_TYPE_MAP, MessageType } from '@/constants';
1010
import * as styles from './index.less';
1111

1212
const MessageList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
13-
const history = useHistory();
14-
1513
const metas: ProListMetas = {
1614
avatar: {
1715
dataIndex: 'author.avatar_url',
1816
render: (_, entity: MessageModel) => {
1917
const { type: _type, author } = entity;
2018
const type = MESSAGE_TYPE_MAP[_type as MessageType];
19+
const { loginname, avatar_url } = author;
2120

2221
return (
2322
<Space size={16}>
@@ -26,10 +25,12 @@ const MessageList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
2625
width: '200px',
2726
}}
2827
>
29-
<Space size={8}>
30-
<Avatar size="small" src={author.avatar_url} />
31-
<span>{author.loginname}</span>
32-
</Space>
28+
<Link to={`/user/${loginname}`}>
29+
<Space size={8}>
30+
<Avatar size="small" src={avatar_url} />
31+
<span>{loginname}</span>
32+
</Space>
33+
</Link>
3334
</div>
3435

3536
<Tag color={type.color}>{type.name}</Tag>
@@ -41,7 +42,10 @@ const MessageList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
4142
dataIndex: 'title',
4243
valueType: 'text',
4344
render: (_, entity: MessageModel) => {
44-
return entity.topic.title;
45+
const {
46+
topic: { id, title },
47+
} = entity;
48+
return <Link to={`/topic/${id}`}>{title}</Link>;
4549
},
4650
},
4751
actions: {
@@ -60,13 +64,6 @@ const MessageList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
6064
metas={metas}
6165
className={styles.list}
6266
toolbar={toolbar}
63-
onRow={(record: MessageModel) => {
64-
return {
65-
onClick: () => {
66-
history.push(`/topic/${record.topic.id}`);
67-
},
68-
};
69-
}}
7067
/>
7168
);
7269
};

‎src/component/TopicList/index.tsx‎

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import dayjs from 'dayjs';
3-
import { useHistory } from 'umi';
3+
import { Link } from 'umi';
44
import { Space, Avatar, Tag } from 'antd';
55
import { ListToolBarProps } from '@ant-design/pro-table';
66
import ProList, { ProListMetas } from '@ant-design/pro-list';
@@ -10,15 +10,14 @@ import { TABS_MAP, TabType } from '@/constants';
1010
import * as styles from './index.less';
1111

1212
const TopicList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
13-
const history = useHistory();
14-
1513
const metas: ProListMetas = {
1614
avatar: {
1715
dataIndex: 'author.avatar_url',
1816
render: (_, entity: TopicModel) => {
1917
const { tab: _tab, author, reply_count, visit_count, top } = entity;
2018

2119
const category = TABS_MAP[_tab as TabType];
20+
const { loginname, avatar_url } = author;
2221

2322
const renderReplyVisit = () =>
2423
typeof visit_count === 'number' && (
@@ -41,7 +40,9 @@ const TopicList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
4140

4241
return (
4342
<Space>
44-
<Avatar size="small" src={author.avatar_url} />
43+
<Link to={`/user/${loginname}`}>
44+
<Avatar size="small" src={avatar_url} />
45+
</Link>
4546
{renderReplyVisit()}
4647
{top ? (
4748
<Tag color="#5BD8A6">置顶</Tag>
@@ -55,6 +56,10 @@ const TopicList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
5556
title: {
5657
dataIndex: 'title',
5758
valueType: 'text',
59+
render: (_, entity: TopicModel) => {
60+
const { id, title } = entity;
61+
return <Link to={`/topic/${id}`}>{title}</Link>;
62+
},
5863
},
5964
actions: {
6065
render: (_, entity: TopicModel) => {
@@ -73,13 +78,6 @@ const TopicList: React.FC<Props> = ({ dataSource, loading, toolbar }) => {
7378
metas={metas}
7479
className={styles.list}
7580
toolbar={toolbar}
76-
onRow={(record) => {
77-
return {
78-
onClick: () => {
79-
history.push(`/topic/${record.id}`);
80-
},
81-
};
82-
}}
8381
/>
8482
);
8583
};

‎src/page/about/index.tsx‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,33 @@ import Markdown from '@/component/Markdown';
44
const content = `
55
## 关于
66
7-
- CNode 社区为国内最大最具影响力的 Node.js 开源技术社区，致力于 Node.js 的技术研究。
7+
CNode 社区为国内最大最具影响力的 Node.js 开源技术社区，致力于 Node.js 的技术研究。
88
9-
- CNode 社区由一批热爱 Node.js 技术的工程师发起，目前已经吸引了互联网各个公司的专业技术人员加入，我们非常欢迎更多对 Node.js 感兴趣的朋友。
9+
CNode 社区由一批热爱 Node.js 技术的工程师发起，目前已经吸引了互联网各个公司的专业技术人员加入，我们非常欢迎更多对 Node.js 感兴趣的朋友。
1010
11-
- CNode 的 SLA 保证是，一个9，即 90.000000%。
11+
CNode 的 SLA 保证是，一个9，即 90.000000%。
1212
1313
社区目前由 [@alsotang](http://cnodejs.org/user/alsotang) 在维护，有问题请联系：[https://github.com/alsotang](https://github.com/alsotang)
1414
1515
请关注我们的官方微博：[http://weibo.com/cnodejs](http://weibo.com/cnodejs)
1616
17+
1718
## 客户端
1819
19-
- 客户端由 [@soliury](https://cnodejs.org/user/soliury) 开发维护。
20+
客户端由 [@soliury](https://cnodejs.org/user/soliury) 开发维护。
2021
21-
- 源码地址： [https://github.com/soliury/noder-react-native](https://github.com/soliury/noder-react-native) 。
22+
源码地址： [https://github.com/soliury/noder-react-native](https://github.com/soliury/noder-react-native) 。
2223
2324
立即体验 CNode 客户端，直接扫描页面右侧二维码。
2425
2526
另，安卓用户同时可选择：[https://github.com/TakWolf/CNode-Material-Design](https://github.com/TakWolf/CNode-Material-Design) ，这是 Java 原生开发的安卓客户端。
27+
28+
29+
## 贡献者
30+
31+
> egg-cnode
32+
33+
[![contributors](https://ergatejs.implements.io/badges/contributors/cnodejs/egg-cnode.svg?owner=cnodejs&repo=egg-cnode&type=svg&width=1232&size=64&padding=8)](https://github.com/cnodejs/egg-cnode/graphs/contributors)
2634
`;
2735

2836
const AboutPage: React.FC<Props> = (props) => {

‎src/page/topic/create/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const CreateTopic: React.FC<Props> = (props) => {
5555
<Form.Item
5656
label="标题"
5757
name="title"
58-
rules={[{ required: true }, { min: 8 }]}
58+
rules={[{ required: true }, { min: 10 }]}
5959
>
6060
<Input allowClear />
6161
</Form.Item>

‎src/page/topic/detail.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@ import { useRequest } from 'ahooks';
55
import { PageHeader, Divider } from 'antd';
66
import * as API from '@/service/topic';
77

8-
import SubTitle from './component/SubTitle';
98
import Markdown from '@/component/Markdown';
10-
import CommentForm from './component/CommentForm';
11-
import CommentList from './component/CommentList';
9+
import CommentList from '@/component/CommentList';
10+
import CommentForm from '@/component/CommentForm';
11+
import SubTitle from './component/SubTitle';
1212

13-
const TopicDetail: React.FC<React.PropsWithChildren<Props>> = (props) => {
13+
const TopicDetailPage: React.FC<React.PropsWithChildren<Props>> = (props) => {
1414
const params: Record<string, any> = useParams();
1515
const topicId = params?.id;
1616

@@ -174,6 +174,6 @@ const TopicDetail: React.FC<React.PropsWithChildren<Props>> = (props) => {
174174
);
175175
};
176176

177-
export default TopicDetail;
177+
export default TopicDetailPage;
178178

179179
interface Props {}

0 commit comments

Comments
 (0)