Kieran/snort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

use redux for NoteCreator state management (#494)

Browse Source 
* use redux for NoteCreator state management

This fixes a bug where the modal closes while replying to a note. This happens if the thread re-renders while you are replying.

Drafts of notes are also now automatically saved unless the user clicks the cancel button.

* fix modal closing bug

* really fix modal closing bug

* fix rebase
This commit is contained in:
Sam Samskies
2023-04-08 02:48:57 -10:00
committed by GitHub
parent eab07add8c
commit b650a1684f
5 changed files with 156 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/app/src/Pages/Layout.tsx
View File

@ -11,6 +11,7 @@ import { bech32ToHex, randomSample, unixNowMs, unwrap } from "Util";
import Icon from "Icons/Icon";
import { RootState } from "State/Store";
import { init, setRelays } from "State/Login";
import { setShow, reset } from "State/NoteCreator";
import { System } from "System";
import ProfileImage from "Element/ProfileImage";
import useLoginFeed from "Feed/LoginFeed";
@ -26,7 +27,9 @@ import { useDmCache } from "Hooks/useDmsCache";
export default function Layout() {
const location = useLocation();
const [show, setShow] = useState(false);
const replyTo = useSelector((s: RootState) => s.noteCreator.replyTo);
const isNoteCreatorShowing = useSelector((s: RootState) => s.noteCreator.show);
const isReplyNoteCreatorShowing = replyTo && isNoteCreatorShowing;
const dispatch = useDispatch();
const navigate = useNavigate();
const { loggedOut, publicKey, relays, preferences, newUserKey } = useSelector((s: RootState) => s.login);
@ -34,10 +37,17 @@ export default function Layout() {
const pub = useEventPublisher();
useLoginFeed();
const handleNoteCreatorButtonClick = () => {
if (replyTo) {
dispatch(reset());
}
dispatch(setShow(true));
};
const shouldHideNoteCreator = useMemo(() => {
const hideOn = ["/settings", "/messages", "/new", "/login", "/donate", "/p/"];
return hideOn.some(a => location.pathname.startsWith(a));
}, [location]);
const hideOn = ["/settings", "/messages", "/new", "/login", "/donate", "/p/", "/e"];
return isReplyNoteCreatorShowing || hideOn.some(a => location.pathname.startsWith(a));
}, [location, isReplyNoteCreatorShowing]);
const shouldHideHeader = useMemo(() => {
const hideOn = ["/login", "/new"];
@ -179,10 +189,10 @@ export default function Layout() {
{!shouldHideNoteCreator && (
<>
<button className="note-create-button" type="button" onClick={() => setShow(!show)}>
<button className="note-create-button" type="button" onClick={handleNoteCreatorButtonClick}>
<Icon name="plus" size={16} />
</button>
<NoteCreator replyTo={undefined} autoFocus={true} show={show} setShow={setShow} />
<NoteCreator />
</>
)}
{window.localStorage.getItem("debug") && <SubDebug />}