fix: fix placeholder image directory path

Dockerfile

@@ -17,6 +17,7 @@ ARG NEXT_PUBLIC_ASSETS_BASE_URL
 
 ENV NODE_ENV=production
 ENV NEXT_TELEMETRY_DISABLED=1
+ENV SOURCE_DIR=/app
 
 COPY . .
 

src/components/ResponsiveImage/ResponsiveImage.tsx

@@ -56,7 +56,7 @@ export const ResponsiveImage = ({
     >
       <div className="comment">
         <img
-          src={data.placeholder?.replace('public/', '/')}
+          src={data.placeholder?.replace('/public/', '/')}
           alt={data.alt}
           title={data.alt}
         />

src/configs/consts.configs.ts

@@ -1 +1 @@
-export const POSTS_IMAGE_PLACEHOLDER_DIR = `./public/images/placeholders`
+export const POSTS_IMAGE_PLACEHOLDER_DIR = '/public/images/placeholders'

src/services/images.service.ts

@@ -5,6 +5,7 @@ import {
   transformStrapiImageUrl,
 } from '@/services/strapi/transformers/utils'
 import axios from 'axios'
+import path from 'path'
 import sharp from 'sharp'
 
 export class PlaceholderService {
@@ -33,7 +34,12 @@ export class PlaceholderService {
     const thumbnailPath = getStrapiImageUrlBySize('thumbnail', imagePath)
 
     try {
-      const filePath = `${POSTS_IMAGE_PLACEHOLDER_DIR}/${fileName}`
+      const relativePath = path.join(POSTS_IMAGE_PLACEHOLDER_DIR, fileName)
+      const filePath = path.join(
+        process.env.SOURCE_DIR ?? process.cwd(),
+        relativePath,
+      )
+
       const imageUrl = transformStrapiImageUrl(thumbnailPath)
       const imageBuffer = (
         await axios({ url: imageUrl, responseType: 'arraybuffer' })
@@ -51,9 +57,9 @@ export class PlaceholderService {
         })
         .toFile(filePath)
 
-      this.add(fileName, filePath)
+      this.add(fileName, relativePath)
 
-      return filePath
+      return relativePath
     } catch (e) {
       console.log(e)
     }