aghontpi/dnde

Drag and drop react email editor

dnde's Issues

Change padding attribute ui

Currently the padding ui is input box, change it to resemble something like below

w.

types not define error given when clone

fn remove id from the uiWrapperList, if possible upgrade list to map

dnde/src/Context/Htmlwrapper.context.tsx

Lines 16 to 21 in 5031a8a

	//todo: fn remove id from the uiWrapperList, if possible upgrade list to map
	return (
	<HtmlContext.Provider
	value={{
	uiList: uiWrapperList,

---

This issue was generated by todo based on a todo comment in 5031a8a. It's been assigned to @aghontpi because they committed the code.

Render HTML template

Is there a way to load an already created HTML Template?*

Element name overlap issue

fix all key realted errors

dnde/src/Utils/htmlProcessor.ts

Lines 75 to 80 in df285b9

	// todo: fix all key realted errors
	if (element.classList.contains('mjml-tag')) {
	// const ReactNode = React.createElement(nodeName, { key: ++counter, ...attributes }, children);
	// return React.createElement(
	// 'div',

---

This issue was generated by todo based on a todo comment in df285b9. It's been assigned to @aghontpi because they committed the code.

Invalid HTML causes crash

Problem

Editing inside the html content without the table element causes crash.

Video

2021-10-25.11-38-20.mp4

Remove processing static paths, unnecessary computation.

dnde/src/Components/BodyAttributes.tsx

Lines 33 to 36 in 6ee7a30

	// todo remove this??, because the path is static,
	// taking advantage of the fact that head tag always has a static path
	if (mjmlJson && mjmlJson['children'] && mjmlJson['children'].length > 0) {
	let headConfig = mjmlJson['children'][0];

---

This issue was generated by todo based on a todo comment in 6ee7a30. It's been assigned to @aghontpi because they committed the code.

make it so, that only text editable fields are shown this,

dnde/src/Components/HtmlWrapper.tsx

Lines 79 to 84 in 4612b5a

	// {/* todo: make it so, that only text editable fields are shown this,
	// make sure to create only one instance of ckeditor and move the position relative to the position of the text */}
	// {children}
	// </div>
	// </div>
	// );

---

This issue was generated by todo based on a todo comment in 4612b5a. It's been assigned to @aghontpi because they committed the code.

mjmlJson here creates two way dependency,

dnde/src/Components/Mods/Content.tsx

Lines 29 to 34 in 0860043

	// todo: mjmlJson here creates two way dependency,
	// remove it, and handle 'mj-text' differently, this is dangerous, as it could lead
	// to infinite renders
	}, [visible, path, mjmlJson]);
	useEffect(() => {

---

This issue was generated by todo based on a todo comment in 0860043. It's been assigned to @aghontpi because they committed the code.

unable to set background image to the entire body

handling emails that has background image to the entire body - unable to handle mihoyo promotional email

Able to create the exact design but unable to

• add background image to entire body of the email

ex: the following image is used as background image to the entire content. (open the image in new tab and check the height)

the image of the original promotional mail

the original mails source code in zip

mihoyo-promotional-mail.html.zip

check if changing directly to mjmlJson causes perfomance impact

dnde/src/Components/Mods/Img.tsx

Lines 38 to 43 in 59380b0

	//todo: check if changing directly to mjmlJson causes perfomance impact
	// if so, then maintain a local state, then on change change the value first,
	// then by using useeffect listen for the in localvalue, then update the mjmlJson.
	const handleChange = useMemo(
	() => (e: ChangeEvent<HTMLInputElement>) => {
	let value = e.currentTarget.value;

---

This issue was generated by todo based on a todo comment in 59380b0. It's been assigned to @aghontpi because they committed the code.

implement getconfirmation, that user is about to delete a column

dnde/src/Components/ColumnSelector.tsx

Lines 50 to 55 in c2543cc

	// todo: implement getconfirmation, that user is about to delete a column
	}
	let newChildren = [];
	// iterate over existing children
	for (let i = 0; i < existingLength && i < convertLength; i++) {

---

This issue was generated by todo based on a todo comment in c2543cc. It's been assigned to @aghontpi because they committed the code.

add operation got complex, refactor by seperating append, insert, copy operation...

dnde/src/Utils/operations.ts

Lines 57 to 62 in 8865202

	// todo: add operation got complex, refactor by seperating append, insert, copy operations
	if (!insert) {
	// if tag name is mj-section, generate uniqueId for all mj-column tags
	if (droppedConfig.tagName === 'mj-section') {
	droppedConfig = generateUiqueIdForColumns(droppedConfig, uid);
	}

---

This issue was generated by todo based on a todo comment in 8865202. It's been assigned to @aghontpi because they committed the code.

optimize this function, move to useEffect, useState.

dnde/src/Components/Mods/Paddings.tsx

Lines 38 to 42 in 65f9001

	//todo: optimize this function, move to useEffect, useState.
	// its being called on every hover event.
	const getValue = (direction: string) => {
	let value = '';
	//todo: debug why removing active causes crash getValue:{@mods/pad..tsx}

---

This issue was generated by todo based on a todo comment in 65f9001. It's been assigned to @aghontpi because they committed the code.

URL without protocol points to same domain

Linking a url using the popover dialog or using the sidebar to link href is not working as intended.

• Input like twitch.tv should redirect to the link but it points to the location in the current domain https://dnde.bluepie.in/template/twitch.tv
• Using full link with the protocol works fine https://twitch.tv

Possible sus line below

dnde/src/Components/Mods/CustomInlineEditor.tsx

Line 259 in 26f7407

'<a href="' + link + '" target="_blank">' + document.getSelection() + '</a>'

refractor getIndexOfElementInParent

dnde/src/Utils/closestParent.ts

Lines 140 to 145 in 8865202

	// todo: refractor getIndexOfElementInParent
	const getIndexOfElementInParent = (node: HTMLElement, mjmlJson: any, uniqueIdentifier: string) => {
	let index = -1;
	let parent = findColumnOfElement(node);
	// within column

---

This issue was generated by todo based on a todo comment in 8865202. It's been assigned to @aghontpi because they committed the code.

ignore exisiting title, custom css tags while import.

dnde/src/Utils/mjmlProcessor.ts

Lines 123 to 126 in e2ce37e

	//todo: ignore exisiting title, custom css tags while import.
	const importJson = (input: any, idGenerator: () => string, rawContent: boolean = false) => {
	let regeneratedIdJson = generateUniqueIdRecursively(input, idGenerator);

---

This issue was generated by todo based on a todo comment in e2ce37e. It's been assigned to @aghontpi because they committed the code.

investigate onChange behaviour here ~sendTestMail

dnde/src/Pages/Editor/Editor.tsx

Lines 63 to 68 in d5b4288

	//todo: investigate onChange behaviour here ~sendTestMail
	const [mail, SetMail] = useState('');
	const onBlur = (e: any) => {
	SetMail(e.currentTarget.value);
	};

---

This issue was generated by todo based on a todo comment in d5b4288. It's been assigned to @aghontpi because they committed the code.

handle generateDropItemPlaceholder inside this fn.

dnde/src/Utils/generateDropItemPlaceholder.ts

Lines 118 to 123 in 548bb29

	// todo: handle generateDropItemPlaceholder inside this fn.
	// by getting event and performing calculations.
	return false;
	}
	// add the new element

---

This issue was generated by todo based on a todo comment in 548bb29. It's been assigned to @aghontpi because they committed the code.

optimize this

dnde/src/Hooks/Attribute.hook.ts

Lines 50 to 55 in 3db1701

	// todo: optimize this
	const getValue = () => {
	let value = '';
	if (path && visible) {
	let element = _.get(mjmlJson, path);
	if (element && element.attributes) {

---

This issue was generated by todo based on a todo comment in 3db1701. It's been assigned to @aghontpi because they committed the code.