Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): render settingsmenu in portal, no zindex

Browse Source
This commit is contained in:
psychedelicious 2024-07-24 06:30:09 +10:00
parent 54aef4959c
commit 0279a27f66
1 changed files with 45 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsMenu.tsx
View File

@ -5,6 +5,7 @@ import {
MenuGroup,
MenuItem,
MenuList,
Portal,
useDisclosure,
useGlobalMenuClose,
} from '@invoke-ai/ui-library';
@ -44,49 +45,51 @@ const SettingsMenu = () => {
icon={<RiSettings4Line fontSize={20} />}
boxSize={8}
/>
<MenuList zIndex={1}>
<MenuGroup title={t('upsell.professional')}>
<SettingsUpsellMenuItem menuText={t('upsell.inviteTeammates')} menuIcon={PiUsersBold} />
<SettingsUpsellMenuItem menuText={t('upsell.shareAccess')} menuIcon={PiShareNetworkFill} />
</MenuGroup>
<Portal>
<MenuList>
<MenuGroup title={t('upsell.professional')}>
<SettingsUpsellMenuItem menuText={t('upsell.inviteTeammates')} menuIcon={PiUsersBold} />
<SettingsUpsellMenuItem menuText={t('upsell.shareAccess')} menuIcon={PiShareNetworkFill} />
</MenuGroup>
<MenuGroup title={t('common.communityLabel')}>
{isGithubLinkEnabled && (
<MenuItem as="a" href={githubLink} target="_blank" icon={<RiGithubFill />}>
{t('common.githubLabel')}
</MenuItem>
)}
{isBugLinkEnabled && (
<MenuItem as="a" href={`${githubLink}/issues`} target="_blank" icon={<PiBugBeetleBold />}>
{t('common.reportBugLabel')}
</MenuItem>
)}
{isDiscordLinkEnabled && (
<MenuItem as="a" href={discordLink} target="_blank" icon={<RiDiscordFill />}>
{t('common.discordLabel')}
</MenuItem>
)}
</MenuGroup>
<MenuGroup title={t('common.settingsLabel')}>
<HotkeysModal>
<MenuItem as="button" icon={<PiKeyboardBold />}>
{t('common.hotkeysLabel')}
</MenuItem>
</HotkeysModal>
<SettingsModal>
<MenuItem as="button" icon={<PiToggleRightFill />}>
{t('common.settingsLabel')}
</MenuItem>
</SettingsModal>
</MenuGroup>
<MenuGroup title={t('accessibility.about')}>
<AboutModal>
<MenuItem as="button" icon={<PiInfoBold />}>
{t('accessibility.about')}
</MenuItem>
</AboutModal>
</MenuGroup>
</MenuList>
<MenuGroup title={t('common.communityLabel')}>
{isGithubLinkEnabled && (
<MenuItem as="a" href={githubLink} target="_blank" icon={<RiGithubFill />}>
{t('common.githubLabel')}
</MenuItem>
)}
{isBugLinkEnabled && (
<MenuItem as="a" href={`${githubLink}/issues`} target="_blank" icon={<PiBugBeetleBold />}>
{t('common.reportBugLabel')}
</MenuItem>
)}
{isDiscordLinkEnabled && (
<MenuItem as="a" href={discordLink} target="_blank" icon={<RiDiscordFill />}>
{t('common.discordLabel')}
</MenuItem>
)}
</MenuGroup>
<MenuGroup title={t('common.settingsLabel')}>
<HotkeysModal>
<MenuItem as="button" icon={<PiKeyboardBold />}>
{t('common.hotkeysLabel')}
</MenuItem>
</HotkeysModal>
<SettingsModal>
<MenuItem as="button" icon={<PiToggleRightFill />}>
{t('common.settingsLabel')}
</MenuItem>
</SettingsModal>
</MenuGroup>
<MenuGroup title={t('accessibility.about')}>
<AboutModal>
<MenuItem as="button" icon={<PiInfoBold />}>
{t('accessibility.about')}
</MenuItem>
</AboutModal>
</MenuGroup>
</MenuList>
</Portal>
</Menu>
);
};