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

set default for informational popups to be disabled

Browse Source
This commit is contained in:
Jennifer Player 2023-09-20 17:43:22 -04:00
parent b64ade586d
commit 21de74fac4
6 changed files with 48 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
invokeai/frontend/web/src/common/components/IAIInformationalPopover.tsx
View File

@ -32,15 +32,15 @@ function IAIInformationalPopover({
children, children,
placement, placement,
}: Props): JSX.Element { }: Props): JSX.Element {
const shouldDisableInformationalPopovers = useAppSelector( const shouldEnableInformationalPopovers = useAppSelector(
(state) => state.system.shouldDisableInformationalPopovers (state) => state.system.shouldEnableInformationalPopovers
); );
const { t } = useTranslation(); const { t } = useTranslation();
const heading = t(`popovers.${details}.heading`); const heading = t(`popovers.${details}.heading`);
const paragraph = t(`popovers.${details}.paragraph`); const paragraph = t(`popovers.${details}.paragraph`);
if (shouldDisableInformationalPopovers) { if (!shouldEnableInformationalPopovers) {
return children; return children;
} else { } else {
return ( return (

32
invokeai/frontend/web/src/features/parameters/components/Parameters/Canvas/BoundingBox/ParamBoundingBoxSize.tsx
View File

@ -1,4 +1,4 @@
import { Flex, Spacer, Text } from '@chakra-ui/react'; import { Box, Flex, Spacer, Text } from '@chakra-ui/react';
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIIconButton from 'common/components/IAIIconButton'; import IAIIconButton from 'common/components/IAIIconButton';
@ -94,20 +94,22 @@ export default function ParamBoundingBoxSize() {
}} }}
> >
<Flex alignItems="center" gap={2}> <Flex alignItems="center" gap={2}>
<IAIInformationalPopover details="paramRatio"> <Box width="full">
<Text <IAIInformationalPopover details="paramRatio">
sx={{ <Text
fontSize: 'sm', sx={{
width: 'full', fontSize: 'sm',
color: 'base.700', width: 'full',
_dark: { color: 'base.700',
color: 'base.300', _dark: {
}, color: 'base.300',
}} },
> }}
{t('parameters.aspectRatio')} >
</Text> {t('parameters.aspectRatio')}
</IAIInformationalPopover> </Text>
</IAIInformationalPopover>
</Box>
<Spacer /> <Spacer />
<ParamAspectRatio /> <ParamAspectRatio />
<IAIIconButton <IAIIconButton

31
invokeai/frontend/web/src/features/parameters/components/Parameters/Core/ParamSize.tsx
View File

@ -1,4 +1,4 @@
import { Flex, Spacer, Text } from '@chakra-ui/react'; import { Box, Flex, Spacer, Text } from '@chakra-ui/react';
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIIconButton from 'common/components/IAIIconButton'; import IAIIconButton from 'common/components/IAIIconButton';
@ -84,20 +84,21 @@ export default function ParamSize() {
}} }}
> >
<Flex alignItems="center" gap={2}> <Flex alignItems="center" gap={2}>
<IAIInformationalPopover details="paramRatio"> <Box width="full">
<Text <IAIInformationalPopover details="paramRatio">
sx={{ <Text
fontSize: 'sm', sx={{
width: 'full', fontSize: 'sm',
color: 'base.700', color: 'base.700',
_dark: { _dark: {
color: 'base.300', color: 'base.300',
}, },
}} }}
> >
{t('parameters.aspectRatio')} {t('parameters.aspectRatio')}
</Text> </Text>
</IAIInformationalPopover> </IAIInformationalPopover>
</Box>
<Spacer /> <Spacer />
<ParamAspectRatio /> <ParamAspectRatio />
<IAIIconButton <IAIIconButton

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

@ -23,7 +23,7 @@ import {
consoleLogLevelChanged, consoleLogLevelChanged,
setEnableImageDebugging, setEnableImageDebugging,
setShouldConfirmOnDelete, setShouldConfirmOnDelete,
setShouldDisableInformationalPopovers, setShouldEnableInformationalPopovers,
shouldAntialiasProgressImageChanged, shouldAntialiasProgressImageChanged,
shouldLogToConsoleChanged, shouldLogToConsoleChanged,
shouldUseNSFWCheckerChanged, shouldUseNSFWCheckerChanged,
@ -67,7 +67,7 @@ const selector = createSelector(
shouldAntialiasProgressImage, shouldAntialiasProgressImage,
shouldUseNSFWChecker, shouldUseNSFWChecker,
shouldUseWatermarker, shouldUseWatermarker,
shouldDisableInformationalPopovers, shouldEnableInformationalPopovers,
} = system; } = system;
const { const {
@ -87,7 +87,7 @@ const selector = createSelector(
shouldUseNSFWChecker, shouldUseNSFWChecker,
shouldUseWatermarker, shouldUseWatermarker,
shouldAutoChangeDimensions, shouldAutoChangeDimensions,
shouldDisableInformationalPopovers, shouldEnableInformationalPopovers,
}; };
}, },
{ {
@ -161,7 +161,7 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
shouldUseNSFWChecker, shouldUseNSFWChecker,
shouldUseWatermarker, shouldUseWatermarker,
shouldAutoChangeDimensions, shouldAutoChangeDimensions,
shouldDisableInformationalPopovers, shouldEnableInformationalPopovers,
} = useAppSelector(selector); } = useAppSelector(selector);
const handleClickResetWebUI = useCallback(() => { const handleClickResetWebUI = useCallback(() => {
@ -312,11 +312,11 @@ const SettingsModal = ({ children, config }: SettingsModalProps) => {
/> />
)} )}
<SettingSwitch <SettingSwitch
label="Disable informational popovers" label="Enable informational popovers"
isChecked={shouldDisableInformationalPopovers} isChecked={shouldEnableInformationalPopovers}
onChange={(e: ChangeEvent<HTMLInputElement>) => onChange={(e: ChangeEvent<HTMLInputElement>) =>
dispatch( dispatch(
setShouldDisableInformationalPopovers(e.target.checked) setShouldEnableInformationalPopovers(e.target.checked)
) )
} }
/> />

8
invokeai/frontend/web/src/features/system/store/systemSlice.ts
View File

@ -35,7 +35,7 @@ export const initialSystemState: SystemState = {
language: 'en', language: 'en',
shouldUseNSFWChecker: false, shouldUseNSFWChecker: false,
shouldUseWatermarker: false, shouldUseWatermarker: false,
shouldDisableInformationalPopovers: false, shouldEnableInformationalPopovers: false,
status: 'DISCONNECTED', status: 'DISCONNECTED',
}; };
@ -76,11 +76,11 @@ export const systemSlice = createSlice({
shouldUseWatermarkerChanged(state, action: PayloadAction<boolean>) { shouldUseWatermarkerChanged(state, action: PayloadAction<boolean>) {
state.shouldUseWatermarker = action.payload; state.shouldUseWatermarker = action.payload;
}, },
setShouldDisableInformationalPopovers( setShouldEnableInformationalPopovers(
state, state,
action: PayloadAction<boolean> action: PayloadAction<boolean>
) { ) {
state.shouldDisableInformationalPopovers = action.payload; state.shouldEnableInformationalPopovers = action.payload;
}, },
}, },
extraReducers(builder) { extraReducers(builder) {
@ -241,7 +241,7 @@ export const {
languageChanged, languageChanged,
shouldUseNSFWCheckerChanged, shouldUseNSFWCheckerChanged,
shouldUseWatermarkerChanged, shouldUseWatermarkerChanged,
setShouldDisableInformationalPopovers, setShouldEnableInformationalPopovers,
} = systemSlice.actions; } = systemSlice.actions;
export default systemSlice.reducer; export default systemSlice.reducer;

2
invokeai/frontend/web/src/features/system/store/types.ts
View File

@ -33,7 +33,7 @@ export interface SystemState {
shouldUseNSFWChecker: boolean; shouldUseNSFWChecker: boolean;
shouldUseWatermarker: boolean; shouldUseWatermarker: boolean;
status: SystemStatus; status: SystemStatus;
shouldDisableInformationalPopovers: boolean; shouldEnableInformationalPopovers: boolean;
} }
export const LANGUAGES = { export const LANGUAGES = {