File size: 825 Bytes
edd2230
3ba9c0c
edd2230
 
3ba9c0c
edd2230
 
3ba9c0c
 
edd2230
 
3ba9c0c
edd2230
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3ba9c0c
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
'use client';

import * as React from 'react';
import { useTheme } from 'next-themes';

import { Button } from '@/components/ui/button';
import { IconMoon, IconSun } from '@/components/ui/icons';

export function ThemeToggle() {
	const { setTheme, theme } = useTheme();
	const [_, startTransition] = React.useTransition();

	return (
		<Button
			variant="ghost"
			size="icon"
			className="fixed bottom-4 right-4 z-50 dark:bg-zinc-950 dark:text-white transition-all p-2 rounded-full shadow-md"
			onClick={() => {
				startTransition(() => {
					setTheme(theme === 'light' ? 'dark' : 'light');
				});
			}}
		>
			{!theme ? null : theme === 'dark' ? (
				<IconMoon className="transition-all" />
			) : (
				<IconSun className="transition-all" />
			)}
			<span className="sr-only">Toggle theme</span>
		</Button>
	);
}