+45
-22
src/routes/__root.tsx
+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
+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}`}