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

Disable reply button while uploading (#627)

Browse Source 
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 }) { export function FeeButtonProvider ({ baseLineItems = {}, useRemoteLineItems = () => null, children }) {
const [lineItems, setLineItems] = useState({}) const [lineItems, setLineItems] = useState({})
const [disabled, setDisabled] = useState(false)
const remoteLineItems = useRemoteLineItems() const remoteLineItems = useRemoteLineItems()
@ -79,9 +80,11 @@ export function FeeButtonProvider ({ baseLineItems = {}, useRemoteLineItems = ()
return { return {
lines, lines,
merge: mergeLineItems, 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 ( return (
<FeeButtonContext.Provider value={value}> <FeeButtonContext.Provider value={value}>
@ -96,12 +99,12 @@ export function useFeeButton () {
export default function FeeButton ({ ChildButton = SubmitButton, variant, text, disabled }) { export default function FeeButton ({ ChildButton = SubmitButton, variant, text, disabled }) {
const me = useMe() const me = useMe()
const { lines, total } = useFeeButton() const { lines, total, disabled: ctxDisabled } = useFeeButton()
return ( return (
<div className={styles.feeButton}> <div className={styles.feeButton}>
<ActionTooltip overlayText={numWithUnits(total, { abbreviate: false })}> <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> </ActionTooltip>
{!me && <AnonInfo />} {!me && <AnonInfo />}
{total > 1 && {total > 1 &&

5
components/form.js
View File

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