admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Moved inlining of CSS to server side IO-424

Browse Source
This commit is contained in:
Patrick Fic
2020-12-08 11:15:29 -08:00
parent 79910f6725
commit bb8343f966
8 changed files with 607 additions and 547 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
client/src/components/shop-template-editor-save-button/shop-template-editor-save-button.component.jsx
View File

@@ -4,8 +4,7 @@ import { useMutation } from "@apollo/react-hooks";
import { useTranslation } from "react-i18next";
import { UPDATE_TEMPLATE } from "../../graphql/templates.queries";
import { logImEXEvent } from "../../firebase/firebase.utils";
//import inlineCss from "inline-css";
import axios from "axios";
export default function ShopTemplateSaveButton({
templateId,
gql,
@@ -16,42 +15,46 @@ export default function ShopTemplateSaveButton({
const [updateTemplate] = useMutation(UPDATE_TEMPLATE);
const handleSave = async () => {
alert("Outstanding issue IO-424");
// logImEXEvent("shop_template_update");
// setLoading(true);
// emailEditorRef.current.exportHtml(async (data) => {
// inlineCss(data.html, {
// url: `${window.location.protocol}://${window.location.host}/`,
// }).then(async function (inlineHtml) {
// const result = await updateTemplate({
// variables: {
// templateId: templateId,
// template: {
// query: gql,
// html: inlineHtml,
// jsontemplate: data.design,
// },
// },
// });
// if (!!!result.errors) {
// notification["success"]({
// message: t("templates.successes.updated"),
// });
// } else {
// notification["error"]({
// message: t("templates.errors.updating", {
// error: JSON.stringify(result.errors),
// }),
// });
// }
// setLoading(false);
// });
// });
logImEXEvent("shop_template_update");
setLoading(true);
emailEditorRef.current.exportHtml(async (data) => {
const response = await axios.post("/render/inlinecss", {
html: data.html,
url: `${window.location.protocol}://${window.location.host}/`,
});
console.log(
"🚀 ~ file: shop-template-editor-save-button.component.jsx ~ line 25 ~ emailEditorRef.current.exportHtml ~ inlineHtml",
response
);
const result = await updateTemplate({
variables: {
templateId: templateId,
template: {
query: gql,
html: response.data,
jsontemplate: data.design,
},
},
});
if (!!!result.errors) {
notification["success"]({
message: t("templates.successes.updated"),
});
} else {
notification["error"]({
message: t("templates.errors.updating", {
error: JSON.stringify(result.errors),
}),
});
}
setLoading(false);
});
};
return (
<Button disabled={!!!templateId} loading={loading} onClick={handleSave}>
{t("general.actions.save")} <span>IO-424</span>
{t("general.actions.save")}
</Button>
);
}

49
client/src/components/shop-template-test-render/shop-template-test-render.component.jsx
View File

@@ -1,7 +1,7 @@
import { Button } from "antd";
import axios from "axios";
import gql from "graphql-tag";
//import inlineCss from "inline-css";
import { JsonEditor as Editor } from "jsoneditor-react";
import "jsoneditor-react/es/editor.min.css";
import React, { useState } from "react";
@@ -32,31 +32,32 @@ export function ShopTemplateTestRender({
const handleTestRender = async () => {
try {
setLoading(true);
alert("IO-424 Blocks this.")
// emailEditorRef.current.exportHtml(async (data) => {
// inlineCss(data.html, {
// url: `${window.location.protocol}://${window.location.host}/`,
// }).then(async function (inlineHtml) {
// try {
// const { data: contextData } = await client.query({
// query: gql(query),
// variables: variables,
// fetchPolicy: "network-only",
// });
// const { data } = await axios.post("/render", {
// view: inlineHtml,
// context: { ...contextData, bodyshop: bodyshop },
// });
// displayTemplateInWindowNoprint(data);
emailEditorRef.current.exportHtml(async (data) => {
try {
const inlineHtml = await axios.post("/render/inlinecss", {
html: data.html,
url: `${window.location.protocol}://${window.location.host}/`,
});
// setLoading(false);
// } catch (error) {
// setLoading(false);
// alert(error);
// }
// });
// });
const { data: contextData } = await client.query({
query: gql(query),
variables: variables,
fetchPolicy: "network-only",
});
const renderResponse = await axios.post("/render", {
view: inlineHtml.data,
context: { ...contextData, bodyshop: bodyshop },
});
displayTemplateInWindowNoprint(renderResponse.data);
setLoading(false);
} catch (error) {
setLoading(false);
alert(error);
}
});
} catch (error) {
setLoading(false);
alert(error);