Merge pull request #20 from yurisldk/feature/client-backend-integration

Client backend integration

README.md

@@ -14,19 +14,15 @@ This codebase containing real world examples (CRUD, auth, advanced patterns, etc
 [![Zustand][shields-zustand-domain]](https://zustand-demo.pmnd.rs/)
 [![TypeScript][shields-typescript-domain]](https://www.typescriptlang.org/)
 
-## Backend Assistance Request
+## Backend Solution for RealWorld API Challenges
 
-Hello everyone,
+As part of the solution to the issues caused by recent changes to the [RealWorld API specifications](https://github.com/gothinkster/realworld/issues/1611), I’ve forked an backend and created a fully compatible alternative with **[RealWorld Express + Prisma](https://github.com/yurisldk/realworld-express-prisma)**.
 
-I’m currently working on the backend for the RealWorld application, built using React. However, I’ve encountered some challenges due to recent updates to the API specifications. As mentioned in this [GitHub discussion](https://github.com/gothinkster/realworld/issues/1611), the project will no longer be maintained. The API server has been deleted, and the demo deployment is no longer available, which has introduced some issues for developers relying on it.
+This fork addresses the challenges caused by the deletion of the official API server and demo deployment, and it implements the updated API specifications to keep the project running smoothly.
 
-If anyone has experience with these changes or expertise in implementing the backend, I’d greatly appreciate your assistance in adapting my backend to align with the updated specifications. Your support will be essential in ensuring compatibility and smooth operation for the app.
+To get the backend up and running, you can find instructions on how to install and set it up in the [RealWorld Express + Prisma repository](https://github.com/yurisldk/realworld-express-prisma).
 
-As a temporary solution, we can use the official backend implementation from [this GitHub repository](https://github.com/gothinkster/node-express-realworld-example-app) or explore other community-backed implementations available through [Codebase Show](https://codebase.show/projects/realworld?category=backend). These resources should help keep the project running while I work on resolving the backend issues.
-
-For further details and feedback, please refer to the [Backend Assistance Request Issue](https://github.com/yurisldk/realworld-react-fsd/issues/19) for more context and ongoing updates.
-
-Feel free to reach out or contribute to the repository if you can provide help!
+Feel free to contribute or reach out if you have any questions or suggestions!
 
 ## Features
 

src/entities/article/article.lib.ts

@@ -9,7 +9,11 @@ export function transformArticleDtoToArticle(
   return {
     ...article,
     tagList: article.tagList.filter(Boolean),
-    author: { ...article.author, bio: article.author.bio || '' },
+    author: {
+      ...article.author,
+      image: article.author?.image || '',
+      bio: article.author?.bio || '',
+    },
   }
 }
 

src/entities/profile/profile.lib.ts

@@ -8,6 +8,7 @@ export function transformProfileDtoToProfile(
 
   return {
     ...profile,
-    bio: profile.bio || '',
+    image: profile?.image || '',
+    bio: profile?.bio || '',
   }
 }

src/features/session/update-session/update-session.ui.tsx

@@ -40,8 +40,8 @@ export const UpdateSessionForm = enhance(() => {
     defaultValues: {
       username: user.username,
       email: user.email,
-      bio: user.bio,
-      image: user.image,
+      bio: user?.bio || '',
+      image: user?.image || '',
       password: '',
     },
   })

src/shared/api/article/article.contracts.ts

@@ -12,8 +12,8 @@ const ArticleDto = z.object({
   favoritesCount: z.number(),
   author: z.object({
     username: z.string(),
-    bio: z.nullable(z.string()),
-    image: z.string(),
+    bio: z.string().nullable(),
+    image: z.string().nullable(),
     following: z.boolean(),
   }),
 })

src/shared/api/auth/auth.contracts.ts

@@ -5,8 +5,8 @@ export const UserDtoSchema = z.object({
     email: z.string(),
     token: z.string(),
     username: z.string(),
-    bio: z.nullable(z.string()),
-    image: z.string(),
+    bio: z.string().nullable(),
+    image: z.string().nullable(),
   }),
 })
 

src/shared/api/favorite/favorite.contracts.ts

@@ -12,8 +12,8 @@ const FavoriteArticleDto = z.object({
   favoritesCount: z.number(),
   author: z.object({
     username: z.string(),
-    bio: z.nullable(z.string()),
-    image: z.string(),
+    bio: z.string().nullable(),
+    image: z.string().nullable(),
     following: z.boolean(),
   }),
 })

src/shared/api/favorite/favorite.service.ts

@@ -11,7 +11,7 @@ export class FavoriteService {
 
   static unfavoriteArticleMutation(slug: string) {
     return realworld
-      .post(`/articles/${slug}/favorite`)
+      .delete(`/articles/${slug}/favorite`)
       .then(AxiosContracts.responseContract(FavoriteArticleDtoSchema))
   }
 }

src/shared/api/index.ts

@@ -2,7 +2,7 @@ import axios, { AxiosError } from 'axios'
 import { z } from 'zod'
 
 export const realworld = axios.create({
-  baseURL: 'https://api.realworld.io/api',
+  baseURL: 'http://localhost:3000/api',
 })
 
 export function handleGenericError(error: AxiosError) {

src/shared/api/profile/profile.contracts.ts

@@ -3,8 +3,8 @@ import { z } from 'zod'
 export const ProfileDtoSchema = z.object({
   profile: z.object({
     username: z.string(),
-    bio: z.nullable(z.string()),
-    image: z.string(),
+    bio: z.string().nullable(),
+    image: z.string().nullable(),
     following: z.boolean(),
   }),
 })

src/shared/session/session.lib.ts

@@ -7,9 +7,9 @@ export function transformUserDtoToSession(
   const { user } = userDto
   return {
     email: user.email,
-    image: user.image,
     token: user.token,
     username: user.username,
+    image: user?.image || '',
     bio: user?.bio || '',
   }
 }