54 lines
2.7 KiB
TypeScript
54 lines
2.7 KiB
TypeScript
import { Button } from '@/components/ui/button';
|
|
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
|
|
import { cn } from '@/lib/utils';
|
|
import CoinIcon from '@/reusables/coin-icon';
|
|
import useLocalSettingsStore from '@/stores/localSettingsStore';
|
|
import { Menu } from 'lucide-react';
|
|
import { useState } from 'react';
|
|
|
|
const EditorHeader = ({ className = '', onNavClick = () => {}, isNavActive = false }) => {
|
|
const { getSetting } = useLocalSettingsStore();
|
|
|
|
const [openCoinDialog, setOpenCoinDialog] = useState(false);
|
|
|
|
return (
|
|
<div className={cn('flex w-full items-center justify-between rounded-xl bg-white p-2 shadow-sm', className)}>
|
|
<Button onClick={onNavClick} variant="outline" size="icon" className="rounded">
|
|
<Menu className="h-8 w-8" />
|
|
</Button>
|
|
|
|
<h1 className="font-display ml-0 text-lg tracking-wide md:ml-3 md:text-xl">MEMEAIGEN</h1>
|
|
|
|
<Button variant="outline" className="inline-flex gap-1 rounded" onClick={() => setOpenCoinDialog(true)}>
|
|
<span className="text-sm font-semibold">0</span>
|
|
<CoinIcon className="h-8 w-8" />
|
|
</Button>
|
|
|
|
<Dialog open={openCoinDialog} onOpenChange={(open) => setOpenCoinDialog(open)}>
|
|
<DialogContent className="sm:max-w-[425px]">
|
|
<DialogHeader>
|
|
<DialogTitle>{getSetting('genAlphaSlang') ? 'Bruh' : 'Chill'}</DialogTitle>
|
|
<DialogDescription>
|
|
{getSetting('genAlphaSlang')
|
|
? "No cap, soon you'll be able to get AI cooking memes that absolutely slay! But lowkey fam, we gotta focus on making these core features bussin' first."
|
|
: "Soon you'll be able to prompt AI to generate memes! Let us focus on nailing the core features first."}
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<DialogFooter>
|
|
<div className="flex justify-between gap-1">
|
|
<span class="text-muted-foreground text-xs italic">
|
|
Note: You can turn {getSetting('genAlphaSlang') ? 'off' : 'on'} gen alpha slang in Settings.
|
|
</span>
|
|
<Button variant="outline" onClick={() => setOpenCoinDialog(false)}>
|
|
{getSetting('genAlphaSlang') ? 'Bet' : 'Okay'}
|
|
</Button>
|
|
</div>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default EditorHeader;
|