| 1 |
import { PATTERNS_HOST, AI_HOST, IMAGES_HOST } from '@constants'; |
| 2 |
import { getSiteStyle } from '@page-creator/api/WPApi'; |
| 3 |
import { useUserStore } from '@page-creator/state/user'; |
| 4 |
import { mergeRequiredPlugins } from '@shared/utils/merge-required-plugins'; |
| 5 |
|
| 6 |
const { siteTitle, siteType } = window.extSharedData; |
| 7 |
const extraBody = { |
| 8 |
...Object.fromEntries( |
| 9 |
Object.entries(window.extSharedData).filter(([key]) => |
| 10 |
// Optionally add items to request body |
| 11 |
[ |
| 12 |
'partnerId', |
| 13 |
'devbuild', |
| 14 |
'version', |
| 15 |
'siteId', |
| 16 |
'wpLanguage', |
| 17 |
'wpVersion', |
| 18 |
'siteProfile', |
| 19 |
].includes(key), |
| 20 |
), |
| 21 |
), |
| 22 |
}; |
| 23 |
|
| 24 |
const fetchPageTemplates = async (details = {}) => { |
| 25 |
const { showLocalizedCopy, activePlugins, installedPlugins } = |
| 26 |
window.extSharedData; |
| 27 |
const { allowsInstallingPlugins } = useUserStore.getState(); |
| 28 |
const sitePlugins = details?.sitePlugins || []; |
| 29 |
|
| 30 |
const plugins = |
| 31 |
activePlugins?.map((path) => { |
| 32 |
return path.split('/')[0]; |
| 33 |
}) ?? []; |
| 34 |
|
| 35 |
const data = Object.entries(details).reduce((result, [key, value]) => { |
| 36 |
if (value === null) result; |
| 37 |
return { |
| 38 |
...result, |
| 39 |
[key]: typeof value === 'object' ? JSON.stringify(value) : value, |
| 40 |
}; |
| 41 |
}, {}); |
| 42 |
|
| 43 |
const res = await fetch(`${PATTERNS_HOST}/api/page-creator`, { |
| 44 |
method: 'POST', |
| 45 |
headers: { 'Content-Type': 'application/json' }, |
| 46 |
body: JSON.stringify({ |
| 47 |
...extraBody, |
| 48 |
siteType: siteType?.slug, |
| 49 |
showLocalizedCopy: !!showLocalizedCopy, |
| 50 |
allowsInstallingPlugins, |
| 51 |
plugins: JSON.stringify(plugins), |
| 52 |
installedPlugins: JSON.stringify(installedPlugins), |
| 53 |
allowedPlugins: JSON.stringify(sitePlugins), |
| 54 |
...data, |
| 55 |
}), |
| 56 |
}); |
| 57 |
|
| 58 |
if (!res.ok) throw new Error('Bad response from server'); |
| 59 |
|
| 60 |
return await res.json(); |
| 61 |
}; |
| 62 |
|
| 63 |
export const getGeneratedPageTemplate = async ({ |
| 64 |
pageProfile, |
| 65 |
siteImages, |
| 66 |
sitePlugins, |
| 67 |
}) => { |
| 68 |
const siteStyle = await getSiteStyle(); |
| 69 |
|
| 70 |
// we need the new generated AI description from the page profile |
| 71 |
const page = await fetchPageTemplates({ |
| 72 |
siteInformation: { title: siteTitle }, |
| 73 |
siteImages, |
| 74 |
siteStyle, |
| 75 |
pageProfile, |
| 76 |
sitePlugins, |
| 77 |
}); |
| 78 |
|
| 79 |
if (!page?.template) { |
| 80 |
throw new Error('Could not get page'); |
| 81 |
} |
| 82 |
|
| 83 |
const currentTheme = window.extSharedData?.themeSlug || 'extendable'; |
| 84 |
if (currentTheme !== 'extendable') { |
| 85 |
page.template.patterns = page.template.patterns.filter( |
| 86 |
(pattern) => !pattern.patternTypes.includes('page-title'), |
| 87 |
); |
| 88 |
} |
| 89 |
|
| 90 |
return page; |
| 91 |
}; |
| 92 |
|
| 93 |
export const generateCustomContent = async ({ |
| 94 |
page, |
| 95 |
userState, |
| 96 |
pageProfile, |
| 97 |
}) => { |
| 98 |
const res = await fetch(`${AI_HOST}/api/patterns`, { |
| 99 |
method: 'POST', |
| 100 |
headers: { 'Content-Type': 'application/json' }, |
| 101 |
body: JSON.stringify({ |
| 102 |
...extraBody, |
| 103 |
page, |
| 104 |
userState, |
| 105 |
siteProfile: pageProfile, |
| 106 |
}), |
| 107 |
}); |
| 108 |
|
| 109 |
if (!res.ok) throw new Error('Bad response from server'); |
| 110 |
return await res.json(); |
| 111 |
}; |
| 112 |
|
| 113 |
export const getPageProfile = async ({ description, siteProfile }) => { |
| 114 |
const response = await fetch(`${AI_HOST}/api/page-profile`, { |
| 115 |
method: 'POST', |
| 116 |
headers: { 'Content-Type': 'application/json' }, |
| 117 |
body: JSON.stringify({ |
| 118 |
...extraBody, |
| 119 |
siteDescription: siteProfile?.aiDescription || '', |
| 120 |
description, |
| 121 |
}), |
| 122 |
}); |
| 123 |
|
| 124 |
if (!response?.ok) { |
| 125 |
throw new Error('Something went wrong while fetching the profile'); |
| 126 |
} |
| 127 |
|
| 128 |
const data = await response.json(); |
| 129 |
return data?.aiDescription |
| 130 |
? data |
| 131 |
: { |
| 132 |
aiTitle: null, |
| 133 |
aiPageType: null, |
| 134 |
aiDescription: null, |
| 135 |
aiKeywords: [], |
| 136 |
}; |
| 137 |
}; |
| 138 |
|
| 139 |
export const getPageImages = async ({ pageProfile }) => { |
| 140 |
const { aiSiteType, aiSiteCategory, aiDescription, aiKeywords } = pageProfile; |
| 141 |
const search = new URLSearchParams({ |
| 142 |
aiSiteType, |
| 143 |
aiSiteCategory, |
| 144 |
aiDescription, |
| 145 |
aiKeywords, |
| 146 |
...extraBody, |
| 147 |
source: 'page-creator', |
| 148 |
}); |
| 149 |
|
| 150 |
if (siteTitle) search.append('title', siteTitle); |
| 151 |
|
| 152 |
const response = await fetch(`${IMAGES_HOST}/api/search?${search}`, { |
| 153 |
method: 'GET', |
| 154 |
headers: { 'Content-Type': 'application/json' }, |
| 155 |
}); |
| 156 |
|
| 157 |
if (!response?.ok) { |
| 158 |
throw new Error('Something went wrong while fetching the images'); |
| 159 |
} |
| 160 |
|
| 161 |
const data = await response.json(); |
| 162 |
return data?.siteImages ? data : { siteImages: [] }; |
| 163 |
}; |
| 164 |
|
| 165 |
export const getSitePlugins = async ({ pageProfile }) => { |
| 166 |
const url = `${AI_HOST}/api/site-plugins`; |
| 167 |
const method = 'POST'; |
| 168 |
const headers = { 'Content-Type': 'application/json' }; |
| 169 |
const fallback = mergeRequiredPlugins([]); |
| 170 |
|
| 171 |
if (!pageProfile) { |
| 172 |
return fallback; |
| 173 |
} |
| 174 |
|
| 175 |
const { wpLanguage, partnerId, pluginGroupId } = window.extSharedData; |
| 176 |
|
| 177 |
const body = JSON.stringify({ |
| 178 |
aiSiteType: pageProfile?.aiPageType || '', |
| 179 |
aiDescription: pageProfile?.aiDescription || '', |
| 180 |
aiKeywords: pageProfile?.aiKeywords || [], |
| 181 |
siteQuestions: [], |
| 182 |
wpLanguage, |
| 183 |
partnerId, |
| 184 |
pluginGroupId, |
| 185 |
}); |
| 186 |
|
| 187 |
let response; |
| 188 |
|
| 189 |
try { |
| 190 |
response = await fetch(url, { method, headers, body }); |
| 191 |
if (!response?.ok) throw new Error('Bad response from server'); |
| 192 |
} catch (error) { |
| 193 |
try { |
| 194 |
response = await fetch(url, { method, headers, body }); |
| 195 |
} catch { |
| 196 |
return fallback; |
| 197 |
} |
| 198 |
} |
| 199 |
|
| 200 |
if (!response?.ok) return fallback; |
| 201 |
|
| 202 |
try { |
| 203 |
const data = await response.json(); |
| 204 |
const suggestedPlugins = data?.selectedPlugins ?? fallback; |
| 205 |
return mergeRequiredPlugins(suggestedPlugins); |
| 206 |
} catch (error) { |
| 207 |
return fallback; |
| 208 |
} |
| 209 |
}; |
| 210 |
|
| 211 |
export const getImprintPageTemplate = async () => { |
| 212 |
const siteStyle = await getSiteStyle(); |
| 213 |
const endpoint = `${PATTERNS_HOST}/api/page-imprint`; |
| 214 |
|
| 215 |
const res = await fetch(endpoint, { |
| 216 |
method: 'POST', |
| 217 |
headers: { 'Content-Type': 'application/json' }, |
| 218 |
body: JSON.stringify({ |
| 219 |
...extraBody, |
| 220 |
siteStyle: JSON.stringify(siteStyle), |
| 221 |
}), |
| 222 |
}); |
| 223 |
|
| 224 |
if (!res.ok) throw new Error('Could not get imprint page'); |
| 225 |
|
| 226 |
const response = await res.json(); |
| 227 |
|
| 228 |
if (!response?.template) { |
| 229 |
throw new Error('No template found for imprint page'); |
| 230 |
} |
| 231 |
|
| 232 |
return { ...response.template }; |
| 233 |
}; |
| 234 |
|