Skip to main content
Glama

CodeGraphContext

ThemeToggle.tsx1.16 kB
"use client" import * as React from "react" import { Moon, Sun } from "lucide-react" import { useTheme } from "next-themes" import { Button } from "@/components/ui/button" import { motion, AnimatePresence } from "framer-motion" export function ThemeToggle() { const { setTheme, theme } = useTheme() const toggleTheme = () => { setTheme(theme === 'dark' ? 'light' : 'dark') } return ( <Button variant="outline" size="icon" onClick={toggleTheme} className="relative overflow-hidden"> <AnimatePresence initial={false} mode="wait"> <motion.div key={theme === 'dark' ? 'sun' : 'moon'} initial={{ y: 20, opacity: 0, rotate: -90 }} animate={{ y: 0, opacity: 1, rotate: 0 }} exit={{ y: -20, opacity: 0, rotate: 90 }} transition={{ duration: 0.3 }} className="absolute" > {theme === 'dark' ? ( <Sun className="h-[1.2rem] w-[1.2rem]" /> ) : ( <Moon className="h-[1.2rem] w-[1.2rem]" /> )} </motion.div> </AnimatePresence> <span className="sr-only">Toggle theme</span> </Button> ) }

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/Shashankss1205/CodeGraphContext'

If you have feedback or need assistance with the MCP directory API, please join our Discord server