refactor: environment setup (#2898)

Co-authored-by: Simon He <57086651+Simon-He95@users.noreply.github.com>

apps/web/src/adapters/affine/index.tsx

@@ -2,9 +2,8 @@
  * This file has deprecated because we do not maintain legacy affine cloud,
  *  please use new affine cloud instead.
  */
-import { AFFINE_STORAGE_KEY, config } from '@affine/env';
 import { initEmptyPage } from '@affine/env/blocksuite';
-import { PageNotFoundError } from '@affine/env/constant';
+import { AFFINE_STORAGE_KEY, PageNotFoundError } from '@affine/env/constant';
 import type {
   AffineDownloadProvider,
   AffineLegacyCloudWorkspace,
@@ -109,7 +108,7 @@ export const AffineAdapter: WorkspaceAdapter<WorkspaceFlavour.AFFINE> = {
   loadPriority: LoadPriority.HIGH,
   Events: {
     'workspace:access': async () => {
-      if (!config.enableLegacyCloud) {
+      if (!runtimeConfig.enableLegacyCloud) {
         console.warn('Legacy cloud is disabled');
         return;
       }
@@ -123,7 +122,7 @@ export const AffineAdapter: WorkspaceAdapter<WorkspaceFlavour.AFFINE> = {
       }
     },
     'workspace:revoke': async () => {
-      if (!config.enableLegacyCloud) {
+      if (!runtimeConfig.enableLegacyCloud) {
         console.warn('Legacy cloud is disabled');
         return;
       }

apps/web/src/adapters/local/index.tsx

@@ -1,11 +1,10 @@
 import { DebugLogger } from '@affine/debug';
+import { initEmptyPage, initPageWithPreloading } from '@affine/env/blocksuite';
 import {
-  config,
   DEFAULT_HELLO_WORLD_PAGE_ID,
   DEFAULT_WORKSPACE_NAME,
-} from '@affine/env';
+  PageNotFoundError,
-import { initEmptyPage, initPageWithPreloading } from '@affine/env/blocksuite';
+} from '@affine/env/constant';
-import { PageNotFoundError } from '@affine/env/constant';
 import type { LocalIndexedDBDownloadProvider } from '@affine/env/workspace';
 import {
   LoadPriority,
@@ -45,7 +44,7 @@ export const LocalAdapter: WorkspaceAdapter<WorkspaceFlavour.LOCAL> = {
       const page = blockSuiteWorkspace.createPage({
         id: DEFAULT_HELLO_WORLD_PAGE_ID,
       });
-      if (config.enablePreloading) {
+      if (runtimeConfig.enablePreloading) {
         initPageWithPreloading(page).catch(err => {
           logger.error('init page with preloading failed', err);
         });

apps/web/src/adapters/workspace.ts

@@ -1,4 +1,4 @@
-import { Unreachable } from '@affine/env';
+import { Unreachable } from '@affine/env/constant';
 import type { AppEvents, WorkspaceUISchema } from '@affine/env/workspace';
 import {
   LoadPriority,

apps/web/src/atoms/index.ts

@@ -1,5 +1,4 @@
 import { DebugLogger } from '@affine/debug';
-import { config } from '@affine/env';
 import { WorkspaceFlavour, WorkspaceVersion } from '@affine/env/workspace';
 import type { RootWorkspaceMetadataV2 } from '@affine/workspace/atom';
 import { rootWorkspacesMetadataAtom } from '@affine/workspace/atom';
@@ -53,7 +52,7 @@ rootWorkspacesMetadataAtom.onMount = setAtom => {
     }, 0);
   }
 
-  if (environment.isDesktop && config.enableSQLiteProvider) {
+  if (environment.isDesktop && runtimeConfig.enableSQLiteProvider) {
     window.apis?.workspace
       .list()
       .then(workspaceIDs => {

apps/web/src/atoms/public-workspace/index.ts

@@ -1,5 +1,4 @@
-import type { BlockSuiteFeatureFlags } from '@affine/env';
+import type { BlockSuiteFeatureFlags } from '@affine/env/global';
-import { config } from '@affine/env';
 import type { AffinePublicWorkspace } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { affineApis } from '@affine/workspace/affine/shared';
@@ -25,7 +24,7 @@ function createPublicWorkspace(
     blockSuiteWorkspace.doc,
     new Uint8Array(binary)
   );
-  Object.entries(config.editorFlags).forEach(([key, value]) => {
+  Object.entries(runtimeConfig.editorFlags).forEach(([key, value]) => {
     blockSuiteWorkspace.awarenessStore.setFlag(
       key as keyof BlockSuiteFeatureFlags,
       value

apps/web/src/atoms/root.ts

@@ -1,6 +1,5 @@
 //#region async atoms that to load the real workspace data
 import { DebugLogger } from '@affine/debug';
-import { config } from '@affine/env';
 import type { WorkspaceRegistry } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import {
@@ -30,7 +29,7 @@ export const workspacesAtom = atom<Promise<AllWorkspace[]>>(
         // TODO: remove this when we remove the legacy cloud
       )
       .filter(workspace =>
-        !config.enableLegacyCloud
+        !runtimeConfig.enableLegacyCloud
           ? workspace.flavour !== WorkspaceFlavour.AFFINE
           : true
       );

apps/web/src/bootstrap/index.ts

@@ -1,5 +1,6 @@
 import { migrateToSubdoc } from '@affine/env/blocksuite';
-import { config, setupGlobal } from '@affine/env/config';
+import { isDesktop, isServer } from '@affine/env/constant';
+import { setupGlobal } from '@affine/env/global';
 import type { LocalIndexedDBDownloadProvider } from '@affine/env/workspace';
 import { WorkspaceFlavour, WorkspaceVersion } from '@affine/env/workspace';
 import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
@@ -16,15 +17,19 @@ import { WorkspaceAdapters } from '../adapters/workspace';
 
 setupGlobal();
 
-if (config.enablePlugin && !environment.isServer) {
+if (process.env.NODE_ENV === 'development') {
+  console.log('Runtime Preset', runtimeConfig);
+}
+
+if (runtimeConfig.enablePlugin && !isServer) {
   import('@affine/copilot');
 }
 
-if (!environment.isServer) {
+if (!isServer) {
   import('@affine/bookmark-block');
 }
 
-if (!environment.isDesktop && !environment.isServer) {
+if (!isDesktop && !isServer) {
   // Polyfill Electron
   const unimplemented = () => {
     throw new Error('AFFiNE Plugin Web will be supported in the future');

apps/web/src/components/affine/create-workspace-modal/index.tsx

@@ -8,7 +8,6 @@ import {
   Tooltip,
 } from '@affine/component';
 import { DebugLogger } from '@affine/debug';
-import { config } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { HelpIcon } from '@blocksuite/icons';
 import { useSetAtom } from 'jotai';
@@ -291,7 +290,7 @@ export const CreateWorkspaceModal = ({
       });
     } else if (mode === 'new') {
       setStep(
-        environment.isDesktop && config.enableSQLiteProvider
+        environment.isDesktop && runtimeConfig.enableSQLiteProvider
           ? 'set-db-location'
           : 'name-workspace'
       );
@@ -306,7 +305,7 @@ export const CreateWorkspaceModal = ({
   const onConfirmEnableCloudSyncing = useCallback(
     (enableCloudSyncing: boolean) => {
       (async function () {
-        if (!config.enableLegacyCloud && enableCloudSyncing) {
+        if (!runtimeConfig.enableLegacyCloud && enableCloudSyncing) {
           setOpenDisableCloudAlertModal(true);
         } else {
           let id = addedId;
@@ -346,7 +345,7 @@ export const CreateWorkspaceModal = ({
   const onConfirmName = useCallback(
     (name: string) => {
       setWorkspaceName(name);
-      if (environment.isDesktop && config.enableSQLiteProvider) {
+      if (environment.isDesktop && runtimeConfig.enableSQLiteProvider) {
         setStep('set-syncing-mode');
       } else {
         // this will be the last step for web for now

apps/web/src/components/affine/setting-modal/general-setting/about/index.tsx

@@ -1,6 +1,6 @@
 import { Switch } from '@affine/component';
 import { relatedLinks } from '@affine/component/contact-modal';
-import { env } from '@affine/env';
+import { isDesktop } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ArrowRightSmallIcon, OpenInNewIcon } from '@blocksuite/icons';
 import { useCallback } from 'react';
@@ -24,7 +24,7 @@ export const AboutAffine = () => {
   return (
     <>
       <SettingHeader title={t['About AFFiNE']()} subtitle={t['None yet']()} />
-      {IS_EXHIBITION && env.isDesktop ? (
+      {IS_EXHIBITION && isDesktop ? (
         <Wrapper title={t['Version']()}>
           <SettingRow
             name={t['Check for updates']()}

apps/web/src/components/affine/setting-modal/general-setting/appearance/index.tsx

@@ -1,5 +1,5 @@
 import { RadioButton, RadioButtonGroup, Switch } from '@affine/component';
-import { env } from '@affine/env';
+import { isDesktop } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { useTheme } from 'next-themes';
 import { useCallback } from 'react';
@@ -71,7 +71,7 @@ export const AppearanceSettings = () => {
             <LanguageMenu />
           </div>
         </SettingRow>
-        {IS_EXHIBITION && env.isDesktop ? (
+        {IS_EXHIBITION && isDesktop ? (
           <SettingRow
             name={t['Client Border Style']()}
             desc={t['Customize the appearance of the client.']()}
@@ -92,7 +92,7 @@ export const AppearanceSettings = () => {
             onChange={checked => changeSwitch('fullWidthLayout', checked)}
           />
         </SettingRow>
-        {IS_EXHIBITION && env.isDesktop ? (
+        {IS_EXHIBITION && isDesktop ? (
           <SettingRow
             name={t['Window frame style']()}
             desc={t['Customize appearance of Windows Client.']()}
@@ -137,7 +137,7 @@ export const AppearanceSettings = () => {
         </Wrapper>
       ) : null}
 
-      {env.isDesktop ? (
+      {isDesktop ? (
         <Wrapper title={t['Sidebar']()}>
           <SettingRow
             name={t['Disable the noise background on the sidebar']()}

apps/web/src/components/affine/workspace-setting-detail/panel/collaboration/index.tsx

@@ -1,5 +1,4 @@
 import { Button, IconButton, Menu, MenuItem, Wrapper } from '@affine/component';
-import { config } from '@affine/env';
 import { Unreachable } from '@affine/env/constant';
 import type {
   AffineLegacyCloudWorkspace,
@@ -186,7 +185,7 @@ const LocalCollaborationPanel: React.FC<
       >
         {t['Enable AFFiNE Cloud']()}
       </Button>
-      {config.enableLegacyCloud ? (
+      {runtimeConfig.enableLegacyCloud ? (
         <TransformWorkspaceToAffineModal
           open={open}
           onClose={() => {

apps/web/src/components/affine/workspace-setting-detail/panel/export/index.tsx

@@ -1,5 +1,4 @@
 import { Button, toast, Wrapper } from '@affine/component';
-import { config } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { rootCurrentWorkspaceIdAtom } from '@affine/workspace/atom';
 import { useAtomValue } from 'jotai';
@@ -13,7 +12,9 @@ export const ExportPanel = () => {
       <Button
         type="light"
         shape="circle"
-        disabled={!environment.isDesktop || !id || !config.enableSQLiteProvider}
+        disabled={
+          !environment.isDesktop || !id || !runtimeConfig.enableSQLiteProvider
+        }
         data-testid="export-affine-backup"
         onClick={async () => {
           if (id) {

apps/web/src/components/affine/workspace-setting-detail/panel/general/index.tsx

@@ -1,6 +1,5 @@
 import { Button, toast } from '@affine/component';
 import { WorkspaceAvatar } from '@affine/component/workspace-avatar';
-import { config } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import {
   ArrowRightSmallIcon,
@@ -31,7 +30,7 @@ const useShowOpenDBFile = (workspaceId: string) => {
       window.apis &&
       window.events &&
       environment.isDesktop &&
-      config.enableSQLiteProvider
+      runtimeConfig.enableSQLiteProvider
     ) {
       window.apis.workspace
         .getMeta(workspaceId)
@@ -143,7 +142,7 @@ export const GeneralPanel: React.FC<PanelProps> = ({
           </Button>
         </div>
       </div>
-      {environment.isDesktop && config.enableSQLiteProvider ? (
+      {environment.isDesktop && runtimeConfig.enableSQLiteProvider ? (
         <DesktopClientOnly workspaceId={workspace.id} />
       ) : null}
       <div className={style.row}>
@@ -209,7 +208,7 @@ function DesktopClientOnly({ workspaceId }: { workspaceId: string }) {
   const t = useAFFiNEI18N();
   const showOpenFolder = useShowOpenDBFile(workspaceId);
   const onRevealDBFile = useCallback(() => {
-    if (environment.isDesktop && config.enableSQLiteProvider) {
+    if (environment.isDesktop && runtimeConfig.enableSQLiteProvider) {
       window.apis?.dialog.revealDBFile(workspaceId).catch(err => {
         console.error(err);
       });

apps/web/src/components/affine/workspace-setting-detail/panel/publish/index.tsx

@@ -5,8 +5,7 @@ import {
   Input,
   Wrapper,
 } from '@affine/component';
-import { config } from '@affine/env';
+import { isBrowser, Unreachable } from '@affine/env/constant';
-import { Unreachable } from '@affine/env/constant';
 import type {
   AffineLegacyCloudWorkspace,
   LocalWorkspace,
@@ -38,9 +37,7 @@ const PublishPanelAffine: React.FC<PublishPanelAffineProps> = ({
   const [origin, setOrigin] = useState('');
   useEffect(() => {
     setOrigin(
-      typeof window !== 'undefined' && window.location.origin
+      isBrowser && window.location.origin ? window.location.origin : ''
-        ? window.location.origin
-        : ''
     );
   }, []);
   const shareUrl = origin + '/public-workspace/' + workspace.id;
@@ -137,7 +134,7 @@ const PublishPanelLocal: React.FC<PublishPanelLocalProps> = ({
       >
         {t['Enable AFFiNE Cloud']()}
       </Button>
-      {config.enableLegacyCloud ? (
+      {runtimeConfig.enableLegacyCloud ? (
         <EnableAffineCloudModal
           open={open}
           onClose={() => {

apps/web/src/components/blocksuite/block-suite-page-list/index.tsx

@@ -5,7 +5,6 @@ import {
   PageList,
   PageListTrashView,
 } from '@affine/component/page-list';
-import { env } from '@affine/env';
 import type { View } from '@affine/env/filter';
 import { Trans } from '@affine/i18n';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
@@ -56,8 +55,8 @@ const PageListEmpty = (props: {
           New Page
         </button>
       );
-      if (env.isDesktop) {
+      if (environment.isDesktop) {
-        const shortcut = env.isMacOs ? '⌘ + N' : 'Ctrl + N';
+        const shortcut = environment.isMacOs ? '⌘ + N' : 'Ctrl + N';
         return (
           <Trans i18nKey="emptyAllPagesClient">
             Click on the <CreateNewPageButton /> button Or press

apps/web/src/components/blocksuite/workspace-header/download-tips.tsx

@@ -1,5 +1,5 @@
 import { DownloadTips } from '@affine/component/affine-banner';
-import { env } from '@affine/env';
+import { isDesktop } from '@affine/env/constant';
 import { useAtom } from 'jotai';
 import { useCallback } from 'react';
 
@@ -13,7 +13,7 @@ export const DownloadClientTip = () => {
     setShowDownloadClientTips(false);
   }, [setShowDownloadClientTips]);
 
-  if (!showDownloadClientTips || env.isDesktop) {
+  if (!showDownloadClientTips || isDesktop) {
     return <></>;
   }
   return <DownloadTips onClose={onCloseDownloadClient} />;

apps/web/src/components/blocksuite/workspace-header/header-right-items/share-menu.tsx

@@ -1,5 +1,4 @@
 import { ShareMenu } from '@affine/component/share-menu';
-import { config } from '@affine/env';
 import { Unreachable } from '@affine/env/constant';
 import type {
   AffineLegacyCloudWorkspace,
@@ -110,7 +109,7 @@ const LocalHeaderShareMenu: React.FC<BaseHeaderProps> = props => {
 };
 
 export const HeaderShareMenu: React.FC<BaseHeaderProps> = props => {
-  if (!config.enableLegacyCloud) {
+  if (!runtimeConfig.enableLegacyCloud) {
     return null;
   }
   if (props.workspace.flavour === WorkspaceFlavour.AFFINE) {

apps/web/src/components/blocksuite/workspace-header/header-right-items/sync-user.tsx

@@ -1,5 +1,4 @@
 import { displayFlex, IconButton, styled, Tooltip } from '@affine/component';
-import { config } from '@affine/env';
 import type { LocalWorkspace } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
@@ -82,7 +81,7 @@ export const SyncUser = () => {
   const t = useAFFiNEI18N();
   const transformWorkspace = useTransformWorkspace();
 
-  if (!config.enableLegacyCloud) {
+  if (!runtimeConfig.enableLegacyCloud) {
     return null;
   }
 

apps/web/src/components/blocksuite/workspace-header/header.tsx

@@ -4,6 +4,7 @@ import {
   appSidebarOpenAtom,
 } from '@affine/component/app-sidebar';
 import { SidebarSwitch } from '@affine/component/app-sidebar/sidebar-header';
+import { isBrowser, isDesktop } from '@affine/env/constant';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { CloseIcon, MinusIcon, RoundedRectangleIcon } from '@blocksuite/icons';
 import type { Page } from '@blocksuite/store';
@@ -148,7 +149,7 @@ const HeaderRightItems: Record<HeaderRightItemName, HeaderItem> = {
       );
     },
     availableWhen: () => {
-      return environment.isDesktop && environment.isWindows;
+      return isDesktop && isBrowser;
     },
   },
 };

apps/web/src/components/blocksuite/workspace-header/utils.tsx

@@ -1,4 +1,4 @@
-import { env } from '@affine/env';
+import { isDesktop } from '@affine/env/constant';
 import { Trans } from '@affine/i18n';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type React from 'react';
@@ -7,18 +7,18 @@ import { useEffect, useState } from 'react';
 const minimumChromeVersion = 102;
 
 export const shouldShowWarning = () => {
-  if (env.isDesktop) {
+  if (isDesktop) {
     // even though desktop have compatibility issues, we don't want to show the warning
     return false;
   }
-  if (!env.isBrowser) {
+  if (!environment.isBrowser) {
     // disable in SSR
     return false;
   }
-  if (env.isChrome) {
+  if (environment.isChrome) {
-    return env.chromeVersion < minimumChromeVersion;
+    return environment.chromeVersion < minimumChromeVersion;
   } else {
-    return !env.isMobile;
+    return !environment.isMobile;
   }
 };
 
@@ -27,9 +27,11 @@ export const OSWarningMessage: React.FC = () => {
   const [notChrome, setNotChrome] = useState(false);
   const [notGoodVersion, setNotGoodVersion] = useState(false);
   useEffect(() => {
-    setNotChrome(env.isBrowser && !env.isChrome);
+    setNotChrome(environment.isBrowser && !environment.isChrome);
     setNotGoodVersion(
-      env.isBrowser && env.isChrome && env.chromeVersion < minimumChromeVersion
+      environment.isBrowser &&
+        environment.isChrome &&
+        environment.chromeVersion < minimumChromeVersion
     );
   }, []);
 

apps/web/src/components/pure/footer/index.tsx

@@ -1,7 +1,6 @@
 import { FlexWrapper } from '@affine/component';
 import { IconButton } from '@affine/component';
 import { Tooltip } from '@affine/component';
-import { config } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type { AccessTokenMessage } from '@affine/workspace/affine/login';
 import { CloudWorkspaceIcon, SignOutIcon } from '@blocksuite/icons';
@@ -62,7 +61,7 @@ export const Footer: React.FC<FooterProps> = ({ user, onLogin, onLogout }) => {
             </div>
           }
           onClick={async () => {
-            if (!config.enableLegacyCloud) {
+            if (!runtimeConfig.enableLegacyCloud) {
               setOpen(true);
             } else {
               onLogin();

apps/web/src/components/pure/help-island/index.tsx

@@ -1,5 +1,4 @@
 import { MuiFade, Tooltip } from '@affine/component';
-import { config, env } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { CloseIcon, NewIcon, UserGuideIcon } from '@blocksuite/icons';
 import { useAtom } from 'jotai';
@@ -28,7 +27,7 @@ const DEFAULT_SHOW_LIST: IslandItemNames[] = [
 const DESKTOP_SHOW_LIST: IslandItemNames[] = [...DEFAULT_SHOW_LIST, 'guide'];
 export type IslandItemNames = 'whatNew' | 'contact' | 'shortcuts' | 'guide';
 export const HelpIsland = ({
-  showList = env.isDesktop ? DESKTOP_SHOW_LIST : DEFAULT_SHOW_LIST,
+  showList = environment.isDesktop ? DESKTOP_SHOW_LIST : DEFAULT_SHOW_LIST,
 }: {
   showList?: IslandItemNames[];
 }) => {
@@ -73,7 +72,7 @@ export const HelpIsland = ({
               <StyledIconWrapper
                 data-testid="right-bottom-change-log-icon"
                 onClick={() => {
-                  window.open(config.changelogUrl, '_blank');
+                  window.open(runtimeConfig.changelogUrl, '_blank');
                 }}
               >
                 <NewIcon />

apps/web/src/components/pure/quick-search-modal/index.tsx

@@ -1,5 +1,4 @@
 import { Modal, ModalWrapper } from '@affine/component';
-import { env } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { Command } from 'cmdk';
 import type { NextRouter } from 'next/router';
@@ -26,10 +25,6 @@ import {
   StyledShortcut,
 } from './style';
 
-const isMac = () => {
-  return env.isBrowser && env.isMacOs;
-};
-
 export type QuickSearchModalProps = {
   blockSuiteWorkspace: BlockSuiteWorkspace;
   open: boolean;
@@ -149,7 +144,11 @@ export const QuickSearchModal: React.FC<QuickSearchModalProps> = ({
                   : t['Quick search placeholder']()
               }
             />
-            <StyledShortcut>{isMac() ? '⌘ + K' : 'Ctrl + K'}</StyledShortcut>
+            <StyledShortcut>
+              {environment.isBrowser && environment.isMacOs
+                ? '⌘ + K'
+                : 'Ctrl + K'}
+            </StyledShortcut>
           </StyledModalHeader>
           <StyledModalDivider
             style={{ display: isPublicAndNoQuery() ? 'none' : '' }}

apps/web/src/components/pure/quick-search-modal/results.tsx

@@ -1,4 +1,4 @@
-import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
+import { UNTITLED_WORKSPACE_NAME } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { EdgelessIcon, PageIcon } from '@blocksuite/icons';
 import { assertExists } from '@blocksuite/store';

apps/web/src/components/pure/workspace-list-modal/index.tsx

@@ -8,7 +8,6 @@ import {
 } from '@affine/component';
 import { ScrollableContainer } from '@affine/component';
 import { WorkspaceList } from '@affine/component/workspace-list';
-import { config } from '@affine/env/config';
 import type {
   AffineLegacyCloudWorkspace,
   LocalWorkspace,
@@ -66,7 +65,7 @@ const CreateWorkspaceCard = ({
   const t = useAFFiNEI18N();
   const anchorEL = useRef<HTMLDivElement>(null);
 
-  if (config.enableSQLiteProvider && environment.isDesktop) {
+  if (runtimeConfig.enableSQLiteProvider && environment.isDesktop) {
     return (
       <Menu
         placement="auto"

apps/web/src/components/root-app-sidebar/index.tsx

@@ -10,7 +10,7 @@ import {
   SidebarContainer,
   SidebarScrollableContainer,
 } from '@affine/component/app-sidebar';
-import { config } from '@affine/env';
+import { isDesktop } from '@affine/env/constant';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import {
@@ -105,14 +105,14 @@ export const RootAppSidebar = ({
 
   // Listen to the "New Page" action from the menu
   useEffect(() => {
-    if (environment.isDesktop) {
+    if (isDesktop) {
       return window.events?.applicationMenu.onNewPageAction(onClickNewPage);
     }
   }, [onClickNewPage]);
 
   const [sidebarOpen, setSidebarOpen] = useAtom(appSidebarOpenAtom);
   useEffect(() => {
-    if (environment.isDesktop && typeof sidebarOpen === 'boolean') {
+    if (isDesktop && typeof sidebarOpen === 'boolean') {
       window.apis?.ui.handleSidebarVisibilityChange(sidebarOpen).catch(err => {
         console.error(err);
       });
@@ -177,7 +177,7 @@ export const RootAppSidebar = ({
           >
             <span data-testid="settings">{t['Settings']()}</span>
           </RouteMenuLinkItem>
-          {config.enableNewSettingModal ? (
+          {runtimeConfig.enableNewSettingModal ? (
             <MenuItem icon={<SettingsIcon />} onClick={onOpenSettingModal}>
               <span data-testid="new-settings">
                 {t['Settings']()}
@@ -203,7 +203,7 @@ export const RootAppSidebar = ({
           {blockSuiteWorkspace && (
             <FavoriteList currentWorkspace={currentWorkspace} />
           )}
-          {config.enableLegacyCloud &&
+          {runtimeConfig.enableLegacyCloud &&
             (currentWorkspace?.flavour === WorkspaceFlavour.AFFINE &&
             currentWorkspace.public ? (
               <RouteMenuLinkItem
@@ -235,7 +235,7 @@ export const RootAppSidebar = ({
           </RouteMenuLinkItem>
         </SidebarScrollableContainer>
         <SidebarContainer>
-          {environment.isDesktop && <AppUpdaterButton />}
+          {isDesktop && <AppUpdaterButton />}
           <div />
           <AddPageButton onClick={onClickNewPage} />
         </SidebarContainer>

apps/web/src/components/workspace-header.tsx

@@ -5,7 +5,6 @@ import {
   useAllPageSetting,
   ViewList,
 } from '@affine/component/page-list';
-import { config } from '@affine/env';
 import type { WorkspaceHeaderProps } from '@affine/env/workspace';
 import { WorkspaceFlavour, WorkspaceSubPath } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
@@ -40,7 +39,7 @@ export function WorkspaceHeader({
               }}
             />
           </div>
-          {config.enableAllPageFilter && (
+          {runtimeConfig.enableAllPageFilter && (
             <div>
               {setting.currentView.id !== NIL ||
               (setting.currentView.id === NIL &&

apps/web/src/hooks/affine/use-shortcuts.ts

@@ -1,4 +1,3 @@
-import { env } from '@affine/env';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { useMemo } from 'react';
 
@@ -209,21 +208,21 @@ export const useWinMarkdownShortcuts = (): ShortcutTip => {
 export const useMarkdownShortcuts = (): ShortcutTip => {
   const macMarkdownShortcuts = useMacMarkdownShortcuts();
   const winMarkdownShortcuts = useWinMarkdownShortcuts();
-  const isMac = env.isBrowser && env.isMacOs;
+  const isMac = environment.isBrowser && environment.isMacOs;
   return isMac ? macMarkdownShortcuts : winMarkdownShortcuts;
 };
 
 export const usePageShortcuts = (): ShortcutTip => {
   const macPageShortcuts = useMacPageKeyboardShortcuts();
   const winPageShortcuts = useWinPageKeyboardShortcuts();
-  const isMac = env.isBrowser && env.isMacOs;
+  const isMac = environment.isBrowser && environment.isMacOs;
   return isMac ? macPageShortcuts : winPageShortcuts;
 };
 
 export const useEdgelessShortcuts = (): ShortcutTip => {
   const macEdgelessShortcuts = useMacEdgelessKeyboardShortcuts();
   const winEdgelessShortcuts = useWinEdgelessKeyboardShortcuts();
-  const isMac = env.isBrowser && env.isMacOs;
+  const isMac = environment.isBrowser && environment.isMacOs;
 
   return isMac ? macEdgelessShortcuts : winEdgelessShortcuts;
 };
@@ -231,7 +230,7 @@ export const useEdgelessShortcuts = (): ShortcutTip => {
 export const useGeneralShortcuts = (): ShortcutTip => {
   const macGeneralShortcuts = useMacGeneralKeyboardShortcuts();
   const winGeneralShortcuts = useWinGeneralKeyboardShortcuts();
-  const isMac = env.isBrowser && env.isMacOs;
+  const isMac = environment.isBrowser && environment.isMacOs;
 
   return isMac ? macGeneralShortcuts : winGeneralShortcuts;
 };

apps/web/src/hooks/current/use-current-workspace.ts

@@ -1,3 +1,4 @@
+import { isBrowser } from '@affine/env/constant';
 import {
   rootCurrentPageIdAtom,
   rootCurrentWorkspaceIdAtom,
@@ -19,7 +20,7 @@ export function useCurrentWorkspace(): [
     currentWorkspace,
     useCallback(
       (id: string | null) => {
-        if (typeof window !== 'undefined' && id) {
+        if (isBrowser && id) {
           localStorage.setItem('last_workspace_id', id);
         }
         setPageId(null);

apps/web/src/layouts/workspace-layout.tsx

@@ -9,8 +9,8 @@ import {
   WorkspaceFallback,
 } from '@affine/component/workspace';
 import { DebugLogger } from '@affine/debug';
-import { config, DEFAULT_HELLO_WORLD_PAGE_ID, env } from '@affine/env';
 import { initEmptyPage, initPageWithPreloading } from '@affine/env/blocksuite';
+import { DEFAULT_HELLO_WORLD_PAGE_ID, isDesktop } from '@affine/env/constant';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { setUpLanguage, useI18N } from '@affine/i18n';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
@@ -350,7 +350,7 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
       id: pageId,
     });
     assertEquals(page.id, pageId);
-    if (config.enablePreloading) {
+    if (runtimeConfig.enablePreloading) {
       initPageWithPreloading(page).catch(error => {
         console.error('import error:', error);
       });
@@ -455,7 +455,7 @@ export const WorkspaceLayoutInner: FC<PropsWithChildren> = ({ children }) => {
   );
   const t = useAFFiNEI18N();
 
-  const showList: IslandItemNames[] = env.isDesktop
+  const showList: IslandItemNames[] = isDesktop
     ? ['whatNew', 'contact', 'guide']
     : ['whatNew', 'contact'];
 

apps/web/src/pages/_app.tsx

@@ -5,7 +5,6 @@ import '../bootstrap';
 
 import { AffineContext } from '@affine/component/context';
 import { WorkspaceFallback } from '@affine/component/workspace';
-import { config } from '@affine/env';
 import { createI18n, I18nextProvider } from '@affine/i18n';
 import type { EmotionCache } from '@emotion/cache';
 import { CacheProvider } from '@emotion/react';
@@ -42,9 +41,6 @@ const DebugProvider = ({ children }: PropsWithChildren): ReactElement => {
 };
 
 const i18n = createI18n();
-if (process.env.NODE_ENV === 'development') {
-  console.log('Runtime Preset', config);
-}
 
 const App = function App({
   Component,

apps/web/src/pages/plugins.tsx

@@ -1,5 +1,4 @@
 import { MainContainer } from '@affine/component/workspace';
-import { config } from '@affine/env';
 import { NoSsr } from '@mui/material';
 import { affinePluginsAtom } from '@toeverything/plugin-infra/manager';
 import { useAtomValue } from 'jotai';
@@ -29,7 +28,7 @@ const Plugins = () => {
 };
 
 export default function PluginPage(): ReactElement {
-  if (!config.enablePlugin) {
+  if (!runtimeConfig.enablePlugin) {
     return <></>;
   }
   return (

apps/web/src/providers/modal-provider.tsx

@@ -1,4 +1,3 @@
-import { env } from '@affine/env';
 import { WorkspaceSubPath } from '@affine/env/workspace';
 import {
   rootCurrentWorkspaceIdAtom,
@@ -69,7 +68,7 @@ export function CurrentWorkspaceModals() {
           }, [setOpenDisableCloudAlertModal])}
         />
       </Suspense>
-      {env.isDesktop && (
+      {environment.isDesktop && (
         <Suspense>
           <OnboardingModal
             open={openOnboardingModal}

apps/web/src/shared/gql.ts

@@ -1,4 +1,3 @@
-import { prefixUrl } from '@affine/env';
 import type {
   GraphQLQuery,
   MutationOptions,

apps/web/src/utils/create-emotion-cache.ts

@@ -1,8 +1,6 @@
-import { env } from '@affine/env';
+import { isBrowser } from '@affine/env/constant';
 import createCache from '@emotion/cache';
 
-const isBrowser = env.isBrowser;
-
 export default function createEmotionCache() {
   let insertionPoint;
 

packages/component/src/components/app-sidebar/app-updater-button/index.jotai.ts

@@ -1,4 +1,4 @@
-import { env } from '@affine/env/config';
+import { isBrowser } from '@affine/env/constant';
 import { atomWithObservable, atomWithStorage } from 'jotai/utils';
 import { Observable } from 'rxjs';
 
@@ -22,7 +22,7 @@ function rpcToObservable<
   return new Observable<T>(subscriber => {
     subscriber.next(initialValue);
     onSubscribe?.();
-    if (typeof window === 'undefined' || !env.isDesktop || !event) {
+    if (!isBrowser || !environment.isDesktop || !event) {
       subscriber.complete();
       return;
     }

packages/component/src/components/app-sidebar/app-updater-button/index.tsx

@@ -1,5 +1,4 @@
-import { config } from '@affine/env/config';
+import { isBrowser, Unreachable } from '@affine/env/constant';
-import { Unreachable } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { CloseIcon, NewIcon, ResetIcon } from '@blocksuite/icons';
 import clsx from 'clsx';
@@ -20,7 +19,7 @@ interface AddPageButtonProps {
 }
 
 const currentVersionAtom = atom(async () => {
-  if (typeof window === 'undefined') {
+  if (!isBrowser) {
     return null;
   }
   const currentVersion = await window.apis?.updater.currentVersion();
@@ -28,7 +27,7 @@ const currentVersionAtom = atom(async () => {
 });
 
 const currentChangelogUnreadAtom = atom(async get => {
-  if (typeof window === 'undefined') {
+  if (!isBrowser) {
     return false;
   }
   const mapping = get(changelogCheckedAtom);
@@ -79,7 +78,7 @@ export function AppUpdaterButton({ className, style }: AddPageButtonProps) {
         );
       }
     } else if (currentChangelogUnread) {
-      window.open(config.changelogUrl, '_blank');
+      window.open(runtimeConfig.changelogUrl, '_blank');
       onDismissCurrentChangelog();
     } else {
       throw new Unreachable();

packages/component/src/components/app-sidebar/index.tsx

@@ -1,4 +1,3 @@
-import { env } from '@affine/env';
 import { Skeleton } from '@mui/material';
 import { assignInlineVars } from '@vanilla-extract/dynamic';
 import clsx from 'clsx';
@@ -84,7 +83,7 @@ export function AppSidebar(props: AppSidebarProps): ReactElement {
   // disable animation to avoid UI flash
   const enableAnimation = useEnableAnimation();
 
-  const isMacosDesktop = env.isDesktop && env.isMacOs;
+  const isMacosDesktop = environment.isDesktop && environment.isMacOs;
   if (initialRender) {
     // avoid the UI flash
     return <div />;
@@ -97,7 +96,7 @@ export function AppSidebar(props: AppSidebarProps): ReactElement {
           [navWidthVar]: `${appSidebarWidth}px`,
         })}
         className={clsx(navWrapperStyle, {
-          'has-background': env.isDesktop && props.hasBackground,
+          'has-background': environment.isDesktop && props.hasBackground,
         })}
         data-open={open}
         data-is-macos-electron={isMacosDesktop}

packages/component/src/components/app-sidebar/quick-search-input/index.tsx

@@ -1,19 +1,19 @@
-import { env } from '@affine/env/config';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { SearchIcon } from '@blocksuite/icons';
 import clsx from 'clsx';
+import type { HTMLAttributes } from 'react';
 
 import { Spotlight } from '../spolight';
 import * as styles from './index.css';
 
-interface QuickSearchInputProps extends React.HTMLAttributes<HTMLDivElement> {
+interface QuickSearchInputProps extends HTMLAttributes<HTMLDivElement> {
   onClick?: () => void;
 }
 
 // Although it is called an input, it is actually a button.
 export function QuickSearchInput({ onClick, ...props }: QuickSearchInputProps) {
   const t = useAFFiNEI18N();
-  const isMac = env.isBrowser && env.isMacOs;
+  const isMac = environment.isBrowser && environment.isMacOs;
 
   return (
     <div

packages/component/src/components/app-sidebar/sidebar-header/index.tsx

@@ -1,4 +1,3 @@
-import { env } from '@affine/env/config';
 import { ArrowLeftSmallIcon, ArrowRightSmallIcon } from '@blocksuite/icons';
 import { useAtomValue } from 'jotai';
 
@@ -20,9 +19,9 @@ export const SidebarHeader = (props: SidebarHeaderProps) => {
   const open = useAtomValue(appSidebarOpenAtom);
   return (
     <div className={navHeaderStyle} data-open={open}>
-      {env.isDesktop && (
+      {environment.isDesktop && (
         <>
-          {env.isMacOs && <div style={{ flex: 1 }} />}
+          {environment.isMacOs && <div style={{ flex: 1 }} />}
           <IconButton
             size="middle"
             data-testid="app-sidebar-arrow-button-back"
@@ -50,7 +49,7 @@ export const SidebarHeader = (props: SidebarHeaderProps) => {
             <ArrowRightSmallIcon />
           </IconButton>
 
-          {!env.isMacOs && <div style={{ flex: 1 }} />}
+          {!environment.isMacOs && <div style={{ flex: 1 }} />}
         </>
       )}
       {open && <SidebarSwitch />}

packages/component/src/components/image-preview-modal/index.jotai.ts

@@ -1,3 +1,4 @@
+import { isBrowser } from '@affine/env/constant';
 import type { EmbedBlockDoubleClickData } from '@blocksuite/blocks';
 import { atom } from 'jotai';
 
@@ -5,7 +6,7 @@ export const previewBlockIdAtom = atom<string | null>(null);
 export const hasAnimationPlayedAtom = atom<boolean | null>(true);
 
 previewBlockIdAtom.onMount = set => {
-  if (typeof window !== 'undefined') {
+  if (isBrowser) {
     const callback = (event: CustomEvent<EmbedBlockDoubleClickData>) => {
       set(event.detail.blockId);
     };

packages/component/src/components/page-list/operation-cell.tsx

@@ -1,3 +1,4 @@
+import { isDesktop } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import {
   DeletePermanentlyIcon,
@@ -65,7 +66,7 @@ export const OperationCell: React.FC<OperationCellProps> = ({
       >
         {favorite ? t['Remove from favorites']() : t['Add to Favorites']()}
       </MenuItem>
-      {!environment.isDesktop && (
+      {!isDesktop && (
         <MenuItem onClick={onOpenPageInNewTab} icon={<OpenInNewIcon />}>
           {t['Open in new tab']()}
         </MenuItem>

packages/component/src/components/share-menu/share-page.tsx

@@ -1,4 +1,3 @@
-import { prefixUrl } from '@affine/env';
 import type { LocalWorkspace } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { Trans } from '@affine/i18n';

packages/component/src/components/theme-provider/index.tsx

@@ -1,3 +1,4 @@
+import { isDesktop } from '@affine/env/constant';
 import { ThemeProvider as NextThemeProvider, useTheme } from 'next-themes';
 import type { PropsWithChildren } from 'react';
 import { memo, useRef } from 'react';
@@ -9,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 (isDesktop && theme) {
       window.apis?.ui
         .handleThemeChange(theme as 'dark' | 'light' | 'system')
         .catch(err => {

packages/component/src/components/workspace/index.tsx

@@ -1,3 +1,4 @@
+import { isDesktop } from '@affine/env/constant';
 import { clsx } from 'clsx';
 import type { FC, PropsWithChildren, ReactElement } from 'react';
 
@@ -22,7 +23,7 @@ export const AppContainer: FC<WorkspaceRootProps> = ({
     <div
       className={clsx(appStyle, {
         'noisy-background': noisyBackground,
-        'blur-background': environment.isDesktop && useBlurBackground,
+        'blur-background': isDesktop && useBlurBackground,
       })}
       data-noise-background={noisyBackground}
       data-is-resizing={resizing}
@@ -40,7 +41,7 @@ export const MainContainer = (props: MainContainerProps): ReactElement => {
   return (
     <div
       className={clsx(mainContainerStyle, 'main-container', props.className)}
-      data-is-desktop={environment.isDesktop}
+      data-is-desktop={isDesktop}
     >
       {props.children}
     </div>

packages/component/tsconfig.json

@@ -5,7 +5,8 @@
   "compilerOptions": {
     "composite": true,
     "noEmit": false,
-    "outDir": "lib"
+    "outDir": "lib",
+    "types": ["@affine/env"]
   },
   "references": [
     {

packages/env/package.json

@@ -3,6 +3,7 @@
   "private": true,
   "main": "./src/index.ts",
   "module": "./src/index.ts",
+  "types": "./src/global.ts",
   "devDependencies": {
     "@blocksuite/global": "0.0.0-20230627165830-836e6fd1-nightly",
     "next": "=13.4.2",
@@ -11,9 +12,7 @@
     "zod": "^3.21.4"
   },
   "exports": {
-    ".": "./src/index.ts",
+    "./global": "./src/global.ts",
-    "./api": "./src/api.ts",
-    "./config": "./src/config.ts",
     "./constant": "./src/constant.ts",
     "./workspace": "./src/workspace.ts",
     "./workspace/legacy-cloud": "./src/workspace/legacy-cloud/index.ts",

packages/env/src/__tests__/subdoc-migration.spec.ts

@@ -38,9 +38,11 @@ describe('subdoc', () => {
       if (id === 'xyWNqindHH') {
         return;
       }
-      if (blocks[id]['sys:flavour'] === 'affine:surface' && !blocks[id]['prop:elements']) {
+      if (
+        blocks[id]['sys:flavour'] === 'affine:surface' &&
+        !blocks[id]['prop:elements']
+      ) {
         blocks[id]['prop:elements'] = data[id]['prop:elements'];
-
       }
       expect(data[id]).toEqual(blocks[id]);
     });

packages/env/src/api.ts

@@ -1,28 +0,0 @@
-import { config, env } from './config';
-import { isValidIPAddress } from './is-valid-ip-address';
-
-let prefixUrl = '/';
-if (typeof window === 'undefined' || env.isDesktop) {
-  // SSR or Desktop
-  const serverAPI = config.serverAPI;
-  if (isValidIPAddress(serverAPI.split(':')[0])) {
-    // This is for Server side rendering support
-    prefixUrl = new URL('http://' + config.serverAPI + '/').origin;
-  } else {
-    prefixUrl = serverAPI;
-  }
-  prefixUrl = prefixUrl.endsWith('/') ? prefixUrl : prefixUrl + '/';
-} else {
-  const params = new URLSearchParams(window.location.search);
-  if (params.get('prefixUrl')) {
-    prefixUrl = params.get('prefixUrl') as string;
-  } else {
-    prefixUrl = window.location.origin + '/';
-  }
-}
-
-const apiUrl = new URL(prefixUrl);
-const wsProtocol = apiUrl.protocol === 'https:' ? 'wss' : 'ws';
-const websocketPrefixUrl = `${wsProtocol}://${apiUrl.host}`;
-
-export { prefixUrl, websocketPrefixUrl };

packages/env/src/blocksuite/subdoc-migration.ts

@@ -91,12 +91,12 @@ function runBlockMigration(
     return;
   }
   if (flavour === 'affine:surface' && version <= 3) {
-    if(data.has('elements')){
+    if (data.has('elements')) {
       const elements = data.get('elements') as Y.Map<unknown>;
       data.set('prop:elements', elements.clone());
       data.delete('elements');
     } else {
-      data.set('prop:elements', new Y.Map())
+      data.set('prop:elements', new Y.Map());
     }
   }
   if (flavour === 'affine:embed') {

packages/env/src/constant.ts

@@ -1,5 +1,19 @@
+// This file should has not side effect
 import type { Workspace } from '@blocksuite/store';
 
+declare global {
+  interface Window {
+    appInfo: {
+      electron: boolean;
+    };
+  }
+}
+
+//#region runtime variables
+export const isBrowser = typeof window !== 'undefined';
+export const isServer = !isBrowser && typeof navigator === 'undefined';
+export const isDesktop = isBrowser && !!window.appInfo?.electron;
+//#endregion
 export const AFFINE_STORAGE_KEY = 'affine-local-storage-v2';
 export const DEFAULT_WORKSPACE_NAME = 'Demo Workspace';
 export const UNTITLED_WORKSPACE_NAME = 'Untitled';

packages/env/src/env.d.ts

@@ -1,2 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-restricted-imports
-import '../hooks/src/use-block-suite-page-meta.ts';

packages/env/src/global.ts

@@ -10,9 +10,12 @@ import type {
   UpdaterHandlerManager,
   WorkspaceHandlerManager,
 } from '@toeverything/infra';
+// fixme(himself65): remove `next/config` dependency
 import getConfig from 'next/config';
 import { z } from 'zod';
 
+import { isBrowser, isDesktop, isServer } from './constant';
+import { isValidIPAddress } from './is-valid-ip-address';
 import { UaHelper } from './ua-helper';
 
 declare global {
@@ -31,6 +34,19 @@ declare global {
     };
     events: any;
   }
+
+  // eslint-disable-next-line no-var
+  var environment: Environment;
+  // eslint-disable-next-line no-var
+  var runtimeConfig: PublicRuntimeConfig;
+  // eslint-disable-next-line no-var
+  var $AFFINE_SETUP: boolean | undefined;
+  // eslint-disable-next-line no-var
+  var editorVersion: string | undefined;
+  // eslint-disable-next-line no-var
+  var prefixUrl: string;
+  // eslint-disable-next-line no-var
+  var websocketPrefixUrl: string;
 }
 
 export const buildFlagsSchema = z.object({
@@ -135,10 +151,31 @@ interface Desktop extends ChromeBrowser {
 
 export type Environment = Browser | Server | Desktop;
 
-export const env: Environment = (() => {
+function printBuildInfo() {
-  let environment = null;
+  console.group('Build info');
+  console.log('Project:', config.PROJECT_NAME);
+  console.log(
+    'Build date:',
+    config.BUILD_DATE ? new Date(config.BUILD_DATE).toLocaleString() : 'Unknown'
+  );
+  console.log('Editor Version:', config.editorVersion);
+
+  console.log('Version:', config.gitVersion);
+  console.log(
+    'AFFiNE is an open source project, you can view its source code on GitHub!'
+  );
+  console.log(`https://github.com/toeverything/AFFiNE/tree/${config.hash}`);
+  console.groupEnd();
+}
+
+export function setupGlobal() {
+  if (globalThis.$AFFINE_SETUP) {
+    return;
+  }
+  globalThis.runtimeConfig = config;
+  let environment: Environment;
   const isDebug = process.env.NODE_ENV === 'development';
-  if (typeof window === 'undefined' || typeof navigator === 'undefined') {
+  if (isServer) {
     environment = {
       isDesktop: false,
       isBrowser: false,
@@ -150,7 +187,7 @@ export const env: Environment = (() => {
 
     environment = {
       origin: window.location.origin,
-      isDesktop: !!window.appInfo?.electron,
+      isDesktop,
       isBrowser: true,
       isServer: false,
       isDebug,
@@ -177,45 +214,37 @@ export const env: Environment = (() => {
     }
   }
   globalThis.environment = environment;
-  return environment;
-})();
 
-function printBuildInfo() {
+  if (environment.isBrowser) {
-  console.group('Build info');
-  console.log('Project:', config.PROJECT_NAME);
-  console.log(
-    'Build date:',
-    config.BUILD_DATE ? new Date(config.BUILD_DATE).toLocaleString() : 'Unknown'
-  );
-  console.log('Editor Version:', config.editorVersion);
-
-  console.log('Version:', config.gitVersion);
-  console.log(
-    'AFFiNE is an open source project, you can view its source code on GitHub!'
-  );
-  console.log(`https://github.com/toeverything/AFFiNE/tree/${config.hash}`);
-  console.groupEnd();
-}
-
-declare global {
-  // eslint-disable-next-line no-var
-  var environment: Environment;
-  // eslint-disable-next-line no-var
-  var $AFFINE_SETUP: boolean | undefined;
-  // eslint-disable-next-line no-var
-  var editorVersion: string | undefined;
-}
-
-export function setupGlobal() {
-  if (globalThis.$AFFINE_SETUP) {
-    return;
-  }
-  globalThis.environment = env;
-  if (env.isBrowser) {
     printBuildInfo();
-    globalThis.editorVersion = config.editorVersion;
+    globalThis.editorVersion = global.editorVersion;
   }
+
+  let prefixUrl: string;
+  if (!isBrowser || isDesktop) {
+    // SSR or Desktop
+    const serverAPI = runtimeConfig.serverAPI;
+    if (isValidIPAddress(serverAPI.split(':')[0])) {
+      // This is for Server side rendering support
+      prefixUrl = new URL('http://' + runtimeConfig.serverAPI + '/').origin;
+    } else {
+      prefixUrl = serverAPI;
+    }
+    prefixUrl = prefixUrl.endsWith('/') ? prefixUrl : prefixUrl + '/';
+  } else {
+    const params = new URLSearchParams(window.location.search);
+    if (params.get('prefixUrl')) {
+      prefixUrl = params.get('prefixUrl') as string;
+    } else {
+      prefixUrl = window.location.origin + '/';
+    }
+  }
+
+  const apiUrl = new URL(prefixUrl);
+  const wsProtocol = apiUrl.protocol === 'https:' ? 'wss' : 'ws';
+  const websocketPrefixUrl = `${wsProtocol}://${apiUrl.host}`;
+
+  globalThis.prefixUrl = prefixUrl;
+  globalThis.websocketPrefixUrl = websocketPrefixUrl;
   globalThis.$AFFINE_SETUP = true;
 }
-
-export { config };

packages/env/src/index.ts

@@ -1,3 +0,0 @@
-export * from './api';
-export * from './config';
-export * from './constant';

packages/hooks/src/__tests__/index.spec.ts

@@ -3,7 +3,7 @@
  */
 import 'fake-indexeddb/auto';
 
-import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
+import { UNTITLED_WORKSPACE_NAME } from '@affine/env/constant';
 import { __unstableSchemas, AffineSchemas } from '@blocksuite/blocks/models';
 import type { Page } from '@blocksuite/store';
 import { assertExists } from '@blocksuite/store';

packages/hooks/src/use-block-suite-workspace-name.ts

@@ -1,4 +1,4 @@
-import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
+import { UNTITLED_WORKSPACE_NAME } from '@affine/env/constant';
 import type { Workspace } from '@blocksuite/store';
 import { assertExists } from '@blocksuite/store';
 import type { Atom, WritableAtom } from 'jotai';

packages/i18n/package.json

@@ -26,7 +26,6 @@
     "url": "git+https://github.com/toeverything/AFFiNE.git"
   },
   "dependencies": {
-    "@affine/debug": "workspace:*",
     "i18next": "^23.2.3",
     "react-i18next": "^13.0.0"
   },

packages/storybook/.storybook/preview.tsx

@@ -2,9 +2,13 @@ import '@affine/component/theme/global.css';
 import '@affine/component/theme/theme.css';
 import { LOCALES, createI18n } from '@affine/i18n';
 import { ThemeProvider, useTheme } from 'next-themes';
-import { ComponentType, useEffect } from 'react';
+import { setupGlobal } from '@affine/env/global';
+import type { ComponentType } from 'react';
+import { useEffect } from 'react';
 import { useDarkMode } from 'storybook-dark-mode';
 
+setupGlobal();
+
 export const parameters = {
   backgrounds: { disable: true },
   actions: { argTypesRegex: '^on[A-Z].*' },

packages/storybook/tsconfig.node.json

@@ -12,5 +12,10 @@
   },
   "include": [".storybook/**/*"],
   "exclude": ["lib"],
-  "references": [{ "path": "../i18n" }]
+  "references": [
+    { "path": "../i18n" },
+    {
+      "path": "../env"
+    }
+  ]
 }

packages/workspace/src/affine/api/index.ts

@@ -1,4 +1,4 @@
-import { MessageCode, Messages } from '@affine/env';
+import { MessageCode, Messages } from '@affine/env/constant';
 import type {
   AcceptInvitingParams,
   DeleteWorkspaceParams,

packages/workspace/src/affine/keck/index.ts

@@ -1,3 +1,4 @@
+import { isBrowser } from '@affine/env/constant';
 import * as encoding from 'lib0/encoding';
 import * as math from 'lib0/math';
 import { Observable } from 'lib0/observable';
@@ -217,7 +218,7 @@ export class KeckProvider extends Observable<string> {
         'window unload'
       );
     };
-    if (typeof window !== 'undefined') {
+    if (isBrowser) {
       window.addEventListener('unload', this._unloadHandler);
     } else if (typeof process !== 'undefined') {
       process.on('exit', this._unloadHandler);
@@ -259,7 +260,7 @@ export class KeckProvider extends Observable<string> {
     }
     clearInterval(this._checkInterval);
     this.disconnect();
-    if (typeof window !== 'undefined') {
+    if (isBrowser) {
       window.removeEventListener('unload', this._unloadHandler);
     } else if (typeof process !== 'undefined') {
       process.off('exit', this._unloadHandler);

packages/workspace/src/affine/login.ts

@@ -1,5 +1,4 @@
 import { DebugLogger } from '@affine/debug';
-import { env } from '@affine/env';
 import { assertExists } from '@blocksuite/global/utils';
 import { Slot } from '@blocksuite/store';
 import { initializeApp } from 'firebase/app';
@@ -189,7 +188,7 @@ export function createAffineAuth(prefix = '/') {
       }
       try {
         let idToken: string | undefined;
-        if (env.isDesktop) {
+        if (environment.isDesktop) {
           idToken = await signInWithElectron(auth);
         } else {
           const response = await signInWithPopup(auth, provider);

packages/workspace/src/affine/shared.ts

@@ -1,4 +1,4 @@
-import { prefixUrl } from '@affine/env';
+import { setupGlobal } from '@affine/env/global';
 import { rootStore } from '@toeverything/plugin-infra/manager';
 
 import { createUserApis, createWorkspaceApis } from './api/index';
@@ -6,9 +6,12 @@ import { currentAffineUserAtom } from './atom';
 import type { LoginResponse } from './login';
 import { createAffineAuth, parseIdToken, setLoginStorage } from './login';
 
+setupGlobal();
+
 export const affineAuth = createAffineAuth(prefixUrl);
 const affineApis = {} as ReturnType<typeof createUserApis> &
   ReturnType<typeof createWorkspaceApis>;
+
 Object.assign(affineApis, createUserApis(prefixUrl));
 Object.assign(affineApis, createWorkspaceApis(prefixUrl));
 

packages/workspace/src/affine/sync.ts

@@ -1,5 +1,4 @@
 import { DebugLogger } from '@affine/debug';
-import { websocketPrefixUrl } from '@affine/env/api';
 import type { WorkspaceCRUD } from '@affine/env/workspace';
 import type { WorkspaceFlavour } from '@affine/env/workspace';
 import {

packages/workspace/src/atom.ts

@@ -1,3 +1,4 @@
+import { isBrowser } from '@affine/env/constant';
 import type { WorkspaceFlavour } from '@affine/env/workspace';
 import type { WorkspaceVersion } from '@affine/env/workspace';
 import type { EditorContainer } from '@blocksuite/editor';
@@ -44,14 +45,12 @@ export const rootWorkspacesMetadataAtom = atomWithStorage<
 export const rootCurrentWorkspaceIdAtom = atom<string | null>(null);
 
 rootCurrentWorkspaceIdAtom.onMount = set => {
-  if (typeof window !== 'undefined') {
+  if (isBrowser) {
     const callback = (url: string) => {
       const value = url.split('/')[2];
       if (value) {
         set(value);
-        if (typeof window !== 'undefined') {
+        localStorage.setItem('last_workspace_id', value);
-          localStorage.setItem('last_workspace_id', value);
-        }
       } else {
         set(null);
       }
@@ -68,7 +67,7 @@ rootCurrentWorkspaceIdAtom.onMount = set => {
 export const rootCurrentPageIdAtom = atom<string | null>(null);
 
 rootCurrentPageIdAtom.onMount = set => {
-  if (typeof window !== 'undefined') {
+  if (isBrowser) {
     const callback = (url: string) => {
       const value = url.split('/')[3];
       if (value) {

packages/workspace/src/local/crud.ts

@@ -1,5 +1,4 @@
 import { DebugLogger } from '@affine/debug';
-import { config } from '@affine/env';
 import type { LocalWorkspace, WorkspaceCRUD } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { nanoid, Workspace as BlockSuiteWorkspace } from '@blocksuite/store';
@@ -112,7 +111,11 @@ export const CRUD: WorkspaceCRUD<WorkspaceFlavour.LOCAL> = {
       : [];
 
     // workspaces in desktop
-    if (window.apis && environment.isDesktop && config.enableSQLiteProvider) {
+    if (
+      window.apis &&
+      environment.isDesktop &&
+      runtimeConfig.enableSQLiteProvider
+    ) {
       const desktopIds = (await window.apis.workspace.list()).map(([id]) => id);
       // the ids maybe a subset of the local storage
       const moreWorkspaces = desktopIds.filter(

packages/workspace/src/providers/index.ts

@@ -1,4 +1,3 @@
-import { config, websocketPrefixUrl } from '@affine/env';
 import type {
   AffineWebSocketProvider,
   LocalIndexedDBBackgroundProvider,
@@ -169,11 +168,11 @@ export const createLocalProviders = (): DocProviderCreator[] => {
     createIndexedDBDownloadProvider,
   ] as DocProviderCreator[];
 
-  if (config.enableBroadcastChannelProvider) {
+  if (runtimeConfig.enableBroadcastChannelProvider) {
     providers.push(createBroadcastChannelProvider);
   }
 
-  if (environment.isDesktop && config.enableSQLiteProvider) {
+  if (environment.isDesktop && runtimeConfig.enableSQLiteProvider) {
     providers.push(createSQLiteProvider, createSQLiteDBDownloadProvider);
   }
 
@@ -185,7 +184,8 @@ export const createAffineProviders = (): DocProviderCreator[] => {
     [
       createAffineDownloadProvider,
       createAffineWebSocketProvider,
-      config.enableBroadcastChannelProvider && createBroadcastChannelProvider,
+      runtimeConfig.enableBroadcastChannelProvider &&
+        createBroadcastChannelProvider,
       createIndexedDBDownloadProvider,
     ] as DocProviderCreator[]
   ).filter(v => Boolean(v));

packages/workspace/src/utils.ts

@@ -1,5 +1,5 @@
-import type { BlockSuiteFeatureFlags } from '@affine/env';
+import { isBrowser, isDesktop } from '@affine/env/constant';
-import { config } from '@affine/env';
+import type { BlockSuiteFeatureFlags } from '@affine/env/global';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import {
   createAffineProviders,
@@ -26,7 +26,7 @@ export function cleanupWorkspace(flavour: WorkspaceFlavour) {
 }
 
 function setEditorFlags(workspace: Workspace) {
-  Object.entries(config.editorFlags).forEach(([key, value]) => {
+  Object.entries(runtimeConfig.editorFlags).forEach(([key, value]) => {
     workspace.awarenessStore.setFlag(
       key as keyof BlockSuiteFeatureFlags,
       value
@@ -96,9 +96,9 @@ export function createEmptyBlockSuiteWorkspace(
     }
     providerCreators.push(...createAffineProviders());
   } else {
-    if (typeof window !== 'undefined') {
+    if (isBrowser) {
       blobStorages.push(createIndexeddbStorage);
-      if (environment.isDesktop) {
+      if (isDesktop) {
         blobStorages.push(createSQLiteStorage);
       }
     }
@@ -107,7 +107,7 @@ export function createEmptyBlockSuiteWorkspace(
 
   const workspace = new Workspace({
     id,
-    isSSR: typeof window === 'undefined',
+    isSSR: !isBrowser,
     providerCreators: typeof window === 'undefined' ? [] : providerCreators,
     blobStorages: blobStorages,
     idGenerator,

scripts/setup/global.ts

@@ -0,0 +1,3 @@
+import { setupGlobal } from '@affine/env/global';
+
+setupGlobal();

tsconfig.node.json

@@ -7,5 +7,10 @@
     "allowSyntheticDefaultImports": true,
     "outDir": "lib"
   },
-  "include": ["vitest.config.ts", "scripts"]
+  "include": ["vitest.config.ts", "scripts"],
+  "references": [
+    {
+      "path": "./packages/env"
+    }
+  ]
 }

vitest.config.ts

@@ -26,6 +26,7 @@ export default defineConfig({
       resolve(rootDir, './scripts/setup/i18n.ts'),
       resolve(rootDir, './scripts/setup/search.ts'),
       resolve(rootDir, './scripts/setup/lottie-web.ts'),
+      resolve(rootDir, './scripts/setup/global.ts'),
     ],
     // split tests that include native addons or not
     include: process.env.NATIVE_TEST

yarn.lock

@@ -277,7 +277,6 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@affine/i18n@workspace:packages/i18n"
   dependencies:
-    "@affine/debug": "workspace:*"
     "@types/node": ^18.16.18
     "@types/prettier": ^2.7.3
     i18next: ^23.2.3