an appview-less Bluesky client using Constellation and PDS Queries reddwarf.app
frontend spa bluesky reddwarf microcosm

prevent no active tabs

rimar1337 92264fde efb287ec

Changed files
+46 -23
src
routes
+45 -22
src/routes/__root.tsx
··· 95 95 agent && 96 96 (location.pathname === `/profile/${agent?.did}` || 97 97 location.pathname === `/profile/${encodeURIComponent(agent?.did ?? "")}`); 98 + const isSettings = location.pathname.startsWith("/settings"); 99 + const isSearch = location.pathname.startsWith("/search"); 100 + const isFeeds = location.pathname.startsWith("/feeds"); 101 + 102 + const locationEnum: 103 + | "feeds" 104 + | "search" 105 + | "settings" 106 + | "notifications" 107 + | "profile" 108 + | "home" = isFeeds 109 + ? "feeds" 110 + : isSearch 111 + ? "search" 112 + : isSettings 113 + ? "settings" 114 + : isNotifications 115 + ? "notifications" 116 + : isProfile 117 + ? "profile" 118 + : "home"; 98 119 99 120 const [postOpen, setPostOpen] = useState(false); 100 121 const [postText, setPostText] = useState(""); ··· 191 212 <IconMaterialSymbolsHomeOutline className="w-6 h-6" /> 192 213 } 193 214 ActiveIcon={<IconMaterialSymbolsHome className="w-6 h-6" />} 194 - active={isHome} 215 + active={locationEnum === "home"} 195 216 onClickCallbback={() => 196 217 navigate({ 197 218 to: "/", ··· 208 229 ActiveIcon={ 209 230 <IconMaterialSymbolsNotifications className="w-6 h-6" /> 210 231 } 211 - active={isNotifications} 232 + active={locationEnum === "notifications"} 212 233 onClickCallbback={() => 213 234 navigate({ 214 235 to: "/notifications", ··· 220 241 <MaterialNavItem 221 242 InactiveIcon={<IconMaterialSymbolsTag className="w-6 h-6" />} 222 243 ActiveIcon={<IconMaterialSymbolsTag className="w-6 h-6" />} 223 - active={location.pathname.startsWith("/feeds")} 244 + active={locationEnum === "feeds"} 224 245 onClickCallbback={() => 225 246 navigate({ 226 247 to: "/feeds", ··· 232 253 <MaterialNavItem 233 254 InactiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 234 255 ActiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 235 - active={location.pathname.startsWith("/search")} 256 + active={locationEnum === "search"} 236 257 onClickCallbback={() => 237 258 navigate({ 238 259 to: "/search", ··· 248 269 ActiveIcon={ 249 270 <IconMaterialSymbolsAccountCircle className="w-6 h-6" /> 250 271 } 251 - active={isProfile ?? false} 272 + active={locationEnum === "profile"} 252 273 onClickCallbback={() => { 253 274 if (authed && agent && agent.assertDid) { 254 275 //window.location.href = `/profile/${agent.assertDid}`; ··· 265 286 <IconMaterialSymbolsSettingsOutline className="w-6 h-6" /> 266 287 } 267 288 ActiveIcon={<IconMaterialSymbolsSettings className="w-6 h-6" />} 268 - active={location.pathname.startsWith("/settings")} 289 + active={locationEnum === "settings"} 269 290 onClickCallbback={() => 270 291 navigate({ 271 292 to: "/settings", ··· 425 446 <IconMaterialSymbolsHomeOutline className="w-6 h-6" /> 426 447 } 427 448 ActiveIcon={<IconMaterialSymbolsHome className="w-6 h-6" />} 428 - active={isHome} 449 + active={locationEnum === "home"} 429 450 onClickCallbback={() => 430 451 navigate({ 431 452 to: "/", ··· 443 464 ActiveIcon={ 444 465 <IconMaterialSymbolsNotifications className="w-6 h-6" /> 445 466 } 446 - active={isNotifications} 467 + active={locationEnum === "notifications"} 447 468 onClickCallbback={() => 448 469 navigate({ 449 470 to: "/notifications", ··· 456 477 small 457 478 InactiveIcon={<IconMaterialSymbolsTag className="w-6 h-6" />} 458 479 ActiveIcon={<IconMaterialSymbolsTag className="w-6 h-6" />} 459 - active={location.pathname.startsWith("/feeds")} 480 + active={locationEnum === "feeds"} 460 481 onClickCallbback={() => 461 482 navigate({ 462 483 to: "/feeds", ··· 469 490 small 470 491 InactiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 471 492 ActiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 472 - active={location.pathname.startsWith("/search")} 493 + active={locationEnum === "search"} 473 494 onClickCallbback={() => 474 495 navigate({ 475 496 to: "/search", ··· 486 507 ActiveIcon={ 487 508 <IconMaterialSymbolsAccountCircle className="w-6 h-6" /> 488 509 } 489 - active={isProfile ?? false} 510 + active={locationEnum === "profile"} 490 511 onClickCallbback={() => { 491 512 if (authed && agent && agent.assertDid) { 492 513 //window.location.href = `/profile/${agent.assertDid}`; ··· 504 525 <IconMaterialSymbolsSettingsOutline className="w-6 h-6" /> 505 526 } 506 527 ActiveIcon={<IconMaterialSymbolsSettings className="w-6 h-6" />} 507 - active={location.pathname.startsWith("/settings")} 528 + active={locationEnum === "settings"} 508 529 onClickCallbback={() => 509 530 navigate({ 510 531 to: "/settings", ··· 566 587 <IconMaterialSymbolsHomeOutline className="w-6 h-6" /> 567 588 } 568 589 ActiveIcon={<IconMaterialSymbolsHome className="w-6 h-6" />} 569 - active={isHome} 590 + active={locationEnum === "home"} 570 591 onClickCallbback={() => 571 592 navigate({ 572 593 to: "/", ··· 594 615 small 595 616 InactiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 596 617 ActiveIcon={<IconMaterialSymbolsSearch className="w-6 h-6" />} 597 - active={location.pathname.startsWith("/search")} 618 + active={locationEnum === "search"} 598 619 onClickCallbback={() => 599 620 navigate({ 600 621 to: "/search", ··· 626 647 ActiveIcon={ 627 648 <IconMaterialSymbolsNotifications className="w-6 h-6" /> 628 649 } 629 - active={isNotifications} 650 + active={locationEnum === "notifications"} 630 651 onClickCallbback={() => 631 652 navigate({ 632 653 to: "/notifications", ··· 661 682 ActiveIcon={ 662 683 <IconMaterialSymbolsAccountCircle className="w-6 h-6" /> 663 684 } 664 - active={isProfile ?? false} 685 + active={locationEnum === "profile"} 665 686 onClickCallbback={() => { 666 687 if (authed && agent && agent.assertDid) { 667 688 //window.location.href = `/profile/${agent.assertDid}`; ··· 699 720 <IconMaterialSymbolsSettingsOutline className="w-6 h-6" /> 700 721 } 701 722 ActiveIcon={<IconMaterialSymbolsSettings className="w-6 h-6" />} 702 - active={location.pathname.startsWith("/settings")} 723 + active={locationEnum === "settings"} 703 724 onClickCallbback={() => 704 725 navigate({ 705 726 to: "/settings", ··· 841 862 <div className={`${!small && "mr-2"} ${active ? " " : " "}`}> 842 863 {active ? ActiveIcon : InactiveIcon} 843 864 </div> 844 - {!small && (<span 845 - className={`text-[17px] text-roboto ${active ? "font-medium" : ""}`} 846 - > 847 - {text} 848 - </span>)} 865 + {!small && ( 866 + <span 867 + className={`text-[17px] text-roboto ${active ? "font-medium" : ""}`} 868 + > 869 + {text} 870 + </span> 871 + )} 849 872 </button> 850 873 ); 851 874 }
+1 -1
src/routes/profile.$did/post.$rkey.image.$i.tsx
··· 85 85 e.stopPropagation(); 86 86 e.nativeEvent.stopImmediatePropagation(); 87 87 }} 88 - className="lightbox-sidebar hidden lg:flex overscroll-none disablegutter border-l dark:border-gray-800 was7 border-gray-300 fixed z-50 flex top-0 right-0 flex-col max-w-[350px] min-w-[350px] max-h-screen overflow-y-scroll dark:bg-gray-950 bg-white" 88 + className="lightbox-sidebar hidden lg:flex overscroll-none disablegutter border-l dark:border-gray-800 was7 border-gray-300 fixed z-50 top-0 right-0 flex-col max-w-[350px] min-w-[350px] max-h-screen overflow-y-scroll dark:bg-gray-950 bg-white" 89 89 > 90 90 <ProfilePostComponent 91 91 key={`/profile/${did}/post/${rkey}`}