changign routes

This commit is contained in:
zmeyer44 2023-10-27 17:48:49 -04:00
parent eb090df052
commit 8a29ccf3d4
25 changed files with 168 additions and 167 deletions

View File

@ -1,7 +1,7 @@
"use client";
import Link from "next/link";
import {
RiHome6Fill,
RiCalendarEventFill,
RiCompass3Fill,
RiQuestionAnswerFill,
} from "react-icons/ri";
@ -11,16 +11,16 @@ import { usePathname } from "next/navigation";
export default function BottomNav() {
const pathname = usePathname();
const navigationItems = [
{
href: "/app",
name: "home",
icon: RiHome6Fill,
},
{
href: "/explore",
name: "explore",
icon: RiCompass3Fill,
},
{
href: "/events",
name: "events",
icon: RiCalendarEventFill,
},
{
href: "",
name: "messages",

View File

@ -12,7 +12,7 @@ export default function Header() {
<div className="fixed z-header flex h-[var(--header-height)] w-full grow border-b bg-background p-5 sm:w-[calc(100vw_-_var(--sidebar-closed-width))] sm:border-b-0 sm:py-0 xl:w-[calc(100vw_-_var(--sidebar-open-width))]">
<div className="flex flex-1 items-stretch justify-between gap-x-4 sm:border-b">
<Link
href="/app"
href="/explore"
className="center justify-between gap-x-3 text-foreground"
>
<Logo className="h-[30px] w-[30px] text-primary sm:hidden" />

View File

@ -4,11 +4,11 @@ export default function Keystone() {
return (
<div className="center hidden sm:flex">
<Link
href="/app"
href="/explore"
className="center fixed h-[var(--header-height)] w-[var(--sidebar-closed-width)] gap-x-3 border-r text-primary hover:text-primary/80 xl:w-[var(--sidebar-open-width)] xl:justify-start xl:pl-5"
>
<Logo className="h-[30px] w-[30px]" />
<div className="font-condensed hidden text-xl font-semibold text-foreground xl:inline-flex">
<div className="hidden font-condensed text-xl font-semibold text-foreground xl:inline-flex">
Flockstr
</div>
</Link>

View File

@ -8,6 +8,7 @@ import {
RiQuestionAnswerLine,
RiAddFill,
RiSettings4Fill,
RiCalendarEventFill,
RiSettings4Line,
} from "react-icons/ri";
import { HiOutlineLightningBolt } from "react-icons/hi";
@ -64,14 +65,6 @@ export default function Sidebar() {
const pathname = usePathname();
const navigation: NavigationElement[] = [
{
href: "/app",
name: "home",
label: "Home",
icon: RiHome6Fill,
type: "link",
active: true,
},
{
href: "/explore",
name: "explore",
@ -80,6 +73,14 @@ export default function Sidebar() {
type: "link",
active: true,
},
{
href: "/events",
name: "events",
label: "Events",
icon: RiCalendarEventFill,
type: "link",
active: true,
},
{
href: "",
name: "messages",

View File

@ -1,37 +0,0 @@
import dynamic from "next/dynamic";
import ExploreCreators from "./_sections/ExploreCreators";
import UpcomingEvents from "./_sections/UpcomingEvents";
import LongFormContentSection from "./_sections/LongFormContent";
import BecomeACreator from "./_sections/BecomeACreator";
const LiveStreamingSection = dynamic(
() => import("./_sections/LiveStreaming"),
{
ssr: false,
},
);
const FeaturedListsSection = dynamic(
() => import("./_sections/FeaturedLists"),
{
ssr: false,
},
);
const NewEventButton = dynamic(() => import("./_components/NewEventButton"), {
ssr: false,
});
export default function Page() {
return (
<div className="relative space-y-6 px-5 pt-5 sm:pt-7">
<ExploreCreators />
<UpcomingEvents />
<LongFormContentSection />
<BecomeACreator />
<LiveStreamingSection />
<FeaturedListsSection />
<div className="z-overlay- fixed bottom-[calc(var(--bottom-nav-height)_+_20px)] right-[20px] sm:hidden">
<NewEventButton />
</div>
</div>
);
}

View File

@ -37,7 +37,7 @@ export default function Layout(props: {
if (sessionStorage.getItem("RichHistory")) {
void router.back();
} else {
void router.push("/app");
void router.push("/explore");
}
}}
size="icon"

View File

@ -37,7 +37,7 @@ export default function Layout(props: {
if (sessionStorage.getItem("RichHistory")) {
void router.back();
} else {
void router.push("/app");
void router.push("/explore");
}
}}
size="icon"

View File

@ -17,31 +17,31 @@ export default function ModalLayout(props: {
const kind = data.kind;
if (kind === 30023) {
return (
<div className="z-overlay fixed inset-y-[10px] left-[10px] right-[10px] overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
<div className="fixed inset-y-[10px] left-[10px] right-[10px] z-overlay overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
{props[30023]}
</div>
);
} else if (kind === 30311) {
return (
<div className="z-overlay fixed inset-y-[10px] left-[10px] right-[10px] overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
<div className="fixed inset-y-[10px] left-[10px] right-[10px] z-overlay overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
{props[30311]}
</div>
);
}
} else if (type === "note") {
return (
<div className="z-overlay fixed inset-y-[10px] left-[10px] right-[10px] overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
<div className="fixed inset-y-[10px] left-[10px] right-[10px] z-overlay overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
{props[1]}
</div>
);
} else if (type === "nevent") {
return (
<div className="z-overlay fixed inset-y-[10px] left-[10px] right-[10px] overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
<div className="fixed inset-y-[10px] left-[10px] right-[10px] z-overlay overflow-hidden overflow-y-auto rounded-lg border bg-background px-4 sm:left-[calc(10px_+_var(--sidebar-closed-width))] xl:left-[calc(10px_+_var(--sidebar-open-width))]">
{props.event}
</div>
);
} else if (type === "npub") {
return redirect(`/${key}`);
}
return redirect(`/app`);
return redirect(`/explore`);
}

70
app/(app)/events/page.tsx Normal file
View File

@ -0,0 +1,70 @@
"use client";
import { NDKEvent, type NDKKind } from "@nostr-dev-kit/ndk";
import CalendarSection, {
CalendarSectionLoading,
} from "./_components/CalendarSection";
import useEvents from "@/lib/hooks/useEvents";
import { getTagValues } from "@/lib/nostr/utils";
import { fromUnix, daysOffset } from "@/lib/utils/dates";
export default function Page() {
const { events, isLoading } = useEvents({
filter: {
kinds: [31923 as NDKKind],
limit: 100,
},
});
const eventsByDay = groupEventsByDay(events);
if (isLoading && !eventsByDay.length) {
return (
<div className="relative flex-col px-5 pt-5 sm:pt-7">
<div className="mx-auto max-w-[900px] space-y-4">
<CalendarSectionLoading />
</div>
</div>
);
}
return (
<div className="relative flex-col px-5 pt-5 sm:pt-7">
<div className="mx-auto max-w-[900px] space-y-4">
{eventsByDay.map((e) => (
<CalendarSection events={e} />
))}
</div>
</div>
);
}
function groupEventsByDay(events: NDKEvent[]) {
const eventDays: Record<string, NDKEvent[]> = {};
for (const event of events) {
const eventStartTime = getTagValues("start", event.tags);
if (!eventStartTime) continue;
const startDate = fromUnix(parseInt(eventStartTime));
const daysAway = daysOffset(startDate);
if (daysAway < 1) continue;
if (eventDays[`${daysAway}`]) {
eventDays[`${daysAway}`]!.push(event);
} else {
eventDays[`${daysAway}`] = [event];
}
}
const groupedArray = Object.entries(eventDays)
.sort(([aKey], [bKey, test]) => {
console.log("test", test);
const aDay = parseInt(aKey);
const bDay = parseInt(bKey);
if (aDay > bDay) {
return 1;
} else if (aDay < bDay) {
return -1;
}
return 0;
})
.map(([_, events]) => events);
console.log("object", eventDays);
console.log("returing", groupedArray);
return groupedArray;
}

View File

@ -1,70 +1,37 @@
"use client";
import { NDKEvent, type NDKKind } from "@nostr-dev-kit/ndk";
import CalendarSection, {
CalendarSectionLoading,
} from "./_components/CalendarSection";
import useEvents from "@/lib/hooks/useEvents";
import { getTagValues } from "@/lib/nostr/utils";
import { fromUnix, daysOffset } from "@/lib/utils/dates";
import dynamic from "next/dynamic";
import ExploreCreators from "./_sections/ExploreCreators";
import UpcomingEvents from "./_sections/UpcomingEvents";
import LongFormContentSection from "./_sections/LongFormContent";
import BecomeACreator from "./_sections/BecomeACreator";
const LiveStreamingSection = dynamic(
() => import("./_sections/LiveStreaming"),
{
ssr: false,
},
);
const FeaturedListsSection = dynamic(
() => import("./_sections/FeaturedLists"),
{
ssr: false,
},
);
const NewEventButton = dynamic(() => import("./_components/NewEventButton"), {
ssr: false,
});
export default function Page() {
const { events, isLoading } = useEvents({
filter: {
kinds: [31923 as NDKKind],
limit: 100,
},
});
const eventsByDay = groupEventsByDay(events);
if (isLoading && !eventsByDay.length) {
return (
<div className="relative flex-col px-5 pt-5 sm:pt-7">
<div className="mx-auto max-w-[900px] space-y-4">
<CalendarSectionLoading />
</div>
</div>
);
}
return (
<div className="relative flex-col px-5 pt-5 sm:pt-7">
<div className="mx-auto max-w-[900px] space-y-4">
{eventsByDay.map((e) => (
<CalendarSection events={e} />
))}
<div className="relative space-y-6 px-5 pt-5 sm:pt-7">
<ExploreCreators />
<UpcomingEvents />
<LongFormContentSection />
<BecomeACreator />
<LiveStreamingSection />
<FeaturedListsSection />
<div className="z-overlay- fixed bottom-[calc(var(--bottom-nav-height)_+_20px)] right-[20px] sm:hidden">
<NewEventButton />
</div>
</div>
);
}
function groupEventsByDay(events: NDKEvent[]) {
const eventDays: Record<string, NDKEvent[]> = {};
for (const event of events) {
const eventStartTime = getTagValues("start", event.tags);
if (!eventStartTime) continue;
const startDate = fromUnix(parseInt(eventStartTime));
const daysAway = daysOffset(startDate);
if (daysAway < 1) continue;
if (eventDays[`${daysAway}`]) {
eventDays[`${daysAway}`]!.push(event);
} else {
eventDays[`${daysAway}`] = [event];
}
}
const groupedArray = Object.entries(eventDays)
.sort(([aKey], [bKey, test]) => {
console.log("test", test);
const aDay = parseInt(aKey);
const bDay = parseInt(bKey);
if (aDay > bDay) {
return 1;
} else if (aDay < bDay) {
return -1;
}
return 0;
})
.map(([_, events]) => events);
console.log("object", eventDays);
console.log("returing", groupedArray);
return groupedArray;
}

View File

@ -7,10 +7,10 @@ import Logo from "@/assets/Logo";
export default function Header() {
const [menuOpen, setMenuOpen] = useState(false);
const navigation = [
{ name: "home", label: "Home", href: "/" },
{ name: "explore", label: "Explore", href: "/app" },
{ name: "about", label: "About", href: "/app" },
{ name: "contact", label: "Contact", href: "/app" },
{ name: "explore", label: "Explore", href: "/explore" },
{ name: "home", label: "Events", href: "/events" },
{ name: "about", label: "About", href: "/explore" },
{ name: "contact", label: "Contact", href: "/explore" },
];
return (
<header
@ -20,7 +20,7 @@ export default function Header() {
)}
>
<div className="center hidden min-h-[var(--header-height)] lg:flex">
<ul className="font-condensed flex w-full max-w-2xl items-center justify-between text-base font-semibold text-zinc-800 hover:text-zinc-600">
<ul className="flex w-full max-w-2xl items-center justify-between font-condensed text-base font-semibold text-zinc-800 hover:text-zinc-600">
{navigation.slice(0, 2).map((item) => (
<li key={item.name} className="">
<Link href={item.href} className="flex p-1">

View File

@ -17,7 +17,7 @@ export default function LandingPage() {
again.
</p>
<div className="center lg:justify-start">
<Link href="/app">
<Link href="/explore">
<Button size={"lg"}>Get Started</Button>
</Link>
</div>
@ -27,7 +27,7 @@ export default function LandingPage() {
<span className="text-sm uppercase tracking-wider text-zinc-400">
About nostr
</span>
<div className="font-condensed space-y-4 font-medium">
<div className="space-y-4 font-condensed font-medium">
<p className="text-sm text-zinc-300">
Nostr is a simple, open protocol for decentralizing how
infomration is stored and retreived on the web.
@ -141,7 +141,7 @@ export default function LandingPage() {
Let's take a look.
</h2>
<div className="mt-6 text-base">
<Link href="/app" className="font-semibold text-white">
<Link href="/explore" className="font-semibold text-white">
Explore Now
<span aria-hidden="true"> &rarr;</span>
</Link>

View File

@ -64,7 +64,7 @@ export default function LandingPage() {
your following, no-longer dependent on an external company.
</p>
<div className="mt-10 flex items-center gap-x-6">
<Link href="/app">
<Link href="/explore">
<Button size={"lg"} className="rounded-sm">
Start Exploring
</Button>

View File

@ -44,7 +44,7 @@ export default function EditorPage({ event }: ArticleProps) {
if (sessionStorage.getItem("RichHistory")) {
void router.back();
} else {
void router.push("/app");
void router.push("/explore");
}
}}
size="icon"

View File

@ -55,7 +55,7 @@ export default function ArticlePage({ event }: ArticleProps) {
if (sessionStorage.getItem("RichHistory")) {
void router.back();
} else {
void router.push("/app");
void router.push("/explore");
}
}}
size="icon"

View File

@ -3,7 +3,7 @@
"background_color": "#ffffff",
"display": "standalone",
"scope": "/",
"start_url": "/app",
"start_url": "/explore",
"name": "Flockstr",
"short_name": "Flockstr",
"icons": [

View File

@ -1,31 +1,31 @@
{
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone",
"scope": "/",
"start_url": "/app",
"name": "Flockstr",
"short_name": "Flockstr",
"icons": [
{
"src": "/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-256x256.png",
"sizes": "256x256",
"type": "image/png"
},
{
"src": "/icon-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone",
"scope": "/",
"start_url": "/explore",
"name": "Flockstr",
"short_name": "Flockstr",
"icons": [
{
"src": "/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-256x256.png",
"sizes": "256x256",
"type": "image/png"
},
{
"src": "/icon-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}