Merge pull request #20 from GuillaumeDorschner/dev

Dev
GuillaumeDorschner · Oct 23, 2023 · 57ae960 · 57ae960
2 parents 60c14f3 + 4cbffbc
commit 57ae960
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 33 deletions.
diff --git a/client/src/routes/home/+page.svelte b/client/src/routes/home/+page.svelte
@@ -22,7 +22,11 @@
         post.comments = [];
         post.likes = 0;
       });
-      posts.set(data.posts);
+      posts.set(data.posts.map(post => ({
+        ...post,
+        comments: [],
+        likes: 0
+      })));
       console.log(data)
     } catch (error) {
       console.error('There has been a problem with your fetch operation:', error);
@@ -78,7 +82,7 @@
     <div class="flex items-center">
       <span class="mx-2">{$user.firstName} {$user.lastName}</span>
       <img
-        src={$user.avatar}
+        src={$user.avatar_path}
         loading="lazy"
         alt="User avatar"
         class="mx-2 w-10 h-10 rounded-full"
@@ -101,24 +105,22 @@
   <main class="p-4">
     <section class="m-8 w-full max-w-2xl mx-auto">
       <h1 class="text-3xl font-bold mb-4">News Feed</h1>
-
+  
       <ul>
         {#each $posts as post (post.id)}
           <li class="mb-4 p-4 rounded border">
-            <h2 class="text-lg font-semibold">{post.author}</h2>
+            <div class="flex items-center mb-2">
+              <img src="https://thispersondoesnotexist.com/" alt="Author avatar" class="w-10 h-10 rounded-full mr-4"/>
+              <div>
+                <h2 class="text-lg font-semibold">{post.title}</h2>
+                <span class="text-sm text-gray-400">by {post.firstname} {post.lastname}</span>
+              </div>
+            </div>
             <p class="text-gray-600">{@html post.content}</p>
-            <button
-              class="mt-2 text-blue-500"
-              on:click={() => addLike(post.id)}
-            >
+            <button class="mt-2 text-blue-500" on:click={() => addLike(post.id)}>
               Like ({post.likes})
             </button>
-            <button
-              class="mt-2 ml-4 text-blue-500"
-              on:click={() =>
-                (openedCommentsPostId =
-                  openedCommentsPostId === post.id ? 0 : post.id)}
-            >
+            <button class="mt-2 ml-4 text-blue-500" on:click={() => (openedCommentsPostId = openedCommentsPostId === post.id ? 0 : post.id)}>
               Commentaires
             </button>
             {#if openedCommentsPostId === post.id}
@@ -129,16 +131,8 @@
                   </li>
                 {/each}
               </ul>
-              <input
-                class="mt-2 p-2 rounded border"
-                type="text"
-                placeholder="Add a comment..."
-                bind:value={newComment}
-              />
-              <button
-                class="mt-2 ml-2 text-blue-500"
-                on:click={() => addComment(post.id)}
-              >
+              <input class="mt-2 p-2 rounded border" type="text" placeholder="Add a comment..." bind:value={newComment}/>
+              <button class="mt-2 ml-2 text-blue-500" on:click={() => addComment(post.id)}>
                 Add
               </button>
             {/if}
@@ -147,6 +141,7 @@
       </ul>
     </section>
   </main>
+
 </div>
 
 <style>

diff --git a/client/src/store/store.js b/client/src/store/store.js
@@ -2,11 +2,11 @@ import { writable } from 'svelte/store';
 
 export let user = writable({
   id: 1,
-	firstName: "",
-	lastName: "",
-	email: "",
-	password: "",
-	avatar_path: "",
+	firstName: "Guillaume",
+	lastName: "Dorschner",
+	email: "gui@gmail.com",
+	password: "1234",
+	avatar_path: "https://thispersondoesnotexist.com/",
 });
 
 export let posts = writable([

diff --git a/src/app.js b/src/app.js
@@ -190,10 +190,20 @@ app.get('/getPosts', async (req, res) => {
 
 		// connect to the database
 		database = await connectDatabase();
+
+		const query = `
+			SELECT posts.id as id, 
+			       users.firstname as firstName,
+				   users.lastname as lastName,
+			       posts.content,
+				   posts.title,
+			       posts.DATE as timestamp 
+			FROM posts 
+			INNER JOIN users on posts.user_id = users.id 
+			ORDER BY DATE DESC;
+		`;
 
-		const result = await database.query(
-			`SELECT * FROM posts INNER JOIN users on posts.user_id = users.id ORDER BY DATE DESC;`,
-		).then((result) => {
+		const result = await database.query(query).then((result) => {
 			if (result.rows.length > 0) {
 				res.status(200).json({ message: 'Posts retrieved successfully', posts: result.rows });
 			} else {

diff --git a/src/database/connectionconfigDb.js b/src/database/connectionconfigDb.js
@@ -20,7 +20,6 @@ const connectDatabase = async () => {
 
     try {
       await rootClient.connect();
-      console.log('Connected to the database successfully!');
       return rootClient;
   } catch (err) {
       console.error('Failed to connect to the database:', err);