fix(env): is mobile flag (#8005)

only 'mobile' entry has isMobile = true flag
This commit is contained in:
EYHN 2024-09-04 09:21:36 +00:00
parent 53886a7cd3
commit 2524491bd1
No known key found for this signature in database
GPG Key ID: 46C9E26A75AB276C
78 changed files with 169 additions and 205 deletions

View File

@ -34,8 +34,8 @@ const createPattern = packageName => [
{
group: ['@affine/env/constant'],
message:
'Do not import from @affine/env/constant. Use `environment.isDesktop` instead',
importNames: ['isDesktop'],
'Do not import from @affine/env/constant. Use `environment.isElectron` instead',
importNames: ['isElectron'],
},
];

View File

@ -2,19 +2,16 @@
import type { DocCollection } from '@blocksuite/store';
declare global {
interface Window {
__appInfo: {
electron: boolean;
schema: string;
windowName: string;
};
}
// eslint-disable-next-line no-var
var __appInfo: {
electron: boolean;
schema: string;
windowName: string;
};
}
//#region runtime variables
export const isBrowser = typeof window !== 'undefined';
export const isServer = !isBrowser && typeof navigator === 'undefined';
export const isDesktop = isBrowser && !!window.__appInfo?.electron;
export const isElectron = !!globalThis.__appInfo?.electron;
//#endregion
export const DEFAULT_WORKSPACE_NAME = 'Demo Workspace';
export const UNTITLED_WORKSPACE_NAME = 'Untitled';

View File

@ -2,7 +2,7 @@
import { assertEquals } from '@blocksuite/global/utils';
import { z } from 'zod';
import { isDesktop, isServer } from './constant.js';
import { isElectron } from './constant.js';
import { UaHelper } from './ua-helper.js';
export const runtimeFlagsSchema = z.object({
@ -10,6 +10,7 @@ export const runtimeFlagsSchema = z.object({
serverUrlPrefix: z.string(),
appVersion: z.string(),
editorVersion: z.string(),
distribution: z.enum(['browser', 'desktop', 'admin', 'mobile']),
appBuildType: z.union([
z.literal('stable'),
z.literal('beta'),
@ -35,18 +36,19 @@ export const runtimeFlagsSchema = z.object({
export type RuntimeConfig = z.infer<typeof runtimeFlagsSchema>;
type BrowserBase = {
/**
* @example https://app.affine.pro
* @example http://localhost:3000
*/
origin: string;
isDesktop: boolean;
isBrowser: true;
isServer: false;
export type Environment = {
isDebug: boolean;
// browser special properties
// Edition
isDesktopEdition: boolean;
isMobileEdition: boolean;
// Platform/Entry
isElectron: boolean;
isDesktopWeb: boolean;
isMobileWeb: boolean;
// Device
isLinux: boolean;
isMacOs: boolean;
isIOS: boolean;
@ -55,37 +57,9 @@ type BrowserBase = {
isFireFox: boolean;
isMobile: boolean;
isChrome: boolean;
chromeVersion?: number;
};
type NonChromeBrowser = BrowserBase & {
isChrome: false;
};
type ChromeBrowser = BrowserBase & {
isSafari: false;
isFireFox: false;
isChrome: true;
chromeVersion: number;
};
type Browser = NonChromeBrowser | ChromeBrowser;
type Server = {
isDesktop: false;
isBrowser: false;
isServer: true;
isDebug: boolean;
};
interface Desktop extends ChromeBrowser {
isDesktop: true;
isBrowser: true;
isServer: false;
isDebug: boolean;
}
export type Environment = Browser | Server | Desktop;
function setupRuntimeConfig() {
if (!process.env.RUNTIME_CONFIG) {
return;
@ -106,31 +80,43 @@ export function setupGlobal() {
let environment: Environment;
const isDebug = process.env.NODE_ENV === 'development';
if (isServer) {
if (!globalThis.navigator) {
environment = {
isDesktop: false,
isBrowser: false,
isServer: true,
isDesktopEdition: false,
isMobileEdition: false,
isElectron: false,
isDesktopWeb: false,
isMobileWeb: false,
isMobile: false,
isDebug,
} satisfies Server;
isLinux: false,
isMacOs: false,
isSafari: false,
isWindows: false,
isFireFox: false,
isChrome: false,
isIOS: false,
};
} else {
const uaHelper = new UaHelper(navigator);
const uaHelper = new UaHelper(globalThis.navigator);
environment = {
origin: window.location.origin,
isDesktop,
isBrowser: true,
isServer: false,
isDesktopEdition: runtimeConfig.distribution !== 'mobile',
isMobileEdition: runtimeConfig.distribution === 'mobile',
isDesktopWeb: runtimeConfig.distribution === 'browser',
isMobileWeb: runtimeConfig.distribution === 'mobile',
isElectron,
isDebug,
isMobile: uaHelper.isMobile,
isLinux: uaHelper.isLinux,
isMacOs: uaHelper.isMacOs,
isSafari: uaHelper.isSafari,
isWindows: uaHelper.isWindows,
isFireFox: uaHelper.isFireFox,
isMobile: uaHelper.isMobile,
isChrome: uaHelper.isChrome,
isIOS: uaHelper.isIOS,
} as Browser;
};
// Chrome on iOS is still Safari
if (environment.isChrome && !environment.isIOS) {
assertEquals(environment.isSafari, false);
@ -141,9 +127,10 @@ export function setupGlobal() {
isFireFox: false,
isChrome: true,
chromeVersion: uaHelper.getChromeVersion(),
} satisfies ChromeBrowser;
};
}
}
globalThis.environment = environment;
globalThis.$AFFINE_SETUP = true;

View File

@ -44,7 +44,7 @@ export const dateFormatOptions: DateFormats[] = [
];
const appSettingBaseAtom = atomWithStorage<AppSetting>('affine-settings', {
clientBorder: environment.isDesktop && !environment.isWindows,
clientBorder: environment.isElectron && !environment.isWindows,
windowFrameStyle: 'frameless',
dateFormat: dateFormatOptions[0],
startWeekOnMonday: false,
@ -61,7 +61,7 @@ type SetStateAction<Value> = Value | ((prev: Value) => Value);
const appSettingEffect = atomEffect(get => {
const settings = get(appSettingBaseAtom);
// some values in settings should be synced into electron side
if (environment.isDesktop) {
if (environment.isElectron) {
logger.debug('sync settings to electron', settings);
// this api type in @affine/electron-api, but it is circular dependency this package, use any here
(window as any).apis?.updater

View File

@ -1,7 +1,7 @@
import type { FlagInfo } from './types';
const isNotStableBuild = runtimeConfig.appBuildType !== 'stable';
const isDesktopEnvironment = environment.isDesktop;
const isDesktopEnvironment = environment.isElectron;
const isCanaryBuild = runtimeConfig.appBuildType === 'canary';
export const AFFINE_FLAGS = {

View File

@ -20,7 +20,7 @@ export const AffineOtherPageLayout = ({
return (
<div className={styles.root}>
{environment.isDesktop ? null : (
{environment.isElectron ? null : (
<div className={styles.topNav}>
<a href="/" rel="noreferrer" className={styles.affineLogo}>
<Logo1Icon width={24} height={24} />

View File

@ -119,8 +119,8 @@ export const OnboardingPage = ({
() => questions?.[questionIdx],
[questionIdx, questions]
);
const isMacosDesktop = environment.isDesktop && environment.isMacOs;
const isWindowsDesktop = environment.isDesktop && environment.isWindows;
const isMacosDesktop = environment.isElectron && environment.isMacOs;
const isWindowsDesktop = environment.isElectron && environment.isWindows;
if (!questions) {
return null;

View File

@ -10,7 +10,7 @@ const DesktopThemeSync = memo(function DesktopThemeSync() {
const lastThemeRef = useRef(theme);
const onceRef = useRef(false);
if (lastThemeRef.current !== theme || !onceRef.current) {
if (environment.isDesktop && theme) {
if (environment.isElectron && theme) {
apis?.ui
.handleThemeChange(theme as 'dark' | 'light' | 'system')
.catch(err => {

View File

@ -1,5 +1,4 @@
export * from './menu.types';
import { isMobile } from '../../utils/env';
import { DesktopMenuItem } from './desktop/item';
import { DesktopMenu } from './desktop/root';
import { DesktopMenuSeparator } from './desktop/separator';
@ -10,10 +9,12 @@ import { MobileMenu } from './mobile/root';
import { MobileMenuSeparator } from './mobile/separator';
import { MobileMenuSub } from './mobile/sub';
const MenuItem = isMobile() ? MobileMenuItem : DesktopMenuItem;
const MenuSeparator = isMobile() ? MobileMenuSeparator : DesktopMenuSeparator;
const MenuSub = isMobile() ? MobileMenuSub : DesktopMenuSub;
const Menu = isMobile() ? MobileMenu : DesktopMenu;
const MenuItem = environment.isMobileEdition ? MobileMenuItem : DesktopMenuItem;
const MenuSeparator = environment.isMobileEdition
? MobileMenuSeparator
: DesktopMenuSeparator;
const MenuSub = environment.isMobileEdition ? MobileMenuSub : DesktopMenuSub;
const Menu = environment.isMobileEdition ? MobileMenu : DesktopMenu;
export {
DesktopMenu,

View File

@ -1,7 +1,6 @@
import { DoneIcon } from '@blocksuite/icons/rc';
import clsx from 'clsx';
import { isMobile } from '../../utils/env';
import type { MenuItemProps } from './menu.types';
import { mobileMenuItem } from './mobile/styles.css';
import * as styles from './styles.css';
@ -27,7 +26,7 @@ export const useMenuItem = <T extends MenuItemProps>({
checked,
selected,
block,
[mobileMenuItem]: isMobile(),
[mobileMenuItem]: environment.isMobileEdition,
},
propsClassName
);

View File

@ -12,7 +12,6 @@ import clsx from 'clsx';
import type { CSSProperties, MouseEvent } from 'react';
import { forwardRef, useCallback, useEffect, useState } from 'react';
import { isMobile } from '../../utils/env';
import type { IconButtonProps } from '../button';
import { IconButton } from '../button';
import * as styles from './styles.css';
@ -151,9 +150,7 @@ export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
children,
contentWrapperClassName,
contentWrapperStyle,
animation = environment.isBrowser && environment.isMobile
? 'slideBottom'
: 'fadeScaleTop',
animation = environment.isMobileEdition ? 'slideBottom' : 'fadeScaleTop',
fullScreen,
...otherProps
} = props;
@ -225,7 +222,7 @@ export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
`anim-${animation}`,
styles.modalOverlay,
overlayClassName,
{ mobile: isMobile() }
{ mobile: environment.isMobileEdition }
)}
style={{
...overlayStyle,

View File

@ -1,3 +0,0 @@
export const isMobile = () => {
return environment.isBrowser && environment.isMobile;
};

View File

@ -23,7 +23,7 @@ export function registerAffineCreationCommands({
category: 'affine:creation',
label: t['com.affine.cmdk.affine.new-page'](),
icon: <PlusIcon />,
keyBinding: environment.isDesktop
keyBinding: environment.isElectron
? {
binding: '$mod+N',
skipRegister: true,
@ -73,7 +73,7 @@ export function registerAffineCreationCommands({
icon: <ImportIcon />,
label: t['com.affine.cmdk.affine.import-workspace'](),
preconditionStrategy: () => {
return environment.isDesktop;
return environment.isElectron;
},
run() {
track.$.cmdk.workspace.createWorkspace({

View File

@ -183,7 +183,7 @@ export function registerAffineSettingsCommands({
`,
category: 'affine:settings',
icon: <SettingsIcon />,
preconditionStrategy: () => environment.isDesktop,
preconditionStrategy: () => environment.isElectron,
run() {
track.$.cmdk.settings.changeAppSetting({
key: 'clientBorder',
@ -231,7 +231,7 @@ export function registerAffineSettingsCommands({
]()}`,
category: 'affine:settings',
icon: <SettingsIcon />,
preconditionStrategy: () => environment.isDesktop,
preconditionStrategy: () => environment.isElectron,
run() {
track.$.cmdk.settings.changeAppSetting({
key: 'enableNoisyBackground',
@ -257,7 +257,7 @@ export function registerAffineSettingsCommands({
]()}`,
category: 'affine:settings',
icon: <SettingsIcon />,
preconditionStrategy: () => environment.isDesktop && environment.isMacOs,
preconditionStrategy: () => environment.isElectron && environment.isMacOs,
run() {
track.$.cmdk.settings.changeAppSetting({
key: 'enableBlurBackground',

View File

@ -16,7 +16,7 @@ export const AppContainer = (props: WorkspaceRootProps) => {
useNoisyBackground={appSettings.enableNoisyBackground}
useBlurBackground={
appSettings.enableBlurBackground &&
environment.isDesktop &&
environment.isElectron &&
environment.isMacOs
}
{...props}

View File

@ -57,7 +57,7 @@ function OAuthProvider({ provider }: { provider: OAuthProviderType }) {
try {
setIsConnecting(true);
const url = await authService.oauthPreflight(provider);
if (environment.isDesktop) {
if (environment.isElectron) {
await apis?.ui.openExternal(url);
} else {
popupWindow(url);

View File

@ -122,7 +122,7 @@ const useSendEmail = (emailType: AuthPanelProps<'sendEmail'>['emailType']) => {
return trigger({
email,
callbackUrl: `/auth/${callbackUrl}?isClient=${
environment.isDesktop ? 'true' : 'false'
environment.isElectron ? 'true' : 'false'
}`,
});
},

View File

@ -14,7 +14,7 @@ type Challenge = {
};
const challengeFetcher = async (url: string) => {
if (!environment.isDesktop) {
if (!environment.isElectron) {
return undefined;
}
@ -31,7 +31,7 @@ const challengeFetcher = async (url: string) => {
};
const generateChallengeResponse = async (challenge: string) => {
if (!environment.isDesktop) {
if (!environment.isElectron) {
return undefined;
}
@ -56,7 +56,7 @@ export const Captcha = () => {
return null;
}
if (environment.isDesktop) {
if (environment.isElectron) {
if (response) {
return <div className={style.captchaWrapper}>Making Challenge</div>;
} else {
@ -87,7 +87,7 @@ export const useCaptcha = (): [string | undefined, string?] => {
useEffect(() => {
if (
hasCaptchaFeature &&
environment.isDesktop &&
environment.isElectron &&
challenge?.challenge &&
prevChallenge.current !== challenge.challenge
) {
@ -104,7 +104,7 @@ export const useCaptcha = (): [string | undefined, string?] => {
return ['XXXX.DUMMY.TOKEN.XXXX'];
}
if (environment.isDesktop) {
if (environment.isElectron) {
if (response) {
return [response, challenge?.challenge];
} else {

View File

@ -43,7 +43,7 @@ export const Onboarding = ({ onOpenApp }: OnboardingProps) => {
return (
<div
className={styles.onboarding}
data-is-desktop={environment.isDesktop}
data-is-desktop={environment.isElectron}
data-is-window={!!status.activeId || !!status.unfoldingId}
>
<div className={styles.offsetOrigin}>

View File

@ -72,7 +72,7 @@ export const AboutAffine = () => {
name={t['com.affine.aboutAFFiNE.version.editor.title']()}
desc={runtimeConfig.editorVersion}
/>
{environment.isDesktop ? (
{environment.isElectron ? (
<>
<UpdateCheckSection />
<SettingRow

View File

@ -85,7 +85,7 @@ export const AppearanceSettings = () => {
<LanguageMenu />
</div>
</SettingRow>
{environment.isDesktop ? (
{environment.isElectron ? (
<SettingRow
name={t['com.affine.appearanceSettings.clientBorder.title']()}
desc={t['com.affine.appearanceSettings.clientBorder.description']()}
@ -97,7 +97,7 @@ export const AppearanceSettings = () => {
/>
</SettingRow>
) : null}
{runtimeConfig.enableNewSettingUnstableApi && environment.isDesktop ? (
{runtimeConfig.enableNewSettingUnstableApi && environment.isElectron ? (
<SettingRow
name={t['com.affine.appearanceSettings.windowFrame.title']()}
desc={t['com.affine.appearanceSettings.windowFrame.description']()}
@ -141,7 +141,7 @@ export const AppearanceSettings = () => {
</SettingWrapper>
) : null}
{environment.isDesktop ? (
{environment.isElectron ? (
<SettingWrapper
title={t['com.affine.appearanceSettings.sidebar.title']()}
>

View File

@ -13,7 +13,7 @@ export const ThemeEditorSetting = () => {
const modified = useLiveData(themeEditor.modified$);
const open = useCallback(() => {
if (environment.isDesktop) {
if (environment.isElectron) {
apis?.ui.openThemeEditor().catch(console.error);
} else {
popupWindow('/theme-editor');

View File

@ -85,7 +85,7 @@ const FontFamilySettings = () => {
const radioItems = useMemo(() => {
const items = getBaseFontStyleOptions(t);
if (!environment.isDesktop) return items;
if (!environment.isElectron) return items;
// resolve custom fonts
const customOption = fontStyleOptions.find(opt => opt.key === 'Custom');
@ -274,7 +274,7 @@ const CustomFontFamilySettings = () => {
},
[editorSettingService.editorSetting]
);
if (settings.fontFamily !== 'Custom' || !environment.isDesktop) {
if (settings.fontFamily !== 'Custom' || !environment.isElectron) {
return null;
}
return (

View File

@ -67,7 +67,7 @@ export const WorkspaceSettingDetail = ({
<EnableCloudPanel />
<MembersPanel />
</SettingWrapper>
{environment.isDesktop && (
{environment.isElectron && (
<SettingWrapper title={t['Storage and Export']()}>
<ExportPanel
workspace={workspace}

View File

@ -151,7 +151,7 @@ export const AFFiNESharePage = (props: ShareMenuProps) => {
}
}, [shareInfoService, t]);
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
const { onClickCopyLink } = useSharingUrl({
workspaceId,

View File

@ -49,7 +49,7 @@ const SubscriptionChangedNotifyFooter = ({
);
};
const isDesktop = environment.isDesktop;
const isDesktop = environment.isElectron;
export const useUpgradeNotify = () => {
const t = useI18n();
const prevNotifyIdRef = useRef<string | number | null>(null);

View File

@ -2,7 +2,7 @@ import { atom } from 'jotai';
import { atomWithStorage } from 'jotai/utils';
export const APP_SIDEBAR_OPEN = 'app-sidebar-open';
export const isMobile = window.innerWidth < 768 && !environment.isDesktop;
export const isMobile = window.innerWidth < 768 && !environment.isElectron;
export const appSidebarOpenAtom = atomWithStorage(APP_SIDEBAR_OPEN, !isMobile);
export const appSidebarFloatingAtom = atom(isMobile);

View File

@ -49,7 +49,7 @@ export function AppSidebar({
useEffect(() => {
// do not float app sidebar on desktop
if (environment.isDesktop) {
if (environment.isElectron) {
return;
}
@ -79,8 +79,8 @@ export function AppSidebar({
};
}, [open, setFloating, setOpen, width]);
const hasRightBorder = !environment.isDesktop && !clientBorder;
const isMacosDesktop = environment.isDesktop && environment.isMacOs;
const hasRightBorder = !environment.isElectron && !clientBorder;
const isMacosDesktop = environment.isElectron && environment.isMacOs;
return (
<>
<ResizePanel
@ -105,7 +105,7 @@ export function AppSidebar({
data-client-border={clientBorder}
>
<nav className={navStyle} data-testid="app-sidebar">
{!environment.isDesktop && <SidebarHeader />}
{!environment.isElectron && <SidebarHeader />}
<div className={navBodyStyle} data-testid="sliderBar-inner">
{children}
</div>

View File

@ -13,7 +13,7 @@ interface QuickSearchInputProps extends HTMLAttributes<HTMLDivElement> {
// Although it is called an input, it is actually a button.
export function QuickSearchInput({ onClick, ...props }: QuickSearchInputProps) {
const t = useI18n();
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
return (
<div

View File

@ -206,7 +206,7 @@ export const PageHeaderMenuButton = ({
setEditing(!isEditing);
}, [isEditing, page.id, page.readonly, setDocReadonly]);
const isMobile = environment.isBrowser && environment.isMobile;
const isMobile = environment.isMobileEdition;
const mobileEditMenuItem = (
<MenuItem
prefixIcon={isEditing ? <SaveIcon /> : <EditIcon />}
@ -293,7 +293,7 @@ export const PageHeaderMenuButton = ({
{t['com.affine.workbench.tab.page-menu-open']()}
</MenuItem>
{environment.isDesktop && (
{environment.isElectron && (
<MenuItem
prefixIcon={<SplitViewIcon />}
data-testid="editor-option-menu-open-in-split-new"

View File

@ -182,7 +182,7 @@ export const PageOperationCell = ({
{t['com.affine.workbench.tab.page-menu-open']()}
</MenuItem>
{environment.isDesktop && enableSplitView ? (
{environment.isElectron && enableSplitView ? (
<MenuItem onClick={onOpenInSplitView} prefixIcon={<SplitViewIcon />}>
{t['com.affine.workbench.split-view.page-menu-open']()}
</MenuItem>

View File

@ -156,7 +156,7 @@ export const CollectionOperations = ({
name: t['com.affine.workbench.tab.page-menu-open'](),
click: openCollectionNewTab,
},
...(enableMultiView && environment.isDesktop
...(enableMultiView && environment.isElectron
? [
{
icon: <SplitViewIcon />,

View File

@ -29,7 +29,7 @@ const DEFAULT_SHOW_LIST: IslandItemNames[] = [
const DESKTOP_SHOW_LIST: IslandItemNames[] = [...DEFAULT_SHOW_LIST];
type IslandItemNames = 'whatNew' | 'contact' | 'shortcuts';
const showList = environment.isDesktop ? DESKTOP_SHOW_LIST : DEFAULT_SHOW_LIST;
const showList = environment.isElectron ? DESKTOP_SHOW_LIST : DEFAULT_SHOW_LIST;
export const HelpIsland = () => {
const { globalContextService } = useServices({

View File

@ -112,7 +112,7 @@ export const RootAppSidebar = (): ReactElement => {
);
useEffect(() => {
if (environment.isDesktop) {
if (environment.isElectron) {
return events?.applicationMenu.onNewPageAction(() => {
apis?.ui
.isActiveTab()
@ -206,7 +206,7 @@ export const RootAppSidebar = (): ReactElement => {
</div>
</SidebarScrollableContainer>
<SidebarContainer>
{environment.isDesktop ? <UpdaterButton /> : <AppDownloadButton />}
{environment.isElectron ? <UpdaterButton /> : <AppDownloadButton />}
</SidebarContainer>
</AppSidebar>
);

View File

@ -12,19 +12,15 @@ import { AuthService } from '../modules/cloud';
const minimumChromeVersion = 106;
const shouldShowWarning = (() => {
if (environment.isDesktop) {
if (environment.isElectron) {
// even though desktop has compatibility issues,
// we don't want to show the warning
return false;
}
if (!environment.isBrowser) {
// disable in SSR
return false;
}
if (environment.isMobile) {
return true;
}
if (environment.isChrome) {
if (environment.isChrome && environment.chromeVersion) {
return environment.chromeVersion < minimumChromeVersion;
}
return false;
@ -32,14 +28,14 @@ const shouldShowWarning = (() => {
const OSWarningMessage = () => {
const t = useI18n();
const notChrome = environment.isBrowser && !environment.isChrome;
const notChrome = !environment.isChrome;
const notGoodVersion =
environment.isBrowser &&
environment.isChrome &&
environment.chromeVersion &&
environment.chromeVersion < minimumChromeVersion;
// TODO(@L-Sun): remove this message when mobile version is able to edit.
if ('isMobile' in environment && environment.isMobile) {
if (environment.isMobile) {
return <span>{t['com.affine.top-tip.mobile']()}</span>;
}
@ -80,7 +76,7 @@ export const TopTip = ({
if (
showLocalDemoTips &&
!environment.isDesktop &&
!environment.isElectron &&
workspace.flavour === WorkspaceFlavour.LOCAL
) {
return (

View File

@ -15,7 +15,7 @@ export const AddWorkspace = ({
return (
<div>
{environment.isDesktop ? (
{environment.isElectron ? (
<MenuItem
block={true}
prefixIcon={<ImportIcon />}

View File

@ -60,7 +60,7 @@ const UnSyncWorkspaceStatus = () => {
const LocalWorkspaceStatus = () => {
return (
<>
{!environment.isDesktop ? (
{!environment.isElectron ? (
<InformationFillDuotoneIcon style={{ color: cssVar('errorColor') }} />
) : (
<LocalWorkspaceIcon />
@ -98,7 +98,7 @@ const useSyncEngineSyncProgress = (meta: WorkspaceMetadata) => {
let content;
// TODO(@eyhn): add i18n
if (workspace.flavour === WorkspaceFlavour.LOCAL) {
if (!environment.isDesktop) {
if (!environment.isElectron) {
content = 'This is a local demo workspace.';
} else {
content = 'Saved locally';

View File

@ -26,8 +26,8 @@ export const AppContainer = ({
children,
...rest
}: WorkspaceRootProps) => {
const noisyBackground = useNoisyBackground && environment.isDesktop;
const blurBackground = environment.isDesktop && useBlurBackground;
const noisyBackground = useNoisyBackground && environment.isElectron;
const blurBackground = environment.isElectron && useBlurBackground;
return (
<div
{...rest}
@ -57,7 +57,7 @@ export const MainContainer = forwardRef<
<div
{...props}
className={clsx(mainContainerStyle, className)}
data-is-desktop={environment.isDesktop}
data-is-desktop={environment.isElectron}
data-transparent={false}
data-client-border={appSettings.clientBorder}
data-side-bar-open={appSideBarOpen}

View File

@ -18,7 +18,7 @@ export function useRegisterFindInPageCommands() {
}, [findInPage]);
useEffect(() => {
if (!environment.isDesktop) {
if (!environment.isElectron) {
return;
}
const unsubs: Array<() => void> = [];

View File

@ -284,7 +284,7 @@ export const useMarkdownShortcuts = (): ShortcutsInfo => {
const macMarkdownShortcuts = useMacMarkdownShortcuts();
const winMarkdownShortcuts = useWinMarkdownShortcuts();
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
return {
title: t['com.affine.shortcutsTitle.markdownSyntax'](),
shortcuts: isMac ? macMarkdownShortcuts : winMarkdownShortcuts,
@ -296,7 +296,7 @@ export const usePageShortcuts = (): ShortcutsInfo => {
const macPageShortcuts = useMacPageKeyboardShortcuts();
const winPageShortcuts = useWinPageKeyboardShortcuts();
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
return {
title: t['com.affine.shortcutsTitle.page'](),
shortcuts: isMac ? macPageShortcuts : winPageShortcuts,
@ -308,7 +308,7 @@ export const useEdgelessShortcuts = (): ShortcutsInfo => {
const macEdgelessShortcuts = useMacEdgelessKeyboardShortcuts();
const winEdgelessShortcuts = useWinEdgelessKeyboardShortcuts();
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
return {
title: t['com.affine.shortcutsTitle.edgeless'](),
shortcuts: isMac ? macEdgelessShortcuts : winEdgelessShortcuts,
@ -320,7 +320,7 @@ export const useGeneralShortcuts = (): ShortcutsInfo => {
const macGeneralShortcuts = useMacGeneralKeyboardShortcuts();
const winGeneralShortcuts = useWinGeneralKeyboardShortcuts();
const isMac = environment.isBrowser && environment.isMacOs;
const isMac = environment.isMacOs;
return {
title: t['com.affine.shortcutsTitle.general'](),
shortcuts: isMac ? macGeneralShortcuts : winGeneralShortcuts,

View File

@ -35,7 +35,7 @@ export const appConfigProxy = new AppConfigProxy();
setupGlobal();
const storage = environment.isDesktop
const storage = environment.isElectron
? new AppConfigStorage({
config: defaultAppConfig,
get: () => appConfigProxy.get(),

View File

@ -1,6 +1,5 @@
import type { UpdateMeta } from '@affine/electron-api';
import { apis, events } from '@affine/electron-api';
import { isBrowser } from '@affine/env/constant';
import { appSettingAtom } from '@toeverything/infra';
import { atom, useAtom, useAtomValue } from 'jotai';
import { atomWithObservable, atomWithStorage } from 'jotai/utils';
@ -30,7 +29,7 @@ function rpcToObservable<
return new Observable<T | null>(subscriber => {
subscriber.next(initialValue);
onSubscribe?.();
if (!isBrowser || !environment.isDesktop || !event) {
if (!environment.isElectron || !event) {
subscriber.complete();
return;
}
@ -76,18 +75,12 @@ export const changelogCheckedAtom = atomWithStorage<Record<string, boolean>>(
export const checkingForUpdatesAtom = atom(false);
export const currentVersionAtom = atom(async () => {
if (!isBrowser) {
return null;
}
const currentVersion = await apis?.updater.currentVersion();
return currentVersion;
});
const currentChangelogUnreadAtom = atom(
async get => {
if (!isBrowser) {
return false;
}
const mapping = get(changelogCheckedAtom);
const currentVersion = await get(currentVersionAtom);
if (currentVersion) {

View File

@ -3,7 +3,7 @@ import { useEffect } from 'react';
export function useDocumentTitle(newTitle?: string | null) {
useEffect(() => {
if (environment.isDesktop || !newTitle) {
if (environment.isElectron || !newTitle) {
return noop;
}

View File

@ -223,7 +223,9 @@ const WorkspaceLayoutUIContainer = ({ children }: PropsWithChildren) => {
);
const resizing = useAtomValue(appSidebarResizingAtom);
const LayoutComponent = environment.isDesktop ? DesktopLayout : BrowserLayout;
const LayoutComponent = environment.isElectron
? DesktopLayout
: BrowserLayout;
return (
<AppContainer data-current-path={currentPath} resizing={resizing}>

View File

@ -36,7 +36,7 @@ function createMixpanel() {
environment: runtimeConfig.appBuildType,
editorVersion: runtimeConfig.editorVersion,
isSelfHosted: Boolean(runtimeConfig.isSelfHosted),
isDesktop: environment.isDesktop,
isDesktop: environment.isElectron,
});
},
reset() {

View File

@ -304,7 +304,7 @@ export const AppTabsHeader = ({
const sidebarWidth = useAtomValue(appSidebarWidthAtom);
const sidebarOpen = useAtomValue(appSidebarOpenAtom);
const sidebarResizing = useAtomValue(appSidebarResizingAtom);
const isMacosDesktop = environment.isDesktop && environment.isMacOs;
const isMacosDesktop = environment.isElectron && environment.isMacOs;
const fullScreen = useIsFullScreen();
const tabsHeaderService = useService(AppTabsHeaderService);
@ -413,7 +413,7 @@ export const AppTabsHeader = ({
className={clsx(styles.root, className)}
style={style}
data-mode={mode}
data-is-windows={environment.isDesktop && environment.isWindows}
data-is-windows={environment.isElectron && environment.isWindows}
>
<div
style={{
@ -474,7 +474,7 @@ export const AppTabsHeader = ({
<IconButton size="24" onClick={onToggleRightSidebar}>
<RightSidebarIcon />
</IconButton>
{environment.isDesktop && environment.isWindows ? (
{environment.isElectron && environment.isWindows ? (
<WindowsAppControls />
) : null}
</div>

View File

@ -88,7 +88,7 @@ export class AuthService extends Service {
email,
// we call it [callbackUrl] instead of [redirect_uri]
// to make it clear the url is used to finish the sign-in process instead of redirect after signed-in
callbackUrl: `/magic-link?client=${environment.isDesktop ? appInfo?.schema : 'web'}`,
callbackUrl: `/magic-link?client=${environment.isElectron ? appInfo?.schema : 'web'}`,
}),
headers: {
'content-type': 'application/json',
@ -131,7 +131,7 @@ export class AuthService extends Service {
'state',
JSON.stringify({
state: oauthUrl.searchParams.get('state'),
client: environment.isDesktop ? appInfo?.schema : 'web',
client: environment.isElectron ? appInfo?.schema : 'web',
})
);
url = oauthUrl.toString();

View File

@ -5,7 +5,7 @@ import { fromPromise, Service } from '@toeverything/infra';
import { BackendError, NetworkError } from '../error';
export function getAffineCloudBaseUrl(): string {
if (environment.isDesktop) {
if (environment.isElectron) {
return runtimeConfig.serverUrlPrefix;
}
const { protocol, hostname, port } = window.location;

View File

@ -28,7 +28,7 @@ const getDefaultSubscriptionSuccessCallbackLink = (
plan === SubscriptionPlan.AI ? '/ai-upgrade-success' : '/upgrade-success';
const urlString = getAffineCloudBaseUrl() + path;
const url = new URL(urlString);
if (environment.isDesktop && appInfo) {
if (environment.isElectron && appInfo) {
url.searchParams.set('schema', appInfo.schema);
}
return url.toString();

View File

@ -183,7 +183,7 @@ export const useExplorerCollectionNodeOperations = (
</MenuItem>
),
},
...(environment.isDesktop && enableMultiView
...(environment.isElectron && enableMultiView
? [
{
index: 99,

View File

@ -181,7 +181,7 @@ export const useExplorerDocNodeOperations = (
</MenuItem>
),
},
...(enableMultiView && environment.isDesktop
...(enableMultiView && environment.isElectron
? [
{
index: 100,

View File

@ -119,7 +119,7 @@ export const useExplorerTagNodeOperations = (
</MenuItem>
),
},
...(enableMultiView && environment.isDesktop
...(enableMultiView && environment.isElectron
? [
{
index: 100,

View File

@ -40,7 +40,7 @@ export class Navigator extends Entity {
);
back() {
if (!environment.isDesktop) {
if (!environment.isElectron) {
window.history.back();
} else {
this.history$.value.back();
@ -48,7 +48,7 @@ export class Navigator extends Entity {
}
forward() {
if (!environment.isDesktop) {
if (!environment.isElectron) {
window.history.forward();
} else {
this.history$.value.forward();

View File

@ -44,7 +44,7 @@ export const NavigationButtons = () => {
};
}, [navigator]);
if (!environment.isDesktop) {
if (!environment.isElectron) {
return null;
}

View File

@ -125,7 +125,7 @@ export const DocPeekViewControls = ({
peekView.close('none');
},
},
environment.isDesktop && {
environment.isElectron && {
icon: <SplitViewIcon />,
nameKey: 'split-view',
name: t['com.affine.peek-view-controls.open-doc-in-split-view'](),

View File

@ -283,7 +283,7 @@ export const CMDKGroup = ({
};
const CMDKKeyBinding = ({ keyBinding }: { keyBinding: string }) => {
const isMacOS = environment.isBrowser && environment.isMacOs;
const isMacOS = environment.isMacOs;
const fragments = useMemo(() => {
return keyBinding.split('+').map(fragment => {
if (fragment === '$mod') {

View File

@ -13,7 +13,7 @@ export class DesktopStateSynchronizer extends Service {
}
startSync = () => {
if (!environment.isDesktop) {
if (!environment.isElectron) {
return;
}

View File

@ -54,7 +54,7 @@ export const RouteContainer = () => {
return (
<div className={styles.root}>
<div className={styles.header}>
{viewPosition.isFirst && !environment.isDesktop && (
{viewPosition.isFirst && !environment.isElectron && (
<SidebarSwitch
show={!leftSidebarOpen}
className={styles.leftSidebarButton}
@ -64,7 +64,7 @@ export const RouteContainer = () => {
viewId={view.id}
className={styles.viewHeaderContainer}
/>
{viewPosition.isLast && !environment.isDesktop && (
{viewPosition.isLast && !environment.isElectron && (
<ToggleButton
show={!sidebarOpen}
className={styles.rightSidebarButton}

View File

@ -38,7 +38,7 @@ export const SidebarContainer = ({
viewId={view.id}
className={clsx(
styles.sidebarBodyTarget,
!environment.isDesktop && styles.borderTop
!environment.isElectron && styles.borderTop
)}
/>
))

View File

@ -44,7 +44,7 @@ export const Header = ({ floating, children, onToggle }: HeaderProps) => {
return (
<Container className={styles.header} floating={floating}>
{children}
{!environment.isDesktop && (
{!environment.isElectron && (
<>
<div className={styles.spacer} />
<ToggleButton onToggle={onToggle} />

View File

@ -40,7 +40,7 @@ export const WorkbenchLink = forwardRef<HTMLAnchorElement, WorkbenchLinkProps>(
}
const at = (() => {
if (isNewTabTrigger(event)) {
return event.altKey && enableMultiView && environment.isDesktop
return event.altKey && enableMultiView && environment.isElectron
? 'tail'
: 'new-tab';
}

View File

@ -22,7 +22,7 @@ import { ViewIslandRegistryProvider } from './view-islands';
import { ViewRoot } from './view-root';
import * as styles from './workbench-root.css';
const useAdapter = environment.isDesktop
const useAdapter = environment.isElectron
? useBindWorkbenchToDesktopRouter
: useBindWorkbenchToBrowserRouter;

View File

@ -47,7 +47,7 @@ export class LocalWorkspaceFlavourProvider
JSON.stringify(allWorkspaceIDs.filter(x => x !== id))
);
if (apis && environment.isDesktop) {
if (apis && environment.isElectron) {
await apis.workspace.delete(id);
}

View File

@ -20,7 +20,7 @@ export const SignIn = () => {
const isLoggedIn = status === 'authenticated' && !isRevalidating;
useEffect(() => {
if (environment.isDesktop && appInfo?.windowName === 'hidden-window') {
if (environment.isElectron && appInfo?.windowName === 'hidden-window') {
return;
}

View File

@ -11,7 +11,7 @@ import {
import { RouteLogic, useNavigateHelper } from '../hooks/use-navigate-helper';
export const loader = () => {
if (!environment.isDesktop && !appConfigStorage.get('onBoarding')) {
if (!environment.isElectron && !appConfigStorage.get('onBoarding')) {
// onboarding is off, redirect to index
return redirect('/');
}
@ -24,7 +24,7 @@ export const Component = () => {
const [, setOnboarding] = useAppConfigStorage('onBoarding');
const openApp = useCallback(() => {
if (environment.isDesktop) {
if (environment.isElectron) {
assertExists(apis);
apis.ui.handleOpenMainApp().catch(err => {
console.log('failed to open main app', err);

View File

@ -258,7 +258,7 @@ const DetailPageImpl = memo(function DetailPageImpl() {
);
const [refCallback, hasScrollTop] = useHasScrollTop();
const dynamicTopBorder = environment.isDesktop;
const dynamicTopBorder = environment.isElectron;
const openOutlinePanel = useCallback(() => {
workbench.openSidebar();

View File

@ -23,7 +23,7 @@ export const useDetailPageHeaderResponsive = (availableWidth: number) => {
viewPosition.isLast &&
!rightSidebarOpen &&
!(hidePresent && hideShare) &&
!environment.isDesktop;
!environment.isElectron;
return {
hideShare,

View File

@ -99,7 +99,7 @@ export const Component = (): ReactElement => {
if (workspaceNotFound) {
if (
detailDocRoute /* */ &&
!environment.isDesktop /* only browser has share page */
!environment.isElectron /* only browser has share page */
) {
return (
<SharePage

View File

@ -26,7 +26,7 @@ export const EmptyPageList = ({
icon={<PlusIcon />}
/>
);
if (environment.isDesktop) {
if (environment.isElectron) {
const shortcut = environment.isMacOs ? '⌘ + N' : 'Ctrl + N';
return (
<Trans i18nKey="emptyAllPagesClient">

View File

@ -63,7 +63,7 @@ export const Setting = () => {
);
useEffect(() => {
if (environment.isDesktop) {
if (environment.isElectron) {
return events?.applicationMenu.openAboutPageInSettingModal(() =>
setOpenSettingModalAtom({
activeTab: 'about',
@ -123,7 +123,7 @@ export function CurrentWorkspaceModals() {
)}
<AiLoginRequiredModal />
<PeekViewManagerModal />
{environment.isDesktop && <FindInPageModal />}
{environment.isElectron && <FindInPageModal />}
<MoveToTrash.ConfirmModal
open={trashConfirmOpen}
onConfirm={handleOnConfirm}

View File

@ -1,15 +1,10 @@
import { isBrowser } from '@affine/env/constant';
import createCache from '@emotion/cache';
export default function createEmotionCache() {
let insertionPoint;
if (isBrowser) {
const emotionInsertionPoint = document.querySelector<HTMLMetaElement>(
'meta[name="emotion-insertion-point"]'
);
insertionPoint = emotionInsertionPoint ?? undefined;
}
const emotionInsertionPoint = document.querySelector<HTMLMetaElement>(
'meta[name="emotion-insertion-point"]'
);
const insertionPoint = emotionInsertionPoint ?? undefined;
return createCache({ key: 'affine', insertionPoint });
}

View File

@ -42,7 +42,7 @@ const desktopWhiteList = [
'/magic-link',
];
if (
!environment.isDesktop &&
!environment.isElectron &&
environment.isDebug &&
desktopWhiteList.every(path => !location.pathname.startsWith(path))
) {

View File

@ -6,7 +6,7 @@ import * as styles from './shell.css';
export function ShellRoot() {
const { appSettings } = useAppSettingHelper();
const translucent =
environment.isDesktop &&
environment.isElectron &&
environment.isMacOs &&
appSettings.enableBlurBackground;
return (

View File

@ -10,7 +10,7 @@ import { gqlFetcherFactory } from './fetcher';
setupGlobal();
export function getBaseUrl(): string {
if (environment.isDesktop) {
if (environment.isElectron) {
return runtimeConfig.serverUrlPrefix;
}
if (typeof window === 'undefined') {

View File

@ -29,7 +29,7 @@ import { RouterProvider } from 'react-router-dom';
import { configureMobileModules } from './modules';
import { router } from './router';
if (!environment.isBrowser && environment.isDebug) {
if (environment.isElectron && environment.isDebug) {
document.body.innerHTML = `<h1 style="color:red;font-size:5rem;text-align:center;">Don't run web entry in electron.</h1>`;
throw new Error('Wrong distribution');
}

View File

@ -31,7 +31,7 @@ import type { PropsWithChildren, ReactElement } from 'react';
import { lazy, Suspense } from 'react';
import { RouterProvider } from 'react-router-dom';
if (!environment.isBrowser && environment.isDebug) {
if (environment.isElectron && environment.isDebug) {
document.body.innerHTML = `<h1 style="color:red;font-size:5rem;text-align:center;">Don't run web entry in electron.</h1>`;
throw new Error('Wrong distribution');
}

View File

@ -6,7 +6,6 @@ import '@affine/core/bootstrap/preload';
import { performanceLogger } from '@affine/core/shared';
import { appInfo } from '@affine/electron-api';
import { isDesktop } from '@affine/env/constant';
import {
init,
reactRouterV6BrowserTracingIntegration,
@ -28,7 +27,7 @@ function main() {
performanceMainLogger.info('start');
// skip bootstrap setup for desktop onboarding
if (isDesktop && appInfo?.windowName === 'onboarding') {
if (environment.isElectron && appInfo?.windowName === 'onboarding') {
performanceMainLogger.info('skip setup');
} else {
performanceMainLogger.info('setup start');

View File

@ -7,6 +7,7 @@ export function getRuntimeConfig(buildFlags: BuildFlags): RuntimeConfig {
const buildPreset: Record<BuildFlags['channel'], RuntimeConfig> = {
get stable() {
return {
distribution: buildFlags.distribution,
appBuildType: 'stable' as const,
serverUrlPrefix: 'https://app.affine.pro',
appVersion: packageJson.version,