leaflet.pub
a tool for shared writing and social publishing
factor out useDrawerOpen
awarm.space
+17
-10
+12
-8
app/lish/[did]/[publication]/[rkey]/Interactions/InteractionDrawer.tsx
+12
-8
app/lish/[did]/[publication]/[rkey]/Interactions/InteractionDrawer.tsx
···
13
13
comments: Comment[];
14
14
did: string;
15
15
}) => {
16
-
let params = useSearchParams();
17
-
let interactionDrawerSearchParam = params.get("interactionDrawer");
18
-
let { drawerOpen: open, drawer } = useInteractionState();
19
-
if (open === false || (open === undefined && !interactionDrawerSearchParam))
20
-
return null;
21
-
let currentDrawer = drawer || interactionDrawerSearchParam;
16
+
let drawer = useDrawerOpen();
17
+
if (!drawer) return null;
22
18
return (
23
19
<>
24
-
<SandwichSpacer className="!w-1 sm:!w-6" />
25
20
<div className="snap-center h-full flex z-10 shrink-0 w-[calc(var(--page-width-units)-12px)] sm:w-[var(--page-width-units)]">
26
21
<div
27
22
id="interaction-drawer"
28
23
className="opaque-container !rounded-lg h-full w-full px-3 sm:px-4 pt-2 sm:pt-3 pb-6 overflow-scroll "
29
24
>
30
-
{currentDrawer === "quotes" ? (
25
+
{drawer === "quotes" ? (
31
26
<Quotes {...props} />
32
27
) : (
33
28
<Comments
···
40
35
</>
41
36
);
42
37
};
38
+
39
+
export const useDrawerOpen = () => {
40
+
let params = useSearchParams();
41
+
let interactionDrawerSearchParam = params.get("interactionDrawer");
42
+
let { drawerOpen: open, drawer } = useInteractionState();
43
+
if (open === false || (open === undefined && !interactionDrawerSearchParam))
44
+
return null;
45
+
return drawer || interactionDrawerSearchParam;
46
+
};
+5
-2
app/lish/[did]/[publication]/[rkey]/PostPages.tsx
+5
-2
app/lish/[did]/[publication]/[rkey]/PostPages.tsx
···
15
15
import { useIdentityData } from "components/IdentityProvider";
16
16
import { AppBskyFeedDefs } from "@atproto/api";
17
17
import { create } from "zustand/react";
18
-
import { InteractionDrawer } from "./Interactions/InteractionDrawer";
18
+
import {
19
+
InteractionDrawer,
20
+
useDrawerOpen,
21
+
} from "./Interactions/InteractionDrawer";
19
22
import { BookendSpacer, SandwichSpacer } from "components/LeafletLayout";
20
23
import { CSS } from "@react-spring/web";
21
24
import { PageOptionButton } from "components/Pages/PageOptions";
···
67
70
preferences: { showComments?: boolean };
68
71
}) {
69
72
let { identity } = useIdentityData();
70
-
let { drawerOpen } = useInteractionState();
73
+
let drawerOpen = useDrawerOpen();
71
74
let pages = usePostPageUIState((s) => s.pages);
72
75
if (!document || !document.documents_in_publications[0].publications)
73
76
return null;