ekzyis
/
stacker.news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Disable reply button while uploading (#627) 

Co-authored-by: ekzyis <ek@stacker.news>
This commit is contained in:
ekzyis 2023-11-13 16:30:01 +01:00 committed by GitHub
parent beade6795c
commit 503f4c380b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/fee-button.js
View File

@ -64,6 +64,7 @@ export function postCommentUseRemoteLineItems ({ parentId, me } = {}) {
export function FeeButtonProvider ({ baseLineItems = {}, useRemoteLineItems = () => null, children }) {
const [lineItems, setLineItems] = useState({})
const [disabled, setDisabled] = useState(false)
const remoteLineItems = useRemoteLineItems()
@ -79,9 +80,11 @@ export function FeeButtonProvider ({ baseLineItems = {}, useRemoteLineItems = ()
return {
lines,
merge: mergeLineItems,
total: Object.values(lines).reduce((acc, { modifier }) => modifier(acc), 0)
total: Object.values(lines).reduce((acc, { modifier }) => modifier(acc), 0),
disabled,
setDisabled
}
}, [baseLineItems, lineItems, remoteLineItems, mergeLineItems])
}, [baseLineItems, lineItems, remoteLineItems, mergeLineItems, disabled, setDisabled])
return (
<FeeButtonContext.Provider value={value}>
@ -96,12 +99,12 @@ export function useFeeButton () {
export default function FeeButton ({ ChildButton = SubmitButton, variant, text, disabled }) {
const me = useMe()
const { lines, total } = useFeeButton()
const { lines, total, disabled: ctxDisabled } = useFeeButton()
return (
<div className={styles.feeButton}>
<ActionTooltip overlayText={numWithUnits(total, { abbreviate: false })}>
<ChildButton variant={variant} disabled={disabled}>{text}{total > 1 && <small> {numWithUnits(total, { abbreviate: false, format: true })}</small>}</ChildButton>
<ChildButton variant={variant} disabled={disabled || ctxDisabled}>{text}{total > 1 && <small> {numWithUnits(total, { abbreviate: false, format: true })}</small>}</ChildButton>
</ActionTooltip>
{!me && <AnonInfo />}
{total > 1 &&

5
components/form.js
View File

@ -105,7 +105,7 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, onKe
innerRef = innerRef || useRef(null)
const imageUploadRef = useRef(null)
const previousTab = useRef(tab)
const { merge } = useFeeButton()
const { merge, setDisabled: setSubmitDisabled } = useFeeButton()
const toaster = useToast()
const [updateImageFeesInfo] = useLazyQuery(gql`
query imageFeesInfo($s3Keys: [Int]!) {
@ -284,6 +284,7 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, onKe
if (text) text += '\n\n'
text += `![Uploading ${file.name}…]()`
helpers.setValue(text)
setSubmitDisabled?.(true)
}}
onSuccess={({ url, name }) => {
let text = innerRef.current.value
@ -291,11 +292,13 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, onKe
helpers.setValue(text)
const s3Keys = [...text.matchAll(AWS_S3_URL_REGEXP)].map(m => Number(m[1]))
updateImageFeesInfo({ variables: { s3Keys } })
setSubmitDisabled?.(false)
}}
onError={({ name }) => {
let text = innerRef.current.value
text = text.replace(`![Uploading ${name}…]()`, '')
helpers.setValue(text)
setSubmitDisabled?.(false)
}}
>
<AddImageIcon width={18} height={18} />