a tool for shared writing and social publishing
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

add speedylink and use all over the place

Basically prefetch on hover or pointer down

+62 -50
+5 -6
app/[leaflet_id]/Actions.tsx
··· 5 5 } from "app/lish/createPub/getPublicationURL"; 6 6 import { ActionButton } from "components/ActionBar/ActionButton"; 7 7 import { GoBackSmall } from "components/Icons/GoBackSmall"; 8 - import { PaintSmall } from "components/Icons/PaintSmall"; 9 8 import { PublishSmall } from "components/Icons/PublishSmall"; 10 9 import { useLeafletPublicationData } from "components/PageSWRDataProvider"; 10 + import { SpeedyLink } from "components/SpeedyLink"; 11 11 import { useToaster } from "components/Toast"; 12 12 import { DotLoader } from "components/utils/DotLoader"; 13 - import Link from "next/link"; 14 13 import { useParams, useRouter } from "next/navigation"; 15 14 import { useState } from "react"; 16 15 import { useReplicache } from "src/replicache"; ··· 26 25 }; 27 26 }) => { 28 27 return ( 29 - <Link 28 + <SpeedyLink 30 29 href={`${getBasePublicationURL(props.publication)}/dashboard`} 31 30 className="hover:!no-underline" 32 31 > ··· 34 33 icon={<GoBackSmall className="shrink-0" />} 35 34 label="To Pub" 36 35 /> 37 - </Link> 36 + </SpeedyLink> 38 37 ); 39 38 }; 40 39 ··· 84 83 content: ( 85 84 <div> 86 85 {pub.doc ? "Updated! " : "Published! "} 87 - <Link 86 + <SpeedyLink 88 87 href={`${getPublicationURL(pub.publications)}/${doc?.rkey}`} 89 88 > 90 89 link 91 - </Link> 90 + </SpeedyLink> 92 91 </div> 93 92 ), 94 93 type: "success",
+5 -14
app/home/LeafletPreview.tsx
··· 29 29 PublicationMetadata, 30 30 PublicationMetadataPreview, 31 31 } from "components/Pages/PublicationMetadata"; 32 + import { SpeedyLink } from "components/SpeedyLink"; 32 33 33 34 export const LeafletPreview = (props: { 34 35 draft?: boolean; ··· 97 98 </div> 98 99 </div> 99 100 </ThemeBackgroundProvider> 100 - <LeafletPreviewLink id={props.token.id} /> 101 + <SpeedyLink 102 + href={`/${props.token.id}`} 103 + className={`no-underline sm:hover:no-underline text-primary absolute inset-0 w-full h-full`} 104 + /> 101 105 </div> 102 106 ) : ( 103 107 <LeafletAreYouSure token={props.token} setState={setState} /> ··· 249 253 </div> 250 254 ); 251 255 }; 252 - 253 - const LeafletPreviewLink = (props: { id: string }) => { 254 - let [prefetch, setPrefetch] = useState(false); 255 - return ( 256 - <Link 257 - onMouseEnter={() => setPrefetch(true)} 258 - onPointerDown={() => setPrefetch(true)} 259 - prefetch={prefetch} 260 - href={`/${props.id}`} 261 - className={`no-underline sm:hover:no-underline text-primary absolute inset-0 w-full h-full`} 262 - /> 263 - ); 264 - };
+6 -5
app/home/Publications.tsx
··· 15 15 import { AtUri } from "@atproto/syntax"; 16 16 import { blobRefToSrc } from "src/utils/blobRefToSrc"; 17 17 import { PublicationThemeProvider } from "components/ThemeManager/PublicationThemeProvider"; 18 + import { SpeedyLink } from "components/SpeedyLink"; 18 19 19 20 export const MyPublicationList = () => { 20 21 let { identity } = useIdentityData(); ··· 23 24 <div className="pubListWrapper w-full sm:w-[200px] flex flex-col sm:gap-1 container py-2 sm:p-0 sm:bg-transparent sm:border-0"> 24 25 <div className="flex justify-between items-center font-bold text-tertiary text-sm px-2 "> 25 26 Publications 26 - <Link 27 - href={"./lish/createPub"} 27 + <SpeedyLink 28 + href={"/lish/createPub"} 28 29 className="pubListCreateNew text-accent-contrast font-bold hover:text-accent-contrast" 29 30 > 30 31 <AddTiny /> 31 - </Link> 32 + </SpeedyLink> 32 33 </div> 33 34 <PublicationList publications={identity.publications} /> 34 35 </div> ··· 65 66 let showPageBackground = !!record?.theme?.showPageBackground; 66 67 return ( 67 68 <PublicationThemeProvider record={record} local pub_creator={pub_creator}> 68 - <Link 69 + <SpeedyLink 69 70 className="pubListItem sm:w-full sm:min-w-0 min-w-40 w-36 px-1 sm:px-2 py-1 sm:h-max hover:no-underline " 70 71 href={`${getBasePublicationURL(props)}/dashboard`} 71 72 > ··· 94 95 {props.name} 95 96 </h4> 96 97 </div> 97 - </Link> 98 + </SpeedyLink> 98 99 </PublicationThemeProvider> 99 100 ); 100 101 }
+3 -5
app/lish/[did]/[publication]/[rkey]/PostHeader/PostHeader.tsx
··· 1 1 "use client"; 2 - import Link from "next/link"; 3 2 import { PubLeafletDocument, PubLeafletPublication } from "lexicons/api"; 4 3 import { getPublicationURL } from "app/lish/createPub/getPublicationURL"; 5 4 import { Interactions } from "../Interactions/Interactions"; 6 5 import { PostPageData } from "../getPostPageData"; 7 6 import { ProfileViewDetailed } from "@atproto/api/dist/client/types/app/bsky/actor/defs"; 8 7 import { useIdentityData } from "components/IdentityProvider"; 9 - import { blobRefToSrc } from "src/utils/blobRefToSrc"; 10 - import { AtUri } from "@atproto/syntax"; 11 8 import { EditTiny } from "components/Icons/EditTiny"; 9 + import { SpeedyLink } from "components/SpeedyLink"; 12 10 13 11 export function PostHeader(props: { 14 12 data: PostPageData; ··· 40 38 <div className="max-w-prose w-full mx-auto" id="post-header"> 41 39 <div className="pubHeader flex flex-col pb-5"> 42 40 <div className="flex justify-between w-full"> 43 - <Link 41 + <SpeedyLink 44 42 className="font-bold hover:no-underline text-accent-contrast" 45 43 href={ 46 44 document && ··· 50 48 } 51 49 > 52 50 {props.name} 53 - </Link> 51 + </SpeedyLink> 54 52 {identity && 55 53 identity.atp_did === 56 54 document.documents_in_publications[0]?.publications
+7 -9
app/lish/[did]/[publication]/dashboard/Actions.tsx
··· 9 9 import { ShareSmall } from "components/Icons/ShareSmall"; 10 10 import { Menu } from "components/Layout"; 11 11 import { MenuItem } from "components/Layout"; 12 - import Link from "next/link"; 13 12 import { HomeSmall } from "components/Icons/HomeSmall"; 14 13 import { EditPubForm } from "app/lish/createPub/UpdatePubForm"; 15 14 import { getPublicationURL } from "app/lish/createPub/getPublicationURL"; ··· 18 17 import { PaintSmall } from "components/Icons/PaintSmall"; 19 18 import { PubThemeSetter } from "components/ThemeManager/PubThemeSetter"; 20 19 import { useIsMobile } from "src/hooks/isMobile"; 20 + import { SpeedyLink } from "components/SpeedyLink"; 21 21 22 22 export const Actions = (props: { publication: string }) => { 23 23 return ( 24 24 <> 25 25 <Media mobile> 26 - <Link 26 + <SpeedyLink 27 27 href="/home" 28 - prefetch 29 28 className="hover:no-underline" 30 29 style={{ textDecorationLine: "none !important" }} 31 30 > 32 31 <ActionButton icon={<HomeSmall />} label="Go Home" /> 33 - </Link> 32 + </SpeedyLink> 34 33 </Media> 35 34 <NewDraftActionButton publication={props.publication} /> 36 35 <PublicationShareButton /> ··· 38 37 <PublicationSettingsButton publication={props.publication} /> 39 38 <hr className="border-border-light" /> 40 39 <Media mobile={false}> 41 - <Link 40 + <SpeedyLink 42 41 href="/home" 43 - prefetch 44 42 className="hover:no-underline" 45 43 style={{ textDecorationLine: "none !important" }} 46 44 > 47 45 <ActionButton icon={<HomeSmall />} label="Go Home" /> 48 - </Link> 46 + </SpeedyLink> 49 47 </Media> 50 48 </> 51 49 ); ··· 73 71 } 74 72 > 75 73 <MenuItem onSelect={() => {}}> 76 - <Link 74 + <SpeedyLink 77 75 href={getPublicationURL(pub!)} 78 76 className="text-secondary hover:no-underline" 79 77 > ··· 81 79 <div className="font-normal text-tertiary text-sm"> 82 80 View your publication as a reader 83 81 </div> 84 - </Link> 82 + </SpeedyLink> 85 83 </MenuItem> 86 84 <MenuItem 87 85 onSelect={(e) => {
+3 -4
app/lish/[did]/[publication]/dashboard/DraftList.tsx
··· 1 1 "use client"; 2 2 3 - import Link from "next/link"; 4 3 import { NewDraftSecondaryButton } from "./NewDraftButton"; 5 4 import React, { useState } from "react"; 6 5 import { usePublicationData } from "./PublicationSWRProvider"; 7 6 import { Menu, MenuItem } from "components/Layout"; 8 7 import { deleteDraft } from "./deleteDraft"; 9 8 import { DeleteSmall } from "components/Icons/DeleteSmall"; 10 - import { PrimaryKey } from "drizzle-orm/sqlite-core"; 11 9 import { ButtonPrimary } from "components/Buttons"; 12 10 import { MoreOptionsVerticalTiny } from "components/Icons/MoreOptionsVerticalTiny"; 11 + import { SpeedyLink } from "components/SpeedyLink"; 13 12 14 13 export function DraftList() { 15 14 let { data: pub_data } = usePublicationData(); ··· 35 34 let [open, setOpen] = useState(false); 36 35 return ( 37 36 <div className="flex flex-row gap-2 items-start"> 38 - <Link 37 + <SpeedyLink 39 38 key={props.id} 40 39 href={`/${props.id}`} 41 40 className="flex flex-col gap-0 hover:!no-underline grow" ··· 46 45 <h3 className="text-tertiary italic">Untitled</h3> 47 46 )} 48 47 <div className="text-secondary italic">{props.description}</div> 49 - </Link> 48 + </SpeedyLink> 50 49 <Menu 51 50 open={open} 52 51 onOpenChange={(o) => setOpen(o)}
+6 -5
app/lish/[did]/[publication]/dashboard/PublishedPostsLists.tsx
··· 1 1 "use client"; 2 - import Link from "next/link"; 3 2 import { AtUri } from "@atproto/syntax"; 4 3 import { PubLeafletDocument } from "lexicons/api"; 5 4 import { EditTiny } from "components/Icons/EditTiny"; ··· 10 9 import { getPublicationURL } from "app/lish/createPub/getPublicationURL"; 11 10 import { Menu, MenuItem } from "components/Layout"; 12 11 import { deletePost } from "./deletePost"; 13 - import { mutate } from "swr"; 14 - import { Button } from "react-aria-components"; 15 12 import { ButtonPrimary } from "components/Buttons"; 16 13 import { MoreOptionsVerticalTiny } from "components/Icons/MoreOptionsVerticalTiny"; 17 14 import { DeleteSmall } from "components/Icons/DeleteSmall"; 18 15 import { ShareSmall } from "components/Icons/ShareSmall"; 19 16 import { ShareButton } from "components/ShareOptions"; 17 + import { SpeedyLink } from "components/SpeedyLink"; 20 18 21 19 export function PublishedPostsList() { 22 20 let { data: publication } = usePublicationData(); ··· 66 64 </a> 67 65 <div className="flex justify-start align-top flex-row gap-1"> 68 66 {leaflet && ( 69 - <Link className="pt-[6px]" href={`/${leaflet.leaflet}`}> 67 + <SpeedyLink 68 + className="pt-[6px]" 69 + href={`/${leaflet.leaflet}`} 70 + > 70 71 <EditTiny /> 71 - </Link> 72 + </SpeedyLink> 72 73 )} 73 74 <Options document_uri={doc.documents.uri} /> 74 75 </div>
+3 -2
app/lish/[did]/[publication]/page.tsx
··· 10 10 PublicationBackgroundProvider, 11 11 PublicationThemeProvider, 12 12 } from "components/ThemeManager/PublicationThemeProvider"; 13 + import { SpeedyLink } from "components/SpeedyLink"; 13 14 14 15 export default async function Publication(props: { 15 16 params: Promise<{ publication: string; did: string }>; ··· 125 126 return ( 126 127 <React.Fragment key={doc.documents?.uri}> 127 128 <div className="flex w-full "> 128 - <Link 129 + <SpeedyLink 129 130 href={`${getPublicationURL(publication)}/${uri.rkey}`} 130 131 className="publishedPost grow flex flex-col hover:!no-underline" 131 132 > ··· 144 145 }, 145 146 )}{" "} 146 147 </p> 147 - </Link> 148 + </SpeedyLink> 148 149 </div> 149 150 <hr className="last:hidden border-border-light" /> 150 151 </React.Fragment>
+24
components/SpeedyLink.tsx
··· 1 + "use client"; 2 + import Link from "next/link"; 3 + import { useState } from "react"; 4 + 5 + export function SpeedyLink(props: { 6 + href: string; 7 + className?: string; 8 + style?: React.CSSProperties; 9 + children?: React.ReactNode; 10 + }) { 11 + let [prefetch, setPrefetch] = useState(false); 12 + return ( 13 + <Link 14 + onMouseEnter={() => setPrefetch(true)} 15 + onPointerDown={() => setPrefetch(true)} 16 + style={props.style} 17 + prefetch={prefetch} 18 + href={props.href} 19 + className={props.className} 20 + > 21 + {props.children} 22 + </Link> 23 + ); 24 + }