yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: useBoolean hook (#2314)

Browse Source 
* feat: Add useBoolean hook and example usage

* More example usage

* chore: More useBoolean conversion
This commit is contained in:
Tom Moor
2021-07-15 15:27:03 -04:00
committed by GitHub
parent 8884da8a4b
commit 31714efb0b
11 changed files with 87 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/components/Sidebar/components/CollectionLink.js
View File

@@ -12,6 +12,7 @@ import DropCursor from "./DropCursor";
import DropToImport from "./DropToImport";
import EditableTitle from "./EditableTitle";
import SidebarLink from "./SidebarLink";
import useBoolean from "hooks/useBoolean";
import useStores from "hooks/useStores";
import CollectionMenu from "menus/CollectionMenu";
import CollectionSortMenu from "menus/CollectionSortMenu";
@@ -35,7 +36,7 @@ function CollectionLink({
isDraggingAnyCollection,
onChangeDragging,
}: Props) {
const [menuOpen, setMenuOpen] = React.useState(false);
const [menuOpen, handleMenuOpen, handleMenuClose] = useBoolean();
const handleTitleChange = React.useCallback(
async (name: string) => {
@@ -163,14 +164,14 @@ function CollectionLink({
{can.update && (
<CollectionSortMenuWithMargin
collection={collection}
onOpen={() => setMenuOpen(true)}
onClose={() => setMenuOpen(false)}
onOpen={handleMenuOpen}
onClose={handleMenuClose}
/>
)}
<CollectionMenu
collection={collection}
onOpen={() => setMenuOpen(true)}
onClose={() => setMenuOpen(false)}
onOpen={handleMenuOpen}
onClose={handleMenuClose}
/>
</>
}

7
app/components/Sidebar/components/DocumentLink.js
View File

@@ -12,6 +12,7 @@ import DropCursor from "./DropCursor";
import DropToImport from "./DropToImport";
import EditableTitle from "./EditableTitle";
import SidebarLink from "./SidebarLink";
import useBoolean from "hooks/useBoolean";
import useStores from "hooks/useStores";
import DocumentMenu from "menus/DocumentMenu";
import { type NavigationNode } from "types";
@@ -120,7 +121,7 @@ function DocumentLink(
[documents, document]
);
const [menuOpen, setMenuOpen] = React.useState(false);
const [menuOpen, handleMenuOpen, handleMenuClose] = useBoolean();
const isMoving = documents.movingDocumentId === node.id;
const manualSort = collection?.sort.field === "index";
@@ -245,8 +246,8 @@ function DocumentLink(
<Fade>
<DocumentMenu
document={document}
onOpen={() => setMenuOpen(true)}
onClose={() => setMenuOpen(false)}
onOpen={handleMenuOpen}
onClose={handleMenuClose}
/>
</Fade>
) : undefined