charlestehio/memefast
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
ct
2025-07-04 03:16:48 +08:00
parent 21b56b6cf0
commit 81c38dd9e3
1 changed files with 32 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
resources/js/modules/editor/partials/editor-ai-sheet.jsx
View File

@@ -18,7 +18,7 @@ const EditorAISheet = () => {
const emitter = useMitt(); const emitter = useMitt();
const { generateMeme, isGeneratingMeme, keywords, isLoadingAIHints, fetchAIHints } = useMediaStore(); const { generateMeme, isGeneratingMeme, keywords, isLoadingAIHints, fetchAIHints } = useMediaStore();
const { user } = useUserStore(); const { credits } = useUserStore();
const { auth } = usePage().props; const { auth } = usePage().props;
useEffect(() => { useEffect(() => {
@@ -66,7 +66,7 @@ const EditorAISheet = () => {
placeholder="Make a meme for e.g. work life stress" placeholder="Make a meme for e.g. work life stress"
value={prompt} value={prompt}
onChange={(e) => setPrompt(e.target.value)} onChange={(e) => setPrompt(e.target.value)}
className="bg-muted/30 max-h-20 min-h-12 resize-none rounded-3xl border-0 p-4 text-base" className="bg-muted/30 max-h-20 min-h-12 resize-none rounded-3xl border-0 p-4 text-center text-base"
/> />
{/* AI Keywords */} {/* AI Keywords */}
@@ -89,27 +89,36 @@ const EditorAISheet = () => {
</div> </div>
)} )}
<div className={cn('space-y-2', !prompt.trim() && 'invisible')}> <div className={cn('space-y-2', !prompt.trim() && 'invisible')}>
<Button {auth.user ? (
onClick={handleSend} <>
className={cn('w-full rounded-full')} <Button
size="lg" onClick={handleSend}
variant="outline" className={cn('w-full rounded-full')}
disabled={!prompt.trim() || isGeneratingMeme} size="lg"
> variant="outline"
{isGeneratingMeme ? ( disabled={!prompt.trim() || isGeneratingMeme}
<Spinner className="text-primary h-4 w-4" /> >
) : ( {isGeneratingMeme ? (
<> <Spinner className="text-primary h-4 w-4" />
Generate Meme ) : (
<div className="flex items-center gap-1"> <>
<CoinIcon></CoinIcon> 2 Generate Meme
</div> <div className="flex items-center gap-1">
</> <CoinIcon></CoinIcon> 2
)} </div>
</Button> </>
<div className="text-muted-foreground text-center text-xs"> )}
A new meme costs 1 credit for AI captions & 1 credit for AI background.{' '} </Button>
</div> <div className="text-muted-foreground text-center text-xs">
A new meme costs 1 credit for AI captions & 1 credit for AI background.{' '}
</div>
<div className="text-muted-foreground text-center text-xs">You have {credits} credits remaining.</div>
</>
) : (
<>
<div className="text-muted-foreground text-center text-xs">Login / Signup to use AI features.</div>
</>
)}
</div> </div>
</div> </div>
</div> </div>