mirror of
https://github.com/zhigang1992/devhub.git
synced 2026-06-15 09:58:29 +08:00
Enable React.memo for card components
This commit is contained in:
@@ -20,7 +20,7 @@ export interface BranchRowProps {
|
||||
|
||||
export interface BranchRowState {}
|
||||
|
||||
export function BranchRow(props: BranchRowProps) {
|
||||
export const BranchRow = React.memo((props: BranchRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -84,4 +84,4 @@ export function BranchRow(props: BranchRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -24,7 +24,7 @@ export interface CommentRowProps {
|
||||
|
||||
export interface CommentRowState {}
|
||||
|
||||
export function CommentRow(props: CommentRowProps) {
|
||||
export const CommentRow = React.memo((props: CommentRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -87,4 +87,4 @@ export function CommentRow(props: CommentRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -11,7 +11,7 @@ export interface CommitListRowProps {
|
||||
commits: GitHubPushedCommit[]
|
||||
}
|
||||
|
||||
export function CommitListRow(props: CommitListRowProps) {
|
||||
export const CommitListRow = React.memo((props: CommitListRowProps) => {
|
||||
const renderItem: RenderItem<GitHubPushedCommit> = ({
|
||||
showMoreItemsIndicator,
|
||||
item: commit,
|
||||
@@ -36,4 +36,4 @@ export function CommitListRow(props: CommitListRowProps) {
|
||||
if (!(commits && commits.length > 0)) return null
|
||||
|
||||
return <RowList {...otherProps} data={commits} renderItem={renderItem} />
|
||||
}
|
||||
})
|
||||
|
||||
@@ -30,7 +30,7 @@ export interface CommitRowProps {
|
||||
|
||||
export interface CommitRowState {}
|
||||
|
||||
export function CommitRow(props: CommitRowProps) {
|
||||
export const CommitRow = React.memo((props: CommitRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -121,4 +121,4 @@ export function CommitRow(props: CommitRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -35,89 +35,91 @@ const styles = StyleSheet.create({
|
||||
},
|
||||
})
|
||||
|
||||
export function IssueOrPullRequestRow(props: IssueOrPullRequestRowProps) {
|
||||
const theme = useTheme()
|
||||
export const IssueOrPullRequestRow = React.memo(
|
||||
(props: IssueOrPullRequestRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
addBottomAnchor,
|
||||
avatarURL,
|
||||
iconColor,
|
||||
iconName,
|
||||
isRead,
|
||||
issueOrPullRequestNumber,
|
||||
smallLeftColumn,
|
||||
title: _title,
|
||||
url,
|
||||
userLinkURL,
|
||||
username,
|
||||
} = props
|
||||
const {
|
||||
addBottomAnchor,
|
||||
avatarURL,
|
||||
iconColor,
|
||||
iconName,
|
||||
isRead,
|
||||
issueOrPullRequestNumber,
|
||||
smallLeftColumn,
|
||||
title: _title,
|
||||
url,
|
||||
userLinkURL,
|
||||
username,
|
||||
} = props
|
||||
|
||||
const title = trimNewLinesAndSpaces(_title)
|
||||
if (!title) return null
|
||||
const title = trimNewLinesAndSpaces(_title)
|
||||
if (!title) return null
|
||||
|
||||
const byText = username ? `@${username}` : ''
|
||||
const byText = username ? `@${username}` : ''
|
||||
|
||||
return (
|
||||
<View style={getCardRowStylesForTheme(theme).container}>
|
||||
<View
|
||||
style={[
|
||||
getCardStylesForTheme(theme).leftColumn,
|
||||
smallLeftColumn
|
||||
? getCardStylesForTheme(theme).leftColumn__small
|
||||
: getCardStylesForTheme(theme).leftColumn__big,
|
||||
]}
|
||||
>
|
||||
{Boolean(username) && (
|
||||
<Avatar
|
||||
avatarURL={avatarURL}
|
||||
isBot={Boolean(username && username.indexOf('[bot]') >= 0)}
|
||||
linkURL={userLinkURL}
|
||||
small
|
||||
style={getCardStylesForTheme(theme).avatar}
|
||||
username={username}
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
|
||||
<View style={getCardStylesForTheme(theme).rightColumn}>
|
||||
<Link
|
||||
href={fixURL(url, {
|
||||
addBottomAnchor,
|
||||
issueOrPullRequestNumber,
|
||||
})}
|
||||
style={getCardRowStylesForTheme(theme).mainContentContainer}
|
||||
return (
|
||||
<View style={getCardRowStylesForTheme(theme).container}>
|
||||
<View
|
||||
style={[
|
||||
getCardStylesForTheme(theme).leftColumn,
|
||||
smallLeftColumn
|
||||
? getCardStylesForTheme(theme).leftColumn__small
|
||||
: getCardStylesForTheme(theme).leftColumn__big,
|
||||
]}
|
||||
>
|
||||
<Text
|
||||
numberOfLines={1}
|
||||
style={[
|
||||
defaultStyles.full,
|
||||
getCardStylesForTheme(theme).normalText,
|
||||
isRead && getCardStylesForTheme(theme).mutedText,
|
||||
]}
|
||||
>
|
||||
<Icon color={iconColor} name={iconName} /> {title}
|
||||
{Boolean(byText) && (
|
||||
<Text
|
||||
style={[
|
||||
getCardStylesForTheme(theme).normalText,
|
||||
getCardStylesForTheme(theme).smallText,
|
||||
getCardStylesForTheme(theme).mutedText,
|
||||
]}
|
||||
>
|
||||
{' '}
|
||||
by {byText}
|
||||
</Text>
|
||||
)}
|
||||
</Text>
|
||||
</Link>
|
||||
{Boolean(username) && (
|
||||
<Avatar
|
||||
avatarURL={avatarURL}
|
||||
isBot={Boolean(username && username.indexOf('[bot]') >= 0)}
|
||||
linkURL={userLinkURL}
|
||||
small
|
||||
style={getCardStylesForTheme(theme).avatar}
|
||||
username={username}
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
|
||||
<CardItemId
|
||||
id={issueOrPullRequestNumber}
|
||||
isRead={isRead}
|
||||
style={styles.cardItemId}
|
||||
url={url}
|
||||
/>
|
||||
<View style={getCardStylesForTheme(theme).rightColumn}>
|
||||
<Link
|
||||
href={fixURL(url, {
|
||||
addBottomAnchor,
|
||||
issueOrPullRequestNumber,
|
||||
})}
|
||||
style={getCardRowStylesForTheme(theme).mainContentContainer}
|
||||
>
|
||||
<Text
|
||||
numberOfLines={1}
|
||||
style={[
|
||||
defaultStyles.full,
|
||||
getCardStylesForTheme(theme).normalText,
|
||||
isRead && getCardStylesForTheme(theme).mutedText,
|
||||
]}
|
||||
>
|
||||
<Icon color={iconColor} name={iconName} /> {title}
|
||||
{Boolean(byText) && (
|
||||
<Text
|
||||
style={[
|
||||
getCardStylesForTheme(theme).normalText,
|
||||
getCardStylesForTheme(theme).smallText,
|
||||
getCardStylesForTheme(theme).mutedText,
|
||||
]}
|
||||
>
|
||||
{' '}
|
||||
by {byText}
|
||||
</Text>
|
||||
)}
|
||||
</Text>
|
||||
</Link>
|
||||
|
||||
<CardItemId
|
||||
id={issueOrPullRequestNumber}
|
||||
isRead={isRead}
|
||||
style={styles.cardItemId}
|
||||
url={url}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
)
|
||||
},
|
||||
)
|
||||
|
||||
@@ -29,7 +29,7 @@ export interface ReleaseRowProps {
|
||||
|
||||
export interface ReleaseRowState {}
|
||||
|
||||
export function ReleaseRow(props: ReleaseRowProps) {
|
||||
export const ReleaseRow = React.memo((props: ReleaseRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -169,4 +169,4 @@ export function ReleaseRow(props: ReleaseRowProps) {
|
||||
)}
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -15,7 +15,7 @@ export interface RepositoryListRowProps {
|
||||
repos: GitHubRepo[]
|
||||
}
|
||||
|
||||
export function RepositoryListRow(props: RepositoryListRowProps) {
|
||||
export const RepositoryListRow = React.memo((props: RepositoryListRowProps) => {
|
||||
const renderItem: RenderItem<GitHubRepo> = ({
|
||||
item: repo,
|
||||
showMoreItemsIndicator,
|
||||
@@ -45,4 +45,4 @@ export function RepositoryListRow(props: RepositoryListRowProps) {
|
||||
if (!(repos && repos.length > 0)) return null
|
||||
|
||||
return <RowList {...otherProps} data={repos} renderItem={renderItem} />
|
||||
}
|
||||
})
|
||||
|
||||
@@ -22,7 +22,7 @@ export interface RepositoryRowProps {
|
||||
|
||||
export interface RepositoryRowState {}
|
||||
|
||||
export function RepositoryRow(props: RepositoryRowProps) {
|
||||
export const RepositoryRow = React.memo((props: RepositoryRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -102,4 +102,4 @@ export function RepositoryRow(props: RepositoryRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -11,7 +11,7 @@ export interface UserListRowProps {
|
||||
users: GitHubUser[]
|
||||
}
|
||||
|
||||
export function UserListRow(props: UserListRowProps) {
|
||||
export const UserListRow = React.memo((props: UserListRowProps) => {
|
||||
const renderItem: RenderItem<GitHubUser> = ({
|
||||
item: user,
|
||||
showMoreItemsIndicator,
|
||||
@@ -35,4 +35,4 @@ export function UserListRow(props: UserListRowProps) {
|
||||
if (!(users && users.length > 0)) return null
|
||||
|
||||
return <RowList {...otherProps} data={users} renderItem={renderItem} />
|
||||
}
|
||||
})
|
||||
|
||||
@@ -19,7 +19,7 @@ export interface UserRowProps {
|
||||
|
||||
export interface UserRowState {}
|
||||
|
||||
export function UserRow(props: UserRowProps) {
|
||||
export const UserRow = React.memo((props: UserRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -69,4 +69,4 @@ export function UserRow(props: UserRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -10,7 +10,7 @@ export interface WikiPageListRowProps {
|
||||
pages: GitHubPage[]
|
||||
}
|
||||
|
||||
export function WikiPageListRow(props: WikiPageListRowProps) {
|
||||
export const WikiPageListRow = React.memo((props: WikiPageListRowProps) => {
|
||||
const renderItem: RenderItem<GitHubPage> = ({
|
||||
item: page,
|
||||
showMoreItemsIndicator,
|
||||
@@ -33,4 +33,4 @@ export function WikiPageListRow(props: WikiPageListRowProps) {
|
||||
if (!(pages && pages.length > 0)) return null
|
||||
|
||||
return <RowList {...otherProps} data={pages} renderItem={renderItem} />
|
||||
}
|
||||
})
|
||||
|
||||
@@ -20,7 +20,7 @@ export interface WikiPageRowProps {
|
||||
|
||||
export interface WikiPageRowState {}
|
||||
|
||||
export function WikiPageRow(props: WikiPageRowProps) {
|
||||
export const WikiPageRow = React.memo((props: WikiPageRowProps) => {
|
||||
const theme = useTheme()
|
||||
|
||||
const {
|
||||
@@ -75,4 +75,4 @@ export function WikiPageRow(props: WikiPageRowProps) {
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user