Skip to content
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit 086974d

Browse files
mydearxymmydearxym
authored
feat(abuse report): redesign (#1069)
* chore(abuse-report): basic setup && fix generator typo * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * refactor(reporter): update docs * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): wip * chore(abuse-report): remove old informer system * chore(abuse-report): ignore error * chore(abuse-report): build error * chore(abuse-report): build error
1 parent 793f576 commit 086974d

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+884
-585
lines changed

‎.gitignore

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,5 +12,4 @@ cypress//integration/examples
1212
cypress/videos/
1313
.vscode/
1414
.DS_Store
15-
report.*
1615
.eslintcache

‎public/icons/static/article/report-solid.svg

Lines changed: 1 addition & 0 deletions
Loading

‎public/icons/static/article/report.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/components/ArticleActionsPanel/index.js

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,16 @@ import React from 'react'
88
import T from 'prop-types'
99
import { values } from 'ramda'
1010

11-
import { ICON_CMD } from '@/config'
1211
import { THREAD } from '@/constant'
1312
import { buildLog } from '@/utils'
1413

15-
import Informer from '@/containers/tool/Informer'
1614
import PinOption from './PinOption'
1715
import RefineOption from './RefineOption'
1816
import EditOption from './EditOption'
1917
import CommunitySetterOption from './CommunitySetterOption'
2018
import DeleteOption from './DeleteOption'
2119

22-
import { Wrapper, Option, OptionIcon, OptionTitle } from './styles'
20+
import { Wrapper } from './styles'
2321

2422
/* eslint-disable-next-line */
2523
const log = buildLog('c:ArticleActionsPanel:index')
@@ -33,7 +31,6 @@ const ArticleActionsPanel = ({
3331
onSetRefined,
3432
onUnsetRefined,
3533
onEdit,
36-
onInform,
3734
onDelete,
3835
onCommunitySet,
3936
}) => {
@@ -66,13 +63,6 @@ const ArticleActionsPanel = ({
6663
onCommunitySet={onCommunitySet}
6764
/>
6865

69-
<Informer>
70-
<Option onClick={onInform}>
71-
<OptionIcon src={`${ICON_CMD}/flag.svg`} />
72-
<OptionTitle>举报该内容</OptionTitle>
73-
</Option>
74-
</Informer>
75-
7666
<DeleteOption
7767
passport="owner"
7868
ownerId={data.author?.id}
@@ -100,7 +90,6 @@ ArticleActionsPanel.propTypes = {
10090
}).isRequired,
10191
communityRaw: T.string.isRequired,
10292
thread: T.oneOf(values(THREAD)),
103-
onInform: T.func,
10493
onDelete: T.func,
10594
onEdit: T.func,
10695
onPin: T.func,
@@ -112,7 +101,6 @@ ArticleActionsPanel.propTypes = {
112101

113102
ArticleActionsPanel.defaultProps = {
114103
thread: THREAD.POST,
115-
onInform: log,
116104
onDelete: log,
117105
onEdit: log,
118106
onPin: log,

‎src/components/Buttons/ArrowButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ type TProps = {
2323
direction?: 'left' | 'right'
2424
dimWhenIdle?: boolean
2525
disabled?: boolean
26-
arrowStyle?: string
26+
arrowStyle?: 'default' | 'simple'
2727
}
2828

2929
const ArrowButton: React.FC<TProps> = ({

‎src/components/Buttons/YesOrNoButtons.tsx

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import React from 'react'
2+
3+
import { Space } from '@/components/Common'
4+
import Button from './Button'
5+
6+
import { Wrapper, CancelBtn } from './styles/yes_or_no_buttons'
7+
8+
type TProps = {
9+
align?: 'center' | 'right'
10+
cancelText?: string
11+
confirmText?: string
12+
onCancel?: () => void
13+
onConfirm?: () => void
14+
}
15+
16+
const YesOrNoButton: React.FC<TProps> = ({
17+
align = 'center',
18+
cancelText = '取消',
19+
confirmText = '确定',
20+
onCancel = console.log,
21+
onConfirm = console.log,
22+
}) => {
23+
return (
24+
<Wrapper align={align}>
25+
<CancelBtn onClick={() => onCancel?.()}>{cancelText}</CancelBtn>
26+
<Space left={5} right={10} />
27+
<Button size="small" type="primary" onClick={() => onConfirm?.()}>
28+
{confirmText}
29+
</Button>
30+
</Wrapper>
31+
)
32+
}
33+
34+
export default YesOrNoButton

‎src/components/Buttons/index.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,4 @@ export { default as OrButton } from './OrButton'
66
export { default as DropdownButton } from './DropdownButton'
77
export { default as NotifyButton } from './NotifyButton'
88
export { default as FollowButton } from './FollowButton'
9+
export { default as YesOrNoButtons } from './YesOrNoButtons'

‎src/components/Buttons/styles/yes_or_no_buttons.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import styled from 'styled-components'
2+
3+
import { css, theme } from '@/utils'
4+
5+
type TWrapper = { align: 'center' | 'right' }
6+
export const Wrapper = styled.div<TWrapper>`
7+
${css.flex('align-center')};
8+
width: 100%;
9+
justify-content: ${({ align }) =>
10+
align === 'center' ? 'center' : 'flex-end'};
11+
`
12+
export const CancelBtn = styled.div`
13+
color: ${theme('button.primary')};
14+
font-size: 14px;
15+
`

‎src/components/Checker/index.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,19 +17,19 @@ import { Wrapper, IconWrapper, Icon, ChildWrapper } from './styles'
1717
const log = buildLog('c:Checker:index')
1818

1919
type TProps = {
20-
children: React.ReactNode
20+
children?: React.ReactNode | null
2121
checked?: boolean
22-
hiddenMode: boolean
22+
hiddenMode?: boolean
2323
size?: TSIZE_SM
24-
onChange: (checked: boolean) => void
24+
onChange?: (checked: boolean) => void
2525
}
2626

2727
const Checker: React.FC<TProps> = ({
2828
checked = false,
2929
onChange = log,
3030
hiddenMode = false,
3131
size = SIZE.MEDIUM,
32-
children,
32+
children = null,
3333
}) => {
3434
const show = checked || !hiddenMode
3535

‎src/components/Checker/styles/index.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,12 @@ export const Wrapper = styled.div<TActive>`
1414
`
1515
export const IconWrapper = styled.div<TItem>`
1616
position: relative;
17-
background: ${({ checked }) => (checked ? '#114759' : '#00262F')};
17+
background: ${({ checked }) => (checked ? '#0d3d4e' : '#012f3a')};
1818
width: ${({ size }) => getIconSize(size)};
1919
height: ${({ size }) => getIconSize(size)};
2020
${css.flex('align-both')};
2121
border: 1px solid;
22-
border-color: ${({ checked }) => (checked ? 'transparent' : '#114759')};
23-
22+
border-color: ${({ checked }) => (checked ? '#246b8c' : '#1c5975')};
2423
border-radius: ${({ size }) => getBorderRadius(size)};
2524
2625
transition: all 0.2s;

‎src/components/FormItem/styles/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ export const TextAreaInput = styled(Input)<{ error: string }>`
2626
error === 'true' ? theme('baseColor.red') : ''};
2727
border-right-color: ${({ error }) =>
2828
error === 'true' ? theme('baseColor.red') : ''};
29+
border: 1px solid tomato;
2930
`
3031

3132
export const FormItemWrapper = styled.div<TSpace>`

‎src/components/Input/Textarea.js

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

‎src/components/Input/Textarea.tsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
/*
2+
*
3+
* Input
4+
*
5+
*/
6+
7+
import React, { useCallback } from 'react'
8+
import { pickBy } from 'ramda'
9+
10+
import { buildLog } from '@/utils'
11+
12+
import { Wrapper } from './styles/textarea'
13+
14+
/* eslint-disable-next-line */
15+
const log = buildLog('c:Input:index')
16+
17+
type TProps = {
18+
testid?: string
19+
placeholder?: string
20+
value?: string | null
21+
onChange?: (e) => void | null
22+
}
23+
24+
const Textarea: React.FC<TProps> = ({
25+
onChange = null,
26+
testid = 'textarea',
27+
...restProps
28+
}) => {
29+
const handleOnChange = useCallback((e) => onChange?.(e), [onChange])
30+
const validProps = pickBy((v) => v !== null, restProps)
31+
32+
return (
33+
<Wrapper
34+
testid={testid}
35+
onChange={handleOnChange}
36+
minRows={1}
37+
spellcheck="false"
38+
{...validProps}
39+
/>
40+
)
41+
}
42+
43+
export default React.memo(Textarea)

‎src/components/Input/index.js renamed to ‎src/components/Input/index.tsx

Lines changed: 24 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
*/
66

77
import React, { useCallback } from 'react'
8-
import T from 'prop-types'
98
import { pickBy } from 'ramda'
109

1110
import { buildLog, nilOrEmpty } from '@/utils'
@@ -22,14 +21,29 @@ import {
2221
/* eslint-disable-next-line */
2322
const log = buildLog('c:Input:index')
2423

25-
const Input = ({
26-
behavior,
27-
onChange,
28-
prefixIcon,
29-
prefixActive,
30-
suffixIcon,
31-
suffixActive,
32-
testid,
24+
type TProps = {
25+
testid?: string
26+
behavior?: 'default' | 'textarea'
27+
placeholder?: string
28+
value?: string | null
29+
prefixIcon?: string | null
30+
prefixActive?: boolean
31+
suffixIcon?: string | null
32+
suffixActive?: boolean
33+
disabled?: boolean
34+
autoFocus?: boolean
35+
36+
onChange?: (e) => void | null
37+
}
38+
39+
const Input: React.FC<TProps> = ({
40+
behavior = 'default',
41+
onChange = null,
42+
prefixIcon = null,
43+
prefixActive = false,
44+
suffixIcon = null,
45+
suffixActive = false,
46+
testid = 'input',
3347
...restProps
3448
}) => {
3549
const handleOnChange = useCallback((e) => onChange && onChange(e), [onChange])
@@ -53,36 +67,8 @@ const Input = ({
5367
</SuffixWrapper>
5468
</Wrapper>
5569
) : (
56-
<Textarea testid={testid} onChange={onChange} minRows={1} {...restProps} />
70+
<Textarea testid={testid} onChange={onChange} {...restProps} />
5771
)
5872
}
5973

60-
Input.propTypes = {
61-
behavior: T.oneOf(['default', 'textarea']),
62-
placeholder: T.string,
63-
value: T.oneOfType([T.string, T.instanceOf(null)]),
64-
onChange: T.oneOfType([T.func, T.instanceOf(null)]),
65-
prefixIcon: T.oneOfType([T.string, T.instanceOf(null)]),
66-
prefixActive: T.bool,
67-
suffixIcon: T.oneOfType([T.string, T.instanceOf(null)]),
68-
suffixActive: T.bool,
69-
disabled: T.bool,
70-
autoFocus: T.bool,
71-
testid: T.string,
72-
}
73-
74-
Input.defaultProps = {
75-
behavior: 'default',
76-
placeholder: '',
77-
value: null,
78-
onChange: null,
79-
prefixIcon: null,
80-
prefixActive: false,
81-
suffixIcon: null,
82-
suffixActive: false,
83-
disabled: false,
84-
autoFocus: false,
85-
testid: 'input',
86-
}
87-
8874
export default React.memo(Input)

‎src/components/Input/styles/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { css, theme } from '@/utils'
77
type IInput = {
88
hasPrefix: boolean
99
hasSuffix: boolean
10+
spellcheck: string
1011
}
1112

1213
export const Wrapper = styled.div.attrs(({ testid }: TTestable) => ({

‎src/components/Input/styles/textarea.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,18 @@ import { theme } from '@/utils'
66

77
import { baseInput } from './index'
88

9+
type TWrapper = TTestable | { spellcheck: string }
10+
911
export const Wrapper = styled(TextareaAutosize).attrs(
1012
({ testid }: TTestable) => ({
1113
'data-test-id': testid,
1214
}),
13-
)<TTestable>`
15+
)<TWrapper>`
1416
${baseInput};
15-
background-color: #0b2631;
17+
color: ${theme('form.text')};
18+
min-height: 56px;
19+
padding: 6px 10px;
20+
background-color: #06303b;
1621
border: 1px solid;
1722
border-color: ${theme('editor.border')};
1823
resize: none;

0 commit comments

Comments
 (0)