GPT

Correct Component Usage

import { client } from '@/lib/client' import { ref } from 'vue' const { isAuthenticated, user, signIn, signOut } = client const email = ref('') const password = ref('') const handleSignIn = async () = { try { await s

Prompt text

Original English text. Replace placeholders with your own details.

<script setup lang="ts">
import { client } from '@/lib/client'
import { ref } from 'vue'

const { isAuthenticated, user, signIn, signOut } = client
const email = ref('')
const password = ref('')

const handleSignIn = async () => {
 try {
 await signIn({ email: email.value, password: password.value })
 } catch (error) {
 console.error('Authentication failed:', error)
 }
}
</script>

<template>
 <div v-if="isAuthenticated">
 <p>Welcome, {{ user.email }}</p>
 <button @click="signOut">Sign Out</button>
 </div>
 <form v-else @submit.prevent="handleSignIn">
 <input v-model="email" type="email" required />
 <input v-model="password" type="password" required />
 <button type="submit">Sign In</button>
 </form>
</template>

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →