PulseApp/docs
PulseApp/docs
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Activity

some changes

Browse Source 
Took 1 hour 4 minutes
This commit is contained in:
Braydon 2024-10-09 13:40:01 -04:00
parent 1296a34657
commit cbc9dcb1ab
11 changed files with 120 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/👨🏼‍💻 Self Hosting/docker.mdx → docs/Self Hosting/docker.mdx
View File

@ -1,6 +1,6 @@
---
title: '🐋 Docker'
published: '2024-10-07'
updated: '2024-10-07'
summary: 'petentium usu tota noluisse errem elaboraret auctor.'
order: 4
---

2
docs/🖥️ Service Monitoring/components.mdx → docs/Service Monitoring/components.mdx
View File

@ -1,6 +1,6 @@
---
title: '🧩 Components'
published: '2024-10-07'
updated: '2024-10-07'
summary: 'petentium usu tota noluisse errem elaboraret auctor.'
order: 2
---

2
docs/🖥️ Service Monitoring/supported-services.mdx → docs/Service Monitoring/supported-services.mdx
View File

@ -1,6 +1,6 @@
---
title: '✔️ Supported Services'
published: '2024-10-07'
updated: '2024-10-07'
summary: 'petentium usu tota noluisse errem elaboraret auctor.'
order: 3
---

8
docs/intro.mdx
View File

@ -1,6 +1,6 @@
---
title: '🚀 Introduction'
published: '2024-10-06'
updated: '2024-10-06'
summary: 'petentium usu tota noluisse errem elaboraret auctor.'
order: 1
---
@ -8,10 +8,8 @@ order: 1
> [!IMPORTANT]
> These docs are currently a work in progress and are subject to change.
# Pulse App
<span className="flex gap-2 items-center select-none">
<Activity className="w-4 h-4 text-primary" /> <span>A lightweight service monitoring solution for tracking the availability of whatever service your heart desires!</span>
</span>
# <span className="flex gap-2.5 items-center"><Activity className="w-6 h-6 text-primary" /> Pulse App</span>
A lightweight service monitoring solution for tracking the availability of whatever service your heart desires!
## Getting Started
Let's get you up and running—this will only take a few minutes! Start by [creating your account](#creating-your-account) and

50
src/app/layout.tsx
View File

@ -6,6 +6,7 @@ import Navbar from "@/components/navbar/navbar";
import Sidebar from "@/components/sidebar/sidebar";
import Footer from "@/components/footer";
import { TooltipProvider } from "@/components/ui/tooltip";
import { getDocsContent } from "@/lib/mdx";
/**
* The metadata for this app.
@ -41,29 +42,32 @@ const RootLayout = ({
children,
}: Readonly<{
children: ReactNode;
}>): ReactElement => (
<html lang="en">
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
<body
className="scroll-smooth antialiased"
style={{
background: "var(--background-gradient)",
}}
>
<TooltipProvider delayDuration={100}>
<div className="px-3 md:px-7 max-w-screen-2xl min-h-screen mx-auto flex flex-col transition-all">
<Navbar />
<div className="pt-[4.5rem] w-full h-full flex flex-grow gap-5">
<div className="relative hidden xs:flex">
<Sidebar />
}>): ReactElement => {
const pages: DocsContentMetadata[] = getDocsContent();
return (
<html lang="en">
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
<body
className="scroll-smooth antialiased"
style={{
background: "var(--background-gradient)",
}}
>
<TooltipProvider delayDuration={100}>
<div className="px-3 md:px-7 max-w-screen-2xl min-h-screen mx-auto flex flex-col transition-all">
<Navbar pages={pages} />
<div className="pt-[4.5rem] w-full h-full flex flex-grow gap-5 sm:gap-8 transition-all transform-gpu">
<div className="relative hidden xs:flex">
<Sidebar pages={pages} />
</div>
{children}
</div>
{children}
</div>
</div>
<Footer />
</TooltipProvider>
</body>
</ThemeProvider>
</html>
);
<Footer />
</TooltipProvider>
</body>
</ThemeProvider>
</html>
);
};
export default RootLayout;

4
src/app/types/mdx.ts
View File

@ -8,9 +8,9 @@ type DocsContentMetadata = MDXMetadata & {
title: string;
/**
* The date this content was published.
* The date this content was updated.
*/
published: string;
updated: string;
/**
* The summary of this content.

18
src/components/docs-footer.tsx
View File

@ -24,14 +24,14 @@ const DocsFooter = ({
const next: DocsContentMetadata | undefined =
current < pages.length - 1 ? pages[current + 1] : undefined;
const [publicationDate, setPublicationDate] = useState<string | null>(
DateTime.fromISO(pages[current]?.published).toRelative()
const [updatedDate, setUpdatedDate] = useState<string | null>(
DateTime.fromISO(pages[current]?.updated).toRelative()
);
useEffect(() => {
const interval = setInterval(() => {
setPublicationDate(
DateTime.fromISO(pages[current]?.published).toRelative()
setUpdatedDate(
DateTime.fromISO(pages[current]?.updated).toRelative()
);
}, 1000);
return () => clearInterval(interval);
@ -39,15 +39,15 @@ const DocsFooter = ({
return (
<footer className="xs:mx-5 sm:mx-10 my-2 flex flex-col select-none transition-all transform-gpu">
{/* Publish Date */}
{/* updated Date */}
<div className="ml-auto pt-4">
<SimpleTooltip
content={DateTime.fromISO(
pages[current]?.published
).toLocaleString(DateTime.DATETIME_MED)}
content={`Last updated on ${DateTime.fromISO(
pages[current]?.updated
).toLocaleString(DateTime.DATETIME_MED)}`}
>
<span className="text-xs sm:text-sm opacity-75 transition-all transform-gpu">
Published {publicationDate}
Updated {updatedDate}
</span>
</SimpleTooltip>
</div>

92
src/components/navbar/navbar.tsx
View File

@ -1,61 +1,59 @@
"use client";
import { ReactElement } from "react";
import Link from "next/link";
import Image from "next/image";
import QuickSearchDialog from "@/components/navbar/search-dialog";
import { getDocsContent } from "@/lib/mdx";
import Sidebar from "@/components/sidebar/sidebar";
const Navbar = (): ReactElement => {
const pages: DocsContentMetadata[] = getDocsContent();
return (
<nav className="fixed left-0 inset-x-0 bg-white/[0.007] backdrop-saturate-100 backdrop-blur-xl border-b z-50">
<div className="px-3 md:px-7 max-w-screen-2xl mx-auto py-4 flex justify-between items-center transition-all transform-gpu">
{/* Branding */}
<Link
className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none"
href="/"
const Navbar = ({ pages }: { pages: DocsContentMetadata[] }): ReactElement => (
<nav className="fixed left-0 inset-x-0 bg-white/[0.007] backdrop-saturate-100 backdrop-blur-xl border-b z-50">
<div className="px-3 md:px-7 max-w-screen-2xl mx-auto py-4 flex justify-between items-center transition-all transform-gpu">
{/* Branding */}
<Link
className="flex gap-1 items-end hover:opacity-75 transition-all transform-gpu select-none"
href="/"
draggable={false}
>
<h1 className="text-lg font-semibold">docs.</h1>
<Image
src="/media/logo.png"
alt="Pulse App Logo"
width={36}
height={36}
draggable={false}
>
<h1 className="text-lg font-semibold">docs.</h1>
<Image
src="/media/logo.png"
alt="Pulse App Logo"
width={36}
height={36}
draggable={false}
/>
</Link>
{/* Right */}
<div className="flex gap-5 sm:gap-7 items-center transition-all transform-gpu">
{/* Search */}
<div className="hidden xs:flex">
<QuickSearchDialog pages={pages} bindKeybind />
</div>
{/* Social */}
<div className="flex gap-5 items-center">
<SocialLink
name="GitHub"
link="https://github.com/PulseAppCC"
icon="/media/github.svg"
/>
</Link>
<SocialLink
name="Discord"
link="https://discord.pulseapp.cc"
icon="/media/discord.svg"
/>
</div>
{/* Right */}
<div className="flex gap-5 sm:gap-7 items-center transition-all transform-gpu">
{/* Search */}
<div className="hidden xs:flex">
<QuickSearchDialog pages={pages} bindKeybind />
</div>
{/* Social */}
<div className="flex gap-5 items-center">
<SocialLink
name="GitHub"
link="https://github.com/PulseAppCC"
icon="/media/github.svg"
/>
<SocialLink
name="Discord"
link="https://discord.pulseapp.cc"
icon="/media/discord.svg"
/>
</div>
{/* Mobile Sidebar */}
<div className="flex xs:hidden">
<Sidebar />
</div>
{/* Mobile Sidebar */}
<div className="flex xs:hidden">
<Sidebar pages={pages} />
</div>
</div>
</nav>
);
};
</div>
</nav>
);
const SocialLink = ({
name,

6
src/components/on-this-page.tsx
View File

@ -33,7 +33,7 @@ const OnThisPage = ({ page }: { page: DocsContentMetadata }): ReactElement => {
let match;
while ((match = headerRegex.exec(page.content)) !== null) {
const level: number = match[1].length; // The number of # symbols determines the header level
const text: string = match[2].trim();
const text: string = match[2].trim().replace(/<[^>]*>/g, "");
const id: string = text
.toLowerCase()
.replace(/\s+/g, "-")
@ -79,7 +79,7 @@ const OnThisPage = ({ page }: { page: DocsContentMetadata }): ReactElement => {
return (
<motion.div
ref={ref}
className="sticky top-[7rem] w-44 max-h-[calc(100vh-3.5rem)] flex flex-col gap-2 text-sm select-none"
className="sticky top-[7.5rem] w-44 max-h-[calc(100vh-3.5rem)] flex flex-col gap-2 text-sm select-none"
initial={{ opacity: 0 }}
animate={{ opacity: inView ? 1 : 0 }}
transition={{ duration: 0.2 }}
@ -119,7 +119,7 @@ const OnThisPage = ({ page }: { page: DocsContentMetadata }): ReactElement => {
draggable={false}
className="block py-1"
>
{truncateText(header.text, 24)}
{truncateText(header.text, 20)}
</Link>
</li>
))}

9
src/components/sidebar/sidebar-links.tsx
View File

@ -51,7 +51,7 @@ const CategoryItem = ({
const hasChildren = Object.keys(node.children).length > 0;
return (
<div className={cn(`relative select-none`, depth > 0 && "ml-4")}>
<div className={cn(`relative select-none`, depth > 0 && "ml-3")}>
{/* Indentation */}
{depth > 0 && (
<div
@ -72,10 +72,13 @@ const CategoryItem = ({
>
<Button
className={cn(
`relative w-full px-1.5 h-8 lg:text-base justify-between hover:bg-accent/20`,
`relative w-full px-1.5 h-8 justify-between hover:bg-accent/35`,
node.isFolder
? "mb-0.5 text-sm font-semibold"
: "lg:text-base",
depth > 0 && "pl-4",
active &&
"text-primary/95 font-bold hover:text-primary"
"text-primary/95 font-semibold hover:text-primary"
)}
variant="ghost"
>

44
src/components/sidebar/sidebar.tsx
View File

@ -1,13 +1,12 @@
import { ReactElement } from "react";
import { Separator } from "@/components/ui/separator";
import { getDocsContent } from "@/lib/mdx";
import SidebarLinks from "@/components/sidebar/sidebar-links";
import ThemeSwitcher from "@/components/theme-switcher";
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
import QuickSearchDialog from "@/components/navbar/search-dialog";
import { AlignRightIcon } from "lucide-react";
const Sidebar = (): ReactElement => (
const Sidebar = ({ pages }: { pages: DocsContentMetadata[] }): ReactElement => (
<>
{/* Mobile */}
<div className="xs:hidden">
@ -16,37 +15,38 @@ const Sidebar = (): ReactElement => (
<AlignRightIcon className="w-6 h-6" />
</SheetTrigger>
<SheetContent className="h-full px-5 pt-11" side="right">
<SidebarContent />
<SidebarContent pages={pages} />
</SheetContent>
</Sheet>
</div>
{/* Desktop */}
<div className="hidden xs:flex sticky top-[4.5rem] max-h-[calc(100vh-3.5rem)] overflow-y-auto min-w-32 w-40 lg:w-52 py-5 flex-col justify-between transition-all transform-gpu">
<SidebarContent />
<SidebarContent pages={pages} />
</div>
</>
);
const SidebarContent = (): ReactElement => {
const pages: DocsContentMetadata[] = getDocsContent();
return (
<div className="h-full flex flex-col justify-between">
{/* Top */}
<div className="flex flex-col">
<div className="xs:hidden pb-3">
<QuickSearchDialog pages={pages} />
</div>
<SidebarLinks pages={pages} />
</div>
{/* Theme Switcher */}
<div className="flex flex-col items-center">
<Separator className="mb-3 bg-separator-gradient" />
<ThemeSwitcher />
const SidebarContent = ({
pages,
}: {
pages: DocsContentMetadata[];
}): ReactElement => (
<div className="h-full flex flex-col justify-between">
{/* Top */}
<div className="flex flex-col">
<div className="xs:hidden pb-3">
<QuickSearchDialog pages={pages} />
</div>
<SidebarLinks pages={pages} />
</div>
);
};
{/* Theme Switcher */}
<div className="flex flex-col items-center">
<Separator className="mb-3 bg-separator-gradient" />
<ThemeSwitcher />
</div>
</div>
);
export default Sidebar;