Allow use of useCurrentUser/useCurrentTeam hooks in unauthenticated components

app/scenes/Document/Shared.tsx

@@ -18,6 +18,7 @@ import { TeamContext } from "~/components/TeamContext";
 import Text from "~/components/Text";
 import env from "~/env";
 import useBuildTheme from "~/hooks/useBuildTheme";
+import useCurrentUser from "~/hooks/useCurrentUser";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
 import { AuthorizationError, OfflineError } from "~/utils/errors";
@@ -83,8 +84,9 @@ function useDocumentId(documentSlug: string, response?: Response) {
 }
 
 function SharedDocumentScene(props: Props) {
-  const { ui, auth } = useStores();
+  const { ui } = useStores();
   const location = useLocation();
+  const user = useCurrentUser({ rejectOnEmpty: false });
   const searchParams = React.useMemo(
     () => new URLSearchParams(location.search),
     [location.search]
@@ -104,10 +106,10 @@ function SharedDocumentScene(props: Props) {
   const theme = useBuildTheme(response?.team?.customTheme, themeOverride);
 
   React.useEffect(() => {
-    if (!auth.user) {
+    if (!user) {
       void changeLanguage(detectLanguage(), i18n);
     }
-  }, [auth, i18n]);
+  }, [user, i18n]);
 
   // ensure the wider page color always matches the theme
   React.useEffect(() => {

app/scenes/Document/components/DataLoader.tsx

@@ -7,6 +7,8 @@ import Document from "~/models/Document";
 import Revision from "~/models/Revision";
 import Error404 from "~/scenes/Error404";
 import ErrorOffline from "~/scenes/ErrorOffline";
+import useCurrentTeam from "~/hooks/useCurrentTeam";
+import useCurrentUser from "~/hooks/useCurrentUser";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
 import Logger from "~/utils/Logger";
@@ -16,12 +18,16 @@ import { matchDocumentEdit, settingsPath } from "~/utils/routeHelpers";
 import Loading from "./Loading";
 
 type Params = {
+  /** The document urlId + slugified title  */
   documentSlug: string;
+  /** A specific revision id to load. */
   revisionId?: string;
+  /** The share ID to use to load data. */
   shareId?: string;
 };
 
 type LocationState = {
+  /** The document title, if preloaded */
   title?: string;
   restore?: boolean;
   revisionId?: string;
@@ -41,17 +47,10 @@ type Props = RouteComponentProps<Params, StaticContext, LocationState> & {
 };
 
 function DataLoader({ match, children }: Props) {
-  const {
-    ui,
-    views,
-    shares,
-    comments,
-    documents,
-    auth,
-    revisions,
-    subscriptions,
-  } = useStores();
-  const { team } = auth;
+  const { ui, views, shares, comments, documents, revisions, subscriptions } =
+    useStores();
+  const team = useCurrentTeam();
+  const user = useCurrentUser();
   const [error, setError] = React.useState<Error | null>(null);
   const { revisionId, shareId, documentSlug } = match.params;
 
@@ -73,7 +72,7 @@ function DataLoader({ match, children }: Props) {
     : undefined;
   const isEditRoute =
     match.path === matchDocumentEdit || match.path.startsWith(settingsPath());
-  const isEditing = isEditRoute || !auth.user?.separateEditMode;
+  const isEditing = isEditRoute || !user?.separateEditMode;
   const can = usePolicy(document?.id);
   const location = useLocation<LocationState>();
 
@@ -180,7 +179,7 @@ function DataLoader({ match, children }: Props) {
       // Prevents unauthorized request to load share information for the document
       // when viewing a public share link
       if (can.read) {
-        if (team?.getPreference(TeamPreference.Commenting)) {
+        if (team.getPreference(TeamPreference.Commenting)) {
           void comments.fetchDocumentComments(document.id, {
             limit: 100,
           });
@@ -199,7 +198,7 @@ function DataLoader({ match, children }: Props) {
     return error instanceof OfflineError ? <ErrorOffline /> : <Error404 />;
   }
 
-  if (!document || !team || (revisionId && !revision)) {
+  if (!document || (revisionId && !revision)) {
     return (
       <>
         <Loading location={location} />

app/scenes/Document/components/DocumentMeta.tsx

@@ -10,6 +10,7 @@ import Document from "~/models/Document";
 import Revision from "~/models/Revision";
 import DocumentMeta from "~/components/DocumentMeta";
 import Fade from "~/components/Fade";
+import useCurrentTeam from "~/hooks/useCurrentTeam";
 import useStores from "~/hooks/useStores";
 import { documentPath, documentInsightsPath } from "~/utils/routeHelpers";
 
@@ -29,10 +30,10 @@ function TitleDocumentMeta({
   revision,
   ...rest
 }: Props) {
-  const { auth, views, comments, ui } = useStores();
+  const { views, comments, ui } = useStores();
   const { t } = useTranslation();
-  const { team } = auth;
   const match = useRouteMatch();
+  const team = useCurrentTeam();
   const documentViews = useObserver(() => views.inDocument(document.id));
   const totalViewers = documentViews.length;
   const onlyYou = totalViewers === 1 && documentViews[0].userId;
@@ -45,7 +46,7 @@ function TitleDocumentMeta({
 
   return (
     <Meta document={document} revision={revision} to={to} replace {...rest}>
-      {team?.getPreference(TeamPreference.Commenting) && (
+      {team.getPreference(TeamPreference.Commenting) && (
         <>
           &nbsp;•&nbsp;
           <CommentLink

app/scenes/Document/components/Editor.tsx

@@ -10,6 +10,8 @@ import Document from "~/models/Document";
 import { RefHandle } from "~/components/ContentEditable";
 import Editor, { Props as EditorProps } from "~/components/Editor";
 import Flex from "~/components/Flex";
+import useCurrentTeam from "~/hooks/useCurrentTeam";
+import useCurrentUser from "~/hooks/useCurrentUser";
 import useFocusedComment from "~/hooks/useFocusedComment";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
@@ -49,8 +51,9 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
   const { t } = useTranslation();
   const match = useRouteMatch();
   const focusedComment = useFocusedComment();
-  const { ui, comments, auth } = useStores();
-  const { user, team } = auth;
+  const { ui, comments } = useStores();
+  const user = useCurrentUser({ rejectOnEmpty: false });
+  const team = useCurrentTeam({ rejectOnEmpty: false });
   const history = useHistory();
   const {
     document,

app/scenes/Document/components/Header.tsx

@@ -29,6 +29,8 @@ import { publishDocument } from "~/actions/definitions/documents";
 import { navigateToTemplateSettings } from "~/actions/definitions/navigation";
 import { restoreRevision } from "~/actions/definitions/revisions";
 import useActionContext from "~/hooks/useActionContext";
+import useCurrentTeam from "~/hooks/useCurrentTeam";
+import useCurrentUser from "~/hooks/useCurrentUser";
 import useMobile from "~/hooks/useMobile";
 import usePolicy from "~/hooks/usePolicy";
 import useStores from "~/hooks/useStores";
@@ -84,10 +86,11 @@ function DocumentHeader({
   headings,
 }: Props) {
   const { t } = useTranslation();
-  const { ui, auth } = useStores();
+  const { ui } = useStores();
   const theme = useTheme();
+  const team = useCurrentTeam({ rejectOnEmpty: false });
+  const user = useCurrentUser({ rejectOnEmpty: false });
   const { resolvedTheme } = ui;
-  const { team, user } = auth;
   const isMobile = useMobile();
   const isRevision = !!revision;
   const isEditingFocus = useEditingFocus();