Fix image preview URLs in admin panel
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

- Use VITE_API_URL environment variable instead of hardcoded localhost:8000
- Fixes broken image previews for both category and product uploads
- Properly constructs backend URL from API URL
This commit is contained in:
dvirlabs 2026-05-08 17:24:02 +03:00
parent e4d37dea3f
commit f9419c2f4a

View File

@ -167,6 +167,10 @@ export default function Admin() {
const newImages = [...uploadedImages]
try {
// Get backend URL from environment
const apiUrl = import.meta.env.VITE_API_URL || 'http://localhost:8000/api'
const backendUrl = apiUrl.replace('/api', '') // Remove /api suffix to get base URL
for (let i = 0; i < files.length; i++) {
const file = files[i]
const formDataUpload = new FormData()
@ -179,7 +183,9 @@ export default function Admin() {
})
// Add the full URL
const imageUrl = `http://localhost:8000${response.data.url}`
const imageUrl = response.data.url.startsWith('http')
? response.data.url
: `${backendUrl}${response.data.url}`
newImages.push(imageUrl)
}
@ -339,9 +345,11 @@ export default function Admin() {
headers: { 'Content-Type': 'multipart/form-data' }
})
// Prepend backend URL for image display
const apiUrl = import.meta.env.VITE_API_URL || 'http://localhost:8000/api'
const backendUrl = apiUrl.replace('/api', '') // Remove /api suffix to get base URL
const imageUrl = response.data.url.startsWith('http')
? response.data.url
: `http://localhost:8000${response.data.url}`
: `${backendUrl}${response.data.url}`
setCategoryFormData({ ...categoryFormData, image: imageUrl })
setToast({ type: 'success', message: 'Image uploaded successfully!' })
} catch (error) {