nostr/primal-web-app
1
0
Fork 0
mirror of https://github.com/PrimalHQ/primal-web-app.git synced 2024-10-01 17:31:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix zap user feedback

Browse Source
This commit is contained in:
Bojan Mojsilovic 2024-04-22 14:52:37 +02:00
parent 15a0b3d3f1
commit 37a522ecbe
2 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Note/Note.tsx
View File

@ -82,6 +82,7 @@ const Note: Component<{
app?.actions.closeCustomZapModal(); app?.actions.closeCustomZapModal();
batch(() => { batch(() => {
updateFooterState('zappedAmount', () => zapOption.amount || 0); updateFooterState('zappedAmount', () => zapOption.amount || 0);
updateFooterState('satsZapped', (z) => z + (zapOption.amount || 0));
// updateFooterState('zappedNow', () => true); // updateFooterState('zappedNow', () => true);
updateFooterState('zapped', () => true); updateFooterState('zapped', () => true);
updateFooterState('showZapAnim', () => true) updateFooterState('showZapAnim', () => true)
@ -90,6 +91,7 @@ const Note: Component<{
const onSuccessZap = (zapOption: ZapOption) => { const onSuccessZap = (zapOption: ZapOption) => {
app?.actions.closeCustomZapModal(); app?.actions.closeCustomZapModal();
app?.actions.resetCustomZap();
batch(() => { batch(() => {
updateFooterState('zapCount', (z) => z + 1); updateFooterState('zapCount', (z) => z + 1);
// updateFooterState('satsZapped', (z) => z + (zapOption.amount || 0)); // updateFooterState('satsZapped', (z) => z + (zapOption.amount || 0));
@ -103,6 +105,7 @@ const Note: Component<{
const onFailZap = (zapOption: ZapOption) => { const onFailZap = (zapOption: ZapOption) => {
app?.actions.closeCustomZapModal(); app?.actions.closeCustomZapModal();
app?.actions.resetCustomZap();
batch(() => { batch(() => {
updateFooterState('zappedAmount', () => -(zapOption.amount || 0)); updateFooterState('zappedAmount', () => -(zapOption.amount || 0));
updateFooterState('satsZapped', (z) => z - (zapOption.amount || 0)); updateFooterState('satsZapped', (z) => z - (zapOption.amount || 0));
@ -116,6 +119,7 @@ const Note: Component<{
const onCancelZap = (zapOption: ZapOption) => { const onCancelZap = (zapOption: ZapOption) => {
app?.actions.closeCustomZapModal(); app?.actions.closeCustomZapModal();
app?.actions.resetCustomZap();
batch(() => { batch(() => {
updateFooterState('zappedAmount', () => -(zapOption.amount || 0)); updateFooterState('zappedAmount', () => -(zapOption.amount || 0));
updateFooterState('satsZapped', (z) => z - (zapOption.amount || 0)); updateFooterState('satsZapped', (z) => z - (zapOption.amount || 0));
@ -127,13 +131,13 @@ const Note: Component<{
}); });
}; };
const customZapInfo: CustomZapInfo = { const customZapInfo: () => CustomZapInfo = () => ({
note: props.note, note: props.note,
onConfirm: onConfirmZap, onConfirm: onConfirmZap,
onSuccess: onSuccessZap, onSuccess: onSuccessZap,
onFail: onFailZap, onFail: onFailZap,
onCancel: onCancelZap, onCancel: onCancelZap,
}; });
const openReactionModal = (openOn = 'likes') => { const openReactionModal = (openOn = 'likes') => {
app?.actions.openReactionModal(props.note.post.id, { app?.actions.openReactionModal(props.note.post.id, {
@ -150,7 +154,7 @@ const Note: Component<{
props.note, props.note,
noteContextMenu?.getBoundingClientRect(), noteContextMenu?.getBoundingClientRect(),
() => { () => {
app?.actions.openCustomZapModal(customZapInfo); app?.actions.openCustomZapModal(customZapInfo());
}, },
openReactionModal, openReactionModal,
); );
@ -211,7 +215,7 @@ const Note: Component<{
note={props.note} note={props.note}
state={footerState} state={footerState}
updateState={updateFooterState} updateState={updateFooterState}
customZapInfo={customZapInfo} customZapInfo={customZapInfo()}
/> />
</div> </div>
</div> </div>
@ -306,7 +310,7 @@ const Note: Component<{
note={props.note} note={props.note}
state={footerState} state={footerState}
updateState={updateFooterState} updateState={updateFooterState}
customZapInfo={customZapInfo} customZapInfo={customZapInfo()}
wide={true} wide={true}
large={true} large={true}
/> />
@ -369,7 +373,7 @@ const Note: Component<{
note={props.note} note={props.note}
state={footerState} state={footerState}
updateState={updateFooterState} updateState={updateFooterState}
customZapInfo={customZapInfo} customZapInfo={customZapInfo()}
/> />
</div> </div>
</div> </div>

8
src/contexts/AppContext.tsx
View File

@ -71,6 +71,7 @@ export type AppContextStore = {
closeReactionModal: () => void, closeReactionModal: () => void,
openCustomZapModal: (custonZapInfo: CustomZapInfo) => void, openCustomZapModal: (custonZapInfo: CustomZapInfo) => void,
closeCustomZapModal: () => void, closeCustomZapModal: () => void,
resetCustomZap: () => void,
openContextMenu: (note: PrimalNote, position: DOMRect | undefined, openCustomZapModal: () => void, openReactionModal: () => void) => void, openContextMenu: (note: PrimalNote, position: DOMRect | undefined, openCustomZapModal: () => void, openReactionModal: () => void) => void,
closeContextMenu: () => void, closeContextMenu: () => void,
openLnbcModal: (lnbc: string, onPay: () => void) => void, openLnbcModal: (lnbc: string, onPay: () => void) => void,
@ -141,7 +142,7 @@ export const AppProvider = (props: { children: JSXElement }) => {
}; };
const openCustomZapModal = (customZapInfo: CustomZapInfo) => { const openCustomZapModal = (customZapInfo: CustomZapInfo) => {
updateStore('customZap', reconcile({ ...customZapInfo })); updateStore('customZap', () => ({ ...customZapInfo }));
updateStore('showCustomZapModal', () => true); updateStore('showCustomZapModal', () => true);
}; };
@ -149,6 +150,10 @@ export const AppProvider = (props: { children: JSXElement }) => {
updateStore('showCustomZapModal', () => false); updateStore('showCustomZapModal', () => false);
}; };
const resetCustomZap = () => {
updateStore('customZap', () => undefined);
};
const openContextMenu = ( const openContextMenu = (
note: PrimalNote, note: PrimalNote,
position: DOMRect | undefined, position: DOMRect | undefined,
@ -258,6 +263,7 @@ export const AppProvider = (props: { children: JSXElement }) => {
closeReactionModal, closeReactionModal,
openCustomZapModal, openCustomZapModal,
closeCustomZapModal, closeCustomZapModal,
resetCustomZap,
openContextMenu, openContextMenu,
closeContextMenu, closeContextMenu,
openLnbcModal, openLnbcModal,