Extract inline fragments from HTML markup by gohabereg · Pull Request #1801 · codex-team/editor.js

Extract inline fragments from HTML markup by gohabereg · Pull Request #1801 · codex-team/editor.js

Conversation

		* @private
		*/
		public insertInlineFragments(data: Pick<SavedData, 'data'>, fragmentsDict: InlineFragmentsDict): Pick<SavedData, 'data'> {
		const insertToString = (str: string, fragments: InlineFragment[]): string => {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It could be moved to the utility method

		startOffset = fragment.range[0] - offset;
		}

		if (!endNode && offset + node.textContent.length >= fragment.range[1]) {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

duplicated code fragment, could be moved to the function

		return template.innerHTML;
		};

		const insert = (dataToProcess: Record<string, unknown>, fragments: InlineFragmentsDict): Pick<SavedData, 'data'> => {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It could be moved to the utility method

		return;
		}

		if (typeof value === 'object') {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

use our internal isObject method

		if (typeof value === 'string') {
		dataToProcess[key] = insertToString(value, fragments[key] as InlineFragment[]);
		}
		});

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what if value is another type? number, function, promise etc?

		const sanitizedData = sanitizeBlocks(extractedData, (name) => {
		return Tools.blockTools.get(name).sanitizeConfig;
		});
		const withFragments = sanitizedData.map(savedData => {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

comment needed. Maybe could be moved to the separate method

		case Node.ELEMENT_NODE: {
		const length = node.textContent.length;
		const fragment: InlineFragment = {
		range: [offset, offset + length],

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

comment needed

		* @private
		*/
		private extractInlineFragments(data: Pick<SavedData, 'data'>): InlineFragmentsDict {
		const extractFromString = (str: string): InlineFragment[] => {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

utility?

		attributes: Object.fromEntries(Array.from((node as HTMLElement).attributes).map(attr => ([attr.nodeName, attr.nodeValue]))),
		};

		fragments.push(fragment);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what if a fragment contains its own children with fragments?

		@@ -0,0 +1,9 @@
		export interface InlineFragment {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

descriptions missed

Todo list:

Connect fragments container to each input in block + recalculate on inputs update
Decide on output format and implement saving
Implement rendering from JSON input
Solve a problem with two-step tools like inline link
Implement different options on fragment insertion: append, replace, merge
Refactoring