diff --git a/src/apps/settings/UISettings.tsx b/src/apps/settings/UISettings.tsx index cc3535765..4c6b3b3ca 100644 --- a/src/apps/settings/UISettings.tsx +++ b/src/apps/settings/UISettings.tsx @@ -8,6 +8,7 @@ import WidthNormalIcon from '@mui/icons-material/WidthNormal'; import WidthWideIcon from '@mui/icons-material/WidthWide'; import { hideOnMobile, settingsGap } from '~/common/theme'; +import { isPwa } from '~/common/util/pwaUtils'; import { useUIPreferencesStore } from '~/common/state/store-ui'; // languages is defined as a JSON file @@ -87,7 +88,7 @@ export function UISettings() { - + {!isPwa() && Centering {centerMode === 'full' ? 'Full screen chat' : centerMode === 'narrow' ? 'Narrow chat' : 'Wide'} @@ -97,7 +98,7 @@ export function UISettings() { } /> - + } diff --git a/src/common/layouts/AppLayout.tsx b/src/common/layouts/AppLayout.tsx index 65e2537df..2e8cb7bc7 100644 --- a/src/common/layouts/AppLayout.tsx +++ b/src/common/layouts/AppLayout.tsx @@ -6,6 +6,7 @@ import { Box, Container, useTheme } from '@mui/joy'; import { Configurator } from '~/modules/llms/configurator/Configurator'; import { SettingsModal } from '../../apps/settings/SettingsModal'; +import { isPwa } from '~/common/util/pwaUtils'; import { useAppStateStore } from '~/common/state/store-appstate'; import { useUIPreferencesStore } from '~/common/state/store-ui'; @@ -19,7 +20,7 @@ export function AppLayout(props: { }) { // external state const theme = useTheme(); - const { centerMode } = useUIPreferencesStore(state => ({ centerMode: state.centerMode }), shallow); + const { centerMode } = useUIPreferencesStore(state => ({ centerMode: isPwa() ? 'full' : state.centerMode }), shallow); // Usage++ (for progressive disclosure of features) const incrementUsage = useAppStateStore((state) => state.incrementUsage); diff --git a/src/common/util/pwaUtils.ts b/src/common/util/pwaUtils.ts new file mode 100644 index 000000000..bda2da3b1 --- /dev/null +++ b/src/common/util/pwaUtils.ts @@ -0,0 +1,8 @@ +/** + * Returns 'true' if the application is been executed as a 'pwa' (e.g. installed, stand-alone) + */ +export const isPwa = (): boolean => { + if (typeof window !== 'undefined') + return window.matchMedia('(display-mode: standalone)').matches; + return false; +}; \ No newline at end of file