refactor: signup component

src/auth/components/email/step2.vue

@@ -0,0 +1,43 @@
+<script lang='ts' setup>
+import { toastController } from "@ionic/vue";
+
+const props = defineProps<{
+  email: string;
+}>();
+const emit = defineEmits<{
+  (e: "success", value: string): void;
+}>();
+const model = defineModel({ type: String, required: true });
+
+async function submitSignup() {
+  if (model.value.length !== 6) {
+    const toast = await toastController.create({
+      message: "Please enter a valid 6-digit verification code.",
+      duration: 1500,
+      position: "bottom",
+    });
+
+    await toast.present();
+    return;
+  }
+
+  emit("success", model.value);
+}
+</script>
+
+<template>
+  <h1><strong>Verify your email</strong></h1>
+  <p>We have sent a verification code to {{ email }}. Please enter the code below to verify your email address.</p>
+
+  <div>
+    <ion-item>
+      <ion-input-otp v-model="model" :length="6" />
+    </ion-item>
+
+    <ion-button expand="block" class="ion-margin-top" shape="round" @click="submitSignup">
+      Submit
+    </ion-button>
+  </div>
+</template>
+
+<style scoped></style>