mirror of
https://github.com/WenPai-org/wpmind.git
synced 2025-08-03 11:11:27 +08:00
fixed wrong toolbar dropdown rendering
This commit is contained in:
parent
8db40cc15c
commit
1255f566b2
1 changed files with 189 additions and 201 deletions
|
@ -13,7 +13,7 @@ import { BlockControls } from '@wordpress/block-editor';
|
|||
import { createHigherOrderComponent } from '@wordpress/compose';
|
||||
import { useDispatch } from '@wordpress/data';
|
||||
import {
|
||||
ToolbarGroup,
|
||||
ToolbarDropdownMenu,
|
||||
DropdownMenu,
|
||||
MenuGroup,
|
||||
MenuItem,
|
||||
|
@ -78,206 +78,194 @@ function Toolbar() {
|
|||
}
|
||||
|
||||
return (
|
||||
<ToolbarGroup>
|
||||
<DropdownMenu
|
||||
icon={<MindLogoIcon />}
|
||||
label={__('Mind', '@@text_domain')}
|
||||
className="mind-toolbar-toggle"
|
||||
popoverProps={{ className: 'mind-toolbar-dropdown' }}
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup>
|
||||
<MenuItem
|
||||
icon={<AIMessage />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal();
|
||||
}}
|
||||
>
|
||||
{__('Ask AI', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIImproveIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(
|
||||
__(
|
||||
'Improve writing language',
|
||||
'mind'
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
{__('Improve', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIFixSpellingIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(
|
||||
__(
|
||||
'Fix spelling and grammar',
|
||||
'mind'
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
{__('Fix Spelling & Grammar', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIShorterIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Make shorter', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Make Shorter', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AILongerIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Make longer', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Make Longer', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AISummarizeIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Summarize', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Summarize', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIParaphraseIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Paraphrase', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Paraphrase', 'mind')}
|
||||
</MenuItem>
|
||||
</MenuGroup>
|
||||
<MenuGroup>
|
||||
<DropdownMenu
|
||||
icon={<AIToneIcon />}
|
||||
iconPosition="left"
|
||||
toggleProps={{
|
||||
children: (
|
||||
<>
|
||||
{__('Adjust Tone', 'mind')}
|
||||
<ArrowRightIcon />
|
||||
</>
|
||||
),
|
||||
}}
|
||||
popoverProps={{
|
||||
placement: 'right-end',
|
||||
className: 'mind-toolbar-dropdown',
|
||||
}}
|
||||
className="mind-toolbar-dropdown-toggle"
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup
|
||||
label={__(
|
||||
'Select Tone',
|
||||
'@@text_domain'
|
||||
)}
|
||||
>
|
||||
{TONE.map((data) => (
|
||||
<MenuItem
|
||||
key={data[0]}
|
||||
onClick={() => {
|
||||
openModal(
|
||||
sprintf(
|
||||
// translators: %s - tone.
|
||||
__(
|
||||
'Change tone to %s',
|
||||
'mind'
|
||||
),
|
||||
data[0]
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
<RawHTML>
|
||||
{wrapEmoji(
|
||||
data[1]
|
||||
)}
|
||||
</RawHTML>
|
||||
</MenuItem>
|
||||
))}
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</DropdownMenu>
|
||||
<DropdownMenu
|
||||
icon={<AITranslateIcon />}
|
||||
iconPosition="left"
|
||||
toggleProps={{
|
||||
children: (
|
||||
<>
|
||||
{__('Translate', 'mind')}
|
||||
<ArrowRightIcon />
|
||||
</>
|
||||
),
|
||||
}}
|
||||
popoverProps={{
|
||||
placement: 'right-end',
|
||||
className: 'mind-toolbar-dropdown',
|
||||
}}
|
||||
className="mind-toolbar-dropdown-toggle"
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup
|
||||
label={__(
|
||||
'Select Language',
|
||||
'@@text_domain'
|
||||
)}
|
||||
>
|
||||
{LANGUAGE.map((data) => (
|
||||
<MenuItem
|
||||
key={data[0]}
|
||||
onClick={() => {
|
||||
openModal(
|
||||
sprintf(
|
||||
// translators: %s - tone.
|
||||
__(
|
||||
'Translate to %s',
|
||||
'mind'
|
||||
),
|
||||
data[0]
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
<RawHTML>
|
||||
{wrapEmoji(
|
||||
data[1]
|
||||
)}
|
||||
</RawHTML>
|
||||
</MenuItem>
|
||||
))}
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</DropdownMenu>
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</DropdownMenu>
|
||||
</ToolbarGroup>
|
||||
<ToolbarDropdownMenu
|
||||
icon={<MindLogoIcon />}
|
||||
label={__('Mind', '@@text_domain')}
|
||||
className="mind-toolbar-toggle"
|
||||
popoverProps={{ className: 'mind-toolbar-dropdown' }}
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup>
|
||||
<MenuItem
|
||||
icon={<AIMessage />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal();
|
||||
}}
|
||||
>
|
||||
{__('Ask AI', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIImproveIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(
|
||||
__('Improve writing language', 'mind')
|
||||
);
|
||||
}}
|
||||
>
|
||||
{__('Improve', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIFixSpellingIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(
|
||||
__('Fix spelling and grammar', 'mind')
|
||||
);
|
||||
}}
|
||||
>
|
||||
{__('Fix Spelling & Grammar', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIShorterIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Make shorter', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Make Shorter', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AILongerIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Make longer', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Make Longer', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AISummarizeIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Summarize', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Summarize', 'mind')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={<AIParaphraseIcon />}
|
||||
iconPosition="left"
|
||||
onClick={() => {
|
||||
openModal(__('Paraphrase', 'mind'));
|
||||
}}
|
||||
>
|
||||
{__('Paraphrase', 'mind')}
|
||||
</MenuItem>
|
||||
</MenuGroup>
|
||||
<MenuGroup>
|
||||
<DropdownMenu
|
||||
icon={<AIToneIcon />}
|
||||
iconPosition="left"
|
||||
toggleProps={{
|
||||
children: (
|
||||
<>
|
||||
{__('Adjust Tone', 'mind')}
|
||||
<ArrowRightIcon />
|
||||
</>
|
||||
),
|
||||
}}
|
||||
popoverProps={{
|
||||
placement: 'right-end',
|
||||
className: 'mind-toolbar-dropdown',
|
||||
}}
|
||||
className="mind-toolbar-dropdown-toggle"
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup
|
||||
label={__(
|
||||
'Select Tone',
|
||||
'@@text_domain'
|
||||
)}
|
||||
>
|
||||
{TONE.map((data) => (
|
||||
<MenuItem
|
||||
key={data[0]}
|
||||
onClick={() => {
|
||||
openModal(
|
||||
sprintf(
|
||||
// translators: %s - tone.
|
||||
__(
|
||||
'Change tone to %s',
|
||||
'mind'
|
||||
),
|
||||
data[0]
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
<RawHTML>
|
||||
{wrapEmoji(data[1])}
|
||||
</RawHTML>
|
||||
</MenuItem>
|
||||
))}
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</DropdownMenu>
|
||||
<DropdownMenu
|
||||
icon={<AITranslateIcon />}
|
||||
iconPosition="left"
|
||||
toggleProps={{
|
||||
children: (
|
||||
<>
|
||||
{__('Translate', 'mind')}
|
||||
<ArrowRightIcon />
|
||||
</>
|
||||
),
|
||||
}}
|
||||
popoverProps={{
|
||||
placement: 'right-end',
|
||||
className: 'mind-toolbar-dropdown',
|
||||
}}
|
||||
className="mind-toolbar-dropdown-toggle"
|
||||
>
|
||||
{() => {
|
||||
return (
|
||||
<>
|
||||
<MenuGroup
|
||||
label={__(
|
||||
'Select Language',
|
||||
'@@text_domain'
|
||||
)}
|
||||
>
|
||||
{LANGUAGE.map((data) => (
|
||||
<MenuItem
|
||||
key={data[0]}
|
||||
onClick={() => {
|
||||
openModal(
|
||||
sprintf(
|
||||
// translators: %s - tone.
|
||||
__(
|
||||
'Translate to %s',
|
||||
'mind'
|
||||
),
|
||||
data[0]
|
||||
)
|
||||
);
|
||||
}}
|
||||
>
|
||||
<RawHTML>
|
||||
{wrapEmoji(data[1])}
|
||||
</RawHTML>
|
||||
</MenuItem>
|
||||
))}
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</DropdownMenu>
|
||||
</MenuGroup>
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</ToolbarDropdownMenu>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue