Skip to content

Commit 7d08fc7

Browse files
committed
[fix] some UI detail bugs
1 parent 223adc5 commit 7d08fc7

File tree

5 files changed

+43
-41
lines changed

5 files changed

+43
-41
lines changed

components/Git/Issue/Card.tsx

Lines changed: 33 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
1-
import { Avatar, Card, CardContent, CardProps, Chip, Icon, Stack, Typography } from '@mui/material';
1+
import { Avatar, Card, CardContent, CardProps, Chip } from '@mui/material';
22
import { marked } from 'marked';
33
import { Issue } from 'mobx-github';
44
import { FC } from 'react';
55

6+
import { SymbolIcon } from '../../Icon';
7+
68
export type IssueCardProps = Issue & Omit<CardProps, 'id'>;
79

810
export const IssueCard: FC<IssueCardProps> = ({
911
id,
12+
repository_url,
1013
number,
1114
title,
1215
labels,
@@ -18,19 +21,21 @@ export const IssueCard: FC<IssueCardProps> = ({
1821
...props
1922
}) => (
2023
<Card {...props}>
21-
<CardContent>
22-
<Typography
23-
variant="h4"
24-
component="a"
25-
href={html_url}
26-
target="_blank"
27-
rel="noreferrer"
28-
style={{ textDecoration: 'none', color: 'inherit' }}
29-
>
30-
#{number} {title}
31-
</Typography>
24+
<CardContent className="flex h-full flex-col justify-between gap-2">
25+
<h2 className="text-2xl">
26+
<a
27+
href={html_url}
28+
target="_blank"
29+
rel="noreferrer"
30+
style={{ textDecoration: 'none', color: 'inherit' }}
31+
>
32+
{repository_url.split('/').slice(-2).join('/')}#{number}
33+
<br />
34+
{title}
35+
</a>
36+
</h2>
3237

33-
<Stack direction="row" spacing={1}>
38+
<div className="flex items-center gap-2">
3439
{labels?.map(
3540
label =>
3641
typeof label === 'object' && (
@@ -41,22 +46,23 @@ export const IssueCard: FC<IssueCardProps> = ({
4146
/>
4247
),
4348
)}
44-
</Stack>
45-
46-
<Typography component="article" dangerouslySetInnerHTML={{ __html: marked(body || '') }} />
49+
</div>
4750

48-
{user && (
49-
<Stack direction="row" spacing={1} alignItems="center">
50-
<Avatar src={user.avatar_url} alt={user.name || ''} />
51-
<Typography>{user.name || ''}</Typography>
52-
</Stack>
53-
)}
54-
<Stack direction="row" spacing={1} alignItems="center">
55-
<Icon>chat_bubble_outline</Icon>
56-
{comments}
57-
</Stack>
51+
<article dangerouslySetInnerHTML={{ __html: marked(body || '') }} />
5852

59-
<time dateTime={created_at}>{new Date(created_at).toLocaleString()}</time>
53+
<footer className="flex items-center justify-between">
54+
{user && (
55+
<div className="flex items-center gap-2">
56+
<Avatar src={user.avatar_url} alt={user.name || ''} />
57+
{user.name || ''}
58+
</div>
59+
)}
60+
<div className="flex items-center gap-2">
61+
<SymbolIcon name="chat" />
62+
{comments}
63+
</div>
64+
<time dateTime={created_at}>{new Date(created_at).toLocaleString()}</time>
65+
</footer>
6066
</CardContent>
6167
</Card>
6268
);

components/Icon.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,12 @@ export interface IconProps extends HTMLAttributes<HTMLSpanElement> {
55
variant?: 'outlined' | 'rounded' | 'sharp';
66
}
77

8-
export const SymbolIcon: FC<IconProps> = ({ className, name, variant = 'outlined', ...props }) => (
8+
export const SymbolIcon: FC<IconProps> = ({
9+
className = '',
10+
name,
11+
variant = 'outlined',
12+
...props
13+
}) => (
914
<span
1015
aria-hidden="false"
1116
aria-label={`${name} icon`}

components/Layout/MainNavigator.tsx

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,6 @@
1-
import {
2-
AppBar,
3-
Button,
4-
Drawer,
5-
IconButton,
6-
Menu,
7-
MenuItem,
8-
PopoverProps,
9-
Toolbar,
10-
} from '@mui/material';
1+
import { AppBar, Drawer, IconButton, Menu, MenuItem, PopoverProps, Toolbar } from '@mui/material';
112
import { observable } from 'mobx';
123
import { observer } from 'mobx-react';
13-
import Image from 'next/image';
144
import Link from 'next/link';
155
import { Component } from 'react';
166

@@ -21,6 +11,7 @@ import { BrandLogo, GithubIcon } from './Svg';
2111

2212
export const mainNavLinks = () => [
2313
{ title: t('latest_projects'), href: '/project' },
14+
{ title: 'GitHub-reward', href: '/project/reward/issue' },
2415
{ title: t('member'), href: '/member' },
2516
{ title: t('open_source_project'), href: '/open-source' },
2617
];

models/Issue.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export class IssueModel extends ListModel<Issue, IssueFilter> {
2424
) {
2525
const [org, repo] = repository_url?.replace('https://github.com/', '').split('/') || [];
2626

27-
const condition = Object.entries({ org, repo, state })
27+
const condition = Object.entries({ org, repo, type: 'issue', state })
2828
.filter(([, value]) => !isEmpty(value))
2929
.map(([key, value]) => `${key}:${value}`)
3030
.join(' ');

pages/_document.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export default function Document() {
4040
* */}
4141
<link
4242
rel="stylesheet"
43-
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=code,dark_mode,diversity_3,keyboard_arrow_down,language,light_mode,menu,translate,trending_up&display=swap"
43+
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&display=swap"
4444
/>
4545
<script type="application/ld+json">{JSON.stringify(siteNameJsonLd)}</script>
4646
</Head>

0 commit comments

Comments
 (0)