force graph, palette

web/components/custom/ai-search.tsx

@@ -22,7 +22,7 @@ const AiSearch: React.FC<AiSearchProps> = (props: { searchQuery: string }) => {
 		if (root_el.current) {
 			root_el.current.appendChild(md_el)
 		}
-	}, [root_el.current, md_el])
+	}, [md_el])
 
 	useEffect(() => {
 		let question = props.searchQuery

web/components/custom/auth-ui.tsx

@@ -1,45 +0,0 @@
-"use client"
-
-import { useState } from "react"
-import { DemoAuth } from "jazz-react"
-import { Input } from "../ui/input"
-import { Button } from "../ui/button"
-
-export const AuthUI: DemoAuth.Component = ({ existingUsers, logInAs, signUp, appName, loading }) => {
-	const [username, setUsername] = useState<string>("")
-
-	if (loading) return <div>Loading...</div>
-
-	return (
-		<div className="bg-background flex h-screen w-screen items-center justify-center">
-			<div className="flex w-72 flex-col gap-8">
-				<h1>{appName}</h1>
-				<form
-					className="flex w-72 flex-col gap-2"
-					onSubmit={e => {
-						e.preventDefault()
-						signUp(username)
-					}}
-				>
-					<Input
-						placeholder="Display name"
-						value={username}
-						onChange={e => setUsername(e.target.value)}
-						autoComplete="webauthn"
-					/>
-					<Button type="submit">Sign Up</Button>
-				</form>
-
-				<div className="flex flex-col gap-2">
-					{existingUsers.map(user => (
-						<Button key={user} onClick={() => logInAs(user)}>
-							Log In as "{user}"
-						</Button>
-					))}
-				</div>
-			</div>
-		</div>
-	)
-}
-
-export default AuthUI

web/components/custom/clerk/clerk-provider-client.tsx

@@ -0,0 +1,7 @@
+"use client"
+
+import { ClerkProvider } from "@clerk/nextjs"
+
+export const ClerkProviderClient = ({ children }: { children: React.ReactNode }) => {
+	return <ClerkProvider>{children}</ClerkProvider>
+}

web/components/custom/clerk/sign-in-client.tsx

@@ -0,0 +1,7 @@
+"use client"
+
+import { SignIn } from "@clerk/nextjs"
+
+export const SignInClient = () => {
+	return <SignIn />
+}

web/components/custom/clerk/sign-up-client.tsx

@@ -0,0 +1,7 @@
+"use client"
+
+import { SignUp } from "@clerk/nextjs"
+
+export const SignUpClient = () => {
+	return <SignUp />
+}

web/components/custom/clerk/signed-in-client.tsx

@@ -0,0 +1,7 @@
+"use client"
+
+import { SignedIn } from "@clerk/nextjs"
+
+export const SignedInClient = ({ children }: { children: React.ReactNode }) => {
+	return <SignedIn>{children}</SignedIn>
+}

web/components/custom/delete-modal.tsx

@@ -20,7 +20,7 @@ export default function DeletePageModal({ isOpen, onClose, onConfirm, title }: D
 		<Dialog open={isOpen} onOpenChange={onClose}>
 			<DialogContent>
 				<DialogHeader>
-					<DialogTitle>Delete "{title}"?</DialogTitle>
+					<DialogTitle>Delete &quot;{title}&quot;?</DialogTitle>
 					<DialogDescription>This action cannot be undone.</DialogDescription>
 				</DialogHeader>
 				<DialogFooter>

web/components/custom/sidebar/partial/page-section.tsx

@@ -72,7 +72,7 @@ const PageSectionHeader: React.FC<PageSectionHeaderProps> = ({ pageCount }) => (
 		>
 			<p className="flex items-center text-xs font-medium">
 				Pages
-				{pageCount && <span className="text-muted-foreground ml-1">{pageCount}</span>}
+				{pageCount > 0 && <span className="text-muted-foreground ml-1">{pageCount}</span>}
 			</p>
 		</Button>
 		<div className={cn("flex items-center gap-px pr-2")}>
@@ -86,6 +86,8 @@ const NewPageButton: React.FC = () => {
 	const { me } = useAccount()
 	const router = useRouter()
 
+	if (!me) return null
+
 	const handleClick = () => {
 		try {
 			const newPersonalPage = PersonalPage.create(
@@ -248,6 +250,4 @@ const ShowAllForm: React.FC = () => {
 			</DropdownMenuContent>
 		</DropdownMenu>
 	)
-}
-
-export default PageSection
+}

web/components/custom/sidebar/partial/profile-section.tsx

@@ -11,6 +11,7 @@ import {
 } from "@/components/ui/dropdown-menu"
 import { useAccount } from "@/lib/providers/jazz-provider"
 import Link from "next/link"
+import { useAuth } from "@clerk/nextjs"
 
 const MenuItem = ({
 	icon,
@@ -48,9 +49,10 @@ const MenuItem = ({
 	)
 }
 export const ProfileSection: React.FC = () => {
-	const { me, logOut } = useAccount({
+	const { me } = useAccount({
 		profile: true
 	})
+	const { signOut } = useAuth()
 	const [menuOpen, setMenuOpen] = useState(false)
 
 	const closeMenu = () => setMenuOpen(false)
@@ -86,7 +88,7 @@ export const ProfileSection: React.FC = () => {
 							</DropdownMenuItem>
 							<DropdownMenuSeparator />
 							<DropdownMenuItem>
-								<MenuItem icon="LogOut" text="Log out" onClick={logOut} onClose={closeMenu} />
+								<MenuItem icon="LogOut" text="Log out" onClick={signOut} onClose={closeMenu} />
 							</DropdownMenuItem>
 						</DropdownMenuContent>
 					</DropdownMenu>

web/components/custom/sidebar/partial/topic-section.tsx

@@ -50,7 +50,7 @@ const TopicSectionHeader: React.FC<TopicSectionHeaderProps> = ({ topicCount }) =
 		>
 			<p className="flex items-center text-xs font-medium">
 				Topics
-				{topicCount && <span className="text-muted-foreground ml-1">{topicCount}</span>}
+				{topicCount > 0 && <span className="text-muted-foreground ml-1">{topicCount}</span>}
 			</p>
 		</Button>
 	</div>
@@ -131,6 +131,4 @@ const ListItem: React.FC<ListItemProps> = ({ label, value, href, count, isActive
 			</div>
 		</div>
 	)
-}
-
-export default TopicSection
+}