| 1 |
import { getLogoShape } from '@auto-launch/fetchers/shape'; |
| 2 |
import { |
| 3 |
failWithFallback, |
| 4 |
fetchWithTimeout, |
| 5 |
retryTwice, |
| 6 |
setStatus, |
| 7 |
} from '@auto-launch/functions/helpers'; |
| 8 |
import { updateOption } from '@auto-launch/functions/wp'; |
| 9 |
import { AI_HOST } from '@constants'; |
| 10 |
import { digest } from '@shared/api/digest'; |
| 11 |
import { reqDataBasics } from '@shared/lib/data'; |
| 12 |
import { __ } from '@wordpress/i18n'; |
| 13 |
import { uploadMedia } from '@wordpress/media-utils'; |
| 14 |
|
| 15 |
const { showAILogo } = window.extSharedData; |
| 16 |
const fallback = { |
| 17 |
logoUrl: |
| 18 |
'https://images.extendify-cdn.com/demo-content/logos/ext-custom-logo-default.webp', |
| 19 |
}; |
| 20 |
const url = `${AI_HOST}/api/site-profile/generate-logo`; |
| 21 |
const method = 'POST'; |
| 22 |
const headers = { 'Content-Type': 'application/json' }; |
| 23 |
|
| 24 |
export const handleSiteLogo = async ({ siteProfile }) => { |
| 25 |
if (!showAILogo) return fallback; |
| 26 |
|
| 27 |
// translators: this is for a action log UI. Keep it short |
| 28 |
setStatus(__('Generating a logo', 'extendify-local')); |
| 29 |
|
| 30 |
const { logoObjectName: objectName } = siteProfile; |
| 31 |
const body = JSON.stringify({ ...reqDataBasics, objectName }); |
| 32 |
const response = await retryTwice(() => |
| 33 |
fetchWithTimeout(url, { method, headers, body }), |
| 34 |
).catch((error) => { |
| 35 |
return { ok: false, statusText: error.message, status: 0 }; |
| 36 |
}); |
| 37 |
|
| 38 |
if (!response?.ok) { |
| 39 |
digest({ |
| 40 |
error: { |
| 41 |
message: response.statusText, |
| 42 |
name: 'FetchError', |
| 43 |
status: response.status, |
| 44 |
}, |
| 45 |
details: { source: 'auto-launch', caller: 'handleSiteLogo', objectName }, |
| 46 |
}); |
| 47 |
return fallback; |
| 48 |
} |
| 49 |
|
| 50 |
const logoUrl = await failWithFallback( |
| 51 |
async () => { |
| 52 |
const { logoUrl } = getLogoShape.parse(await response.json()); |
| 53 |
return logoUrl; |
| 54 |
}, |
| 55 |
fallback.logoUrl, |
| 56 |
{ caller: 'handleSiteLogo' }, |
| 57 |
); |
| 58 |
|
| 59 |
// If this errors we just move on. |
| 60 |
await uploadLogo(logoUrl); |
| 61 |
|
| 62 |
return getLogoShape.parse({ logoUrl }); |
| 63 |
}; |
| 64 |
|
| 65 |
// The backend serves the real brand logo from a `logos-custom/` path; other |
| 66 |
// logos keep the duotone-prefixed upload name. |
| 67 |
export const isExternalLogo = (url) => url?.includes('logos-custom/') ?? false; |
| 68 |
|
| 69 |
export const uploadLogo = async (url, { external = false } = {}) => { |
| 70 |
const blob = await (await fetch(url)).blob(); |
| 71 |
const type = blob.type; |
| 72 |
const fileExtension = type.replace('image/', ''); |
| 73 |
const prefix = external ? 'ext-logo-' : 'ext-custom-logo-'; |
| 74 |
const logoName = `${prefix}${Date.now()}`; |
| 75 |
const image = new File([blob], `${logoName}.${fileExtension}`, { type }); |
| 76 |
|
| 77 |
await uploadMedia({ |
| 78 |
filesList: [image], |
| 79 |
onFileChange: async ([fileObj]) => { |
| 80 |
if (!fileObj?.id) return; |
| 81 |
await updateOption('site_logo', fileObj.id); |
| 82 |
}, |
| 83 |
onError: (err) => { |
| 84 |
console.error('Error uploading logo:', err); |
| 85 |
digest({ |
| 86 |
error: err, |
| 87 |
details: { source: 'auto-launch', caller: 'uploadLogo' }, |
| 88 |
}); |
| 89 |
}, |
| 90 |
}); |
| 91 |
}; |
| 92 |
|
