From 06c55be6a50c74c7567db31ae5769cb0e77cbdf8 Mon Sep 17 00:00:00 2001 From: austinkelsay Date: Mon, 9 Oct 2023 16:08:33 -0500 Subject: [PATCH 1/4] crosspost to nostr checkbox only appears on discussion forms --- components/adv-post-form.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/components/adv-post-form.js b/components/adv-post-form.js index 6fea99dd..4345ce58 100644 --- a/components/adv-post-form.js +++ b/components/adv-post-form.js @@ -7,6 +7,7 @@ import Info from './info' import { numWithUnits } from '../lib/format' import styles from './adv-post-form.module.css' import { useMe } from './me' +import { useRouter } from 'next/router' const EMPTY_FORWARD = { nym: '', pct: '' } @@ -19,6 +20,7 @@ export function AdvPostInitial ({ forward, boost }) { export default function AdvPostForm () { const me = useMe() + const router = useRouter() return ( - {me && + {me && router.query.type === 'discussion' && crosspost to nostr From cdd3e4fdd4745cfa585ae4618b506b307d2a50c9 Mon Sep 17 00:00:00 2001 From: austinkelsay Date: Wed, 11 Oct 2023 17:26:25 -0500 Subject: [PATCH 2/4] Removing a tag, retested crossposts and edits --- components/use-crossposter.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/components/use-crossposter.js b/components/use-crossposter.js index 06d70520..62f5beee 100644 --- a/components/use-crossposter.js +++ b/components/use-crossposter.js @@ -6,7 +6,6 @@ import { useQuery } from '@apollo/client' import { SETTINGS } from '../fragments/users' async function discussionToEvent (item) { - const pubkey = await window.nostr.getPublicKey() const createdAt = Math.floor(Date.now() / 1000) return { @@ -14,8 +13,7 @@ async function discussionToEvent (item) { kind: 30023, content: item.text, tags: [ - ['d', `https://stacker.news/items/${item.id}`], - ['a', `30023:${pubkey}:https://stacker.news/items/${item.id}`, 'wss://relay.nostr.band'], + ['d', item.id.toString()], ['title', item.title], ['published_at', createdAt.toString()] ] From 99ce6c6e45fa98f72689225cc7e3ca7f1f4ba39f Mon Sep 17 00:00:00 2001 From: Satoshi Nakamoto Date: Thu, 12 Oct 2023 12:15:11 -0400 Subject: [PATCH 3/4] Add a discussion post with a lot of comments to help debug in dev to the seed file --- prisma/seed.js | 33 +++++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/prisma/seed.js b/prisma/seed.js index 2f102eaa..6202eb61 100644 --- a/prisma/seed.js +++ b/prisma/seed.js @@ -1,5 +1,27 @@ const { PrismaClient } = require('@prisma/client') const prisma = new PrismaClient() + +function selectRandomly (items) { + return items[Math.floor(Math.random() * items.length)] +} + +async function addComments (parentIds, nComments, userIds, commentText) { + const clonedParentIds = [...parentIds] + const clonedUserIds = [...userIds] + for (let i = 0; i < nComments; i++) { + const selectedParent = selectRandomly(clonedParentIds) + const selectedUserId = selectRandomly(clonedUserIds) + const newComment = await prisma.item.create({ + data: { + parentId: selectedParent, + userId: selectedUserId, + text: commentText + } + }) + clonedParentIds.push(newComment.id) + } +} + async function main () { const k00b = await prisma.user.upsert({ where: { name: 'k00b' }, @@ -155,6 +177,17 @@ async function main () { } } }) + + const bigCommentPost = await prisma.item.create({ + data: { + title: 'a discussion post with a lot of comments', + text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', + userId: k00b.id, + subName: 'bitcoin' + } + }) + + addComments([bigCommentPost.id], 200, [k00b.id, anon.id, satoshi.id, greg.id, stan.id], 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.') } main() .catch(e => { From a7e016e9ba01a318d394f62ad2f0f65aa859e839 Mon Sep 17 00:00:00 2001 From: keyan Date: Thu, 12 Oct 2023 12:46:22 -0500 Subject: [PATCH 4/4] fix? markdown input rerendering more than needed --- components/form.js | 236 ++++++++++++++++++++++++--------------------- 1 file changed, 126 insertions(+), 110 deletions(-) diff --git a/components/form.js b/components/form.js index eec9212b..a005be46 100644 --- a/components/form.js +++ b/components/form.js @@ -91,6 +91,7 @@ export function InputSkeleton ({ label, hint }) { ) } +const DEFAULT_MENTION_INDICES = { start: -1, end: -1 } export function MarkdownInput ({ label, topLevel, groupClassName, onChange, setHasImgLink, onKeyDown, innerRef, ...props }) { const [tab, setTab] = useState('write') const [, meta, helpers] = useField(props) @@ -122,7 +123,7 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, setH }, [innerRef, selectionRange.start, selectionRange.end]) const [mentionQuery, setMentionQuery] = useState() - const [mentionIndices, setMentionIndices] = useState({ start: -1, end: -1 }) + const [mentionIndices, setMentionIndices] = useState(DEFAULT_MENTION_INDICES) const [userSuggestDropdownStyle, setUserSuggestDropdownStyle] = useState({}) const insertMention = useCallback((name) => { const { start, end } = mentionIndices @@ -133,7 +134,79 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, setH helpers.setValue(updatedValue) setSelectionRange({ start: first.length, end: first.length }) innerRef.current.focus() - }, [mentionIndices, innerRef, helpers]) + }, [mentionIndices, innerRef, helpers?.setValue]) + + const onChangeInner = useCallback((formik, e) => { + if (onChange) onChange(formik, e) + if (setHasImgLink) { + setHasImgLink(mdHas(e.target.value, ['link', 'image'])) + } + // check for mention editing + const { value, selectionStart } = e.target + let priorSpace = -1 + for (let i = selectionStart - 1; i >= 0; i--) { + if (/\s|\n/.test(value[i])) { + priorSpace = i + break + } + } + let nextSpace = value.length + for (let i = selectionStart; i <= value.length; i++) { + if (/\s|\n/.test(value[i])) { + nextSpace = i + break + } + } + const currentSegment = value.substring(priorSpace + 1, nextSpace) + + // set the query to the current character segment and note where it appears + if (/^@[\w_]*$/.test(currentSegment)) { + setMentionQuery(currentSegment) + setMentionIndices({ start: priorSpace + 1, end: nextSpace }) + const { top, left } = textAreaCaret(e.target, e.target.selectionStart) + setUserSuggestDropdownStyle({ + position: 'absolute', + top: `${top + Number(window.getComputedStyle(e.target).lineHeight.replace('px', ''))}px`, + left: `${left}px` + }) + } else { + setMentionQuery(undefined) + setMentionIndices(DEFAULT_MENTION_INDICES) + } + }, [onChange, setHasImgLink, setMentionQuery, setMentionIndices, setUserSuggestDropdownStyle]) + + const onKeyDownInner = useCallback((userSuggestOnKeyDown) => { + return (e) => { + const metaOrCtrl = e.metaKey || e.ctrlKey + if (metaOrCtrl) { + if (e.key === 'k') { + // some browsers use CTRL+K to focus search bar so we have to prevent that behavior + e.preventDefault() + insertMarkdownLinkFormatting(innerRef.current, helpers.setValue, setSelectionRange) + } + if (e.key === 'b') { + // some browsers use CTRL+B to open bookmarks so we have to prevent that behavior + e.preventDefault() + insertMarkdownBoldFormatting(innerRef.current, helpers.setValue, setSelectionRange) + } + if (e.key === 'i') { + // some browsers might use CTRL+I to do something else so prevent that behavior too + e.preventDefault() + insertMarkdownItalicFormatting(innerRef.current, helpers.setValue, setSelectionRange) + } + if (e.key === 'Tab' && e.altKey) { + e.preventDefault() + insertMarkdownTabFormatting(innerRef.current, helpers.setValue, setSelectionRange) + } + } + + if (!metaOrCtrl) { + userSuggestOnKeyDown(e) + } + + if (onKeyDown) onKeyDown(e) + } + }, [innerRef, helpers?.setValue, setSelectionRange, onKeyDown]) return ( @@ -159,76 +232,10 @@ export function MarkdownInput ({ label, topLevel, groupClassName, onChange, setH dropdownStyle={userSuggestDropdownStyle} >{({ onKeyDown: userSuggestOnKeyDown }) => ( { - if (onChange) onChange(formik, e) - if (setHasImgLink) { - setHasImgLink(mdHas(e.target.value, ['link', 'image'])) - } - // check for mention editing - const { value, selectionStart } = e.target - let priorSpace = -1 - for (let i = selectionStart - 1; i >= 0; i--) { - if (/\s|\n/.test(value[i])) { - priorSpace = i - break - } - } - let nextSpace = value.length - for (let i = selectionStart; i <= value.length; i++) { - if (/\s|\n/.test(value[i])) { - nextSpace = i - break - } - } - const currentSegment = value.substring(priorSpace + 1, nextSpace) - - // set the query to the current character segment and note where it appears - if (/^@[\w_]*$/.test(currentSegment)) { - setMentionQuery(currentSegment) - setMentionIndices({ start: priorSpace + 1, end: nextSpace }) - } else { - setMentionQuery(undefined) - setMentionIndices({ start: -1, end: -1 }) - } - - const { top, left } = textAreaCaret(e.target, e.target.selectionStart) - setUserSuggestDropdownStyle({ - position: 'absolute', - top: `${top + Number(window.getComputedStyle(e.target).lineHeight.replace('px', ''))}px`, - left: `${left}px` - }) - }} innerRef={innerRef} - onKeyDown={(e) => { - const metaOrCtrl = e.metaKey || e.ctrlKey - if (metaOrCtrl) { - if (e.key === 'k') { - // some browsers use CTRL+K to focus search bar so we have to prevent that behavior - e.preventDefault() - insertMarkdownLinkFormatting(innerRef.current, helpers.setValue, setSelectionRange) - } - if (e.key === 'b') { - // some browsers use CTRL+B to open bookmarks so we have to prevent that behavior - e.preventDefault() - insertMarkdownBoldFormatting(innerRef.current, helpers.setValue, setSelectionRange) - } - if (e.key === 'i') { - // some browsers might use CTRL+I to do something else so prevent that behavior too - e.preventDefault() - insertMarkdownItalicFormatting(innerRef.current, helpers.setValue, setSelectionRange) - } - if (e.key === 'Tab' && e.altKey) { - e.preventDefault() - insertMarkdownTabFormatting(innerRef.current, helpers.setValue, setSelectionRange) - } - } - - if (!metaOrCtrl) { - userSuggestOnKeyDown(e) - } - - if (onKeyDown) onKeyDown(e) - }} + {...props} + onChange={onChangeInner} + onKeyDown={onKeyDownInner(userSuggestOnKeyDown)} />)} @@ -300,6 +307,32 @@ function InputInner ({ const storageKey = storageKeyPrefix ? storageKeyPrefix + '-' + props.name : undefined + const onKeyDownInner = useCallback((e) => { + const metaOrCtrl = e.metaKey || e.ctrlKey + if (metaOrCtrl) { + if (e.key === 'Enter') formik?.submitForm() + } + + if (onKeyDown) onKeyDown(e) + }, [formik?.submitForm, onKeyDown]) + + const onChangeInner = useCallback((e) => { + field?.onChange(e) + + if (storageKey) { + window.localStorage.setItem(storageKey, e.target.value) + } + + if (onChange) { + onChange(formik, e) + } + }, [field?.onChange, storageKey, onChange]) + + const onBlurInner = useCallback((e) => { + field?.onBlur?.(e) + onBlur && onBlur(e) + }, [field?.onBlur, onBlur]) + useEffect(() => { if (overrideValue) { helpers.setValue(overrideValue) @@ -331,31 +364,12 @@ function InputInner ({ {prepend} { - const metaOrCtrl = e.metaKey || e.ctrlKey - if (metaOrCtrl) { - if (e.key === 'Enter') formik?.submitForm() - } - - if (onKeyDown) onKeyDown(e) - }} ref={innerRef} - {...field} {...props} - onChange={(e) => { - field.onChange(e) - - if (storageKey) { - window.localStorage.setItem(storageKey, e.target.value) - } - - if (onChange) { - onChange(formik, e) - } - }} - onBlur={(e) => { - field.onBlur?.(e) - onBlur && onBlur(e) - }} + {...field} + {...props} + onKeyDown={onKeyDownInner} + onChange={onChangeInner} + onBlur={onBlurInner} isInvalid={invalid} isValid={showValid && meta.initialValue !== meta.value && meta.touched && !meta.error} /> @@ -393,6 +407,7 @@ function InputInner ({ ) } +const INITIAL_SUGGESTIONS = { array: [], index: 0 } export function UserSuggest ({ query, onSelect, dropdownStyle, children }) { const [getUsers] = useLazyQuery(TOP_USERS, { onCompleted: data => { @@ -405,7 +420,6 @@ export function UserSuggest ({ query, onSelect, dropdownStyle, children }) { } }) - const INITIAL_SUGGESTIONS = { array: [], index: 0 } const [suggestions, setSuggestions] = useState(INITIAL_SUGGESTIONS) const resetSuggestions = useCallback(() => setSuggestions(INITIAL_SUGGESTIONS), []) @@ -602,7 +616,7 @@ export function Form ({ } }, []) - function clearLocalStorage (values) { + const clearLocalStorage = useCallback((values) => { Object.keys(values).forEach(v => { window.localStorage.removeItem(storageKeyPrefix + '-' + v) if (Array.isArray(values[v])) { @@ -615,7 +629,7 @@ export function Form ({ }) } }) - } + }, [storageKeyPrefix]) // if `invoiceable` is set, // support for payment per invoice if they are lurking or don't have enough balance @@ -627,6 +641,19 @@ export function Form ({ onSubmit = useInvoiceable(onSubmit, { callback: clearLocalStorage, ...options }) } + const onSubmitInner = useCallback(async (values, ...args) => { + try { + if (onSubmit) { + const options = await onSubmit(values, ...args) + if (!storageKeyPrefix || options?.keepLocalStorage) return + clearLocalStorage(values) + } + } catch (err) { + console.log(err) + toaster.danger(err.message || err.toString?.()) + } + }, [onSubmit, toaster, clearLocalStorage, storageKeyPrefix]) + return ( { - try { - if (onSubmit) { - const options = await onSubmit(values, ...args) - if (!storageKeyPrefix || options?.keepLocalStorage) return - clearLocalStorage(values) - } - } catch (err) { - console.log(err) - toaster.danger(err.message || err.toString?.()) - } - }} + onSubmit={onSubmitInner} innerRef={innerRef} >