Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug-Refactor-Type-determination-logic-in-turn-into-dropdown-component #3239

Merged
merged 8 commits into from
Jun 9, 2024
Merged

Bug-Refactor-Type-determination-logic-in-turn-into-dropdown-component #3239

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
445d8d7
Bug-Refactor-Type-determination-logic-in-turn-into-dropdown-componet
kumarajay0412 Jun 4, 2024
04fad5a
feat : improve logic for checking common selection
kumarajay0412 Jun 4, 2024
b5ed9ce
Create serious-bikes-remember.md
kumarajay0412 Jun 4, 2024
6294793
update : logic of iterating over nodes using every in turn into dropd…
kumarajay0412 Jun 4, 2024
0c988fb
feat : update variable names in different turnIntoDropdownMenu
kumarajay0412 Jun 8, 2024
f2c5fde
Create orange-dolphins-hear.md
kumarajay0412 Jun 8, 2024
5e56143
Merge branch 'main' into Bug-Refactor-Type-determination-logic-in-tur…
kumarajay0412 Jun 8, 2024
6bcce76
Merge branch 'main' into Bug-Refactor-Type-determination-logic-in-tur…
kumarajay0412 Jun 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/serious-bikes-remember.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@udecode/plate-ui": patch
---

refactor type determination logic in turn-into-dropdown component
30 changes: 16 additions & 14 deletions apps/www/src/components/plate-ui/playground-turn-into-dropdown-menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,10 @@ import type { DropdownMenuProps } from '@radix-ui/react-dropdown-menu';

import { ELEMENT_BLOCKQUOTE } from '@udecode/plate-block-quote';
import {
type TElement,
collapseSelection,
findNode,
focusEditor,
getNodeEntries,
isBlock,
isSelectionExpanded,
toggleNodeType,
useEditorRef,
useEditorSelector,
Expand Down Expand Up @@ -109,20 +107,24 @@ const defaultItem = items.find((item) => item.value === ELEMENT_PARAGRAPH)!;

export function PlaygroundTurnIntoDropdownMenu(props: DropdownMenuProps) {
const value: string = useEditorSelector((editor) => {
if (!isSelectionExpanded(editor)) {
const entry = findNode<TElement>(editor!, {
match: (n) => isBlock(editor, n),
});
let firstNodeType: string = ELEMENT_PARAGRAPH;
let allNodesMatchFirstNode = false;
const codeBlockEntries = getNodeEntries(editor, {
Copy link
Collaborator

Choose a reason for hiding this comment

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

All looks good now. The only other thing I can see is you might want to change this variable name.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

done

match: (n) => isBlock(editor, n),
mode: 'highest',
});
const nodes = Array.from(codeBlockEntries);

if (nodes.length > 0) {
firstNodeType = nodes[0][0].type as string;
allNodesMatchFirstNode = nodes.every(([node]) => {
const type: string = (node?.type as string) || ELEMENT_PARAGRAPH;

if (entry) {
return (
items.find((item) => item.value === entry[0].type)?.value ??
ELEMENT_PARAGRAPH
);
}
return type === firstNodeType;
});
}

return ELEMENT_PARAGRAPH;
return allNodesMatchFirstNode ? firstNodeType : ELEMENT_PARAGRAPH;
}, []);

const editor = useEditorRef();
Expand Down
30 changes: 16 additions & 14 deletions apps/www/src/registry/default/plate-ui/turn-into-dropdown-menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,10 @@ import type { DropdownMenuProps } from '@radix-ui/react-dropdown-menu';

import { ELEMENT_BLOCKQUOTE } from '@udecode/plate-block-quote';
import {
type TElement,
collapseSelection,
findNode,
focusEditor,
getNodeEntries,
isBlock,
isCollapsed,
toggleNodeType,
useEditorRef,
useEditorSelector,
Expand Down Expand Up @@ -79,20 +77,24 @@ const defaultItem = items.find((item) => item.value === ELEMENT_PARAGRAPH)!;

export function TurnIntoDropdownMenu(props: DropdownMenuProps) {
const value: string = useEditorSelector((editor) => {
if (isCollapsed(editor.selection)) {
const entry = findNode<TElement>(editor, {
match: (n) => isBlock(editor, n),
});
let firstNodeType: string = ELEMENT_PARAGRAPH;
let allNodesMatchFirstNode = false;
const codeBlockEntries = getNodeEntries(editor, {
match: (n) => isBlock(editor, n),
mode: 'highest',
});
const nodes = Array.from(codeBlockEntries);

if (nodes.length > 0) {
firstNodeType = nodes[0][0].type as string;
allNodesMatchFirstNode = nodes.every(([node]) => {
const type: string = (node?.type as string) || ELEMENT_PARAGRAPH;

if (entry) {
return (
items.find((item) => item.value === entry[0].type)?.value ??
ELEMENT_PARAGRAPH
);
}
return type === firstNodeType;
});
}

return ELEMENT_PARAGRAPH;
return allNodesMatchFirstNode ? firstNodeType : ELEMENT_PARAGRAPH;
}, []);

const editor = useEditorRef();
Expand Down
30 changes: 16 additions & 14 deletions templates/plate-playground-template/src/components/plate-ui/turn-into-dropdown-menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,9 @@ import { DropdownMenuProps } from '@radix-ui/react-dropdown-menu';
import { ELEMENT_BLOCKQUOTE } from '@udecode/plate-block-quote';
import {
collapseSelection,
findNode,
focusEditor,
getNodeEntries,
isBlock,
isCollapsed,
TElement,
toggleNodeType,
useEditorRef,
useEditorSelector,
Expand Down Expand Up @@ -77,20 +75,24 @@ const defaultItem = items.find((item) => item.value === ELEMENT_PARAGRAPH)!;

export function TurnIntoDropdownMenu(props: DropdownMenuProps) {
const value: string = useEditorSelector((editor) => {
if (isCollapsed(editor.selection)) {
const entry = findNode<TElement>(editor, {
match: (n) => isBlock(editor, n),
});
let firstNodeType: string = ELEMENT_PARAGRAPH;
let allNodesMatchFirstNode = false;
const codeBlockEntries = getNodeEntries(editor, {
match: (n) => isBlock(editor, n),
mode: 'highest',
});
const nodes = Array.from(codeBlockEntries);

if (nodes.length > 0) {
firstNodeType = nodes[0][0].type as string;
allNodesMatchFirstNode = nodes.every(([node]) => {
const type: string = (node?.type as string) || ELEMENT_PARAGRAPH;

if (entry) {
return (
items.find((item) => item.value === entry[0].type)?.value ??
ELEMENT_PARAGRAPH
);
}
return type === firstNodeType;
});
}

return ELEMENT_PARAGRAPH;
return allNodesMatchFirstNode ? firstNodeType : ELEMENT_PARAGRAPH;
}, []);

const editor = useEditorRef();
Expand Down
Loading