@botonic/plugin-flow-builder
Version:
Use Flow Builder to show your contents
84 lines • 4.09 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useWebviewContents = void 0;
const tslib_1 = require("tslib");
const axios_1 = tslib_1.__importDefault(require("axios"));
const react_1 = require("react");
const constants_1 = require("../constants");
const types_1 = require("../types");
const types_2 = require("./types");
function useWebviewContents({ apiUrl = constants_1.FLOW_BUILDER_API_URL_PROD, version = types_1.FlowBuilderJSONVersion.LATEST,
// @ts-ignore
orgId, botId, webviewId, locale, mapContents, }) {
const [textContents, setTextContents] = (0, react_1.useState)();
const [imageContents, setImageContents] = (0, react_1.useState)();
const [contents, setContents] = (0, react_1.useState)({});
const [currentLocale, setCurrentLocale] = (0, react_1.useState)(locale);
const [error, setError] = (0, react_1.useState)(false);
const updateCurrentLocale = (textContents) => {
if (!textContents || textContents.length === 0) {
console.log('There is no text contents to check the locale');
return;
}
const locales = textContents[0].content.text.map(text => text.locale);
const language = currentLocale.split('-')[0];
if (locales.includes(currentLocale)) {
setCurrentLocale(currentLocale);
return;
}
if (locales.includes(language)) {
setCurrentLocale(language);
return;
}
console.error(`locale: ${currentLocale} cannot be resolved with: ${locales.join(', ')}`);
};
const getTextContent = (contentID) => {
var _a, _b;
return (((_b = (_a = textContents === null || textContents === void 0 ? void 0 : textContents.find(textContent => textContent.code === contentID)) === null || _a === void 0 ? void 0 : _a.content.text.find(text => text.locale === currentLocale)) === null || _b === void 0 ? void 0 : _b.message) ||
'');
};
const getImageSrc = (contentID) => {
var _a, _b;
return (((_b = (_a = imageContents === null || imageContents === void 0 ? void 0 : imageContents.find(imageContent => imageContent.code === contentID)) === null || _a === void 0 ? void 0 : _a.content.image.find(image => image.locale === currentLocale)) === null || _b === void 0 ? void 0 : _b.file) ||
'');
};
(0, react_1.useEffect)(() => {
if (textContents || imageContents) {
const contentsObject = {};
for (const [key, value] of Object.entries(mapContents)) {
contentsObject[key] = getTextContent(value) || getImageSrc(value);
}
setContents(contentsObject);
}
}, [textContents, imageContents, currentLocale]);
(0, react_1.useEffect)(() => {
const getResponseContents = () => tslib_1.__awaiter(this, void 0, void 0, function* () {
const url = `${apiUrl}/v1/bot_flows/${botId}/versions/${version}/webviews/${webviewId}/`;
try {
const response = yield axios_1.default.get(url);
const textResponseContents = response.data.filter(webviewContent => webviewContent.type === types_2.WebviewContentType.TEXT);
setTextContents(textResponseContents);
const imageResponseContents = response.data.filter(webviewContent => webviewContent.type === types_2.WebviewContentType.IMAGE);
setImageContents(imageResponseContents);
updateCurrentLocale(textResponseContents);
}
catch (error) {
console.error('Error fetching webview contents:', error);
setError(true);
}
});
getResponseContents();
}, []);
return {
isLoading: Object.keys(contents).length === 0,
error,
webviewContentsContext: {
getTextContent,
getImageSrc,
setCurrentLocale,
contents,
},
};
}
exports.useWebviewContents = useWebviewContents;
//# sourceMappingURL=use-webview-contents.js.map