prettier
This commit is contained in:
parent
5b1aaee605
commit
3b737a078a
63 changed files with 1132 additions and 1853 deletions
|
@ -1,17 +1,15 @@
|
|||
'use client';
|
||||
"use client";
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
import { BookOpenText, Home, Search, SquarePen, Settings } from 'lucide-react';
|
||||
import Link from 'next/link';
|
||||
import { useSelectedLayoutSegments } from 'next/navigation';
|
||||
import React, { useState, type ReactNode } from 'react';
|
||||
import Layout from './Layout';
|
||||
import SettingsDialog from './SettingsDialog';
|
||||
import { cn } from "@/lib/utils";
|
||||
import { BookOpenText, Home, Search, SquarePen, Settings } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { useSelectedLayoutSegments } from "next/navigation";
|
||||
import React, { useState, type ReactNode } from "react";
|
||||
import Layout from "./Layout";
|
||||
import SettingsDialog from "./SettingsDialog";
|
||||
|
||||
const VerticalIconContainer = ({ children }: { children: ReactNode }) => {
|
||||
return (
|
||||
<div className="flex flex-col items-center gap-y-3 w-full">{children}</div>
|
||||
);
|
||||
return <div className="flex flex-col items-center gap-y-3 w-full">{children}</div>;
|
||||
};
|
||||
|
||||
const Sidebar = ({ children }: { children: React.ReactNode }) => {
|
||||
|
@ -22,21 +20,21 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
|
|||
const navLinks = [
|
||||
{
|
||||
icon: Home,
|
||||
href: '/',
|
||||
active: segments.length === 0 || segments.includes('c'),
|
||||
label: 'Home',
|
||||
href: "/",
|
||||
active: segments.length === 0 || segments.includes("c"),
|
||||
label: "Home",
|
||||
},
|
||||
{
|
||||
icon: Search,
|
||||
href: '/discover',
|
||||
active: segments.includes('discover'),
|
||||
label: 'Discover',
|
||||
href: "/discover",
|
||||
active: segments.includes("discover"),
|
||||
label: "Discover",
|
||||
},
|
||||
{
|
||||
icon: BookOpenText,
|
||||
href: '/library',
|
||||
active: segments.includes('library'),
|
||||
label: 'Library',
|
||||
href: "/library",
|
||||
active: segments.includes("library"),
|
||||
label: "Library",
|
||||
},
|
||||
];
|
||||
|
||||
|
@ -53,10 +51,8 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
|
|||
key={i}
|
||||
href={link.href}
|
||||
className={cn(
|
||||
'relative flex flex-row items-center justify-center cursor-pointer hover:bg-black/10 dark:hover:bg-white/10 duration-150 transition w-full py-2 rounded-lg',
|
||||
link.active
|
||||
? 'text-black dark:text-white'
|
||||
: 'text-black/70 dark:text-white/70',
|
||||
"relative flex flex-row items-center justify-center cursor-pointer hover:bg-black/10 dark:hover:bg-white/10 duration-150 transition w-full py-2 rounded-lg",
|
||||
link.active ? "text-black dark:text-white" : "text-black/70 dark:text-white/70",
|
||||
)}
|
||||
>
|
||||
<link.icon />
|
||||
|
@ -67,15 +63,9 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
|
|||
))}
|
||||
</VerticalIconContainer>
|
||||
|
||||
<Settings
|
||||
onClick={() => setIsSettingsOpen(!isSettingsOpen)}
|
||||
className="cursor-pointer"
|
||||
/>
|
||||
<Settings onClick={() => setIsSettingsOpen(!isSettingsOpen)} className="cursor-pointer" />
|
||||
|
||||
<SettingsDialog
|
||||
isOpen={isSettingsOpen}
|
||||
setIsOpen={setIsSettingsOpen}
|
||||
/>
|
||||
<SettingsDialog isOpen={isSettingsOpen} setIsOpen={setIsSettingsOpen} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -85,15 +75,11 @@ const Sidebar = ({ children }: { children: React.ReactNode }) => {
|
|||
href={link.href}
|
||||
key={i}
|
||||
className={cn(
|
||||
'relative flex flex-col items-center space-y-1 text-center w-full',
|
||||
link.active
|
||||
? 'text-black dark:text-white'
|
||||
: 'text-black dark:text-white/70',
|
||||
"relative flex flex-col items-center space-y-1 text-center w-full",
|
||||
link.active ? "text-black dark:text-white" : "text-black dark:text-white/70",
|
||||
)}
|
||||
>
|
||||
{link.active && (
|
||||
<div className="absolute top-0 -mt-4 h-1 w-full rounded-b-lg bg-black dark:bg-white" />
|
||||
)}
|
||||
{link.active && <div className="absolute top-0 -mt-4 h-1 w-full rounded-b-lg bg-black dark:bg-white" />}
|
||||
<link.icon />
|
||||
<p className="text-xs">{link.label}</p>
|
||||
</Link>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue