frontend/composables/post.ts

@@ -35,38 +35,7 @@ const createNewPost = async (data: unknown) => {
 
     const res = await request.post('/api/posts', parsedNewPost.data)
 
-    await fetchPosts()
+    console.log(res)
 }
 
-const responseValidator = z.object({
-    status: z.number(),
-    data: z.unknown().array(),
-})
-
-const fetchPosts = async (refresh: Boolean = false) => {
-    const posts = usePosts()
-    const lastPost = refresh
-        ? 0
-        : posts.value.length
-            ? posts.value[posts.value.length - 1].sequence
-            : 0
-
-    const data = await request.get('/api/posts', {
-        params: { lastPost: lastPost },
-    })
-
-    const response = responseValidator.safeParse(data.data)
-
-    if (!response.success) return
-
-    posts.value = [...posts.value, ...parsePosts(response.data.data)]
-}
-
-export {
-    parsePost,
-    parsePosts,
-    PostValidator,
-    createNewPost,
-    usePosts,
-    fetchPosts,
-}
+export { parsePost, parsePosts, PostValidator, createNewPost, usePosts }

frontend/composables/user.ts

@@ -23,23 +23,6 @@ const userLogin = async (email: String, password: String) => {
     await getUser()
 }
 
-const newUserSchema = z.object({
-    name: z.string(),
-    email: z.string().email(),
-    password: z.string().min(6),
-    password_confirmation: z.string().min(6),
-})
-
-const userSignup = async (data: unknown) => {
-    const newUser = newUserSchema.safeParse(data)
-
-    if (!newUser.success) return newUser.error.format()
-
-    await request.post('/register', newUser.data)
-
-    await getUser()
-}
-
 const getUser = async () => {
     await request
         .get('/api/user')
@@ -60,4 +43,4 @@ const userLogout = async () => {
 
 const useUser = () => useState<String>('user', () => '')
 
-export { userLogin, useUser, getUser, userLogout, userSignup }
+export { userLogin, useUser, getUser, userLogout }

frontend/pages/index.vue

@@ -6,10 +6,27 @@ definePageMeta({
 import { z } from 'zod'
 
 const posts = usePosts()
+const lastPost = ref<Number>(0)
 const openCreatePostModal = ref<Boolean>(false)
 
+const responseValidator = z.object({
+    status: z.number(),
+    data: z.unknown().array(),
+})
+
 const getPosts = async () => {
-    await fetchPosts()
+    const data = await request.get('/api/posts', {
+        params: { lastPost: lastPost.value },
+    })
+
+    console.log(data)
+
+    const response = responseValidator.safeParse(data.data)
+
+    if (!response.success) return
+
+    posts.value = [...posts.value, ...parsePosts(response.data.data)]
+    lastPost.value = posts.value[posts.value.length - 1].sequence
 }
 
 const logout = async () => {
@@ -39,7 +56,7 @@ onMounted(() => {
                 <div v-if="posts" v-for="post in posts">
                     <PostCard :title="post.title" :description="post.description" />
                 </div>
-                <button @click="getPosts()"> More </button>
+                <button @click="getPosts()">More {{ lastPost }}</button>
             </div>
         </div>
         <button @click="createPost()"

frontend/pages/login/index.vue

@@ -6,14 +6,11 @@ definePageMeta({
 const user = useUser()
 
 const userCredential = reactive({
-    name: '',
     email: '',
     password: '',
-    password_confirmation: '',
 })
 
 const isSigningIn = ref<Boolean>(false)
-const isSignUp = ref<Boolean>(false)
 
 const errors = reactive({
     email: '',
@@ -34,16 +31,6 @@ const login = async () => {
     setTimeout(() => (isSigningIn.value = false), 500)
 }
 
-const toggleSignup = () => {
-    isSignUp.value = !isSignUp.value
-}
-
-const signup = async () => {
-    isSigningIn.value = true
-    const error = await userSignup(userCredential)
-    setTimeout(() => (isSigningIn.value = false), 500)
-}
-
 watch(
     () => user.value,
     () => {
@@ -56,11 +43,6 @@ watch(
     <div class="absolute flex h-screen w-screen items-center justify-center">
         <div
             class="flex w-96 flex-col items-center justify-center gap-2 rounded-xl border border-lightgray bg-secondary p-6">
-            <label v-if="isSignUp" class="mt-2 w-full">
-                Name
-            </label>
-            <input v-if="isSignUp" type="text" v-model="userCredential.name" class="w-full rounded-md" />
-
             <label class="mt-2 w-full"> Email </label>
             <input type="text" v-model="userCredential.email" class="w-full rounded-md" />
             <span v-if="errors.email" class="w-full text-red-400">
@@ -73,29 +55,14 @@ watch(
                 {{ errors.password }}
             </span>
 
-            <label v-if="isSignUp" class="mt-2 w-full">
-                Password Confirmation
-            </label>
-            <input v-if="isSignUp" type="password" v-model="userCredential.password_confirmation"
-                class="w-full rounded-md" />
-
             <div v-if="errors.user" class="mt-4 text-red-400">
                 {{ errors.user }}
             </div>
 
-            <button @click="isSignUp ? signup() : login()"
-                class="mt-6 flex gap-2 rounded-full border border-lightgray bg-blue-500 px-6 py-2">
+            <button @click="login()" class="mt-6 flex gap-2 rounded-full border border-lightgray bg-blue-500 px-6 py-2">
                 <Icon v-if="isSigningIn" name="loading" />
-                <div> {{ isSignUp ? 'Sign up' : 'Sign in' }} </div>
+                <div> Sign In </div>
             </button>
-
-            <div @click="toggleSignup()" class="mt-4 text-blue-500 underline">
-                {{
-                    isSignUp
-                    ? 'Already have an account? Sign in'
-                    : 'No account? Sign up'
-                }}
-            </div>
         </div>
     </div>
 </template>