Fix import loop in web app

web/src/components/Account.jsx

@@ -56,7 +56,7 @@ import accountApi, { LimitBasis, Role, SubscriptionInterval, SubscriptionStatus
 import { Pref, PrefGroup } from "./Pref";
 import db from "../app/db";
 import UpgradeDialog from "./UpgradeDialog";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import DialogFooter from "./DialogFooter";
 import { Paragraph } from "./styles";
 import { EmailPrimaryElsewhereError, IncorrectPasswordError, UnauthorizedError } from "../app/errors";

web/src/components/AccountContext.js

@@ -0,0 +1,5 @@
+import { createContext } from "react";
+
+const AccountContext = createContext(null);
+
+export default AccountContext;

web/src/components/App.jsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { createContext, Suspense, useContext, useEffect, useState, useMemo } from "react";
+import { Suspense, useContext, useEffect, useState, useMemo } from "react";
 import { Box, Toolbar, CssBaseline, Backdrop, CircularProgress, useMediaQuery, ThemeProvider, createTheme } from "@mui/material";
 import { useLiveQuery } from "dexie-react-hooks";
 import { BrowserRouter, Outlet, Route, Routes, useParams } from "react-router-dom";
@@ -27,11 +27,10 @@ import initI18n from "../app/i18n"; // Translations!
 import prefs from "../app/Prefs";
 import RTLCacheProvider from "./RTLCacheProvider";
 import session from "../app/Session";
+import AccountContext from "./AccountContext";
 
 initI18n();
 
-export const AccountContext = createContext(null);
-
 const App = () => {
   const { i18n } = useTranslation();
   const languageDir = i18n.dir();

web/src/components/Navigation.jsx

@@ -41,7 +41,7 @@ import config from "../app/config";
 import session from "../app/Session";
 import accountApi, { Permission, Role } from "../app/AccountApi";
 import UpgradeDialog from "./UpgradeDialog";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import { PermissionDenyAll, PermissionRead, PermissionReadWrite, PermissionWrite } from "./ReserveIcons";
 import { SubscriptionPopup } from "./SubscriptionPopup";
 import { useNotificationPermissionListener, useVersionChangeListener } from "./hooks";

web/src/components/Preferences.jsx

@@ -41,7 +41,7 @@ import session from "../app/Session";
 import routes from "./routes";
 import accountApi, { Permission, Role } from "../app/AccountApi";
 import { Pref, PrefGroup } from "./Pref";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import { Paragraph } from "./styles";
 import prefs, { THEME } from "../app/Prefs";
 import { PermissionDenyAll, PermissionRead, PermissionReadWrite, PermissionWrite } from "./ReserveIcons";

web/src/components/PublishDialog.jsx

@@ -40,7 +40,7 @@ import session from "../app/Session";
 import routes from "./routes";
 import accountApi from "../app/AccountApi";
 import { UnauthorizedError } from "../app/errors";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 
 const PublishDialog = (props) => {
   const theme = useTheme();

web/src/components/SubscribeDialog.jsx

@@ -26,7 +26,7 @@ import session from "../app/Session";
 import routes from "./routes";
 import accountApi, { Permission, Role } from "../app/AccountApi";
 import ReserveTopicSelect from "./ReserveTopicSelect";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import { TopicReservedError, UnauthorizedError } from "../app/errors";
 import { ReserveLimitChip } from "./SubscriptionPopup";
 import prefs from "../app/Prefs";

web/src/components/SubscriptionPopup.jsx

@@ -39,7 +39,7 @@ import routes from "./routes";
 import PopupMenu from "./PopupMenu";
 import { formatShortDateTime, shuffle } from "../app/utils";
 import api from "../app/Api";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import { ReserveAddDialog, ReserveDeleteDialog, ReserveEditDialog } from "./ReserveDialogs";
 import { UnauthorizedError } from "../app/errors";
 

web/src/components/UpgradeDialog.jsx

@@ -28,7 +28,7 @@ import { Check, Close } from "@mui/icons-material";
 import { NavLink } from "react-router-dom";
 import { UnauthorizedError } from "../app/errors";
 import { formatBytes, formatNumber, formatPrice, formatShortDate } from "../app/utils";
-import { AccountContext } from "./App";
+import AccountContext from "./AccountContext";
 import routes from "./routes";
 import session from "../app/Session";
 import accountApi, { SubscriptionInterval } from "../app/AccountApi";