릴리스: v0.1.43 토스트와 즐겨찾기 추가

frontend/src/views/LoginView.vue

@@ -1,12 +1,14 @@
 <script setup>
-import { onMounted, ref } from 'vue'
+import { onMounted, ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useAuthStore } from '../stores/auth'
 import { api } from '../lib/api'
+import { useToast } from '../composables/useToast'
 
 const router = useRouter()
 const route = useRoute()
 const auth = useAuthStore()
+const toast = useToast()
 
 const email = ref('')
 const password = ref('')
@@ -14,6 +16,12 @@ const mode = ref('login')
 const error = ref('')
 const hasUsers = ref(true)
 
+watch(error, (message) => {
+  if (!message) return
+  toast.error(message)
+  error.value = ''
+})
+
 onMounted(async () => {
   try {
     const meta = await api.authMeta()
@@ -46,9 +54,6 @@ async function submit() {
           회원가입
         </button>
       </div>
-
-      <div v-if="error" class="error">{{ error }}</div>
-
       <label class="label">이메일</label>
       <input v-model="email" class="input" placeholder="you@example.com" autocomplete="email" />
 
@@ -103,13 +108,6 @@ async function submit() {
   background: rgba(96, 165, 250, 0.18);
   border-color: rgba(255, 255, 255, 0.16);
 }
-.error {
-  margin-bottom: 10px;
-  padding: 10px 12px;
-  border-radius: 12px;
-  border: 1px solid rgba(239, 68, 68, 0.3);
-  background: rgba(239, 68, 68, 0.12);
-}
 .label {
   display: block;
   font-size: 13px;